{"version":3,"file":"static/chunks/5680-a0a28b5597c962c0.js","mappings":"AACA","sources":["webpack://_N_E/./src/components/Search/Tags.tsx","webpack://_N_E/./src/components/Search/SearchListItem.tsx","webpack://_N_E/./src/components/Books/List/BookList.tsx","webpack://_N_E/./src/components/Books/List/BookListDetailFilter.tsx","webpack://_N_E/./src/components/Books/List/BookListSearchForm.tsx","webpack://_N_E/./src/components/Books/List/BookListFilterArea.tsx","webpack://_N_E/./src/components/Books/List/BookListPage.tsx","webpack://_N_E/./src/components/Books/List/BooksResultDesc.tsx","webpack://_N_E/./src/modules/mypages/libraries/components/filter/LibraryFilterDropdown.tsx","webpack://_N_E/./src/utils/scroll.ts","webpack://_N_E/"],"sourcesContent":["import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n display: inline-block;\\n vertical-align: middle;\\n font-size: 12px;\\n color: #5f5f69;\\n line-height: 23px;\\n padding: 0 6px;\\n border: solid 1px #f3f3f3;\\n border-radius: 2px;\\n background-color: #fafafa;\\n height: 24px;\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nexport const TagsWrapper = styled.div.withConfig({\n componentId: \"sc-77cfbac1-0\"\n})(_templateObject());\nexport const Tags = (param)=>{\n let { text } = param;\n return /*#__PURE__*/ _jsx(TagsWrapper, {\n children: text\n });\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n position: relative;\\n width: 50%;\\n min-height: 201px;\\n border-right: 1px solid #f3f3f3;\\n border-bottom: 1px solid #f3f3f3;\\n padding: 28px;\\n padding-right: 25px;\\n @media (max-width: 1200px) {\\n min-height: 126px;\\n padding: 16px;\\n width: 100%;\\n }\\n\\n a {\\n width: 100%;\\n display: flex;\\n }\\n\\n p {\\n margin: 0;\\n }\\n\\n .thumb-img-wrapper {\\n }\\n\\n .thumb-img {\\n object-fit: contain;\\n min-height: 156px;\\n border: 1px solid #f3f3f3;\\n background-color: #fff;\\n max-width: none;\\n @media (max-width: 1200px) {\\n height: 96px;\\n min-height: 96px;\\n max-width: 71px;\\n width: auto;\\n }\\n }\\n\\n .contents {\\n margin-left: 16px;\\n display: flex;\\n flex-direction: column;\\n justify-content: space-between;\\n @media (max-width: 1200px) {\\n justify-content: flex-start;\\n }\\n }\\n\\n .title {\\n margin-bottom: 8px;\\n font-size: 16px;\\n font-weight: 600;\\n line-height: 1.5;\\n display: -webkit-box;\\n -webkit-box-orient: vertical;\\n -webkit-line-clamp: 2;\\n overflow: hidden;\\n text-overflow: ellipsis;\\n @media (max-width: 1200px) {\\n font-size: 14px;\\n margin-bottom: 4px;\\n display: block;\\n word-break: break-all;\\n }\\n }\\n\\n .author {\\n font-size: 14px;\\n line-height: 1.5;\\n color: \",\n \";\\n margin-bottom: 8px;\\n @media (max-width: 1200px) {\\n font-size: 12px;\\n margin-bottom: 0;\\n }\\n }\\n\\n .price-badge-wrapper {\\n display: flex;\\n align-items: center;\\n\\n .parsing-badge-img {\\n width: 71px;\\n height: 21px;\\n background: url('/assets/label-edit-filter.svg') no-repeat;\\n }\\n\\n @media (max-width: 1200px) {\\n margin-top: 12px;\\n .parsing-badge-img {\\n width: 52.5px;\\n height: 17px;\\n background-size: contain;\\n }\\n }\\n\\n .price {\\n margin-right: 6px;\\n font-size: 20px;\\n font-weight: bold;\\n line-height: 30px;\\n @media (max-width: 1200px) {\\n font-size: 16px;\\n }\\n }\\n }\\n\\n .tags-wrapper {\\n flex-wrap: wrap;\\n margin-top: 6px;\\n display: flex;\\n gap: 6px;\\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 Image from \"@/components/common/Image\";\nimport RatingWithText from \"@/components/common/RatingWithText\";\nimport { CouponTag, EditableTag } from \"@/components/Tags\";\nimport { priceFormatter } from \"@/lib/utils\";\nimport { Tags, TagsWrapper } from \"@/components/Search/Tags\";\nimport { BOOKS_PRODUCT, EBOOKS_PRODUCT } from \"@/settings/constant\";\nimport Link from \"next/link\";\nimport React, { useMemo } from \"react\";\nimport { DataTypesWithString } from \"../../api/product\";\nimport styled from \"styled-components\";\nimport { styled as muiStyled } from \"@mui/material\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nexport const SearchListItem = (param)=>{\n let { thumbImage , id , productType , canEdit , title , author , price , rating , isCouponAvailable , dataTypes , unit , licenseTitle , questionNumber } = param;\n const { isHandout , url } = useMemo(()=>{\n let url = \"/products/\".concat(id);\n switch(productType){\n case \"aladinbook\":\n url = BOOKS_PRODUCT.concat(\"/\".concat(id));\n break;\n case \"ebook\":\n url = EBOOKS_PRODUCT.concat(\"/\".concat(id));\n break;\n default:\n }\n return {\n isHandout: productType === \"handout\",\n url\n };\n }, [\n productType\n ]);\n return /*#__PURE__*/ _jsx(SearchListItemWrapper, {\n className: \"item-wrapper\",\n children: /*#__PURE__*/ _jsxs(Link, {\n href: url,\n passHref: true,\n onClick: ()=>{\n mixpanelEvent(\"Search Item Clicked\", {\n \"Product ID\": id,\n \"Product Title\": title,\n \"Coupon Badge\": isCouponAvailable,\n \"Edit Badge\": canEdit,\n \"Review Badge\": rating && parseFloat(rating) >= 3\n });\n },\n children: [\n canEdit && /*#__PURE__*/ _jsx(SearchItemEditableTag, {\n children: \"편집가능\"\n }),\n /*#__PURE__*/ _jsx(\"div\", {\n className: \"thumb-img-wrapper\",\n children: /*#__PURE__*/ _jsx(Image, {\n src: thumbImage,\n width: 120,\n height: 158,\n alt: \"thumbnail\",\n className: \"thumb-img\"\n })\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"contents\",\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"content-top\",\n children: [\n /*#__PURE__*/ _jsx(\"p\", {\n className: \"title\",\n children: title\n }),\n /*#__PURE__*/ _jsx(\"p\", {\n className: \"author\",\n children: author\n })\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"content-bottom\",\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"price-badge-wrapper\",\n children: [\n /*#__PURE__*/ _jsxs(\"p\", {\n className: \"price\",\n children: [\n priceFormatter(price),\n \"원\"\n ]\n }),\n isCouponAvailable && /*#__PURE__*/ _jsx(SearchItemCouponTag, {\n children: \"할인쿠폰\"\n })\n ]\n }),\n isHandout && /*#__PURE__*/ _jsxs(\"div\", {\n className: \"tags-wrapper\",\n children: [\n rating && parseFloat(rating) >= 3 && /*#__PURE__*/ _jsx(Tags, {\n text: /*#__PURE__*/ _jsx(RatingWithText, {\n rating: parseFloat(rating)\n })\n }),\n licenseTitle && /*#__PURE__*/ _jsx(Tags, {\n text: licenseTitle\n }),\n dataTypes.length > 0 && /*#__PURE__*/ _jsxs(TagsWrapper, {\n children: [\n DataTypesWithString[dataTypes[0]],\n (dataTypes === null || dataTypes === void 0 ? void 0 : dataTypes.length) > 1 && /*#__PURE__*/ _jsxs(_Fragment, {\n children: [\n \" 외 \",\n dataTypes.length - 1\n ]\n })\n ]\n }),\n unit && /*#__PURE__*/ _jsx(Tags, {\n text: unit\n }),\n questionNumber > 0 && /*#__PURE__*/ _jsx(Tags, {\n text: \"\".concat(questionNumber.toString(), \"문항\")\n })\n ]\n })\n ]\n })\n ]\n })\n ]\n })\n });\n};\nconst SearchListItemWrapper = styled.div.withConfig({\n componentId: \"sc-cd349116-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_500);\nconst SearchItemCouponTag = muiStyled(CouponTag)((param)=>{\n let { theme } = param;\n return {\n marginLeft: \"6px\"\n };\n});\nconst SearchItemEditableTag = muiStyled(EditableTag)((param)=>{\n let { theme } = param;\n return {\n top: \"12px\",\n left: \"12px\",\n [theme.breakpoints.down(\"md\")]: {\n top: \"8px\",\n left: \"8px\"\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 @media (max-width: 1200px) {\\n margin: 0;\\n }\\n @media (max-width: 768px) {\\n margin: 0 -16px;\\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 { SearchFilteredProductEmpty } from \"@/components/Search/SearchFilteredProductEmpty\";\nimport { SearchListItem } from \"@/components/Search/SearchListItem\";\nimport { SearchListWrapper } from \"@/components/Search/SearchProductListView\";\nimport { SkeletonListItem } from \"@/components/Search/SkeletonListItem\";\nimport { useBooksQuery } from \"@/hooks/useBooksQuery\";\nimport React, { Fragment, useEffect } from \"react\";\nimport styled from \"styled-components\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nconst NewBookListWrapper = styled(SearchListWrapper).withConfig({\n componentId: \"sc-3076d6a2-0\"\n})(_templateObject());\nexport const BookList = (param)=>{\n let { listData , isFetchingNextPage , hasNextPage , isLoading , isSuccess } = param;\n var _listData_pages_;\n const { hasSelectedFilter , productType , keyword } = useBooksQuery();\n useEffect(()=>{\n var _listData_pages_;\n isSuccess && hasSelectedFilter && ((_listData_pages_ = listData === null || listData === void 0 ? void 0 : listData.pages[0]) === null || _listData_pages_ === void 0 ? void 0 : _listData_pages_.data.length) === 0 && mixpanelEvent(\"No Search Results Found\", {\n position: productType === \"ebook\" ? \"ebook\" : \"books\",\n keyword: keyword\n });\n }, [\n isSuccess,\n hasSelectedFilter,\n listData\n ]);\n if (isLoading) return /*#__PURE__*/ _jsx(SearchListWrapper, {\n children: [\n ...Array(10)\n ].map((_, index)=>/*#__PURE__*/ _jsx(SkeletonListItem, {}, index))\n });\n if (isSuccess && hasSelectedFilter && ((_listData_pages_ = listData === null || listData === void 0 ? void 0 : listData.pages[0]) === null || _listData_pages_ === void 0 ? void 0 : _listData_pages_.data.length) === 0) {\n return /*#__PURE__*/ _jsx(SearchFilteredProductEmpty, {});\n }\n return /*#__PURE__*/ _jsxs(_Fragment, {\n children: [\n /*#__PURE__*/ _jsx(NewBookListWrapper, {\n children: listData === null || listData === void 0 ? void 0 : listData.pages.map((page, idx)=>{\n var _page_data;\n return /*#__PURE__*/ _jsx(Fragment, {\n children: page === null || page === void 0 ? void 0 : (_page_data = page.data) === null || _page_data === void 0 ? void 0 : _page_data.map((product)=>{\n if (!!!product) return null;\n return /*#__PURE__*/ _jsx(SearchListItem, {\n title: product.title,\n author: product.author,\n thumbImage: product.thumbImg,\n id: product.id.toString(),\n productType: product.productType,\n price: product.price\n }, \"search-list-item-\".concat(product.id));\n })\n }, \"search-list-data-\".concat(idx));\n })\n }),\n isFetchingNextPage && hasNextPage && /*#__PURE__*/ _jsx(SearchListWrapper, {\n children: [\n ...Array(2)\n ].map((_, index)=>/*#__PURE__*/ _jsx(SkeletonListItem, {}, index))\n })\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 display: flex;\\n gap: 12px;\\n\\n .ant-btn {\\n border: 1px solid \",\n \";\\n }\\n\\n .ant-dropdown-trigger {\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n line-height: 24px;\\n\\n i {\\n margin-left: 4px;\\n }\\n\\n color: \",\n \";\\n\\n &.active {\\n color: \",\n \";\\n font-weight: 600;\\n border-color: \",\n \";\\n background-color: \",\n \";\\n\\n svg {\\n stroke: \",\n \";\\n }\\n }\\n\\n &.ant-dropdown-open {\\n color: \",\n \";\\n background-color: \",\n \";\\n border: solid 1px \",\n \";\\n\\n i {\\n svg {\\n stroke: \",\n \";\\n }\\n }\\n }\\n\\n &.ant-dropdown-open {\\n }\\n }\\n\\n .ant-dropdown-trigger {\\n @media (hover: hover) {\\n &:hover:not(.ant-dropdown-open) {\\n background-color: \",\n \";\\n border: solid 1px \",\n \";\\n color: \",\n \";\\n\\n svg {\\n stroke: \",\n \";\\n }\\n }\\n }\\n @media (max-width: 768px) {\\n height: 30px;\\n padding: 4px 8px;\\n font-size: 14px;\\n }\\n }\\n\\n @media (max-width: 768px) {\\n i {\\n //display: none;\\n }\\n\\n body:has(&) {\\n .styled-card {\\n display: none;\\n }\\n }\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport styled from \"styled-components\";\nimport LibraryFilterDropdown from \"@/modules/mypages/libraries/components/filter/LibraryFilterDropdown\";\nimport { Checkbox, Col, Row } from \"antd\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { BookListDetailFiltersMap, FilterTypeToQueryKey, findLabel } from \"../../../api/booksProducts\";\nexport const BookListDetailFilter = (param)=>{\n let { filterList , handleMobileSlider , selectedFilterList , query , handleDetailFilter } = param;\n const { width } = useWindowDimensions();\n const isMobile = width < 769;\n if (filterList) return /*#__PURE__*/ _jsx(BookListDetailFilterWrapper, {\n children: Object.keys(BookListDetailFiltersMap).map((key)=>{\n var _filterList_key;\n const queryKey = FilterTypeToQueryKey[key];\n const count = selectedFilterList.filter((item)=>item.key === queryKey).length;\n const sortedFilterList = (_filterList_key = filterList[key]) === null || _filterList_key === void 0 ? void 0 : _filterList_key.sort((a, b)=>{\n if (key === \"publisher\") {\n const strA = String(a);\n const strB = String(b);\n const isKorean = (text)=>/^[\\uac00-\\ud7a3]+$/.test(text[0]);\n if (isKorean(strA) === isKorean(strB)) {\n return strA.localeCompare(strB);\n }\n if (isKorean(strA) && !isKorean(strB)) {\n return -1;\n }\n if (!isKorean(strA) && isKorean(strB)) {\n return 1;\n }\n }\n });\n return /*#__PURE__*/ _jsx(\"div\", {\n onClick: ()=>{\n if (isMobile) {\n handleMobileSlider(true, queryKey);\n }\n },\n children: /*#__PURE__*/ _jsx(LibraryFilterDropdown, {\n label: BookListDetailFiltersMap[key].label,\n count: count,\n children: /*#__PURE__*/ _jsx(Row, {\n gutter: [\n 24,\n 0\n ],\n children: filterList[key] && sortedFilterList.map((sub)=>{\n var _query_queryKey, _BookListDetailFiltersMap_key;\n const isChecked = (_query_queryKey = query[queryKey]) === null || _query_queryKey === void 0 ? void 0 : _query_queryKey.includes(sub.toString());\n const label = findLabel(queryKey, sub);\n return /*#__PURE__*/ _jsx(Col, {\n span: ((_BookListDetailFiltersMap_key = BookListDetailFiltersMap[key]) === null || _BookListDetailFiltersMap_key === void 0 ? void 0 : _BookListDetailFiltersMap_key.colSpan) || 12,\n children: /*#__PURE__*/ _jsx(Checkbox, {\n checked: isChecked,\n onChange: ()=>{\n handleDetailFilter(queryKey, sub, sub);\n },\n children: label\n })\n }, sub);\n })\n })\n })\n }, \"new-book-filter-\" + key);\n })\n });\n};\nconst BookListDetailFilterWrapper = styled.div.withConfig({\n componentId: \"sc-28c46ad3-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_100, (props)=>props.theme.new.colors.sol_gray_600, (props)=>props.theme.new.colors.sol_indigo_500, (props)=>props.theme.new.colors.sol_indigo_200, (props)=>props.theme.new.colors.sol_indigo_0, (props)=>props.theme.new.colors.sol_indigo_500, (props)=>props.theme.new.colors.white, (props)=>props.theme.new.colors.sol_indigo_500, (props)=>props.theme.new.colors.sol_gray_100, (props)=>props.theme.new.colors.white, (props)=>props.theme.new.colors.sol_indigo_0, (props)=>props.theme.new.colors.sol_gray_100, (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 ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport React, { useEffect, useState } from \"react\";\nimport styled from \"styled-components\";\nimport TextField from \"../../common/TextField\";\nimport { Modal } from \"antd\";\nexport const BookListSearchForm = (param)=>{\n let { keyword , handleSearch , placeholder } = param;\n const [searchValue, setSearchValue] = useState(keyword);\n const onChange = (e)=>{\n setSearchValue(e.target.value);\n };\n const onSearch = (e)=>{\n if (searchValue.trim().length === 0) {\n Modal.warn({\n title: \"검색어를 1글자 이상 입력해주세요.\"\n });\n return;\n }\n handleSearch(searchValue);\n };\n const resetSearch = ()=>{\n setSearchValue(\"\");\n handleSearch(\"\");\n };\n useEffect(()=>{\n if (!keyword) {\n setSearchValue(\"\");\n }\n }, [\n keyword\n ]);\n return /*#__PURE__*/ _jsx(BookListSearchFormWrapper, {\n onSubmit: (e)=>e.preventDefault(),\n children: /*#__PURE__*/ _jsx(TextField, {\n placeholder: placeholder,\n value: searchValue,\n onSubmit: onSearch,\n onClear: resetSearch,\n onChange: onChange,\n onSearchClick: onSearch\n })\n });\n};\nconst BookListSearchFormWrapper = styled.form.withConfig({\n componentId: \"sc-cf83709d-0\"\n})(_templateObject());\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n width: 90px;\\n color: \",\n \";\\n font-weight: 600;\\n line-height: 1.5;\\n font-size: 16px;\\n @media (max-width: 768px) {\\n font-size: 14px;\\n //width: 67px;\\n padding-right: 16px;\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n margin-top: 0;\\n\\n .filter-area {\\n .ant-row {\\n align-items: center;\\n\\n .ant-col:nth-child(2) {\\n width: 100%;\\n flex: 1;\\n }\\n }\\n }\\n\\n @media (max-width: 1200px) {\\n border-radius: 6px;\\n box-shadow: 3px 3px 12px 0px rgba(28, 31, 46, 0.06);\\n padding: 24px;\\n background-color: white;\\n border-bottom: none;\\n margin: 0;\\n }\\n @media (max-width: 768px) {\\n box-shadow: none;\\n border-bottom: 8px solid \",\n \";\\n border-radius: 0;\\n margin: 0 -16px;\\n padding: 16px 16px 0;\\n .filter-area {\\n padding: 0 16px 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 h2 {\\n color: \",\n \";\\n font-size: 24px;\\n font-weight: 600;\\n line-height: 32px;\\n padding-bottom: 20px;\\n padding-top: 48px;\\n }\\n\\n @media (max-width: 768px) {\\n background-color: \",\n \";\\n margin: 0 -16px;\\n padding: 0 16px;\\n h2 {\\n padding: 20px 0;\\n margin: 0;\\n text-align: center;\\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 { useMemo, useState } from \"react\";\nimport { useBooksQuery } from \"@/hooks/useBooksQuery\";\nimport { MobileFilterSideSheet } from \"@/components/Search/MobileFilterSideSheet\";\nimport styled from \"styled-components\";\nimport { Col, Row } from \"antd\";\nimport { BookListMobileFilterList } from \"@/components/Books/List/BookListMobileFilterList\";\nimport { BookListDetailFilter } from \"./BookListDetailFilter\";\nimport { BookListSearchForm } from \"./BookListSearchForm\";\nimport { BookListSelectedFilter } from \"./BookListSelectedFilter\";\nimport { SourceTypeWithString } from \"src/api/product\";\nimport { FilterArea, MobileSliderArea, SelectingArea } from \"@/components/Search\";\nexport const BookListFilterArea = (param)=>{\n let { filterStore } = param;\n const { handleDetailFilter , selectedFilterList , productType , handleSearch , keyword , query } = useBooksQuery();\n const [openMobileSlider, setOpenMobileSlider] = useState({\n isOpen: false,\n value: \"\"\n });\n const handleMobileSlider = (isOpen, value)=>{\n setOpenMobileSlider({\n isOpen,\n value\n });\n };\n const placeholderByType = useMemo(()=>{\n switch(productType){\n case \"aladinbook\":\n return \"찾으시는 도서를 검색해보세요\";\n case \"ebook\":\n return \"'기출문제집'을 검색해보세요\";\n default:\n return \"검색어를 입력해주세요\";\n }\n }, [\n productType\n ]);\n return /*#__PURE__*/ _jsxs(_Fragment, {\n children: [\n /*#__PURE__*/ _jsxs(BookListFilterAreaWrapper, {\n children: [\n /*#__PURE__*/ _jsxs(\"h2\", {\n children: [\n SourceTypeWithString[productType],\n \" 상품 찾기\"\n ]\n }),\n /*#__PURE__*/ _jsxs(BookListSelectingArea, {\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"filter-area\",\n children: [\n /*#__PURE__*/ _jsxs(Row, {\n children: [\n /*#__PURE__*/ _jsx(Col, {\n children: /*#__PURE__*/ _jsx(FilterName, {\n children: \"검색\"\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n children: /*#__PURE__*/ _jsx(BookListSearchForm, {\n keyword: keyword,\n handleSearch: handleSearch,\n placeholder: placeholderByType\n })\n })\n ]\n }),\n /*#__PURE__*/ _jsxs(Row, {\n children: [\n /*#__PURE__*/ _jsx(Col, {\n children: /*#__PURE__*/ _jsx(FilterName, {\n children: \"상세 필터\"\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n children: /*#__PURE__*/ _jsx(BookListDetailFilter, {\n filterList: filterStore,\n handleMobileSlider: handleMobileSlider,\n selectedFilterList: selectedFilterList,\n query: query,\n handleDetailFilter: handleDetailFilter\n })\n })\n ]\n })\n ]\n }),\n /*#__PURE__*/ _jsx(BookListSelectedFilter, {})\n ]\n })\n ]\n }),\n /*#__PURE__*/ _jsx(MobileSliderArea, {\n children: /*#__PURE__*/ _jsxs(MobileFilterSideSheet, {\n title: \"상세 필터\",\n sliderOpen: openMobileSlider,\n openSlider: handleMobileSlider,\n children: [\n /*#__PURE__*/ _jsx(BookListSelectedFilter, {\n slider: true\n }),\n /*#__PURE__*/ _jsx(BookListMobileFilterList, {\n handleFilter: handleDetailFilter,\n filters: filterStore,\n selectedFilters: selectedFilterList,\n openSlider: handleMobileSlider,\n sliderOpen: openMobileSlider\n })\n ]\n })\n })\n ]\n });\n};\nconst FilterName = styled.p.withConfig({\n componentId: \"sc-fa79eb8c-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_800);\nconst BookListSelectingArea = styled(SelectingArea).withConfig({\n componentId: \"sc-fa79eb8c-1\"\n})(_templateObject1(), (props)=>props.theme.new.colors.sol_gray_50);\nconst BookListFilterAreaWrapper = styled(FilterArea).withConfig({\n componentId: \"sc-fa79eb8c-2\"\n})(_templateObject2(), (pros)=>pros.theme.new.colors.sol_gray_900, (props)=>props.theme.new.colors.sol_gray_0);\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n position: relative;\\n background-color: \",\n \";\\n padding-bottom: 40px;\\n\\n .sort-select {\\n visibility: hidden;\\n }\\n\\n body:has(&) {\\n .search-request-form {\\n visibility: hidden;\\n }\\n\\n @media (max-width: 768px) {\\n .inner {\\n border-bottom: 1px solid \",\n \";\\n }\\n\\n .fixed {\\n display: none;\\n }\\n\\n .search-request-form {\\n display: none;\\n }\\n }\\n }\\n\\n @media (max-width: 768px) {\\n background-color: \",\n \";\\n .active-tab-wrapper {\\n margin: 0 -16px;\\n padding: unset;\\n flex: 1;\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n gap: unset;\\n\\n li {\\n width: 100%;\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n padding: 12px 0;\\n\\n > div {\\n font-size: 16px;\\n line-height: 24px;\\n }\\n\\n &.active {\\n padding: 12px 0 10px;\\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 ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { BookList } from \"@/components/Books/List/BookList\";\nimport { BookListFilterArea } from \"@/components/Books/List/BookListFilterArea\";\nimport { BooksResultDesc } from \"@/components/Books/List/BooksResultDesc\";\nimport { Container } from \"@/components/Container/Container\";\nimport { ActiveTabLabel, SearchListWrap } from \"@/components/Search\";\nimport { ActiveTab } from \"@/components/common/ActiveTab\";\nimport { useBooksQuery } from \"@/hooks/useBooksQuery\";\nimport { useInfiniteQuery, useQuery } from \"@tanstack/react-query\";\nimport { Modal } from \"antd\";\nimport { useEffect } from \"react\";\nimport { useInView } from \"react-intersection-observer\";\nimport { QueryKey, getBooksProducts, getBooksProductsCount, getBooksProductsFilters } from \"src/api/booksProducts\";\nimport { SourceTypeWithString } from \"src/api/product\";\nimport styled from \"styled-components\";\nimport { useScrollPosition } from \"../../../utils/scroll\";\nconst LIMIT = 10;\nexport const BookListPage = (param)=>{\n let {} = param;\n var _bookList_pages_, _bookList_pages_1;\n const { handleActiveTab , productType , getFilteredQuery , searchParams } = useBooksQuery();\n const [bottom, inView] = useInView();\n const { data: count } = useQuery([\n \"bookListCount\"\n ], ()=>getBooksProductsCount());\n const { data: filter , isLoading: isLoadingFilterData } = useQuery([\n \"bookListFilter\",\n productType\n ], ()=>getBooksProductsFilters({\n productType: productType,\n fields: [\n \"subject\",\n \"publisher\",\n \"curriculum\"\n ]\n }));\n const { data: bookList , fetchNextPage , hasNextPage , isFetchingNextPage , isLoading , isSuccess } = useInfiniteQuery([\n \"bookList\",\n productType,\n getFilteredQuery,\n searchParams.toString()\n ], (param)=>{\n let { pageParam =0 } = param;\n return getBooksProducts({\n productType,\n offset: pageParam,\n limit: LIMIT,\n [QueryKey.KEYWORD]: searchParams.get(QueryKey.KEYWORD),\n [QueryKey.CURRICULUM]: searchParams.getAll(QueryKey.CURRICULUM),\n [QueryKey.PUBLISHER]: searchParams.getAll(QueryKey.PUBLISHER),\n [QueryKey.SUBJECT]: searchParams.getAll(QueryKey.SUBJECT)\n });\n }, {\n getNextPageParam: (lastPage)=>{\n const { offset , total } = lastPage.pagination;\n if (offset + LIMIT >= total) return undefined;\n return offset + LIMIT;\n },\n onError: (error)=>{\n ;\n Modal.error({\n title: \"상품리스트를 불러오지 못했습니다. \",\n content: error.message\n });\n }\n });\n var _count_aladinbook, _bookList_pages__pagination_total;\n const tabList = [\n {\n key: \"aladinbook\",\n label: /*#__PURE__*/ _jsxs(ActiveTabLabel, {\n children: [\n SourceTypeWithString[\"aladinbook\"],\n /*#__PURE__*/ _jsx(\"span\", {\n children: (_count_aladinbook = count === null || count === void 0 ? void 0 : count.aladinbook) !== null && _count_aladinbook !== void 0 ? _count_aladinbook : 0\n })\n ]\n })\n },\n {\n key: \"ebook\",\n label: /*#__PURE__*/ _jsxs(ActiveTabLabel, {\n children: [\n SourceTypeWithString[\"ebook\"],\n \" \",\n /*#__PURE__*/ _jsx(\"span\", {\n children: (_bookList_pages__pagination_total = (_bookList_pages_ = bookList === null || bookList === void 0 ? void 0 : bookList.pages[0]) === null || _bookList_pages_ === void 0 ? void 0 : _bookList_pages_.pagination.total) !== null && _bookList_pages__pagination_total !== void 0 ? _bookList_pages__pagination_total : 0\n })\n ]\n })\n }\n ];\n useScrollPosition(\"bookListPage\");\n useEffect(()=>{\n if (inView && hasNextPage) {\n fetchNextPage();\n }\n }, [\n inView,\n hasNextPage\n ]);\n var _bookList_pages__pagination_total_toString;\n return /*#__PURE__*/ _jsx(BookListPageWrapper, {\n children: /*#__PURE__*/ _jsxs(Container, {\n children: [\n /*#__PURE__*/ _jsx(ActiveTab, {\n tabList: tabList,\n activeTab: productType,\n setActiveTab: handleActiveTab\n }),\n /*#__PURE__*/ _jsxs(BookListSearchListWrap, {\n children: [\n filter && /*#__PURE__*/ _jsx(BookListFilterArea, {\n filterStore: filter\n }),\n /*#__PURE__*/ _jsx(BooksResultDesc, {\n totalCount: (_bookList_pages__pagination_total_toString = (_bookList_pages_1 = bookList === null || bookList === void 0 ? void 0 : bookList.pages[0]) === null || _bookList_pages_1 === void 0 ? void 0 : _bookList_pages_1.pagination.total.toString()) !== null && _bookList_pages__pagination_total_toString !== void 0 ? _bookList_pages__pagination_total_toString : \"0\"\n }),\n /*#__PURE__*/ _jsx(BookList, {\n listData: bookList,\n hasNextPage: hasNextPage,\n isLoading: isLoading,\n isSuccess: isSuccess,\n isFetchingNextPage: isFetchingNextPage\n }),\n /*#__PURE__*/ _jsx(\"div\", {\n ref: bottom\n })\n ]\n })\n ]\n })\n });\n};\nconst BookListPageWrapper = styled.div.withConfig({\n componentId: \"sc-9b88095c-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_0, (props)=>props.theme.new.colors.sol_gray_100, (props)=>props.theme.new.colors.white);\nconst BookListSearchListWrap = styled(SearchListWrap).withConfig({\n componentId: \"sc-9b88095c-1\"\n})(_templateObject1());\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: flex-end;\\n padding-bottom: 12px;\\n width: 100%;\\n margin-top: 36px;\\n\\n .select-label {\\n color: #5f5f69;\\n }\\n\\n @media (max-width: 768px) {\\n margin: 0 -16px;\\n padding: 12px 16px 12px;\\n width: auto;\\n border-bottom: 1px solid #e1e4ed;\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n font-size: 16px;\\n font-weight: normal;\\n color: \",\n \";\\n @media (max-width: 1200px) {\\n font-size: 12px;\\n }\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject2() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n justify-content: space-between;\\n gap: 8px;\\n\\n .ant-select:not(:where(.css-dev-only-do-not-override-i7pvmq).ant-select-customize-input)\\n .ant-select-selector {\\n background-color: transparent;\\n height: 24px;\\n border: none;\\n padding: 0;\\n }\\n\\n .ant-select {\\n .ant-select-arrow {\\n inset-inline-end: 0px;\\n top: 60%;\\n @media (max-width: 1200px) {\\n margin-top: -4px;\\n inset-inline-end: -4px;\\n top: 55%;\\n }\\n }\\n }\\n\\n .ant-select-selector {\\n .select-label {\\n font-size: 16px;\\n color: \",\n \";\\n text-align: right;\\n @media (max-width: 1200px) {\\n font-size: 12px;\\n }\\n }\\n\\n .ant-select-arrow {\\n display: block;\\n }\\n\\n .ant-select-selection-item {\\n @media (max-width: 1200px) {\\n padding-inline-end: 14px;\\n }\\n }\\n }\\n\\n .img-wrapper {\\n width: 16px;\\n\\n img:first-child {\\n display: block;\\n @media (max-width: 1200px) {\\n display: none;\\n }\\n }\\n\\n img:last-child {\\n display: none;\\n @media (max-width: 1200px) {\\n display: block;\\n }\\n }\\n }\\n\\n body:has(&) {\\n .select-label {\\n .ant-select-item-option {\\n font-size: 12px;\\n }\\n }\\n }\\n\"\n ]);\n _templateObject2 = 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 { Select } from \"antd\";\nimport styled from \"styled-components\";\nimport themeGet from \"@styled-system/theme-get\";\nimport Image from \"next/image\";\nconst sortOptions = [\n {\n value: \"order_cnt\",\n label: /*#__PURE__*/ _jsx(\"div\", {\n className: \"select-label\",\n children: \"인기순\"\n })\n },\n {\n value: \"new\",\n label: /*#__PURE__*/ _jsx(\"div\", {\n className: \"select-label\",\n children: \"최신순\"\n })\n },\n {\n value: \"price\",\n label: /*#__PURE__*/ _jsx(\"div\", {\n className: \"select-label\",\n children: \"낮은가격순\"\n })\n },\n {\n value: \"title\",\n label: /*#__PURE__*/ _jsx(\"div\", {\n className: \"select-label\",\n children: \"자료명순\"\n })\n }\n];\nexport const BooksResultDesc = (param)=>{\n let { onClickSort , totalCount , query } = param;\n const { sort } = query !== null && query !== void 0 ? query : {};\n return /*#__PURE__*/ _jsxs(SearchResultDescWrap, {\n children: [\n /*#__PURE__*/ _jsxs(SearchResultAmount, {\n children: [\n \"검색 결과 \",\n totalCount,\n \"건\"\n ]\n }),\n /*#__PURE__*/ _jsx(SearchSortingBox, {\n children: /*#__PURE__*/ _jsx(\"div\", {\n className: \"sort-select\",\n children: /*#__PURE__*/ _jsx(Select, {\n onChange: (value)=>onClickSort(value),\n style: {\n width: 120\n },\n options: sortOptions,\n value: sort || \"order_cnt\",\n suffixIcon: /*#__PURE__*/ _jsxs(\"div\", {\n className: \"img-wrapper\",\n children: [\n /*#__PURE__*/ _jsx(Image, {\n src: \"/static/assets/ico-folding.svg\",\n width: 16,\n height: 16,\n alt: \"icon-w\"\n }),\n /*#__PURE__*/ _jsx(Image, {\n src: \"/static/assets/ico-open-m.svg\",\n width: 16,\n height: 16,\n alt: \"icon-m\"\n })\n ]\n })\n })\n })\n })\n ]\n });\n};\nexport const SearchResultDescWrap = styled.div.withConfig({\n componentId: \"sc-1482b612-0\"\n})(_templateObject());\nexport const SearchResultAmount = styled.div.withConfig({\n componentId: \"sc-1482b612-1\"\n})(_templateObject1(), themeGet(\"text.2\", \"#5F5F69\"));\nexport const SearchSortingBox = styled.div.withConfig({\n componentId: \"sc-1482b612-2\"\n})(_templateObject2(), themeGet(\"text.2\", \"#5F5F69\"));\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 align-items: center;\\n height: auto;\\n padding: 6px 12px;\\n border-radius: 6px;\\n border-color: \",\n \";\\n color: \",\n \";\\n font-size: 16px;\\n line-height: 1.5;\\n\\n &:hover,\\n &.ant-dropdown-open,\\n &.active {\\n &:not([disabled]) {\\n border-color: \",\n \";\\n color: \",\n \";\\n font-weight: 600;\\n }\\n }\\n &[disabled] {\\n background-color: \",\n \";\\n }\\n\\n svg {\\n margin-left: 4px;\\n transition: transform 0.2s;\\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 width: 450px;\\n max-height: 200px;\\n padding: 0px 4px;\\n overflow: auto;\\n border-radius: 6px;\\n box-shadow: 6px 6px 20px 0px rgba(28, 31, 46, 0.12) !important;\\n\\n ::-webkit-scrollbar {\\n -webkit-appearance: none;\\n width: 8px;\\n }\\n\\n ::-webkit-scrollbar-thumb {\\n border-radius: 5px;\\n background-color: rgba(0, 0, 0, 0.5);\\n -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\\n }\\n\\n @media (max-width: 768px) {\\n width: 90vw;\\n }\\n\\n dt {\\n padding: 8px 0;\\n color: \",\n \";\\n font-size: 14px;\\n font-weight: 600;\\n line-height: 22px;\\n letter-spacing: -0.14px;\\n }\\n dd {\\n margin-bottom: 12px;\\n\\n &:last-of-type {\\n margin-bottom: 0px;\\n }\\n }\\n .ant-checkbox-wrapper {\\n width: 100%;\\n margin: 6px 0;\\n padding: 6px 0;\\n align-items: center;\\n }\\n .ant-checkbox {\\n margin: 3px;\\n top: 0;\\n\\n .ant-checkbox-inner {\\n width: 18px;\\n height: 18px;\\n }\\n & + span {\\n color: \",\n \";\\n font-size: 16px;\\n line-height: 1.5;\\n overflow: hidden;\\n text-overflow: ellipsis;\\n white-space: nowrap;\\n }\\n }\\n .ant-checkbox-checked + span {\\n color: \",\n \";\\n }\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport Icon from \"@/components/icon/Icon\";\nimport { ArrowDownOutlined, Sizes } from \"@/components/icon/IconList\";\nimport { Button, Card, Dropdown } from \"antd\";\nimport { useState } from \"react\";\nimport styled from \"styled-components\";\nexport const Chip = styled(Button).withConfig({\n componentId: \"sc-560a5e23-0\"\n})(_templateObject(), (props)=>props.theme.new.colors.sol_gray_100, (props)=>props.theme.new.colors.sol_gray_300, (props)=>props.theme.new.colors.sol_gray_700, (props)=>props.theme.new.colors.sol_gray_700, (props)=>props.theme.new.colors.sol_gray_50, (props)=>props.open ? \"transform: rotate(180deg);\" : \"\");\nconst StyledCard = styled(Card).withConfig({\n componentId: \"sc-560a5e23-1\"\n})(_templateObject1(), (props)=>props.theme.new.colors.sol_gray_500, (props)=>props.theme.new.colors.sol_gray_900, (props)=>props.theme.new.colors.sol_indigo_500);\nconst LibraryFilterDropdown = (param)=>{\n let { label , count , children , disabled } = param;\n const [open, setOpen] = useState(false);\n return /*#__PURE__*/ _jsx(_Fragment, {\n children: /*#__PURE__*/ _jsx(Dropdown, {\n dropdownRender: (menu)=>{\n return /*#__PURE__*/ _jsx(StyledCard, {\n size: \"small\",\n bordered: false,\n className: \"styled-card\",\n children: children\n });\n },\n trigger: [\n \"click\"\n ],\n open: open,\n onOpenChange: setOpen,\n disabled: disabled,\n children: /*#__PURE__*/ _jsxs(Chip, {\n type: \"ghost\",\n ghost: true,\n open: open,\n className: count && \"active\",\n children: [\n /*#__PURE__*/ _jsxs(\"span\", {\n children: [\n label,\n \" \",\n !!count && count\n ]\n }),\n /*#__PURE__*/ _jsx(Icon, {\n icon: ArrowDownOutlined,\n size: Sizes.small\n })\n ]\n })\n })\n });\n};\nexport default LibraryFilterDropdown;\n","import { debounce } from \"lodash\";\nimport { useEffect, useRef } from \"react\";\nconst ScrollPositionMemory = {};\nexport function raf(cb) {\n let tick = false;\n return ()=>{\n if (tick) {\n return 0;\n }\n tick = true;\n return window.requestAnimationFrame(()=>{\n tick = false;\n cb();\n });\n };\n}\nexport function useScrollPosition(name) {\n const scrollPosition = useRef(null);\n useEffect(()=>{\n const handleScroll = debounce(raf(()=>{\n const { scrollY } = window;\n scrollPosition.current = scrollY;\n }), 100);\n var _ScrollPositionMemory_name;\n const _cachedScrollPosition = (_ScrollPositionMemory_name = ScrollPositionMemory[name]) !== null && _ScrollPositionMemory_name !== void 0 ? _ScrollPositionMemory_name : 0;\n window.scrollTo(0, _cachedScrollPosition);\n window.addEventListener(\"scroll\", handleScroll, {\n passive: true\n });\n return ()=>{\n window.removeEventListener(\"scroll\", handleScroll);\n if (scrollPosition.current !== null) {\n ScrollPositionMemory[name] = scrollPosition.current;\n }\n };\n }, [\n name\n ]);\n return;\n}\n"],"names":[],"sourceRoot":""}