{"version":3,"file":"static/chunks/pages/index-d49dddecf0aefedc.js","mappings":"AACA","sources":["webpack://_N_E/","webpack://_N_E/./src/components/Landing/GoodnotesPromotion.tsx","webpack://_N_E/./src/components/Landing/PromotionLink.tsx","webpack://_N_E/./src/components/Landing/SubjectSection.tsx","webpack://_N_E/./src/components/UniversityShop/CheckUniversityDialog.tsx","webpack://_N_E/./src/components/Landing/AllHandoutSection.tsx","webpack://_N_E/./src/components/Landing/MainBanner.tsx","webpack://_N_E/./src/components/Landing/MiniBannerSection.tsx","webpack://_N_E/./public/static/assets/Group.svg","webpack://_N_E/./src/components/Landing/QuickMenu.tsx","webpack://_N_E/./src/components/Landing/EmptyHandoutSection.tsx","webpack://_N_E/./src/components/Landing/RankingSection.tsx","webpack://_N_E/./public/static/assets/cicle_arrow.svg","webpack://_N_E/./public/static/assets/Close_2px.svg","webpack://_N_E/./src/components/Landing/SelectedBookList.tsx","webpack://_N_E/./src/components/Landing/SelectedBookSection.tsx","webpack://_N_E/./public/static/assets/arrow/arrow-area.svg","webpack://_N_E/./src/components/Landing/SolvookPassSection.tsx","webpack://_N_E/./src/api/main.ts","webpack://_N_E/./src/modules/landings/home/LandingPage.tsx","webpack://_N_E/./src/pages/index.tsx","webpack://_N_E/<anon>"],"sourcesContent":["\n    (window.__NEXT_P = window.__NEXT_P || []).push([\n      \"/\",\n      function () {\n        return require(\"private-next-pages/index.tsx\");\n      }\n    ]);\n    if(module.hot) {\n      module.hot.dispose(function () {\n        window.__NEXT_P.push([\"/\"])\n      });\n    }\n  ","import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { useDropdownMenu } from \"@/hooks/useDropdownMenu\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { EBOOKS_LANDING, EBOOKS_UNIVERSITY_LANDING } from \"@/settings/constant\";\nimport { Button } from \"@bookips/solvook-ui-library\";\nimport { Menu, styled, Typography } from \"@mui/material\";\nimport Link from \"next/link\";\nimport Icon from \"../icon/Icon\";\nimport { ArrowDown, GoodnoteIcon, Sizes } from \"../icon/IconList\";\nexport const GoodnotesPromotion = ()=>{\n    const dropdownList = [\n        {\n            title: \"대학∙수험서∙외국어\",\n            link: EBOOKS_UNIVERSITY_LANDING\n        },\n        {\n            title: \"중등∙고등\",\n            link: EBOOKS_LANDING\n        }\n    ];\n    const { handleOpen , handleClose , open , anchorEl  } = useDropdownMenu();\n    const mixpanelTrigger = (name, url)=>{\n        mixpanelEvent(\"Home Quick button Clicked\", {\n            \"Button Type\": \"Goodnotes\",\n            \"Button Name\": name,\n            url: url\n        });\n    };\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsxs(ButtonWithDropdownMenu, {\n                id: \"goodntes-promotion\",\n                \"aria-expanded\": open ? \"true\" : undefined,\n                onClick: (e)=>{\n                    handleOpen(e);\n                    mixpanelTrigger(\"굿노트6 eBook\");\n                },\n                children: [\n                    /*#__PURE__*/ _jsxs(Typography, {\n                        variant: \"subtitle2\",\n                        sx: {\n                            display: \"flex\",\n                            gap: \"4px\",\n                            alignItems: \"center\"\n                        },\n                        children: [\n                            /*#__PURE__*/ _jsx(Icon, {\n                                icon: GoodnoteIcon,\n                                className: \"goodnotes-icon\",\n                                size: Sizes.large\n                            }),\n                            \"굿노트6 eBook\"\n                        ]\n                    }),\n                    /*#__PURE__*/ _jsx(Icon, {\n                        icon: ArrowDown,\n                        size: Sizes.xsmall,\n                        color: \"#3B4054\",\n                        className: \"arrow-down\"\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(Menu, {\n                id: \"goodntes-promotion\",\n                anchorEl: anchorEl,\n                open: open,\n                onClose: handleClose,\n                MenuListProps: {\n                    \"aria-labelledby\": \"basic-button\"\n                },\n                sx: {\n                    marginTop: \"10px\"\n                },\n                children: /*#__PURE__*/ _jsx(\"ul\", {\n                    children: dropdownList.map((item, index)=>{\n                        return /*#__PURE__*/ _jsx(LinkListItem, {\n                            link: item.link,\n                            onClick: ()=>mixpanelTrigger(item.title, item.link),\n                            children: item.title\n                        }, index + item.title);\n                    })\n                })\n            })\n        ]\n    });\n};\nexport const LinkListItem = (param)=>{\n    let { link , children , onClick  } = param;\n    return /*#__PURE__*/ _jsx(ListItem, {\n        children: /*#__PURE__*/ _jsx(Link, {\n            onClick: onClick,\n            href: link,\n            children: children\n        })\n    });\n};\nconst ListItem = styled(\"li\")((param)=>{\n    let { theme  } = param;\n    return {\n        textAlign: \"center\",\n        ...theme.typography.body1,\n        \">a\": {\n            padding: \"8px 12px\",\n            display: \"inline-block\"\n        },\n        \"&:hover\": {\n            backgroundColor: theme.palette.grey[50]\n        }\n    };\n});\nexport const ButtonWithDropdownMenu = styled(Button)((param)=>{\n    let { theme  } = param;\n    return {\n        backgroundColor: \"#fff\",\n        borderRadius: \"4px\",\n        padding: \"2px 8px\",\n        color: theme.palette.text.primary,\n        textTransform: \"none\",\n        ...theme.typography.subtitle2,\n        \".goodnotes-icon svg\": {\n            width: \"20px\",\n            height: \"20px\"\n        },\n        \".arrow-down svg\": {\n            marginLeft: \"4px\"\n        },\n        '&[aria-expanded=\"true\"]': {\n            backgroundColor: theme.palette.dim.gray300[\"20%\"],\n            \".arrow-down svg\": {\n                transform: \"rotate(180deg)\",\n                transition: \"all 0.3s ease\"\n            }\n        },\n        \"&:hover\": {\n            backgroundColor: theme.palette.dim.gray300[\"20%\"]\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Divider, styled as muiStyled } from \"@mui/material\";\nimport React from \"react\";\nimport { GoodnotesPromotion } from \"./GoodnotesPromotion\";\nimport { PassPromotion } from \"./PassPromotion\";\nexport const PromotionLinks = (param)=>{\n    let {} = param;\n    return /*#__PURE__*/ _jsxs(PromotionStack, {\n        children: [\n            /*#__PURE__*/ _jsx(GoodnotesPromotion, {}),\n            /*#__PURE__*/ _jsx(ButtonDivider, {\n                orientation: \"vertical\",\n                textAlign: \"center\"\n            }),\n            /*#__PURE__*/ _jsx(PassPromotion, {})\n        ]\n    });\n};\nexport const ButtonDivider = muiStyled(Divider)((param)=>{\n    let { theme  } = param;\n    return {\n        height: \"14px\",\n        margin: \"5px 0\",\n        color: theme.palette.grey[\"100\"]\n    };\n});\nexport const PromotionStack = muiStyled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"flex\",\n        alignItems: \"center\",\n        [theme.breakpoints.down(\"md\")]: {\n            flexShrink: 0,\n            padding: \"0 32px 0 0\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            display: \"none\"\n        }\n    };\n});\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  .ant-tabs-nav {\\n    margin-bottom: 0;\\n\\n    ::before {\\n      display: none;\\n    }\\n  }\\n\\n  .ant-tabs-nav-wrap {\\n    .ant-tabs-ink-bar {\\n      background-color: \",\n        \";\\n    }\\n\\n    .ant-tabs-nav-list {\\n      .ant-tabs-tab {\\n        padding: 0;\\n\\n        .ant-tabs-tab-btn {\\n          padding: 0 0 10px 0;\\n          font-size: 20px;\\n          line-height: 1.5;\\n          font-weight: 600;\\n          color: \",\n        \";\\n        }\\n      }\\n\\n      .ant-tabs-tab-active {\\n        .ant-tabs-tab-btn {\\n          color: \",\n        \";\\n        }\\n      }\\n\\n      .ant-tabs-tab + .ant-tabs-tab {\\n        margin-left: 20px;\\n      }\\n    }\\n  }\\n\\n  @media (max-width: 768px) {\\n    .ant-tabs-nav-wrap {\\n      .ant-tabs-nav-list {\\n        .ant-tabs-tab {\\n          .ant-tabs-tab-btn {\\n            padding: 0 0 8px 0;\\n            font-size: 16px;\\n          }\\n        }\\n\\n        .ant-tabs-tab + .ant-tabs-tab {\\n          margin-left: 12px;\\n        }\\n      }\\n    }\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  border-bottom: 1px solid \",\n        \";\\n  width: 100vw;\\n  margin-left: calc(50% - 50vw);\\n  background-color: #fff;\\n\\n  overflow-x: auto;\\n\\n  > div {\\n    display: flex;\\n    width: 100%;\\n    justify-content: space-between;\\n    align-items: center;\\n    max-width: 1200px;\\n    overflow-x: auto;\\n\\n    .ant-tabs {\\n      margin-top: 12px;\\n      @media (max-width: 768px) {\\n        margin-top: 0;\\n      }\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    padding: 0 0 0 32px;\\n    margin: 0 -32px;\\n  }\\n\\n  @media (max-width: 768px) {\\n    width: calc(100% + 32px);\\n    margin: 0 -16px;\\n    padding: 0 0 0 20px;\\n  }\\n\"\n    ]);\n    _templateObject1 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useDropdownMenu } from \"@/hooks/useDropdownMenu\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { Tabs } from \"@bookips/solvook-ui-library\";\nimport { Box, Divider, Menu, Typography, useTheme } from \"@mui/material\";\nimport { Tabs as AntdTabs } from \"antd\";\nimport { useRouter } from \"next/router\";\nimport React, { useCallback, useMemo } from \"react\";\nimport { Subjects } from \"src/api/product\";\nimport styled from \"styled-components\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { EDITION_CATEGORY_DAECHI } from \"@/settings/constant\";\nimport Link from \"next/link\";\nimport Icon from \"../icon/Icon\";\nimport { ArrowDown, Sizes } from \"../icon/IconList\";\nimport { ButtonWithDropdownMenu, LinkListItem } from \"./GoodnotesPromotion\";\nimport { PromotionLinks } from \"./PromotionLink\";\nconst subjectTabList = [\n    {\n        id: 0,\n        key: Subjects.EN,\n        label: \"영어\"\n    },\n    {\n        id: 1,\n        key: Subjects.KO,\n        label: \"국어\"\n    },\n    {\n        id: 2,\n        key: Subjects.MA,\n        label: \"수학\"\n    },\n    {\n        id: 3,\n        key: Subjects.SC,\n        label: \"과학\"\n    },\n    {\n        id: 4,\n        key: Subjects.SO,\n        label: \"사회\"\n    }\n];\nexport const SubjectSection = (param)=>{\n    let { subject , setSubject  } = param;\n    const theme = useTheme();\n    const router = useRouter();\n    const { isTablet  } = useWindowDimensions();\n    const initSubjectId = useMemo(()=>{\n        const findIndex = subjectTabList.findIndex((item)=>item.key === subject);\n        return findIndex !== -1 ? findIndex : subjectTabList[0].id;\n    }, [\n        subject\n    ]);\n    const { tabsProps , changeTab  } = Tabs.useTabs(initSubjectId);\n    const handleClickTab = useCallback((_, value)=>{\n        const currentSubject = subjectTabList[value].key;\n        setSubject(currentSubject);\n        changeTab(_, value);\n        mixpanelEvent(\"Tab UI Clicked\", {\n            \"Tab Type\": \"Subject Home\",\n            \"Tab Name\": currentSubject\n        });\n    }, [\n        changeTab,\n        router,\n        setSubject\n    ]);\n    return /*#__PURE__*/ _jsx(SubjectSectionWrapper, {\n        children: /*#__PURE__*/ _jsxs(\"div\", {\n            children: [\n                /*#__PURE__*/ _jsxs(Tabs, {\n                    ...tabsProps,\n                    onChange: handleClickTab,\n                    variant: isTablet ? \"standard\" : \"scrollable\",\n                    scrollButtons: false,\n                    containerStyle: {\n                        display: \"flex\",\n                        flexShrink: 0\n                    },\n                    children: [\n                        subjectTabList.map((item, idx)=>/*#__PURE__*/ _jsx(Tabs.Tab, {\n                                label: item.label,\n                                value: idx,\n                                sx: {\n                                    color: theme.palette.text.secondary,\n                                    [theme.breakpoints.down(\"sm\")]: {\n                                        ...theme.typography.subtitle1,\n                                        marginRight: \"12px\"\n                                    }\n                                }\n                            }, item.key)),\n                        /*#__PURE__*/ _jsx(Divider, {\n                            sx: (theme)=>({\n                                    margin: \"auto\",\n                                    height: 20,\n                                    marginRight: \"4px\",\n                                    marginLeft: \"-8px\",\n                                    [theme.breakpoints.down(\"sm\")]: {\n                                        height: 16,\n                                        marginLeft: \"-4px\",\n                                        marginRight: 0\n                                    }\n                                }),\n                            orientation: \"vertical\",\n                            variant: \"middle\",\n                            flexItem: true\n                        }),\n                        /*#__PURE__*/ _jsx(SolvookPassMenu, {}),\n                        /*#__PURE__*/ _jsx(Box, {\n                            sx: {\n                                display: \"flex\",\n                                alignItems: \"center\",\n                                padding: \"0 12px 0 8px\"\n                            },\n                            children: /*#__PURE__*/ _jsxs(Typography, {\n                                component: Link,\n                                href: EDITION_CATEGORY_DAECHI,\n                                variant: \"h6\",\n                                onClick: ()=>{\n                                    // mx-108 대치관 버튼 클릭시\n                                    mixpanelEvent(\"Tab UI Clicked\", {\n                                        \"Tab Type\": \"Subject Home\",\n                                        \"Tab Name\": \"Daechi\"\n                                    });\n                                },\n                                sx: {\n                                    display: \"flex\",\n                                    gap: \"2px\",\n                                    color: theme.palette.text.secondary,\n                                    [theme.breakpoints.down(\"sm\")]: {\n                                        ...theme.typography.subtitle1\n                                    }\n                                },\n                                children: [\n                                    \"대치관(학원자료)\",\n                                    /*#__PURE__*/ _jsx(Typography, {\n                                        variant: \"label\",\n                                        component: \"span\",\n                                        sx: (theme)=>({\n                                                color: theme.palette.red[400]\n                                            }),\n                                        children: \"N\"\n                                    })\n                                ]\n                            })\n                        })\n                    ]\n                }),\n                /*#__PURE__*/ _jsx(PromotionLinks, {})\n            ]\n        })\n    });\n};\nconst SolvookPassMenu = ()=>{\n    const theme = useTheme();\n    const { handleOpen , handleClose , open , anchorEl  } = useDropdownMenu();\n    const { isMobile  } = useWindowDimensions();\n    const dropdownList = [\n        {\n            title: \"영어\",\n            link: \"/categories/edition/solvookpassen\"\n        },\n        {\n            title: \"국어\",\n            link: \"/categories/edition/solvookpassko\"\n        }\n    ];\n    const handleClickDropdownMenu = (e)=>{\n        handleOpen(e);\n        mixpanelEvent(\"Tab UI Clicked\", {\n            \"Tab Type\": \"Subject Home\",\n            \"Tab Name\": \"Solvookpass\"\n        });\n    };\n    return /*#__PURE__*/ _jsxs(Box, {\n        sx: {\n            display: \"flex\",\n            alignItems: \"center\"\n        },\n        children: [\n            /*#__PURE__*/ _jsxs(ButtonWithDropdownMenu, {\n                id: \"goodntes-promotion\",\n                \"aria-expanded\": open ? \"true\" : undefined,\n                onClick: handleClickDropdownMenu,\n                sx: (theme)=>({\n                        display: \"flex\",\n                        alignItems: \"start\",\n                        \"&:hover h6\": {\n                            transition: \"all 0.5s\",\n                            color: theme.palette.text.primary\n                        },\n                        '&[aria-expanded=\"true\"] h6': {\n                            transition: \"all 0.5s\",\n                            color: theme.palette.text.primary\n                        }\n                    }),\n                children: [\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: isMobile ? \"subtitle1\" : \"h6\",\n                        sx: (theme)=>({\n                                color: theme.palette.text.secondary\n                            }),\n                        children: \"쏠북패스\"\n                    }),\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: \"label\",\n                        sx: (theme)=>({\n                                color: theme.palette.red[400],\n                                fontSize: isMobile ? \"10px\" : \"12px\"\n                            }),\n                        children: \"N\"\n                    }),\n                    /*#__PURE__*/ _jsx(Box, {\n                        sx: {\n                            alignSelf: \"center\"\n                        },\n                        children: /*#__PURE__*/ _jsx(Icon, {\n                            icon: ArrowDown,\n                            size: Sizes.xsmall,\n                            color: theme.palette.grey[500],\n                            className: \"arrow-down\"\n                        })\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(Menu, {\n                id: \"goodntes-promotion\",\n                anchorEl: anchorEl,\n                open: open,\n                onClose: handleClose,\n                MenuListProps: {\n                    \"aria-labelledby\": \"basic-button\"\n                },\n                sx: {\n                    marginTop: \"5px\"\n                },\n                slotProps: {\n                    paper: {\n                        sx: {\n                            width: \"133px\"\n                        }\n                    }\n                },\n                children: /*#__PURE__*/ _jsx(\"ul\", {\n                    children: dropdownList.map((item, index)=>{\n                        return /*#__PURE__*/ _jsx(LinkListItem, {\n                            link: item.link,\n                            onClick: ()=>{},\n                            children: item.title\n                        }, index + item.title);\n                    })\n                })\n            })\n        ]\n    });\n};\nexport const TabsNav = styled(AntdTabs).withConfig({\n    componentId: \"sc-2af770d4-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.gray900, (props)=>props.theme.new.colors.gray500, (props)=>props.theme.new.colors.gray900);\nconst SubjectSectionWrapper = styled.section.withConfig({\n    componentId: \"sc-2af770d4-1\"\n})(_templateObject1(), (props)=>props.theme.new.colors.sol_gray_100);\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { EBOOKS_UNIVERSITY_LANDING } from \"@/settings/constant\";\nimport { Button, Checkbox, ConfirmDialog } from \"@bookips/solvook-ui-library\";\nimport { Typography, styled, useTheme } from \"@mui/material\";\nimport { useRouter } from \"next/router\";\nimport { useCallback, useEffect, useState } from \"react\";\nconst VISIT_STORAGE_KEY = \"visit-before\";\nconst CheckUniversityDialog = ()=>{\n    const router = useRouter();\n    const theme = useTheme();\n    const [checked, setChecked] = useState(false);\n    const [open, isOpen] = useState(false);\n    const VISIT_BEFORE = localStorage.getItem(VISIT_STORAGE_KEY);\n    const handleOk = useCallback(()=>{\n        if (checked) {\n            const today = Date.now();\n            const expires = new Date(today + 1000 * 60 * 60 * 24);\n            localStorage.setItem(VISIT_STORAGE_KEY, expires.getTime().toString());\n        }\n        isOpen(false);\n    }, [\n        checked\n    ]);\n    useEffect(()=>{\n        if (VISIT_BEFORE === null) {\n            return isOpen(true);\n        }\n        if (Number(VISIT_BEFORE) < Date.now()) {\n            return isOpen(true);\n        }\n        return isOpen(false);\n    }, []);\n    return /*#__PURE__*/ _jsx(ConfirmDialog, {\n        open: open,\n        onClose: ()=>isOpen(false),\n        title: \"굿노트 eBook 대학교재를 찾으시나요?\",\n        content: /*#__PURE__*/ _jsx(Typography, {\n            variant: \"body1\",\n            color: theme.palette.text.secondary,\n            children: \"대학교재 홈을 찾고 계신다면 ‘대학교재 홈 가기’를 클릭해주세요.\"\n        }),\n        sx: {\n            padding: \"20px\",\n            margin: \"20px\"\n        },\n        footer: /*#__PURE__*/ _jsxs(FooterRow, {\n            children: [\n                /*#__PURE__*/ _jsx(Checkbox, {\n                    label: /*#__PURE__*/ _jsx(Typography, {\n                        variant: \"body1\",\n                        color: theme.palette.text.secondary,\n                        children: \"하루동안 보지 않기\"\n                    }),\n                    value: \"\",\n                    checked: checked,\n                    onChange: ()=>{\n                        setChecked((prev)=>!prev);\n                    }\n                }),\n                /*#__PURE__*/ _jsxs(\"div\", {\n                    children: [\n                        /*#__PURE__*/ _jsx(Button, {\n                            variant: \"soft\",\n                            label: \"닫기\",\n                            onClick: ()=>{\n                                handleOk();\n                            }\n                        }),\n                        /*#__PURE__*/ _jsx(Button, {\n                            variant: \"solid\",\n                            label: \"대학교재 홈 가기\",\n                            onClick: ()=>{\n                                handleOk();\n                                router.push(EBOOKS_UNIVERSITY_LANDING);\n                            }\n                        })\n                    ]\n                })\n            ]\n        })\n    });\n};\nconst FooterRow = styled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"flex\",\n        justifyContent: \"space-between\",\n        alignItems: \"center\",\n        marginTop: \"28px\",\n        div: {\n            display: \"flex\",\n            gap: \"8px\"\n        },\n        button: {\n            padding: \"12px 20px\"\n        },\n        \"@media (max-width: 768px)\": {\n            flexDirection: \"column\",\n            alignItems: \"flex-start\",\n            div: {\n                width: \"100%\",\n                label: {\n                    width: \"100%\"\n                },\n                button: {\n                    width: \"100%\"\n                }\n            }\n        }\n    };\n});\nexport default CheckUniversityDialog;\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n\\n  a {\\n    color: \",\n        \";\\n    font-size: 14px;\\n    font-weight: 600;\\n    line-height: 22px;\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  //height: 784px;\\n\\n  .swiper {\\n    width: 100%;\\n    height: 100%;\\n    margin-left: auto;\\n    margin-right: auto;\\n    //임시 변경필요\\n    padding-right: \",\n        \"px;\\n  }\\n\\n  .swiper-wrapper {\\n    //row-gap: 20px;\\n    //column-gap: 20px;\\n    align-content: flex-start;\\n    @media (max-width: 768px) {\\n      //row-gap: 20px;\\n      //column-gap: 20px;\\n    }\\n  }\\n\\n  .swiper-slide {\\n    text-align: center;\\n    //flex-shrink: unset;\\n    width: unset !important;\\n    height: unset;\\n    flex: 1 1 auto;\\n    //border: 1px solid red;\\n\\n    //display: flex;\\n    //justify-content: center;\\n    //align-items: center;\\n    :nth-child(1),\\n    :nth-child(2),\\n    :nth-child(3) {\\n      .index-label {\\n        background-color: \",\n        \";\\n      }\\n    }\\n  }\\n\\n  .swiper {\\n    width: 100%;\\n    height: 100%;\\n    margin-left: auto;\\n    margin-right: auto;\\n  }\\n\\n  .book-info-wrapper {\\n    width: 224px;\\n    flex-direction: column;\\n    gap: 8px;\\n\\n    img {\\n      width: 92px;\\n    }\\n\\n    .thumb-wrapper {\\n      display: flex;\\n      box-sizing: border-box;\\n      flex-direction: column;\\n      width: 100%;\\n      padding: 8px;\\n      height: 224px;\\n      padding-bottom: 40px;\\n    }\\n\\n    > div {\\n      position: relative;\\n    }\\n\\n    .preview-btn {\\n      bottom: 8px;\\n      left: 8px;\\n      right: 8px;\\n      width: auto;\\n      text-align: center;\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    height: 382px;\\n    margin-right: -32px;\\n  }\\n  @media (max-width: 768px) {\\n    //margin: 32px 0;\\n    margin-right: -16px;\\n    height: 306px;\\n    .book-info-wrapper {\\n      width: 150px;\\n\\n      .thumb-wrapper {\\n        height: 150px;\\n        padding-bottom: 8px;\\n\\n        img {\\n          width: 68px;\\n        }\\n      }\\n    }\\n\\n    .preview-btn {\\n      display: none;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject1 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject2() {\n    const data = _tagged_template_literal([\n        \"\\n  color: \",\n        \";\\n  font-size: 24px;\\n  font-weight: 700;\\n  line-height: 1.5;\\n  margin-bottom: 20px;\\n\\n  span {\\n    margin-left: 8px;\\n    color: \",\n        \";\\n    font-size: 14px;\\n    font-weight: 400;\\n    line-height: 22px;\\n  }\\n\\n  @media (max-width: 768px) {\\n    margin-bottom: 16px;\\n    font-size: 20px;\\n\\n    span {\\n      font-size: 14px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport Link from \"next/link\";\nimport React, { useEffect, useState } from \"react\";\nimport { Subjects } from \"src/api/product\";\nimport styled, { useTheme } from \"styled-components\";\nimport \"swiper/css\";\nimport \"swiper/css/grid\";\nimport \"swiper/css/scrollbar\";\nimport { Swiper, SwiperSlide } from \"swiper/react\";\nimport { BookCard } from \"./BookCard\";\nimport { RankingListSkeleton } from \"./MainPageSkeletons\";\nimport { SwiperCustomButton } from \"./SwiperCustomButton\";\nexport const AllHandoutSection = (param)=>{\n    let { handleDataType , data , selectedDataType , showSkeleton , isEmptyRanking , selectedBook , subject  } = param;\n    const theme = useTheme();\n    const [skeletonTimer, setSkeletonTimer] = useState(null);\n    const swiperOptions = {\n        slidesPerView: \"auto\",\n        centerInsufficientSlides: true,\n        navigation: {\n            nextEl: \".all-handout-button-next\",\n            prevEl: \".all-handout-button-prev\"\n        },\n        spaceBetween: 20\n    };\n    useEffect(()=>{\n        if (showSkeleton) {\n            setSkeletonTimer(setTimeout(()=>{\n                setSkeletonTimer(null);\n            }, 1000));\n        }\n    }, [\n        showSkeleton\n    ]);\n    if (skeletonTimer) {\n        return /*#__PURE__*/ _jsx(RankingListSkeleton, {});\n    }\n    if (!!!data || data.items.length === 0) {\n        return /*#__PURE__*/ _jsx(_Fragment, {});\n    }\n    return /*#__PURE__*/ _jsxs(\"section\", {\n        children: [\n            /*#__PURE__*/ _jsxs(ListHeader, {\n                children: [\n                    /*#__PURE__*/ _jsx(SectionTitle, {\n                        children: \"\\uD83D\\uDC40 가장 최근에 업로드된 자료\"\n                    }),\n                    subject === Subjects.EN ? /*#__PURE__*/ _jsx(Link, {\n                        href: \"/search?q=\".concat(selectedBook === null || selectedBook === void 0 ? void 0 : selectedBook.title, \"&subject=\").concat(subject, \"&sort=LATEST\"),\n                        children: \"전체보기\"\n                    }) : /*#__PURE__*/ _jsx(SwiperCustomButton, {\n                        nextClassName: \"all-handout-button-next\",\n                        prevClassName: \"all-handout-button-prev\"\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(ProductList, {\n                children: /*#__PURE__*/ _jsx(Swiper, {\n                    ...swiperOptions,\n                    children: data.items.map((book, index)=>{\n                        return /*#__PURE__*/ _jsx(SwiperSlide, {\n                            children: /*#__PURE__*/ _jsx(BookCard, {\n                                book: book,\n                                index: index,\n                                positionType: \"curation\"\n                            })\n                        }, \"book-slide-\".concat(index));\n                    })\n                })\n            })\n        ]\n    });\n};\nconst SwiperPaddingW = 36 * 2;\nconst ListHeader = styled.div.withConfig({\n    componentId: \"sc-ae98fde4-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_indigo_500);\nconst ProductList = styled.div.withConfig({\n    componentId: \"sc-ae98fde4-1\"\n})(_templateObject1(), SwiperPaddingW, (props)=>props.theme.new.colors.sol_blue_500);\nexport const SectionTitle = styled.h3.withConfig({\n    componentId: \"sc-ae98fde4-2\"\n})(_templateObject2(), (props)=>props.theme.new.colors.sol_gray_800, (props)=>props.theme.new.colors.sol_gray_500);\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport Image from \"next/image\";\nimport React, { useRef, useState } from \"react\";\nimport { ArrowRight2px } from \"@/components/icon/IconList\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { alpha, Box, styled, Typography } from \"@mui/material\";\nimport Slider from \"react-slick\";\nimport \"slick-carousel/slick/slick-theme.css\";\nimport \"slick-carousel/slick/slick.css\";\nimport Icon from \"../icon/Icon\";\nexport const MainBannerSection = (param)=>{\n    let { data , onClick  } = param;\n    const [currentSlide, setCurrentSlide] = useState(0);\n    const sliderRef = useRef(null);\n    const { device  } = useWindowDimensions();\n    const totalSlides = data.items.length;\n    if (!data) {\n        return null;\n    }\n    const settings = {\n        dots: false,\n        infinite: data.items.length > 1,\n        speed: 500,\n        slidesToShow: 1,\n        slidesToScroll: 1,\n        autoplay: true,\n        autoplaySpeed: 4000,\n        beforeChange: (_, newIndex)=>setCurrentSlide(newIndex),\n        arrows: false\n    };\n    const handleClickBanner = (banner, idx)=>{\n        if (idx === currentSlide) {\n            onClick(banner, \"mainBanner\");\n            window.location.href = banner.link;\n        }\n    };\n    const handleClickArrow = (type)=>{\n        if (type === \"left\") {\n            var _sliderRef_current;\n            (_sliderRef_current = sliderRef.current) === null || _sliderRef_current === void 0 ? void 0 : _sliderRef_current.slickPrev();\n        } else {\n            var _sliderRef_current1;\n            (_sliderRef_current1 = sliderRef.current) === null || _sliderRef_current1 === void 0 ? void 0 : _sliderRef_current1.slickNext();\n        }\n    };\n    return /*#__PURE__*/ _jsxs(Container, {\n        children: [\n            /*#__PURE__*/ _jsx(Arrow, {\n                type: \"left\",\n                style: {\n                    left: 30\n                },\n                onClick: ()=>handleClickArrow(\"left\")\n            }),\n            /*#__PURE__*/ _jsx(Arrow, {\n                type: \"right\",\n                style: {\n                    right: 30\n                },\n                onClick: ()=>handleClickArrow(\"right\")\n            }),\n            /*#__PURE__*/ _jsx(Slider, {\n                ref: (slider)=>{\n                    sliderRef.current = slider;\n                },\n                ...settings,\n                children: data.items.map((banner, idx)=>{\n                    return /*#__PURE__*/ _jsxs(Box, {\n                        onClick: ()=>handleClickBanner(banner, idx),\n                        sx: (theme)=>({\n                                display: \"block !important\",\n                                overflow: \"hidden\",\n                                borderRadius: \"12px\",\n                                border: \"1px solid\",\n                                borderColor: alpha(theme.palette.grey[900], 0.1)\n                            }),\n                        children: [\n                            device === \"pc\" && /*#__PURE__*/ _jsx(Image, {\n                                width: 1200,\n                                height: 210,\n                                src: banner.imageUrlPc,\n                                alt: \"\".concat(idx, \"-img\")\n                            }),\n                            device === \"tablet\" && /*#__PURE__*/ _jsx(Image, {\n                                width: 1200,\n                                height: 220,\n                                src: banner.imageUrlTablet,\n                                alt: \"\".concat(idx, \"-img\")\n                            }),\n                            device === \"mobile\" && /*#__PURE__*/ _jsx(Image, {\n                                width: 800,\n                                height: 250,\n                                src: banner.imageUrlMobile,\n                                alt: \"\".concat(idx, \"-img\")\n                            })\n                        ]\n                    }, \"banner-box-\".concat(idx));\n                })\n            }),\n            /*#__PURE__*/ _jsxs(Indicator, {\n                children: [\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: device === \"pc\" ? \"subtitle1\" : \"subtitle2\",\n                        sx: {\n                            color: \"white\"\n                        },\n                        children: currentSlide + 1\n                    }),\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: device === \"pc\" ? \"subtitle1\" : \"subtitle2\",\n                        sx: {\n                            color: \"rgba(255, 255, 255, 0.5)\"\n                        },\n                        children: \"/\"\n                    }),\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: device === \"pc\" ? \"subtitle1\" : \"subtitle2\",\n                        sx: {\n                            color: \"rgba(255, 255, 255, 0.5)\"\n                        },\n                        children: totalSlides\n                    })\n                ]\n            })\n        ]\n    });\n};\nconst Arrow = (param)=>{\n    let { type , style , onClick  } = param;\n    return /*#__PURE__*/ _jsx(Box, {\n        className: \"banner-arrow\",\n        onClick: onClick,\n        sx: (theme)=>({\n                position: \"absolute\",\n                zIndex: 1,\n                display: \"flex\",\n                justifyContent: \"center\",\n                alignItems: \"center\",\n                height: 40,\n                width: 40,\n                backgroundColor: \"white\",\n                cursor: \"pointer\",\n                top: \"38%\",\n                borderRadius: \"40px\",\n                opacity: 0,\n                transition: \"opacity 0.3s\",\n                border: \"1px solid\",\n                borderColor: theme.palette.grey[200],\n                svg: {\n                    transform: \"scaleX(\".concat(type === \"left\" ? \"-1\" : \"1\", \")\")\n                }\n            }),\n        style: style,\n        children: /*#__PURE__*/ _jsx(Icon, {\n            icon: ArrowRight2px\n        })\n    });\n};\nconst Indicator = styled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        position: \"absolute\",\n        bottom: 20,\n        right: 30,\n        backgroundColor: \"rgba(0, 0, 0, 0.2)\",\n        borderRadius: \"16px\",\n        display: \"flex\",\n        gap: \"4px\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        margin: \"auto\",\n        padding: \"0 12px\",\n        [theme.breakpoints.down(\"lg\")]: {\n            bottom: 1.6,\n            right: 7,\n            borderRadius: 0,\n            borderTopLeftRadius: \"6px\",\n            borderBottomRightRadius: \"11px\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            bottom: 2,\n            right: 5,\n            borderRadius: 0,\n            borderTopLeftRadius: \"6px\",\n            borderBottomRightRadius: \"11px\"\n        }\n    };\n});\nconst Container = styled(\"section\")((param)=>{\n    let { theme  } = param;\n    return {\n        position: \"relative\",\n        \"&:hover .banner-arrow\": {\n            opacity: 1\n        },\n        marginTop: 48,\n        \".slick-list\": {\n            overflow: \"visible\"\n        },\n        a: {\n            borderRadius: \"12px\",\n            overflow: \"hidden\"\n        },\n        img: {\n            height: \"100%\"\n        },\n        [theme.breakpoints.down(\"lg\")]: {\n            marginTop: 32,\n            \".slick-slide\": {\n                aspectRatio: \"110/21\"\n            }\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            marginTop: 20,\n            \".slick-slide\": {\n                aspectRatio: \"400/125\"\n            }\n        },\n        \".slick-slide \": {\n            padding: \"0 10px\",\n            opacity: 0.7,\n            [theme.breakpoints.down(\"lg\")]: {\n                padding: \"0 6px\"\n            },\n            [theme.breakpoints.down(\"sm\")]: {\n                padding: \"0 4px\"\n            }\n        },\n        \".slick-active\": {\n            opacity: 1\n        }\n    };\n});\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  .swiper-slide:last-child {\\n    margin-right: 0 !important;\\n  }\\n\\n  @media (max-width: 1200px) {\\n    .swiper-slide {\\n      //flex-shrink: unset;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  height: 104px;\\n  border-radius: 6px;\\n  padding: 20px 24px;\\n  display: flex;\\n  justify-content: flex-start;\\n  gap: 20px;\\n  cursor: pointer;\\n  box-sizing: border-box;\\n  border: 1px solid transparent;\\n  > div {\\n    width: 100%;\\n    display: flex;\\n    flex-direction: column;\\n    justify-content: center;\\n    p:first-child {\\n      color: \",\n        \";\\n      line-height: 24px;\\n    }\\n    p:last-child {\\n      font-size: 20px;\\n      font-weight: 600;\\n      line-height: 30px;\\n      display: flex;\\n      justify-content: space-between;\\n      align-items: center;\\n      i {\\n        margin-left: 4px;\\n      }\\n    }\\n  }\\n  :hover {\\n    border: 1px solid \",\n        \";\\n  }\\n  @media (hover: hover) {\\n    :hover {\\n      border: 1px solid \",\n        \";\\n    }\\n  }\\n  @media (max-width: 1200px) {\\n    //min-width: 320px;\\n    width: 100%;\\n    padding: 16px 20px;\\n    height: 86px;\\n  }\\n  @media (max-width: 1100px) {\\n    img {\\n      display: none;\\n    }\\n  }\\n  @media (max-width: 768px) {\\n    height: 74px;\\n    //width: 280px;\\n    padding: 16px 20px;\\n    img {\\n      width: 45px;\\n      display: block;\\n    }\\n    > div {\\n      p:first-child {\\n        font-size: 12px;\\n        line-height: 18px;\\n      }\\n      p:last-child {\\n        font-size: 18px;\\n        line-height: 26px;\\n      }\\n    }\\n  }\\n\"\n    ]);\n    _templateObject1 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport Icon from \"@/components/icon/Icon\";\nimport { ArrowRight, Sizes } from \"@/components/icon/IconList\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport styled from \"styled-components\";\nimport { Swiper, SwiperSlide } from \"swiper/react\";\nexport const MiniBannerSection = (param)=>{\n    let { data , onClick  } = param;\n    const { width  } = useWindowDimensions();\n    const isMobile = width < 769;\n    const initialSlideOptions = {\n        slidesPerView: 3,\n        spaceBetween: 20\n    };\n    const [slideOptions, setSlideOptions] = useState(initialSlideOptions);\n    const swiperRef = useRef(null);\n    useEffect(()=>{\n        if (isMobile) {\n            var _swiperRef_current, _swiperRef_current_swiper, _swiperRef_current1, _swiperRef_current_swiper1;\n            setSlideOptions({\n                slidesPerView: 1,\n                slidesPerGroup: 1,\n                autoplay: {\n                    delay: 4000\n                }\n            });\n            (_swiperRef_current = swiperRef.current) === null || _swiperRef_current === void 0 ? void 0 : (_swiperRef_current_swiper = _swiperRef_current.swiper) === null || _swiperRef_current_swiper === void 0 ? void 0 : _swiperRef_current_swiper.update();\n            (_swiperRef_current1 = swiperRef.current) === null || _swiperRef_current1 === void 0 ? void 0 : (_swiperRef_current_swiper1 = _swiperRef_current1.swiper) === null || _swiperRef_current_swiper1 === void 0 ? void 0 : _swiperRef_current_swiper1.autoplay.start();\n        } else setSlideOptions(initialSlideOptions);\n    }, [\n        width\n    ]);\n    if (!data) {\n        return;\n    }\n    return /*#__PURE__*/ _jsx(MiniBannerSectionWrapper, {\n        children: /*#__PURE__*/ _jsx(Swiper, {\n            ref: swiperRef,\n            ...slideOptions,\n            className: \"best-sales-swiper\",\n            children: data.items.map((item, index)=>{\n                return /*#__PURE__*/ _jsx(SwiperSlide, {\n                    children: /*#__PURE__*/ _jsxs(MiniBannerLinkWrapper, {\n                        onClick: ()=>onClick(item, \"miniBanner\"),\n                        href: item.link,\n                        style: {\n                            backgroundColor: item.bgColor\n                        },\n                        children: [\n                            /*#__PURE__*/ _jsx(Image, {\n                                src: item.imageUrl,\n                                alt: item.mainText,\n                                width: 64,\n                                height: 64\n                            }),\n                            /*#__PURE__*/ _jsxs(\"div\", {\n                                children: [\n                                    /*#__PURE__*/ _jsx(\"p\", {\n                                        children: item.upperText\n                                    }),\n                                    /*#__PURE__*/ _jsxs(\"p\", {\n                                        children: [\n                                            item.mainText,\n                                            \" \",\n                                            /*#__PURE__*/ _jsx(Icon, {\n                                                icon: ArrowRight,\n                                                size: Sizes.small\n                                            })\n                                        ]\n                                    })\n                                ]\n                            })\n                        ]\n                    })\n                }, \"best-sales-swiper-\".concat(index));\n            })\n        })\n    });\n};\nconst MiniBannerSectionWrapper = styled.section.withConfig({\n    componentId: \"sc-a001c14a-0\"\n})(_templateObject());\nconst MiniBannerLinkWrapper = styled(Link).withConfig({\n    componentId: \"sc-a001c14a-1\"\n})(_templateObject1(), (props)=>props.theme.new.colors.gray500, (props)=>props.theme.new.colors.gray300, (props)=>props.theme.new.colors.gray300);\n","var _path, _path2, _path3, _path4, _path5, _path6;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgGroup = function SvgGroup(props) {\n  return /*#__PURE__*/React.createElement(\"svg\", _extends({\n    width: 34,\n    height: 30,\n    fill: \"none\",\n    xmlns: \"http://www.w3.org/2000/svg\"\n  }, props), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"M8.131.2v10.75c5.62 3.327 8.794 11.868 8.794 11.868V9.172S13.746 3.531 8.131.204V.199Z\",\n    fill: \"#403391\"\n  })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"M16.925 9.172v13.646S20.1 14.273 25.72 10.95V.2c-5.62 3.327-8.794 8.968-8.794 8.968v.005Z\",\n    fill: \"#57C29E\"\n  })), _path3 || (_path3 = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"M1.717 29.66a2.57 2.57 0 0 1-.808-.349l.402-.908c.196.126.419.231.68.314.258.079.507.118.76.118.472 0 .708-.118.708-.358 0-.122-.07-.218-.205-.275a3.662 3.662 0 0 0-.65-.188 5.926 5.926 0 0 1-.822-.227 1.394 1.394 0 0 1-.567-.389c-.158-.179-.236-.419-.236-.72 0-.266.074-.506.218-.72.144-.214.363-.38.65-.507.289-.122.643-.183 1.062-.183.288 0 .567.03.847.096.275.065.524.161.734.284l-.376.916c-.415-.227-.817-.336-1.205-.336-.245 0-.42.035-.533.11-.113.074-.166.165-.166.283 0 .118.066.205.201.262.131.057.345.118.638.184.331.07.607.144.825.227.218.078.406.21.567.384.162.175.24.415.24.72 0 .262-.074.498-.218.708-.144.21-.362.38-.655.506-.292.127-.642.188-1.056.188-.354 0-.695-.044-1.027-.13l-.008-.01ZM6.127 29.499a2.203 2.203 0 0 1-.865-.808 2.186 2.186 0 0 1-.314-1.162 2.185 2.185 0 0 1 1.179-1.969 2.587 2.587 0 0 1 1.24-.292c.459 0 .873.096 1.24.292.367.197.655.463.865.808.21.345.314.73.314 1.162a2.186 2.186 0 0 1-1.179 1.969 2.587 2.587 0 0 1-1.24.292c-.458 0-.873-.096-1.24-.292Zm1.838-.882c.18-.105.32-.25.42-.441.1-.188.157-.402.157-.65 0-.25-.053-.464-.158-.651a1.165 1.165 0 0 0-.419-.442 1.151 1.151 0 0 0-.594-.157c-.218 0-.419.053-.593.157a1.075 1.075 0 0 0-.42.442c-.1.187-.157.401-.157.65s.053.463.157.65c.105.188.245.337.42.442.179.104.375.157.593.157.219 0 .42-.053.594-.157ZM10.367 25.35h1.231v3.376h2.074v.978h-3.305v-4.353Z\",\n    fill: \"#403391\"\n  })), _path4 || (_path4 = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"M19.305 29.499a2.203 2.203 0 0 1-.864-.808 2.186 2.186 0 0 1-.315-1.162 2.185 2.185 0 0 1 1.18-1.969 2.587 2.587 0 0 1 1.24-.292c.458 0 .873.096 1.24.292.366.197.654.463.864.808.21.345.314.73.314 1.162a2.186 2.186 0 0 1-1.179 1.969 2.587 2.587 0 0 1-1.24.292c-.458 0-.873-.096-1.24-.292Zm1.838-.882c.18-.105.32-.25.42-.441.1-.188.157-.402.157-.65 0-.25-.052-.464-.157-.651a1.165 1.165 0 0 0-.42-.442 1.15 1.15 0 0 0-.593-.157c-.219 0-.42.053-.594.157a1.075 1.075 0 0 0-.42.442c-.1.187-.157.401-.157.65s.053.463.158.65c.104.188.244.337.419.442.179.104.375.157.594.157.218 0 .419-.053.593-.157ZM24.502 29.499a2.203 2.203 0 0 1-.865-.808 2.186 2.186 0 0 1-.314-1.162A2.185 2.185 0 0 1 24.5 25.56a2.587 2.587 0 0 1 1.24-.292c.46 0 .874.096 1.24.292.367.197.656.463.865.808.21.345.315.73.315 1.162a2.186 2.186 0 0 1-1.18 1.969 2.587 2.587 0 0 1-1.24.292c-.458 0-.873-.096-1.24-.292Zm1.838-.882c.179-.105.319-.25.419-.441.1-.188.157-.402.157-.65 0-.25-.052-.464-.157-.651a1.165 1.165 0 0 0-.42-.442 1.15 1.15 0 0 0-.593-.157c-.218 0-.42.053-.594.157a1.075 1.075 0 0 0-.42.442c-.1.187-.156.401-.156.65s.052.463.157.65c.105.188.244.337.42.442.178.104.375.157.593.157.218 0 .42-.053.594-.157ZM30.423 28.123l-.463.49V29.7H28.74v-4.35h1.219v1.808l1.685-1.807H33l-1.777 1.925L33.09 29.7h-1.433l-1.24-1.581v.009l.005-.005Z\",\n    fill: \"#57C29E\"\n  })), _path5 || (_path5 = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"M14.616 25.351h-1.328l1.856 4.35h.655v-1.516l-1.18-2.838-.003.004Z\",\n    fill: \"#403391\"\n  })), _path6 || (_path6 = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"M18.218 25.35H17l-1.206 2.839-.655 1.515h1.214l1.865-4.349v-.004Z\",\n    fill: \"#57C29E\"\n  })));\n};\nexport default SvgGroup;","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport EmptySrc from \"@/static/assets/Group.svg\";\nimport { Badge } from \"@bookips/solvook-ui-library\";\nimport { Box, styled, Typography } from \"@mui/material\";\nimport Image from \"next/image\";\nimport { useRouter } from \"next/router\";\nconst QuickMenu = (param)=>{\n    let { items , subject  } = param;\n    if (!items) return;\n    return /*#__PURE__*/ _jsx(QuickMenuContainer, {\n        children: items.map((menu)=>/*#__PURE__*/ _jsx(MenuItem, {\n                subject: subject,\n                link: menu.link,\n                src: menu.imageUrl,\n                title: menu.title,\n                badgeTitle: menu.badgeText\n            }))\n    });\n};\nconst MenuItem = (param)=>{\n    let { link , src , badgeTitle , title , subject  } = param;\n    const router = useRouter();\n    const handleClick = ()=>{\n        mixpanelEvent(\"Subject Home Quick Menu Clicked\", {\n            Subject: subject,\n            \"Menu Title\": title,\n            URL: link\n        });\n        router.push(link);\n    };\n    return /*#__PURE__*/ _jsxs(Menu, {\n        onClick: handleClick,\n        children: [\n            /*#__PURE__*/ _jsx(BadgeWrapper, {\n                children: /*#__PURE__*/ _jsx(Badge, {\n                    customcolor: \"Red\",\n                    badgeContent: badgeTitle,\n                    sx: {\n                        width: \"100%\",\n                        height: \"20px\",\n                        span: {\n                            transform: \"initial\",\n                            position: \"relative\"\n                        }\n                    }\n                })\n            }),\n            /*#__PURE__*/ _jsx(ImageWrapper, {\n                className: \"image-wrapper\",\n                children: src ? /*#__PURE__*/ _jsx(Image, {\n                    src: src,\n                    alt: \"empty-icon\",\n                    width: 48,\n                    height: 48\n                }) : /*#__PURE__*/ _jsx(EmptySrc, {})\n            }),\n            /*#__PURE__*/ _jsx(Typography, {\n                className: \"label\",\n                variant: \"subtitle2\",\n                sx: (theme)=>({\n                        ...theme.typography.subtitle2,\n                        wordBreak: \"keep-all\",\n                        overflowWrap: \"anywhere\",\n                        [theme.breakpoints.down(\"sm\")]: {\n                            ...theme.typography.label\n                        },\n                        textAlign: \"center\"\n                    }),\n                children: title\n            })\n        ]\n    });\n};\nconst BadgeWrapper = styled(Box)({\n    position: \"absolute\",\n    width: \"100%\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    top: -12,\n    \".MuiBadge-root\": {\n        justifyContent: \"center\"\n    }\n});\nconst ImageWrapper = styled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"flex\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        width: 48,\n        height: 48,\n        borderRadius: \"12px\",\n        border: \"1px solid\",\n        borderColor: theme.palette.grey[200],\n        transition: \"all 0.2s\",\n        overflow: \"hidden\"\n    };\n});\nconst QuickMenuContainer = styled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        marginTop: \"20px\",\n        padding: \"24px\",\n        gap: \"16px\",\n        display: \"flex\",\n        flexWrap: \"wrap\",\n        [theme.breakpoints.down(\"sm\")]: {\n            display: \"grid\",\n            gridTemplateColumns: \"repeat(4, 1fr)\",\n            columnGap: \"8px\"\n        },\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        borderRadius: \"12px\",\n        backgroundColor: \"white\",\n        border: \"1px solid\",\n        borderColor: theme.palette.grey[200]\n    };\n});\nconst Menu = styled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        cursor: \"pointer\",\n        alignSelf: \"start\",\n        display: \"flex\",\n        position: \"relative\",\n        flexDirection: \"column\",\n        gap: \"8px\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        width: 100,\n        transition: \"all 0.2s\",\n        img: {\n            scale: 1,\n            transition: \"all 0.2s\"\n        },\n        \"&:hover\": {\n            \".image-wrapper\": {\n                border: \"2px solid\",\n                borderColor: theme.palette.primary.main\n            },\n            \".label\": {\n                color: \"\".concat(theme.palette.primary.main)\n            },\n            img: {\n                scale: 1.1\n            }\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            width: \"auto\"\n        }\n    };\n});\nexport default QuickMenu;\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  background-color: \",\n        \";\\n  padding: 40px 48px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  gap: 32px;\\n  margin-bottom: 72px;\\n  .thumb-wrapper {\\n    width: 200px;\\n    height: 200px;\\n    background-color: \",\n        \";\\n    border-radius: 50%;\\n    display: flex;\\n    align-items: center;\\n    justify-content: center;\\n    img {\\n      box-shadow: 3px 3px 12px 0px rgba(28, 31, 46, 0.06);\\n    }\\n  }\\n  .title {\\n    text-align: center;\\n    font-size: 24px;\\n    font-weight: 700;\\n    line-height: 32px;\\n    strong {\\n      color: \",\n        \";\\n      font-weight: 700;\\n    }\\n  }\\n  .ant-btn {\\n    height: 48px;\\n    width: 200px;\\n    border-radius: 6px;\\n    font-size: 16px;\\n    font-weight: 600;\\n    line-height: 1.5;\\n    display: flex;\\n    align-items: center;\\n    justify-content: center;\\n    i {\\n      margin-right: 8px;\\n    }\\n  }\\n  .link-wrapper {\\n    display: flex;\\n    gap: 20px;\\n    margin-top: 40px;\\n    a {\\n      border-radius: 6px;\\n      background-color: #fff;\\n      padding: 20px;\\n      display: flex;\\n      position: relative;\\n      height: 136px;\\n      justify-content: space-between;\\n      width: 360px;\\n      img {\\n        position: absolute;\\n        right: 0;\\n        bottom: 0;\\n        padding: 16px;\\n        height: 100px;\\n      }\\n      div {\\n        flex-direction: column;\\n        justify-content: space-between;\\n        display: flex;\\n      }\\n      p:first-child {\\n        font-size: 18px;\\n        font-weight: 700;\\n        line-height: 26px;\\n      }\\n      p:last-child {\\n        color: \",\n        \";\\n        font-size: 14px;\\n        font-weight: 600;\\n        line-height: 22px;\\n      }\\n    }\\n  }\\n  @media (max-width: 768px) {\\n    .thumb-wrapper {\\n      width: 158px;\\n      height: 158px;\\n      img {\\n        width: 72px;\\n      }\\n    }\\n    .title {\\n      font-size: 20px;\\n    }\\n    .link-wrapper {\\n      flex-direction: column;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport Image from \"next/image\";\nimport { Button, Modal } from \"antd\";\nimport Link from \"next/link\";\nimport { useAuthStore } from \"@/lib/auth/AuthStore\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { useRouter } from \"next/router\";\nimport { EXTERNAL_CAHNNEL_TALK_BOT, EXTERNAL_PROMOTION_AUTHOR_PAGE } from \"@/settings/constant\";\nimport Icon from \"../icon/Icon\";\nimport { Bell, Sizes } from \"../icon/IconList\";\nexport const EmptyHandoutSection = (param)=>{\n    let { selectedBook  } = param;\n    const { isLoggedIn , user  } = useAuthStore();\n    const router = useRouter();\n    return /*#__PURE__*/ _jsxs(EmptyRankingListWrapper, {\n        children: [\n            /*#__PURE__*/ _jsx(\"div\", {\n                className: \"thumb-wrapper\",\n                children: /*#__PURE__*/ _jsx(Image, {\n                    unoptimized: true,\n                    alt: \"selected-book-image\",\n                    width: 92,\n                    height: 128,\n                    src: selectedBook.imageUrl\n                })\n            }),\n            /*#__PURE__*/ _jsxs(\"p\", {\n                className: \"title\",\n                children: [\n                    /*#__PURE__*/ _jsx(\"strong\", {\n                        children: selectedBook.title\n                    }),\n                    \"의 \",\n                    /*#__PURE__*/ _jsx(\"br\", {}),\n                    \"준비된 수업자료가 아직은 없어요...\\uD83D\\uDE25\"\n                ]\n            }),\n            /*#__PURE__*/ _jsxs(Button, {\n                type: \"primary\",\n                onClick: ()=>{\n                    if (isLoggedIn) {\n                        mixpanelEvent(\"click_alert\", {\n                            bookId: selectedBook.id,\n                            userId: user.id\n                        });\n                        Modal.success({\n                            title: \"자료 알림 신청 완료\",\n                            content: /*#__PURE__*/ _jsx(\"div\", {\n                                children: \"해당 교재의 수업자료가 업로드되면 고객님께 문자 혹은 알림톡을 통해 알려드릴게요\"\n                            }),\n                            okText: \"확인\"\n                        });\n                        return;\n                    }\n                    Modal.confirm({\n                        title: \"자료 알림 신청은 로그인이 필요해요\",\n                        content: /*#__PURE__*/ _jsx(\"div\", {\n                            children: \"수업자료의 업로드를 알리기 위해서 로그인 정보가 필요해요\"\n                        }),\n                        okText: \"로그인\",\n                        onOk: ()=>{\n                            router.push(\"/login\");\n                        },\n                        cancelText: \"닫기\"\n                    });\n                },\n                children: [\n                    /*#__PURE__*/ _jsx(Icon, {\n                        icon: Bell,\n                        color: \"#fff\",\n                        size: Sizes.xmedium\n                    }),\n                    \"자료 알림 받기\"\n                ]\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"link-wrapper\",\n                children: [\n                    /*#__PURE__*/ _jsxs(Link, {\n                        href: EXTERNAL_CAHNNEL_TALK_BOT,\n                        target: \"_blank\",\n                        children: [\n                            /*#__PURE__*/ _jsxs(\"div\", {\n                                children: [\n                                    /*#__PURE__*/ _jsxs(\"p\", {\n                                        children: [\n                                            \"필요한 유형의 수업자료가 \",\n                                            /*#__PURE__*/ _jsx(\"br\", {}),\n                                            \"있으신가요?\"\n                                        ]\n                                    }),\n                                    /*#__PURE__*/ _jsx(\"p\", {\n                                        children: \"수업자료 신청하기 \"\n                                    })\n                                ]\n                            }),\n                            /*#__PURE__*/ _jsx(Image, {\n                                unoptimized: true,\n                                alt: \"link-img\",\n                                width: 100,\n                                height: 100,\n                                src: \"/static/assets/empty_mail_box.svg\"\n                            })\n                        ]\n                    }),\n                    /*#__PURE__*/ _jsxs(Link, {\n                        href: EXTERNAL_PROMOTION_AUTHOR_PAGE,\n                        target: \"_blank\",\n                        children: [\n                            /*#__PURE__*/ _jsxs(\"div\", {\n                                children: [\n                                    /*#__PURE__*/ _jsxs(\"p\", {\n                                        children: [\n                                            \"내가 제작한 수업자료로 \",\n                                            /*#__PURE__*/ _jsx(\"br\", {}),\n                                            \"월 200만원\"\n                                        ]\n                                    }),\n                                    /*#__PURE__*/ _jsx(\"p\", {\n                                        children: \"실제 사례 살펴보기\"\n                                    })\n                                ]\n                            }),\n                            /*#__PURE__*/ _jsx(Image, {\n                                unoptimized: true,\n                                alt: \"link-img\",\n                                width: 100,\n                                height: 100,\n                                src: \"/static/assets/empty_document_money.svg\"\n                            })\n                        ]\n                    })\n                ]\n            })\n        ]\n    });\n};\nconst EmptyRankingListWrapper = styled.section.withConfig({\n    componentId: \"sc-cefeb796-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_0, (props)=>props.theme.new.colors.sol_gray_50, (props)=>props.theme.new.colors.sol_indigo_500, (props)=>props.theme.new.colors.sol_indigo_500);\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  flex: 1;\\n  gap: 10px;\\n\\n  > button {\\n    padding: 8px 12px;\\n    border-radius: 6px;\\n    border: 1px solid \",\n        \";\\n    background-color: #fff;\\n    font-weight: 600;\\n    color: \",\n        \";\\n    cursor: pointer;\\n\\n    &.active {\\n      background-color: \",\n        \";\\n      border: 1px solid transparent;\\n      color: #fff;\\n    }\\n  }\\n\\n  @media (max-width: 768px) {\\n    gap: 8px;\\n    > button {\\n      padding: 4px 10px;\\n      font-size: 14px;\\n      line-height: 22px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  > .button-wrapper {\\n    display: flex;\\n    align-items: flex-end;\\n    margin-bottom: 20px;\\n  }\\n\\n  @media (max-width: 768px) {\\n    margin-bottom: 34px;\\n    > .button-wrapper {\\n      margin-bottom: 16px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject1 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject2() {\n    const data = _tagged_template_literal([\n        \"\\n  /* height: 572px; */\\n  width: 100%;\\n\\n  @media (max-width: 1200px) {\\n    margin-right: -32px;\\n  }\\n  @media (max-width: 768px) {\\n    /* height: 448px; */\\n    margin-right: -16px;\\n  }\\n\\n  .book-info-wrapper {\\n    height: 172px;\\n    /* width: 420px; */\\n\\n    img {\\n      width: 68px;\\n    }\\n\\n    @media (max-width: 768px) {\\n      height: 136px;\\n      width: 320px;\\n      gap: 12px;\\n      img {\\n        width: 56px;\\n      }\\n    }\\n  }\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject3() {\n    const data = _tagged_template_literal([\n        \"\\n  display: grid;\\n  grid-template-columns: 1fr 1fr 1fr;\\n  gap: 32px 36px;\\n  .preview-btn {\\n    width: 100%;\\n  }\\n\\n  .card-wrapper {\\n    position: relative;\\n\\n    :nth-child(1),\\n    :nth-child(2),\\n    :nth-child(3) {\\n      .index-label {\\n        background-color: \",\n        \";\\n        color: #fff;\\n      }\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    grid-template-columns: 1fr 1fr;\\n    gap: 20px 20px;\\n  }\\n  @media (max-width: 768px) {\\n    grid-template-columns: 1fr;\\n    gap: 16px;\\n  }\\n\"\n    ]);\n    _templateObject3 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject4() {\n    const data = _tagged_template_literal([\n        \"\\n  color: \",\n        \";\\n  font-size: 24px;\\n  font-weight: 700;\\n  line-height: 32px;\\n  margin-bottom: 20px;\\n\\n  span {\\n    margin-left: 8px;\\n    color: \",\n        \";\\n    font-size: 14px;\\n    font-weight: 400;\\n    line-height: 22px;\\n  }\\n\\n  @media (max-width: 768px) {\\n    margin-bottom: 12px;\\n    font-size: 18px;\\n    span {\\n      font-size: 12px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject4 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject5() {\n    const data = _tagged_template_literal([\n        \"\\n  margin-top: 16px;\\n\\n  button {\\n    border: 1px solid \",\n        \";\\n    color: \",\n        \";\\n\\n    :active {\\n      border: 1px solid \",\n        \";\\n      background-color: \",\n        \";\\n    }\\n    :hover {\\n      border: 1px solid \",\n        \";\\n      background-color: \",\n        \";\\n    }\\n  }\\n\"\n    ]);\n    _templateObject5 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { Button } from \"@bookips/solvook-ui-library\";\nimport React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport styled, { useTheme } from \"styled-components\";\nimport \"swiper/css\";\nimport \"swiper/css/grid\";\nimport \"swiper/css/scrollbar\";\nimport Icon from \"../icon/Icon\";\nimport { ArrowDown, Sizes } from \"../icon/IconList\";\nimport { BookCard } from \"./BookCard\";\nimport { EmptyHandoutSection } from \"./EmptyHandoutSection\";\nimport { RankingListSkeleton } from \"./MainPageSkeletons\";\nexport const RankingSection = (param)=>{\n    let { handleDataType , data , selectedDataType , showSkeleton , isEmptyRanking , selectedBook , onClick  } = param;\n    const [skeletonTimer, setSkeletonTimer] = useState(null);\n    const { isMobile  } = useWindowDimensions();\n    useEffect(()=>{\n        if (showSkeleton) {\n            setSkeletonTimer(setTimeout(()=>{\n                setSkeletonTimer(null);\n            }, 1000));\n        }\n    }, [\n        showSkeleton\n    ]);\n    if (skeletonTimer) {\n        return /*#__PURE__*/ _jsx(RankingListSkeleton, {});\n    }\n    if (selectedBook && isEmptyRanking) {\n        return /*#__PURE__*/ _jsx(EmptyHandoutSection, {\n            selectedBook: selectedBook\n        });\n    }\n    if (data === null) return /*#__PURE__*/ _jsx(_Fragment, {});\n    return /*#__PURE__*/ _jsxs(GridCarouselWrapper, {\n        children: [\n            /*#__PURE__*/ _jsxs(SectionTitle, {\n                children: [\n                    \"\\uD83D\\uDC51 자료 유형별 판매 랭킹\",\n                    /*#__PURE__*/ _jsx(\"span\", {\n                        children: \"실시간 업데이트\"\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(\"div\", {\n                className: \"button-wrapper\",\n                children: /*#__PURE__*/ _jsx(DataTypeButton, {\n                    children: data.type.items.map((item, index)=>{\n                        return /*#__PURE__*/ _jsx(\"button\", {\n                            onClick: ()=>handleDataType(item.id),\n                            className: selectedDataType === item.id ? \"active\" : \"\",\n                            children: item.title\n                        }, \"data-type-button-\".concat(index));\n                    })\n                })\n            }),\n            /*#__PURE__*/ _jsx(CarouselItem, {\n                children: isMobile ? /*#__PURE__*/ _jsx(RankingMoreList, {\n                    rankingList: data\n                }) : /*#__PURE__*/ _jsx(BookBox, {\n                    children: data.items.slice(0, 12).map((book, index)=>{\n                        return /*#__PURE__*/ _jsx(\"div\", {\n                            className: \"card-wrapper\",\n                            onClick: ()=>onClick(book, \"rankingProduct\"),\n                            children: /*#__PURE__*/ _jsx(BookCard, {\n                                book: book,\n                                index: index,\n                                positionType: \"selectedBook\"\n                            })\n                        }, \"book-slide-\".concat(index));\n                    })\n                })\n            })\n        ]\n    });\n};\nconst RankingMoreList = (param)=>{\n    let { rankingList  } = param;\n    const SHOW_MORE_COUNT = 3;\n    const SHOW_MORE_MAX_COUNT = 12;\n    const theme = useTheme();\n    const [appendCount, setAppendCount] = useState(SHOW_MORE_COUNT);\n    const currCount = useRef(SHOW_MORE_COUNT);\n    const handleMoreClick = useCallback(()=>{\n        if (currCount.current < SHOW_MORE_MAX_COUNT) {\n            setAppendCount((prev)=>prev + SHOW_MORE_COUNT);\n        }\n    }, []);\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(BookBox, {\n                children: rankingList.items.slice(0, appendCount).map((book, index)=>{\n                    return /*#__PURE__*/ _jsx(\"div\", {\n                        className: \"card-wrapper\",\n                        onClick: ()=>{},\n                        children: /*#__PURE__*/ _jsx(BookCard, {\n                            book: book,\n                            index: index,\n                            positionType: \"selectedBook\"\n                        })\n                    }, \"book-slide-\".concat(index));\n                })\n            }),\n            rankingList.items.length > appendCount && /*#__PURE__*/ _jsx(MoreButton, {\n                children: /*#__PURE__*/ _jsx(Button, {\n                    fullWidth: true,\n                    label: \"랭킹 더보기\",\n                    variant: \"outlined\",\n                    endIcon: /*#__PURE__*/ _jsx(Icon, {\n                        icon: ArrowDown,\n                        size: Sizes.small,\n                        color: theme.new.colors.sol_gray_500\n                    }),\n                    onClick: ()=>handleMoreClick()\n                })\n            })\n        ]\n    });\n};\nconst SwiperPaddingW = 156;\nconst SwiperPaddingM = 80;\nconst DataTypeButton = styled.div.withConfig({\n    componentId: \"sc-5014ea96-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_100, (props)=>props.theme.new.colors.sol_gray_500, (props)=>props.theme.new.colors.sol_blue_500);\nconst GridCarouselWrapper = styled.section.withConfig({\n    componentId: \"sc-5014ea96-1\"\n})(_templateObject1());\nconst CarouselItem = styled.div.withConfig({\n    componentId: \"sc-5014ea96-2\"\n})(_templateObject2());\nconst BookBox = styled.div.withConfig({\n    componentId: \"sc-5014ea96-3\"\n})(_templateObject3(), (props)=>props.theme.new.colors.sol_blue_400);\nexport const SectionTitle = styled.h3.withConfig({\n    componentId: \"sc-5014ea96-4\"\n})(_templateObject4(), (props)=>props.theme.new.colors.sol_gray_800, (props)=>props.theme.new.colors.sol_gray_500);\nconst MoreButton = styled.div.withConfig({\n    componentId: \"sc-5014ea96-5\"\n})(_templateObject5(), (props)=>props.theme.new.colors.sol_gray_200, (props)=>props.theme.new.colors.sol_gray_500, (props)=>props.theme.new.colors.sol_gray_200, (props)=>props.theme.new.colors.sol_gray_50, (props)=>props.theme.new.colors.sol_gray_200, (props)=>props.theme.new.colors.sol_gray_50);\n","var _circle, _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgCicleArrow = function SvgCicleArrow(props) {\n  return /*#__PURE__*/React.createElement(\"svg\", _extends({\n    width: 16,\n    height: 16,\n    fill: \"none\",\n    xmlns: \"http://www.w3.org/2000/svg\"\n  }, props), _circle || (_circle = /*#__PURE__*/React.createElement(\"circle\", {\n    cx: 8,\n    cy: 8,\n    r: 8,\n    fill: \"#A9AFC7\",\n    fillOpacity: 0.2\n  })), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n    d: \"m11 7-3 3-3-3\",\n    stroke: \"#3B4054\",\n    strokeWidth: 1.5,\n    strokeMiterlimit: 10,\n    strokeLinecap: \"round\"\n  })));\n};\nexport default SvgCicleArrow;","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgClose2Px = function SvgClose2Px(props) {\n  return /*#__PURE__*/React.createElement(\"svg\", _extends({\n    width: 20,\n    height: 20,\n    fill: \"none\",\n    xmlns: \"http://www.w3.org/2000/svg\"\n  }, props), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n    fillRule: \"evenodd\",\n    clipRule: \"evenodd\",\n    d: \"M2.327 2.328a.833.833 0 0 1 1.179 0L10 8.822l6.494-6.494a.833.833 0 0 1 1.178 1.179L11.178 10l6.494 6.494a.833.833 0 0 1-1.178 1.178L10 11.18l-6.494 6.494a.833.833 0 1 1-1.179-1.178L8.821 10 2.327 3.507a.833.833 0 0 1 0-1.179Z\",\n    fill: \"#3B4054\"\n  })));\n};\nexport default SvgClose2Px;","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  all: unset;\\n  display: flex;\\n  align-items: center;\\n  font-size: 14px;\\n  margin-right: 12px;\\n  cursor: pointer;\\n  font-weight: 600;\\n  color: \",\n        \";\\n  i {\\n    margin-right: 4px;\\n  }\\n  @media (max-width: 1200px) {\\n    margin: 0;\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n  padding-bottom: 20px;\\n\\n  @media (max-width: 768px) {\\n    padding-bottom: 16px;\\n  }\\n\"\n    ]);\n    _templateObject1 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject2() {\n    const data = _tagged_template_literal([\n        \"\\n  position: relative;\\n  @media (max-width: 1200px) {\\n  }\\n  .swiper-horizontal {\\n    overflow: visible;\\n  }\\n  .guid-tooltip-wrapper {\\n    top: calc(100% - 10px);\\n    left: 230px;\\n    z-index: 3;\\n    @media (max-width: 768px) {\\n      left: 170px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject3() {\n    const data = _tagged_template_literal([\n        \"\\n  color: \",\n        \";\\n  font-size: 24px;\\n  font-weight: 700;\\n  line-height: 32px;\\n  margin-bottom: 20px;\\n\\n  span {\\n    margin-left: 8px;\\n    color: \",\n        \";\\n    font-size: 14px;\\n    font-weight: 400;\\n    line-height: 22px;\\n  }\\n\\n  @media (max-width: 768px) {\\n    margin-bottom: 16px;\\n    font-size: 16px;\\n    span {\\n      font-size: 14px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject3 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport CircleArrow from \"@/static/assets/cicle_arrow.svg\";\nimport CloseIcon from \"@/static/assets/Close_2px.svg\";\nimport EmptySrc from \"@/static/assets/Group.svg\";\nimport { Button, Tooltip } from \"@bookips/solvook-ui-library\";\nimport { Box, Drawer, SvgIcon, Typography, alpha, styled as muiStyled, useTheme as muiUseTheme, useMediaQuery } from \"@mui/material\";\nimport Image from \"next/image\";\nimport React, { useEffect, useState } from \"react\";\nimport styled, { useTheme } from \"styled-components\";\nimport { Swiper, SwiperSlide } from \"swiper/react\";\nimport Radio from \"../common/Radio\";\nimport Icon from \"../icon/Icon\";\nimport { Plus, Setting, Sizes } from \"../icon/IconList\";\nimport { SwiperCustomButton } from \"./SwiperCustomButton\";\nconst tooltipTitle = \"내가 찾는 교재로 변경할 수 있어요.\";\nexport const SelectedBookList = (param)=>{\n    let { openSelectBooksModal , selectBookList , setSelectedBook , selectedBook , setModalType  } = param;\n    var _selectBookList_;\n    const isDefaultList = !!(selectBookList === null || selectBookList === void 0 ? void 0 : (_selectBookList_ = selectBookList[0]) === null || _selectBookList_ === void 0 ? void 0 : _selectBookList_.isDefault);\n    const theme = useTheme();\n    const muiTheme = muiUseTheme();\n    const [isOpenTooltip, setIsOpenTooltip] = useState(false);\n    const isMobile = useMediaQuery(muiTheme.breakpoints.down(\"sm\"));\n    const isTablet = useMediaQuery(muiTheme.breakpoints.between(\"sm\", \"lg\"));\n    const closeTooltip = ()=>setIsOpenTooltip(false);\n    useEffect(()=>{\n        setIsOpenTooltip(isDefaultList);\n    }, [\n        isDefaultList\n    ]);\n    const openSettingModal = ()=>{\n        closeTooltip();\n        setModalType(\"selectBooksModal\");\n        openSelectBooksModal();\n        //mx-131\n        mixpanelEvent(\"Book Setting Clicked\", {\n            \"Button Type\": \"BookSetting1\",\n            \"Button Name\": \"교재설정\"\n        });\n    };\n    return /*#__PURE__*/ _jsxs(ListWrap, {\n        children: [\n            /*#__PURE__*/ _jsxs(SelectedBooksHeader, {\n                children: [\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: isMobile ? \"h6\" : \"h5\",\n                        children: \"맞춤 교재별 추천 자료를 찾아보세요.\"\n                    }),\n                    isMobile || /*#__PURE__*/ _jsxs(Box, {\n                        sx: {\n                            display: \"flex\",\n                            alignItems: \"center\"\n                        },\n                        children: [\n                            /*#__PURE__*/ _jsx(BookListTooltip, {\n                                title: /*#__PURE__*/ _jsx(Typography, {\n                                    variant: \"subtitle1\",\n                                    color: \"white\",\n                                    children: tooltipTitle\n                                }),\n                                open: isMobile ? false : isOpenTooltip,\n                                placement: isTablet ? \"bottom-end\" : \"bottom\",\n                                children: /*#__PURE__*/ _jsxs(EditSelectBookBtn, {\n                                    className: \"edit-select-book-btn\",\n                                    onClick: openSettingModal,\n                                    children: [\n                                        /*#__PURE__*/ _jsx(Icon, {\n                                            icon: Setting,\n                                            size: Sizes.small,\n                                            color: theme.new.colors.sol_gray_700\n                                        }),\n                                        \"교재 설정\"\n                                    ]\n                                })\n                            }),\n                            /*#__PURE__*/ _jsx(SwiperCustomButton, {\n                                nextClassName: \"selectedBooks-button-next\",\n                                prevClassName: \"selectedBooks-button-prev\"\n                            })\n                        ]\n                    })\n                ]\n            }),\n            isMobile ? /*#__PURE__*/ _jsx(MobileSelector, {\n                isOpenTooltip: isOpenTooltip,\n                closeTooltip: closeTooltip,\n                selectBookList: selectBookList,\n                setSelectedBook: setSelectedBook,\n                selectedBook: selectedBook,\n                openSelectBooksModal: openSelectBooksModal\n            }) : /*#__PURE__*/ _jsx(CarouselSelector, {\n                selectBookList: selectBookList,\n                setSelectedBook: setSelectedBook,\n                selectedBook: selectedBook,\n                openSettingModal: openSettingModal\n            })\n        ]\n    });\n};\nconst MobileSelector = (param)=>{\n    let { isOpenTooltip , closeTooltip , selectBookList , selectedBook , setSelectedBook , openSelectBooksModal  } = param;\n    const [isOpen, setIsOpen] = useState(false);\n    const selected = selectBookList.find((item)=>item.id === selectedBook.id);\n    const muiTheme = muiUseTheme();\n    const handleClick = ()=>{\n        setIsOpen(true);\n        closeTooltip();\n    };\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(Button, {\n                onClick: handleClick,\n                sx: {\n                    all: \"unset\",\n                    cursor: \"pointer\",\n                    width: \"100%\"\n                },\n                children: /*#__PURE__*/ _jsx(BookListTooltip, {\n                    title: tooltipTitle,\n                    open: isOpenTooltip,\n                    placement: \"bottom\",\n                    sx: {\n                        top: \"-21px !important\"\n                    },\n                    children: /*#__PURE__*/ _jsxs(MobileMenu, {\n                        children: [\n                            /*#__PURE__*/ _jsx(BookItem, {\n                                isActive: true,\n                                imageUrl: selected === null || selected === void 0 ? void 0 : selected.imageUrl,\n                                title: selected === null || selected === void 0 ? void 0 : selected.title,\n                                isMobile: true,\n                                className: \"active\"\n                            }),\n                            /*#__PURE__*/ _jsx(Box, {\n                                sx: {\n                                    marginRight: \"20px\"\n                                },\n                                children: /*#__PURE__*/ _jsx(CircleArrow, {})\n                            })\n                        ]\n                    })\n                })\n            }),\n            /*#__PURE__*/ _jsx(Drawer, {\n                sx: {\n                    width: \"85%\",\n                    flexShrink: 0,\n                    \"& .MuiDrawer-paper\": {\n                        width: \"85%\"\n                    }\n                },\n                open: isOpen,\n                onClose: ()=>setIsOpen(false),\n                anchor: \"right\",\n                children: /*#__PURE__*/ _jsxs(Box, {\n                    sx: {\n                        display: \"flex\",\n                        flexDirection: \"column\",\n                        height: \"100%\"\n                    },\n                    children: [\n                        /*#__PURE__*/ _jsxs(MobileDrawerWrapper, {\n                            children: [\n                                /*#__PURE__*/ _jsx(Typography, {\n                                    variant: \"subtitle1\",\n                                    children: \"맞춤 교재 선택\"\n                                }),\n                                /*#__PURE__*/ _jsx(CloseIcon, {\n                                    onClick: ()=>setIsOpen(false),\n                                    style: {\n                                        cursor: \"pointer\"\n                                    }\n                                })\n                            ]\n                        }),\n                        /*#__PURE__*/ _jsx(Box, {\n                            sx: {\n                                display: \"flex\",\n                                flexGrow: 1,\n                                overflow: \"auto\",\n                                flexDirection: \"column\"\n                            },\n                            children: selectBookList.map((favorite, idx)=>{\n                                const isSelected = selectedBook.id === favorite.id;\n                                return /*#__PURE__*/ _jsxs(MobileBookWrapper, {\n                                    isSelected: isSelected,\n                                    className: isSelected ? \"selected\" : \"\",\n                                    onClick: ()=>{\n                                        setSelectedBook(favorite);\n                                        setIsOpen(false);\n                                    },\n                                    children: [\n                                        /*#__PURE__*/ _jsx(BookItem, {\n                                            isActive: isSelected,\n                                            sx: {\n                                                padding: 0\n                                            },\n                                            imageUrl: favorite.imageUrl,\n                                            title: favorite.title,\n                                            isMobile: undefined\n                                        }),\n                                        /*#__PURE__*/ _jsx(Radio, {\n                                            id: favorite.id,\n                                            checked: isSelected,\n                                            sx: {\n                                                padding: 0\n                                            }\n                                        })\n                                    ]\n                                }, \"mobile-book-item-\".concat(idx));\n                            })\n                        }),\n                        /*#__PURE__*/ _jsx(Box, {\n                            sx: (theme)=>({\n                                    padding: \"12px 20px\",\n                                    borderTop: \"1px solid\",\n                                    borderColor: theme.palette.grey[50]\n                                }),\n                            children: /*#__PURE__*/ _jsx(Button, {\n                                onClick: ()=>openSelectBooksModal(),\n                                label: /*#__PURE__*/ _jsxs(Typography, {\n                                    color: \"primary\",\n                                    variant: \"subtitle1\",\n                                    sx: {\n                                        display: \"flex\",\n                                        alignItems: \"center\",\n                                        justifyContent: \"center\",\n                                        marginLeft: \"8px\"\n                                    },\n                                    children: [\n                                        /*#__PURE__*/ _jsx(SvgIcon, {\n                                            sx: {\n                                                width: 16,\n                                                height: 16,\n                                                marginRight: \"8px\"\n                                            },\n                                            children: /*#__PURE__*/ _jsx(Plus, {\n                                                color: muiTheme.palette.primary.main\n                                            })\n                                        }),\n                                        \"추가/삭제하기\"\n                                    ]\n                                }),\n                                fullWidth: true\n                            })\n                        })\n                    ]\n                })\n            })\n        ]\n    });\n};\nconst CarouselSelector = (param)=>{\n    let { selectBookList , setSelectedBook , selectedBook , openSettingModal  } = param;\n    const muiTheme = muiUseTheme();\n    return /*#__PURE__*/ _jsxs(TopPaginationStyledSwiper, {\n        slidesPerView: \"auto\",\n        spaceBetween: 4,\n        navigation: {\n            nextEl: \".selectedBooks-button-next\",\n            prevEl: \".selectedBooks-button-prev\"\n        },\n        onSlideChange: ()=>mixpanelEvent(\"Product Recommendation Carousel Clicked\"),\n        children: [\n            selectBookList.map((favorite, i)=>{\n                const isActive = favorite.id === (selectedBook === null || selectedBook === void 0 ? void 0 : selectedBook.id);\n                return /*#__PURE__*/ _jsx(SwiperSlide, {\n                    children: /*#__PURE__*/ _jsx(BookItem, {\n                        onClick: ()=>{\n                            setSelectedBook(favorite);\n                        },\n                        isActive: isActive,\n                        className: isActive ? \"active\" : \"\",\n                        title: favorite.title,\n                        imageUrl: favorite.imageUrl,\n                        isMobile: false\n                    }, favorite.id)\n                }, \"book-item-\".concat(i));\n            }),\n            /*#__PURE__*/ _jsx(SwiperSlide, {\n                children: /*#__PURE__*/ _jsx(Button, {\n                    label: /*#__PURE__*/ _jsx(Typography, {\n                        variant: \"subtitle2\",\n                        color: \"primary\",\n                        children: \"추가하기\"\n                    }),\n                    variant: \"text\",\n                    startIcon: /*#__PURE__*/ _jsx(Plus, {\n                        color: muiTheme.palette.primary.main\n                    }),\n                    onClick: openSettingModal\n                })\n            }, \"book-item-add\")\n        ]\n    });\n};\nconst BookItem = (param)=>{\n    let { imageUrl , title , isMobile , isActive , ...props } = param;\n    return /*#__PURE__*/ _jsxs(BookList, {\n        isMobile: isMobile,\n        ...props,\n        children: [\n            /*#__PURE__*/ _jsx(SrcWrapper, {\n                children: imageUrl ? /*#__PURE__*/ _jsx(Image, {\n                    unoptimized: true,\n                    alt: \"book_img\",\n                    src: imageUrl,\n                    width: 34,\n                    height: 48\n                }) : /*#__PURE__*/ _jsx(EmptySrc, {})\n            }),\n            /*#__PURE__*/ _jsx(Typography, {\n                variant: isActive ? \"subtitle1\" : \"body1\",\n                color: \"text.secondary\",\n                sx: {\n                    display: \"-webkit-box\",\n                    WebkitLineClamp: 2,\n                    WebkitBoxOrient: \"vertical\",\n                    overflow: \"hidden\",\n                    textOverflow: \"ellipsis\",\n                    wordBreak: \"break-word\"\n                },\n                children: title || \"\"\n            })\n        ]\n    });\n};\nconst BookListTooltip = muiStyled(Tooltip)((param)=>{\n    let { theme  } = param;\n    return {\n        zIndex: 2,\n        \".MuiTooltip-tooltip\": {\n            boxShadow: \"0px 4px 12px 0px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.04)\"\n        }\n    };\n});\nconst MobileBookWrapper = muiStyled(Box)((param)=>{\n    let { theme , isSelected  } = param;\n    return {\n        display: \"flex\",\n        flexDirection: \"row\",\n        justifyContent: \"space-between\",\n        alignItems: \"center\",\n        padding: \"12px 20px\",\n        gap: \"12px\",\n        borderBottom: \"1px solid\",\n        borderColor: theme.palette.grey[50],\n        backgroundColor: isSelected ? theme.palette.indigo[50] : \"white\",\n        \"&.selected h6\": {\n            color: theme.palette.primary.main\n        }\n    };\n});\nconst MobileDrawerWrapper = muiStyled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        padding: \"16px 20px\",\n        display: \"flex\",\n        justifyContent: \"space-between\",\n        alignItems: \"center\",\n        borderBottom: \"1px solid\",\n        borderColor: theme.palette.grey[50]\n    };\n});\nconst MobileMenu = muiStyled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        borderTopLeftRadius: 12,\n        borderTopRightRadius: 12,\n        backgroundColor: \"white\",\n        border: \"2px solid\",\n        borderBottom: 0,\n        borderColor: theme.palette.primary.main,\n        position: \"relative\",\n        zIndex: 2,\n        display: \"flex\",\n        flexDirection: \"row\",\n        alignItems: \"center\",\n        justifyContent: \"space-between\"\n    };\n});\nconst SrcWrapper = muiStyled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        width: 34,\n        minWidth: 34,\n        height: 48,\n        backgroundColor: theme.palette.grey[0],\n        display: \"flex\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        borderRadius: \"4px\",\n        border: \"1px solid\",\n        borderColor: theme.palette.grey[200],\n        svg: {\n            scale: 0.8\n        }\n    };\n});\nexport const EditSelectBookBtn = styled.button.withConfig({\n    componentId: \"sc-d283004d-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_700);\nconst SelectedBooksHeader = styled.div.withConfig({\n    componentId: \"sc-d283004d-1\"\n})(_templateObject1());\nconst ListWrap = styled.div.withConfig({\n    componentId: \"sc-d283004d-2\"\n})(_templateObject2());\nexport const SectionTitle = styled.h3.withConfig({\n    componentId: \"sc-d283004d-3\"\n})(_templateObject3(), (props)=>props.theme.new.colors.sol_gray_800, (props)=>props.theme.new.colors.sol_gray_500);\nexport const BookList = muiStyled(\"button\")((param)=>{\n    let { theme , isMobile  } = param;\n    return {\n        all: \"unset\",\n        display: \"flex\",\n        position: \"relative\",\n        flexDirection: \"row\",\n        gap: \"12px\",\n        alignItems: \"center\",\n        cursor: \"pointer\",\n        flexGgrow: 1,\n        maxWidth: isMobile ? \"100%\" : \"280px\",\n        padding: \"20px\",\n        \"&.active h6\": {\n            color: theme.palette.primary.main\n        }\n    };\n});\nexport const TopPaginationStyledSwiper = muiStyled(Swiper)((param)=>{\n    let { theme  } = param;\n    return {\n        button: {\n            borderTop: \"2px solid\",\n            borderRight: \"2px solid\",\n            borderBottom: 0,\n            borderLeft: \"2px solid\",\n            height: 50,\n            borderTopLeftRadius: \"12px\",\n            borderTopRightRadius: \"12px\"\n        },\n        \"button:not(.active)\": {\n            borderColor: \"transparent\"\n        },\n        \"button.active\": {\n            borderColor: theme.palette.primary.main,\n            backgroundColor: \"white\"\n        },\n        \"button:not(.active):hover\": {\n            backgroundColor: alpha(theme.palette.grey[300], 0.2),\n            transition: \"background-color 0.3s\"\n        },\n        \".swiper-wrapper\": {\n            display: \"flex\",\n            alignItems: \"center\"\n        },\n        \".swiper-slide\": {\n            zIndex: 2,\n            width: \"auto\",\n            bottom: 0\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Container } from \"@/components/Container\";\nimport React from \"react\";\nimport \"react-alice-carousel/lib/alice-carousel.css\";\nimport { styled } from \"@mui/material\";\nimport \"swiper/css/navigation\";\nimport \"swiper/css/pagination\";\nimport \"swiper/css/scrollbar\";\nimport \"swiper/swiper.min.css\";\nimport { SelectedBookList } from \"./SelectedBookList\";\nexport const SelectedBooksSection = (param)=>{\n    let { openSelectBooksModal , selectBookList , setSelectedBook , selectedBook , setModalType  } = param;\n    return /*#__PURE__*/ _jsxs(SelectBooksArea, {\n        className: \"carousel\",\n        children: [\n            /*#__PURE__*/ _jsx(Container, {\n                children: /*#__PURE__*/ _jsx(SelectedBookList, {\n                    openSelectBooksModal: openSelectBooksModal,\n                    selectBookList: selectBookList,\n                    selectedBook: selectedBook,\n                    setSelectedBook: setSelectedBook,\n                    setModalType: setModalType\n                })\n            }),\n            /*#__PURE__*/ _jsx(Divider, {})\n        ]\n    });\n};\nconst Divider = styled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        position: \"absolute\",\n        width: \"100%\",\n        height: \"2px\",\n        backgroundColor: theme.palette.primary.main,\n        bottom: \"0\",\n        zIndex: \"0\"\n    };\n});\nconst SelectBooksArea = styled(\"section\")((param)=>{\n    let { theme  } = param;\n    return {\n        marginTop: 64,\n        width: \"100%\",\n        position: \"relative\",\n        [theme.breakpoints.down(\"sm\")]: {\n            marginTop: 40\n        }\n    };\n});\n","var _rect, _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nvar SvgArrowArea = function SvgArrowArea(props) {\n  return /*#__PURE__*/React.createElement(\"svg\", _extends({\n    width: 48,\n    height: 48,\n    fill: \"none\",\n    xmlns: \"http://www.w3.org/2000/svg\"\n  }, props), _rect || (_rect = /*#__PURE__*/React.createElement(\"rect\", {\n    width: 48,\n    height: 48,\n    rx: 24,\n    fill: \"#3B4054\"\n  })), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n    fillRule: \"evenodd\",\n    clipRule: \"evenodd\",\n    d: \"m30.838 24-8.59 9.664a1 1 0 0 1-1.495-1.328L28.162 24l-7.41-8.336a1 1 0 0 1 1.495-1.328L30.837 24Z\",\n    fill: \"#fff\"\n  })));\n};\nexport default SvgArrowArea;","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n  padding-bottom: 20px;\\n\\n  @media (max-width: 768px) {\\n    padding-bottom: 16px;\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport ArrowArea from \"@/static/assets/arrow/arrow-area.svg\";\nimport { alpha, Box, styled, Typography, useMediaQuery, useTheme } from \"@mui/material\";\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { useRouter } from \"next/router\";\nimport { Swiper, SwiperSlide } from \"swiper/react\";\nimport { BookCard } from \"./BookCard\";\nimport { ManualCurationSectionWrapper } from \"./ManualCurationSection\";\nimport { SwiperCustomButton } from \"./SwiperCustomButton\";\nconst SolvookPassSection = (param)=>{\n    let { promotion , subject , isLoggedIn , selectedBook  } = param;\n    const router = useRouter();\n    const theme = useTheme();\n    const isMobile = useMediaQuery(theme.breakpoints.down(\"sm\"));\n    const handleClickSeeMore = (uiType)=>{\n        if (!(promotion === null || promotion === void 0 ? void 0 : promotion.viewAllLink)) return;\n        mixpanelEvent(\"More Button Clicked\", {\n            \"Button Type\": \"Brand Home Products\",\n            \"Button Name\": \"전체보기\",\n            \"Button URL\": promotion === null || promotion === void 0 ? void 0 : promotion.viewAllLink,\n            \"UI Type\": uiType\n        });\n        router.push(promotion === null || promotion === void 0 ? void 0 : promotion.viewAllLink);\n    };\n    const handleClickBanner = ()=>{\n        mixpanelEvent(\"PR Section Banner Clicked\", {\n            Subject: subject,\n            \"Section Title\": promotion.title,\n            \"Section Type\": \"Banner\",\n            Url: promotion === null || promotion === void 0 ? void 0 : promotion.bannerLink,\n            isLoggedIn,\n            selectedBookId: selectedBook.id,\n            selectedBookTitle: selectedBook.title\n        });\n    };\n    const handleClickCard = (book)=>{\n        mixpanelEvent(\"PR Section Product Clicked\", {\n            Subject: subject,\n            \"Section Title\": promotion.title,\n            \"Section Type\": \"Product\",\n            \"Product Title\": book.title,\n            authorName: book.author,\n            isLoggedIn,\n            price: book.price,\n            productId: book.id,\n            selectedBookId: selectedBook.id,\n            selectedBookTitle: selectedBook.title\n        });\n    };\n    if (!promotion) return null;\n    return /*#__PURE__*/ _jsxs(SectionContainer, {\n        children: [\n            /*#__PURE__*/ _jsxs(SelectedBooksHeader, {\n                children: [\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: isMobile ? \"h6\" : \"h5\",\n                        children: promotion === null || promotion === void 0 ? void 0 : promotion.title\n                    }),\n                    /*#__PURE__*/ _jsxs(Box, {\n                        sx: {\n                            display: \"flex\",\n                            alignItems: \"center\"\n                        },\n                        children: [\n                            /*#__PURE__*/ _jsx(EditSelectBookBtn, {\n                                className: \"edit-select-book-btn\",\n                                onClick: ()=>handleClickSeeMore(\"text\"),\n                                children: \"전체 보기\"\n                            }),\n                            /*#__PURE__*/ _jsx(SwiperCustomButton, {\n                                nextClassName: \"selectedBooks-pass-button-next\",\n                                prevClassName: \"selectedBooks-pass-button-prev\"\n                            })\n                        ]\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(ManualCurationSectionWrapper, {\n                style: {\n                    marginTop: 0,\n                    marginBottom: 0\n                },\n                children: /*#__PURE__*/ _jsxs(Swiper, {\n                    height: 382,\n                    scrollbar: false,\n                    slidesPerView: \"auto\",\n                    spaceBetween: 20,\n                    navigation: {\n                        nextEl: \".selectedBooks-pass-button-next\",\n                        prevEl: \".selectedBooks-pass-button-prev\"\n                    },\n                    children: [\n                        ((promotion === null || promotion === void 0 ? void 0 : promotion.bannerImageUrlPc) || (promotion === null || promotion === void 0 ? void 0 : promotion.bannerImageUrlMobile)) && /*#__PURE__*/ _jsx(SwiperSlide, {\n                            style: {\n                                borderRadius: \"6px\",\n                                overflow: \"hidden\"\n                            },\n                            children: (promotion === null || promotion === void 0 ? void 0 : promotion.bannerLink) ? /*#__PURE__*/ _jsx(Link, {\n                                className: \"book-info-wrapper\",\n                                style: {\n                                    height: \"100%\",\n                                    display: \"block\"\n                                },\n                                onClick: handleClickBanner,\n                                href: promotion.bannerLink,\n                                children: /*#__PURE__*/ _jsx(Image, {\n                                    src: isMobile ? promotion === null || promotion === void 0 ? void 0 : promotion.bannerImageUrlMobile : promotion === null || promotion === void 0 ? void 0 : promotion.bannerImageUrlPc,\n                                    alt: \"PR 모듈 배너 이미지\",\n                                    fill: true\n                                })\n                            }) : /*#__PURE__*/ _jsx(\"div\", {\n                                className: \"book-info-wrapper\",\n                                children: /*#__PURE__*/ _jsx(Image, {\n                                    src: isMobile ? promotion === null || promotion === void 0 ? void 0 : promotion.bannerImageUrlMobile : promotion === null || promotion === void 0 ? void 0 : promotion.bannerImageUrlPc,\n                                    alt: \"PR 모듈 배너 이미지\",\n                                    fill: true\n                                })\n                            })\n                        }, \"item-banner\"),\n                        promotion === null || promotion === void 0 ? void 0 : promotion.items.map((book, index)=>{\n                            return /*#__PURE__*/ _jsx(SwiperSlide, {\n                                children: /*#__PURE__*/ _jsx(BookCard, {\n                                    book: book,\n                                    index: index,\n                                    positionType: \"curation\",\n                                    onClick: ()=>handleClickCard(book)\n                                })\n                            }, \"item-\".concat(index));\n                        }),\n                        /*#__PURE__*/ _jsx(SwiperSlide, {\n                            children: /*#__PURE__*/ _jsxs(SeeMore, {\n                                className: \"book-info-wrapper\",\n                                onClick: ()=>handleClickSeeMore(\"icon\"),\n                                children: [\n                                    /*#__PURE__*/ _jsx(ArrowArea, {}),\n                                    /*#__PURE__*/ _jsx(Typography, {\n                                        variant: \"subtitle1\",\n                                        children: \"전체 보기\"\n                                    })\n                                ]\n                            })\n                        }, \"item-see-more\")\n                    ]\n                })\n            })\n        ]\n    });\n};\nconst SeeMore = styled(Box)((param)=>{\n    let { theme  } = param;\n    return {\n        borderRadius: \"6px\",\n        height: \"100%\",\n        display: \"flex\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        gap: \"12px\",\n        transition: \"background-color 0.2s\",\n        cursor: \"pointer\",\n        \"&:hover\": {\n            backgroundColor: alpha(theme.palette.grey[300], 0.2)\n        }\n    };\n});\nconst SectionContainer = styled(\"section\")((param)=>{\n    let { theme  } = param;\n    return {\n        \".book-info-wrapper\": {\n            width: \"224px \",\n            [theme.breakpoints.down(\"sm\")]: {\n                width: \"150px \"\n            }\n        }\n    };\n});\nexport const EditSelectBookBtn = styled(\"button\")((param)=>{\n    let { theme  } = param;\n    return {\n        all: \"unset\",\n        display: \"flex\",\n        alignItems: \"center\",\n        fontSize: \"14px\",\n        marginRight: \"12px\",\n        cursor: \"pointer\",\n        fontWeight: 600,\n        color: theme.palette.grey[700]\n    };\n});\nconst SelectedBooksHeader = styled(\"div\")(_templateObject());\nexport default SolvookPassSection;\n","import { toQueryStringCamel } from \"src/utils/misc\";\nimport { otherApiClient } from \".\";\nexport const getMain = async (req)=>{\n    const { data  } = await otherApiClient.market.get(\"/main/\".concat(toQueryStringCamel(req)));\n    return data;\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  p,\\n  span {\\n    line-height: 1.5;\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { Container } from \"@/components/Container\";\nimport { AllHandoutSection } from \"@/components/Landing/AllHandoutSection\";\nimport { MainBannerSection } from \"@/components/Landing/MainBanner\";\nimport { MainPageSkeleton } from \"@/components/Landing/MainPageSkeletons\";\nimport { ManualCurationSection } from \"@/components/Landing/ManualCurationSection\";\nimport { MiniBannerSection } from \"@/components/Landing/MiniBannerSection\";\nimport QuickMenu from \"@/components/Landing/QuickMenu\";\nimport { RankingSection } from \"@/components/Landing/RankingSection\";\nimport { SelectedBooksSection } from \"@/components/Landing/SelectedBookSection\";\nimport SolvookPassSection from \"@/components/Landing/SolvookPassSection\";\nimport { SubjectSection } from \"@/components/Landing/SubjectSection\";\nimport { UserSourceStepModal } from \"@/components/Landing/modals/UserSourceStepModal\";\nimport CheckUniversityDialog from \"@/components/UniversityShop/CheckUniversityDialog\";\nimport { useAuthStore } from \"@/lib/auth/AuthStore\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { SIGNUP_AFTER_USER_PROFILE } from \"@/settings/constant\";\nimport { Box } from \"@mui/material\";\nimport { useMutation, useQuery } from \"@tanstack/react-query\";\nimport { useRouter } from \"next/router\";\nimport React, { useEffect, useState } from \"react\";\nimport { getMain } from \"src/api/main\";\nimport { getUserMeta } from \"src/api/users\";\nimport { useMainPageStore, useSavedUserSourceStore } from \"src/store/main\";\nimport { useModal } from \"src/utils/overlay\";\nimport styled from \"styled-components\";\nimport SwiperCore, { A11y, Autoplay, EffectCoverflow, Grid, Navigation, Pagination, Scrollbar } from \"swiper\";\nimport { Subjects } from \"../../../api/product\";\nexport const LandingPage = ()=>{\n    var _data_quickMenu, _data_userSourceData, _data_userSourceData_curation, _data_userSourceData_curation1, _data_userSourceData_curationAll, _data_userSourceData_curationAll1;\n    SwiperCore.use([\n        Navigation,\n        Pagination,\n        Scrollbar,\n        Autoplay,\n        A11y,\n        Grid,\n        EffectCoverflow\n    ]);\n    const { user , isLoggedIn  } = useAuthStore();\n    const { push  } = useRouter();\n    const getMeMutation = useMutation(getUserMeta);\n    const [isSelectBooksModalOpen, { open: openSelectBooksModal , close: closeSelectBooksModal  }] = useModal(\"selectBooksModal\");\n    const { isMobile  } = useWindowDimensions();\n    const { savedUserSource , savedUserMeta , updateUserMeta  } = useSavedUserSourceStore((param)=>{\n        let { savedUserSource , savedUserMeta , updateUserMeta  } = param;\n        return {\n            savedUserSource,\n            savedUserMeta,\n            updateUserMeta\n        };\n    });\n    const { subject , setSubject , selectedBookList , setAllSelectedBookList , selectedBook , setSelectedBook , modalType , setModalType , selectedDataType , setSelectedDataType  } = useMainPageStore((param)=>{\n        let { subject , setSubject , selectedBookList , setAllSelectedBookList , selectedBook , setSelectedBook , modalType , setModalType , selectedDataType , setSelectedDataType  } = param;\n        return {\n            subject,\n            setSubject,\n            selectedBookList,\n            setAllSelectedBookList,\n            selectedBook,\n            setSelectedBook,\n            modalType,\n            setModalType,\n            selectedDataType,\n            setSelectedDataType\n        };\n    });\n    const [guidTooltipOpen, setGuidTooltipOpen] = useState(true);\n    const handleSubject = (newSubject)=>{\n        if (newSubject === subject) return;\n        setSubject(newSubject);\n        getSavedUserSource(newSubject);\n        mixpanelEvent(\"Subject Home Page Viewed\", {\n            subject,\n            isLoggedIn,\n            userId: user === null || user === void 0 ? void 0 : user.id,\n            userType: savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.job\n        });\n    };\n    const handleDataType = (type)=>{\n        setSelectedDataType(type);\n        mixpanelEvent(\"Ranking Tab Clicked\", {\n            subject,\n            contentsType: type,\n            isLoggedIn,\n            userType: savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.job\n        });\n    };\n    const handleSelectedBook = (book)=>{\n        setSelectedBook(book);\n        mixpanelEvent(\"Selected Book Clicked\", {\n            subject,\n            selectedBookId: book.id,\n            selectedBookTitle: book.title\n        });\n    };\n    const onClickBanner = (banner, bannerType)=>{\n        mixpanelEvent(\"Subject Home Banner Clicked\", {\n            subject,\n            bannerType,\n            isLoggedIn,\n            userType: savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.job,\n            bannerUrl: banner.link\n        });\n    };\n    const onClickCuration = (book, title)=>{\n        mixpanelEvent(\"Curation Product Clicked\", {\n            subject,\n            productId: book.id,\n            productTitle: book.title,\n            productType: \"handout\",\n            isLoggedIn,\n            userType: savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.job,\n            curationTitle: title,\n            curationType: selectedDataType,\n            price: book.price,\n            authorName: book.author,\n            selectedBookId: selectedBook === null || selectedBook === void 0 ? void 0 : selectedBook.id,\n            selectedBookTitle: selectedBook === null || selectedBook === void 0 ? void 0 : selectedBook.title,\n            \"Coupon Badge\": book === null || book === void 0 ? void 0 : book.isCouponAvailable,\n            \"Edit Badge\": book === null || book === void 0 ? void 0 : book.isEditable,\n            \"Review Badge\": (book === null || book === void 0 ? void 0 : book.rating) >= 3\n        });\n    };\n    const getUserSourcePanel = (data)=>{\n        if (selectedBookList.length === 0) {\n            var _data_userSourcePanel;\n            setAllSelectedBookList((data === null || data === void 0 ? void 0 : (_data_userSourcePanel = data.userSourcePanel) === null || _data_userSourcePanel === void 0 ? void 0 : _data_userSourcePanel.items) || []);\n        }\n        if (!subject || subject !== data.mainSubject) {\n            setSubject(data.mainSubject);\n        }\n        if (data.userSourceData.isEmpty || !data.userSourceData.salesRanking) {\n            return;\n        }\n        if (!selectedDataType) {\n            setSelectedDataType(data.userSourceData.salesRanking.type.selected);\n        }\n    };\n    const getSavedUserSource = (subject)=>{\n        if (isLoggedIn) {\n            return;\n        }\n        if (savedUserSource.length === 0) {\n            return;\n        }\n        let searchSubject = subject;\n        if (!subject) {\n            if (savedUserSource.length === 2) {\n                searchSubject = Subjects.EN;\n                setSubject(Subjects.EN);\n            } else if (savedUserSource.length === 1) {\n                setSubject(savedUserSource[0].subject);\n                searchSubject = savedUserSource[0].subject;\n            }\n        }\n        const foundSource = savedUserSource.find((item)=>item.subject === searchSubject);\n        if (foundSource) {\n            setAllSelectedBookList(foundSource.selectedBookList);\n        }\n    };\n    const { data , isLoading , isFetching , isError  } = useQuery([\n        \"main\",\n        selectedBook,\n        selectedDataType,\n        subject,\n        user === null || user === void 0 ? void 0 : user.id\n    ], ()=>{\n        return getMain({\n            subject: subject,\n            userSource: selectedBook === null || selectedBook === void 0 ? void 0 : selectedBook.id.toString(),\n            salesRankingType: selectedDataType\n        });\n    }, {\n        retry: 1,\n        keepPreviousData: true,\n        refetchOnWindowFocus: false,\n        refetchOnMount: false,\n        enabled: !isSelectBooksModalOpen,\n        onSuccess: (data)=>{\n            getUserSourcePanel(data);\n        }\n    });\n    const fetchUserMeta = async ()=>{\n        var _res_schoolItems;\n        const res = await getMeMutation.mutateAsync();\n        //등록된 정보가 없을 경우, 해당 정보를 받기 위한 step으로 이동\n        if (!(res === null || res === void 0 ? void 0 : res.job) || !res.mainSubject && (res === null || res === void 0 ? void 0 : res.job) !== \"university\" || !(res === null || res === void 0 ? void 0 : (_res_schoolItems = res.schoolItems) === null || _res_schoolItems === void 0 ? void 0 : _res_schoolItems.length)) {\n            await push({\n                pathname: SIGNUP_AFTER_USER_PROFILE,\n                query: {\n                    alreadySignupUser: true\n                }\n            });\n            return;\n        }\n        //업데이트가 안됐을 경우 업데이트\n        updateUserMeta({\n            mainSubject: res.mainSubject,\n            job: res.job,\n            schoolItems: res.schoolItems.map((item)=>item.id)\n        });\n        return;\n    };\n    useEffect(()=>{\n        // setSubject(null)\n        getSavedUserSource();\n        const { job , schoolItems , mainSubject  } = savedUserMeta;\n        if (isLoggedIn) {\n            if (!job || !mainSubject && job !== \"university\" || !(schoolItems === null || schoolItems === void 0 ? void 0 : schoolItems.length)) {\n                fetchUserMeta();\n            }\n        }\n    }, [\n        isLoggedIn,\n        savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.job,\n        savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.mainSubject,\n        savedUserMeta === null || savedUserMeta === void 0 ? void 0 : savedUserMeta.schoolItems\n    ]);\n    if (isLoading || isError) return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(SubjectSection, {\n                setSubject: handleSubject,\n                subject: subject\n            }),\n            /*#__PURE__*/ _jsx(MainPageSkeleton, {})\n        ]\n    });\n    return /*#__PURE__*/ _jsxs(LandingPageWrapper, {\n        children: [\n            /*#__PURE__*/ _jsx(SubjectSection, {\n                setSubject: handleSubject,\n                subject: subject\n            }),\n            /*#__PURE__*/ _jsx(MainBannerSection, {\n                data: data === null || data === void 0 ? void 0 : data.mainBanner,\n                onClick: onClickBanner\n            }),\n            /*#__PURE__*/ _jsx(QuickMenu, {\n                items: data === null || data === void 0 ? void 0 : (_data_quickMenu = data.quickMenu) === null || _data_quickMenu === void 0 ? void 0 : _data_quickMenu.items,\n                subject: subject\n            }),\n            /*#__PURE__*/ _jsxs(Box, {\n                sx: {\n                    width: \"100vw\",\n                    marginLeft: \"calc(50% - 50vw)\"\n                },\n                children: [\n                    /*#__PURE__*/ _jsx(SelectedBooksSection, {\n                        openSelectBooksModal: openSelectBooksModal,\n                        selectBookList: selectedBookList,\n                        selectedBook: selectedBook,\n                        setSelectedBook: handleSelectedBook,\n                        setModalType: setModalType\n                    }),\n                    /*#__PURE__*/ _jsx(Box, {\n                        sx: (theme)=>({\n                                backgroundColor: \"white\",\n                                paddingTop: \"64px\",\n                                [theme.breakpoints.down(\"sm\")]: {\n                                    paddingTop: \"40px\"\n                                }\n                            }),\n                        children: /*#__PURE__*/ _jsxs(Container, {\n                            style: {\n                                display: \"flex\",\n                                flexDirection: \"column\",\n                                gap: isMobile ? \"40px\" : \"64px\",\n                                paddingBottom: isMobile ? \"40px\" : \"64px\"\n                            },\n                            children: [\n                                /*#__PURE__*/ _jsx(SolvookPassSection, {\n                                    promotion: data === null || data === void 0 ? void 0 : (_data_userSourceData = data.userSourceData) === null || _data_userSourceData === void 0 ? void 0 : _data_userSourceData.promotion,\n                                    subject: subject,\n                                    isLoggedIn: isLoggedIn,\n                                    selectedBook: selectedBook\n                                }),\n                                /*#__PURE__*/ _jsx(RankingSection, {\n                                    isEmptyRanking: data === null || data === void 0 ? void 0 : data.userSourceData.isEmpty,\n                                    data: data === null || data === void 0 ? void 0 : data.userSourceData.salesRanking,\n                                    handleDataType: handleDataType,\n                                    selectedDataType: selectedDataType,\n                                    selectedBook: selectedBook,\n                                    showSkeleton: isFetching,\n                                    onClick: onClickCuration\n                                }),\n                                /*#__PURE__*/ _jsx(MiniBannerSection, {\n                                    data: data === null || data === void 0 ? void 0 : data.userSourceData.miniBanner,\n                                    onClick: onClickBanner\n                                }),\n                                ((_data_userSourceData_curation = data === null || data === void 0 ? void 0 : data.userSourceData.curation) === null || _data_userSourceData_curation === void 0 ? void 0 : _data_userSourceData_curation.sections.length) > 0 && ((_data_userSourceData_curation1 = data === null || data === void 0 ? void 0 : data.userSourceData.curation) === null || _data_userSourceData_curation1 === void 0 ? void 0 : _data_userSourceData_curation1.sections.map((section, index)=>{\n                                    return /*#__PURE__*/ _jsx(ManualCurationSection, {\n                                        showSkeleton: isFetching,\n                                        data: section,\n                                        onClick: onClickCuration\n                                    }, section.title + index);\n                                })),\n                                /*#__PURE__*/ _jsx(AllHandoutSection, {\n                                    isEmptyRanking: data === null || data === void 0 ? void 0 : data.userSourceData.isEmpty,\n                                    data: data === null || data === void 0 ? void 0 : data.userSourceData.allProduct,\n                                    handleDataType: setSelectedDataType,\n                                    selectedDataType: selectedDataType,\n                                    selectedBook: selectedBook,\n                                    showSkeleton: isFetching,\n                                    subject: subject\n                                }),\n                                ((_data_userSourceData_curationAll = data === null || data === void 0 ? void 0 : data.userSourceData.curationAll) === null || _data_userSourceData_curationAll === void 0 ? void 0 : _data_userSourceData_curationAll.sections.length) > 0 && ((_data_userSourceData_curationAll1 = data === null || data === void 0 ? void 0 : data.userSourceData.curationAll) === null || _data_userSourceData_curationAll1 === void 0 ? void 0 : _data_userSourceData_curationAll1.sections.map((section, index)=>{\n                                    return /*#__PURE__*/ _jsx(ManualCurationSection, {\n                                        showSkeleton: isFetching,\n                                        data: section,\n                                        onClick: onClickCuration\n                                    }, section.title + index);\n                                }))\n                            ]\n                        })\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(UserSourceStepModal, {\n                closeSelectBooksModal: closeSelectBooksModal,\n                isSelectBooksModalOpen: isSelectBooksModalOpen,\n                modalType: modalType\n            }),\n            user.job === \"university\" && /*#__PURE__*/ _jsx(CheckUniversityDialog, {})\n        ]\n    });\n};\nconst LandingPageWrapper = styled.div.withConfig({\n    componentId: \"sc-53d50583-0\"\n})(_templateObject());\n","// Custom DatePicker that uses Day.js instead of Moment.js\nimport { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n\t \t/* screen width is greater than 1200px (large) */\\n\t\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  min-height: 80vh;\\n  padding-bottom: 0;\\n  overflow-x: hidden;\\n  background-color: \",\n        \";\\n  &.header-fixed {\\n    padding-top: 85px;\\n  }\\n\\n  \",\n        \"\\n\"\n    ]);\n    _templateObject1 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject2() {\n    const data = _tagged_template_literal([\n        \"\\n  padding: 120px 20px;\\n  text-align: center;\\n\\n  p {\\n    font-size: 16px;\\n  }\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { Container, View } from \"@/components\";\nimport { PreviewDialogProvider } from \"@/components/Search/PreviewDialogProvider\";\nimport { LandingPage } from \"@/modules/landings/home/LandingPage\";\nimport { styled } from \"@mui/material\";\nimport media from \"styled-media-query\";\nconst HomePageWrapper = styled(View)(_templateObject1(), (param)=>{\n    let { theme  } = param;\n    return theme.palette.grey[50];\n}, media.greaterThan(\"large\")(_templateObject()));\nconst RequireKaikasWrppaer = styled(\"div\")(_templateObject2());\nconst HomePage = (param)=>{\n    let { auth  } = param;\n    return /*#__PURE__*/ _jsx(HomePageWrapper, {\n        children: /*#__PURE__*/ _jsx(Container, {\n            children: /*#__PURE__*/ _jsx(PreviewDialogProvider, {\n                children: /*#__PURE__*/ _jsx(LandingPage, {})\n            })\n        })\n    });\n};\n//\n// HomePage.getInitialProps = async (ctx) => {\n// \tconst { auth, relayerInfos } = ctx\n//\n// \tconsole.log('getInitialProps', auth)\n//\n// \treturn {}\n// }\n// export default withAuth(HomePage, {\n// \tauth: false,\n// })\nexport default HomePage;\n"],"names":[],"sourceRoot":""}