{"version":3,"file":"static/chunks/5473-2b626d2b0c0dd49b.js","mappings":"AACA","sources":["webpack://_N_E/./src/components/GenericPanel.tsx","webpack://_N_E/./src/hooks/useStores.ts","webpack://_N_E/./src/lib/pagination/helper.ts","webpack://_N_E/./src/lib/pagination/page.tsx","webpack://_N_E/./src/lib/pagination/useUpdateRouterHistory.tsx","webpack://_N_E/./src/lib/pagination/index.ts","webpack://_N_E/./src/lib/utils/renderType.ts","webpack://_N_E/./src/lib/viewModels/useViewModel.ts","webpack://_N_E/./src/lib/viewModels/index.ts","webpack://_N_E/./src/modules/products/components/ProductCurrentFilterTag.tsx","webpack://_N_E/./src/modules/products/components/SearchCheckboxModal.tsx","webpack://_N_E/./src/modules/products/components/ProductFilterBox.tsx","webpack://_N_E/./src/modules/products/components/GetPriceOptionsFromProduct.tsx","webpack://_N_E/./src/modules/products/components/ProductDynamicPrice.tsx","webpack://_N_E/./src/modules/products/components/ProductList.tsx","webpack://_N_E/./src/modules/products/components/ProductTypeSearchResult.tsx","webpack://_N_E/./src/modules/products/components/ProductTypeSearchResultHeader.tsx","webpack://_N_E/./src/modules/products/components/SearchCheckbox.tsx","webpack://_N_E/./src/modules/products/components/SearchResultFilter.tsx","webpack://_N_E/./src/modules/products/components/SearchResultHeader.tsx","webpack://_N_E/./src/modules/products/components/SmallTypeSelect.tsx","webpack://_N_E/./src/modules/products/stores/ProductModel.tsx","webpack://_N_E/./src/modules/products/commands/AddItemToCartCommand.ts","webpack://_N_E/./src/modules/products/commands/getFiltersCommand.ts","webpack://_N_E/./src/lib/helpers/isEmpty.ts","webpack://_N_E/./src/lib/helpers/isTruthy.ts","webpack://_N_E/./src/lib/helpers/isFalsy.ts","webpack://_N_E/./src/lib/helpers/index.ts","webpack://_N_E/./src/modules/products/commands/getProductsCommand.ts","webpack://_N_E/./src/modules/products/viewModels/ProductListViewModel.tsx","webpack://_N_E/./src/modules/products/components/ProductSearchResultHeader.tsx","webpack://_N_E/./src/modules/products/components/ProductUnifiedSearchResult.tsx","webpack://_N_E/./src/modules/products/views/ProductListView.tsx","webpack://_N_E/<anon>"],"sourcesContent":["import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n      padding: 20px 20px 40px;\\n      box-shadow: 0 7.1px 70.7px 0 rgba(0, 0, 0, 0.1);\\n    \"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  padding: 32px 0;\\n  min-width: 432px;\\n  min-height: 100px;\\n  position: relative;\\n  @media (max-width: 1200px) {\\n  }\\n  @media (max-width: 768px) {\\n    min-width: 0;\\n    word-break: break-word;\\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  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n  padding: 0 20px;\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject3() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  padding: 0 20px;\\n  //margin-top: 24px;\\n\\n  & > * {\\n    flex: 1;\\n  }\\n\"\n    ]);\n    _templateObject3 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject4() {\n    const data = _tagged_template_literal([\n        \"\\n          background-color: rgba(27, 27, 41, 0.3) !important;\\n        \"\n    ]);\n    _templateObject4 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject5() {\n    const data = _tagged_template_literal([\n        \"\\n          background: \",\n        \" !important;\\n\\n          &:hover {\\n            background: \",\n        \" !important;\\n          }\\n        \"\n    ]);\n    _templateObject5 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject6() {\n    const data = _tagged_template_literal([\n        \"\\n  \",\n        \";\\n\"\n    ]);\n    _templateObject6 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject7() {\n    const data = _tagged_template_literal([\n        \"\\n        button:not(.ant-btn-background-ghost) {\\n          background-color: #ff5252 !important;\\n        }\\n\\n        button.ant-btn-background-ghost {\\n          background-color: transparent !important;\\n          border: 1px solid rgb(232, 232, 234) !important;\\n\\n          > span {\\n            color: rgba(79, 85, 107) !important;\\n          }\\n        }\\n      \"\n    ]);\n    _templateObject7 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject8() {\n    const data = _tagged_template_literal([\n        \"\\n        button:not(.ant-btn-background-ghost) {\\n          background-color: rgba(27, 27, 41, 0.3) !important;\\n        }\\n      \"\n    ]);\n    _templateObject8 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject9() {\n    const data = _tagged_template_literal([\n        \"\\n  text-align: center;\\n  padding: 0 40px;\\n\\n  @media (max-width: 1200px) {\\n  }\\n  @media (max-width: 768px) {\\n    padding: 0 16px;\\n  }\\n\\n  .ant-row {\\n    display: inline-flex;\\n    width: 100%;\\n    max-width: \",\n        \";\\n    gap: 12px;\\n    margin: 0 auto;\\n\\n    .ant-col {\\n      margin-top: 24px;\\n    }\\n\\n    @media (max-width: 1200px) {\\n    }\\n    @media (max-width: 768px) {\\n      max-width: 100%;\\n    }\\n  }\\n\\n  .buttons-wrapper {\\n    flex-direction: row;\\n\\n    button {\\n      height: 48px;\\n\\n      span {\\n        font-size: 16px;\\n        font-weight: 700;\\n\\n        @media (max-width: 1200px) {\\n        }\\n        @media (max-width: 768px) {\\n          font-size: 14px;\\n        }\\n      }\\n\\n      &.ant-btn-primary {\\n        &:not(.ant-btn-background-ghost) {\\n          span {\\n            color: #fff;\\n          }\\n        }\\n\\n        &.ant-btn-background-ghost {\\n          span {\\n            color: \",\n        \";\\n          }\\n        }\\n      }\\n    }\\n\\n    \",\n        \";\\n    \",\n        \"\\n  }\\n\"\n    ]);\n    _templateObject9 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject10() {\n    const data = _tagged_template_literal([\n        \"\\n  font-size: 24px;\\n  font-weight: 700;\\n  text-align: center;\\n  margin: 0;\\n\\n  .red {\\n    color: #ff5252;\\n  }\\n\\n  @media (max-width: 1200px) {\\n  }\\n  @media (max-width: 768px) {\\n    font-size: 20px;\\n  }\\n\"\n    ]);\n    _templateObject10 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject11() {\n    const data = _tagged_template_literal([\n        \"\\n  font-size: 16px;\\n  text-align: center;\\n  line-height: 1.5;\\n  margin-top: \",\n        \";\\n  margin-bottom: 0;\\n\\n  .go-btn {\\n    color: #002fa8;\\n    text-decoration: underline;\\n  }\\n\\n  @media (max-width: 1200px) {\\n  }\\n  @media (max-width: 768px) {\\n    font-size: 14px;\\n  }\\n\"\n    ]);\n    _templateObject11 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject12() {\n    const data = _tagged_template_literal([\n        \"\\n  border: none;\\n  display: block;\\n  position: absolute;\\n  background: transparent;\\n  top: 0;\\n  right: 0;\\n  font-size: 0;\\n  width: 64px;\\n  height: 64px;\\n  cursor: pointer;\\n\\n  > span {\\n    background: url('/static/assets/icon_close_bold.svg') no-repeat 50% 50%;\\n    background-size: 32px;\\n    display: block;\\n    height: 64px;\\n  }\\n\"\n    ]);\n    _templateObject12 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject13() {\n    const data = _tagged_template_literal([\n        \"\\n  width: 432px !important;\\n\"\n    ]);\n    _templateObject13 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { Button, Col, Row } from \"antd\";\nimport React from \"react\";\nimport styled, { css } from \"styled-components\";\nimport Modal from \"./modal/Modal\";\nconst GenericPanelWrapper = styled.div.withConfig({\n    componentId: \"sc-71532917-0\"\n})(_templateObject1(), (param)=>{\n    let { useStandardMode  } = param;\n    return useStandardMode && css(_templateObject());\n});\nconst Header = styled.div.withConfig({\n    componentId: \"sc-71532917-1\"\n})(_templateObject2());\nconst Body = styled.div.withConfig({\n    componentId: \"sc-71532917-2\"\n})(_templateObject3());\nconst StyledButton = styled(Button).withConfig({\n    componentId: \"sc-71532917-3\"\n})(_templateObject6(), (props)=>{\n    return (props === null || props === void 0 ? void 0 : props.disabled) ? css(_templateObject4()) : css(_templateObject5(), (props)=>props.theme.new.colors.sol_indigo_500, (props)=>props.theme.new.colors.sol_indigo_500);\n});\nconst Footer = styled.div.withConfig({\n    componentId: \"sc-71532917-4\"\n})(_templateObject9(), (param)=>{\n    let { maxWidth  } = param;\n    return maxWidth ? null : \"412px\";\n}, (props)=>props.theme.new.colors.sol_indigo_500, (props)=>{\n    return (props === null || props === void 0 ? void 0 : props.buttonType) === \"warning\" && css(_templateObject7());\n}, (props)=>{\n    return (props === null || props === void 0 ? void 0 : props.disabled) && css(_templateObject8());\n});\nconst PanelTitle = styled.h2.withConfig({\n    componentId: \"sc-71532917-5\"\n})(_templateObject10());\nconst PanelDescription = styled.p.withConfig({\n    componentId: \"sc-71532917-6\"\n})(_templateObject11(), (param)=>{\n    let { space  } = param;\n    return space ? \"32px\" : \"8px\";\n});\nexport const GenericPanelWithModal = (param)=>{\n    let { open , width =640 , cancelText , okText , title , description , onOk , onClose , children , okButtonProps , space , closeIcon , buttonType =\"default\" , ...props } = param;\n    return /*#__PURE__*/ _jsx(Modal, {\n        width: width,\n        onClose: onClose,\n        open: open,\n        ...props,\n        children: /*#__PURE__*/ _jsx(GenericPanel, {\n            space: space,\n            useStandardMode: false,\n            cancelText: cancelText,\n            okText: okText,\n            okButtonProps: okButtonProps,\n            title: title,\n            description: description,\n            onOk: onOk,\n            closeIcon: closeIcon,\n            buttonType: buttonType,\n            onClose: onClose,\n            children: children\n        })\n    });\n};\nexport const GenericPanelCloseIcon = (param)=>{\n    let { onClick  } = param;\n    return /*#__PURE__*/ _jsx(CloseIconBtn, {\n        onClick: onClick,\n        children: /*#__PURE__*/ _jsx(\"span\", {\n            children: \"닫기\"\n        })\n    });\n};\nconst CloseIconBtn = styled.button.withConfig({\n    componentId: \"sc-71532917-7\"\n})(_templateObject12());\nexport const GenericPanel = (param)=>{\n    let { children , cancelText , okText , title , description , onOk , onClose , useStandardMode =false , space , okButtonProps , closeIcon , buttonType  } = param;\n    const handleOnClose = (e)=>{\n        if (onClose) {\n            onClose(e);\n        }\n    };\n    const handleOnOk = (e)=>{\n        if (onOk) {\n            onOk(e);\n        }\n    };\n    return /*#__PURE__*/ _jsxs(GenericPanelWrapper, {\n        useStandardMode: useStandardMode,\n        className: \"panel_wrapper\",\n        children: [\n            (title || description) && /*#__PURE__*/ _jsxs(Header, {\n                className: \"panel_header\",\n                children: [\n                    /*#__PURE__*/ _jsx(PanelTitle, {\n                        className: \"panel_title\",\n                        children: title\n                    }),\n                    description && /*#__PURE__*/ _jsx(PanelDescription, {\n                        className: \"panel_desc\",\n                        space: space,\n                        children: description\n                    })\n                ]\n            }),\n            closeIcon && /*#__PURE__*/ _jsx(GenericPanelCloseIcon, {\n                onClick: (e)=>handleOnClose(e)\n            }),\n            children && /*#__PURE__*/ _jsx(Body, {\n                className: \"panel_body\",\n                children: children\n            }),\n            (okText || cancelText) && /*#__PURE__*/ _jsx(Footer, {\n                maxWidth: (okButtonProps === null || okButtonProps === void 0 ? void 0 : okButtonProps.maxWidth) === \"100%\",\n                className: \"panel_footer\",\n                buttonType: buttonType,\n                disabled: okButtonProps === null || okButtonProps === void 0 ? void 0 : okButtonProps.disabled,\n                children: /*#__PURE__*/ _jsxs(Row, {\n                    gutter: 8,\n                    className: \"buttons-wrapper\",\n                    justify: \"center\",\n                    children: [\n                        cancelText && onClose && okText && onOk && /*#__PURE__*/ _jsxs(_Fragment, {\n                            children: [\n                                /*#__PURE__*/ _jsx(Col, {\n                                    span: 11,\n                                    children: /*#__PURE__*/ _jsx(Button, {\n                                        type: \"primary\",\n                                        ghost: true,\n                                        onClick: handleOnClose,\n                                        block: true,\n                                        children: cancelText\n                                    })\n                                }),\n                                /*#__PURE__*/ _jsx(Col, {\n                                    span: 11,\n                                    children: /*#__PURE__*/ _jsx(StyledButton, {\n                                        className: okButtonProps === null || okButtonProps === void 0 ? void 0 : okButtonProps.className,\n                                        disabled: okButtonProps === null || okButtonProps === void 0 ? void 0 : okButtonProps.disabled,\n                                        buttonType: buttonType,\n                                        type: \"primary\",\n                                        onClick: handleOnOk,\n                                        block: true,\n                                        children: okText\n                                    })\n                                })\n                            ]\n                        }),\n                        !cancelText && okText && /*#__PURE__*/ _jsx(Col, {\n                            span: 24,\n                            children: /*#__PURE__*/ _jsx(StyledButton, {\n                                className: okButtonProps === null || okButtonProps === void 0 ? void 0 : okButtonProps.className,\n                                disabled: okButtonProps === null || okButtonProps === void 0 ? void 0 : okButtonProps.disabled,\n                                type: \"primary\",\n                                onClick: (e)=>handleOnOk(e),\n                                // style={{ backgroundColor: okButtonProps.className==='delete-btn'? 'red':null }}\n                                block: true,\n                                children: okText\n                            })\n                        })\n                    ]\n                })\n            })\n        ]\n    });\n};\nexport const genericPanelSmallWidth = css(_templateObject13());\n","import { useContext } from \"react\";\nimport { MobXProviderContext } from \"mobx-react\";\nexport const useStores = ()=>{\n    return useContext(MobXProviderContext);\n};\n","import drop from \"lodash/drop\";\nimport take from \"lodash/take\";\nimport shuffle from \"lodash/shuffle\";\nexport function getCurrentPageNumber(param) {\n    let { total , limit , rowCount  } = param;\n    if (rowCount) {\n        return Math.max(1, Math.ceil(rowCount / limit));\n    } else {\n        return Math.max(1, Math.ceil(total / limit));\n    }\n}\nexport const getCurrentPage = (offset, limit)=>{\n    return Math.max(offset / limit + 1, 1);\n};\nexport const filterData = (items, param)=>{\n    const defaultParamLength = 2 // default param object is {page: 1, limit: 10}\n    ;\n    if (Object.keys(param).length !== defaultParamLength) {\n        return shuffle(items);\n    } else {\n        return items;\n    }\n};\nexport const getPaginatedItems = (param)=>{\n    let { items =[] , page =1 , limit =10 , loadMore =false , param: param1 = {}  } = param;\n    let data = [];\n    if (!items) return [];\n    const total = items.length;\n    items = filterData(items, param1);\n    if (loadMore) {\n        data = take(items, page * limit);\n    } else {\n        if (page * limit > total) return getPaginatedItems({\n            items,\n            page: page - 1,\n            limit\n        });\n        data = take(drop(items, (page - 1) * limit), limit);\n    }\n    return {\n        data,\n        page,\n        limit,\n        total\n    };\n} // export default getPaginatedItems;\n;\n","// import { useLocalObservable } from 'mobx-react'\nimport { toQueryString } from \"../utils/url\";\nimport { getCurrentPage } from \"./helper\";\nexport const Page = (props)=>({\n        _total: props.total,\n        _limit: props.limit,\n        _offset: props.offset,\n        _pageSize: props.pageSize,\n        get total () {\n            return this._total || 0;\n        },\n        get limit () {\n            return this._limit || 10;\n        },\n        get offset () {\n            return this._offset || 0;\n        },\n        get pageSize () {\n            return this._pageSize || this._limit || 10;\n        },\n        setCurrent (offset, limit, total) {\n            this._offset = offset;\n            this._limit = limit;\n            if (total) {\n                this._total = total;\n            }\n        },\n        get current () {\n            const page = getCurrentPage(this.offset, this.limit);\n            return {\n                offset: this.offset,\n                limit: this.limit,\n                total: this.total,\n                page,\n                current: page,\n                pageSize: this.pageSize\n            };\n        },\n        next (page) {\n            const newOffset = this.limit * (page - 1);\n            const newPage = getCurrentPage(newOffset, this.limit);\n            return {\n                offset: newOffset,\n                limit: this.limit,\n                total: this.total,\n                page: newPage,\n                current: newPage,\n                pageSize: this.pageSize\n            };\n        }\n    });\nexport const updatePageChangedWithRouterEvent = function(params, router) {\n    let isReplace = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;\n    const urlParams = new URLSearchParams(params);\n    let newQuery = {};\n    const urlEntries = Object.fromEntries(urlParams.entries());\n    if (Object.keys(urlEntries).length > 0) {\n        newQuery = {\n            ...newQuery,\n            ...urlEntries\n        };\n    } else {\n        const defaultParams = Object.keys(router.query).filter((key)=>key !== \"offset\" && key !== \"limit\" && key !== \"slug\");\n        newQuery = {\n            ...defaultParams\n        };\n    }\n    if (isReplace) {\n        return router.replace({\n            pathname: router.pathname,\n            query: {\n                ...router.query,\n                ...newQuery\n            }\n        }, undefined, {\n            shallow: true,\n            scroll: true\n        });\n    }\n    router.push({\n        // pathname: `${router.pathname}?${urlParams}`,\n        // pathname: `/category/[slug]?${urlParams}`,\n        pathname: router.pathname,\n        query: {\n            ...router.query,\n            ...newQuery\n        }\n    }, undefined, // {\n    // \tpathname: `/category/[slug]?${urlParams}`,\n    // \tquery: {\n    // \t\t...router.query,\n    // \t},\n    {\n        shallow: true,\n        scroll: true\n    });\n// router.push(`${router.pathname}?${urlParams}`, { query: router.query }, { shallow: true })\n// router.push(`${router.pathname}?${urlParams}`, undefined, { shallow: true })\n// return\n// window.history.replaceState(\n// \twindow.history.state,\n// \t'',\n// \twindow.location.pathname + '?' + urlParams.toString(),\n// )\n};\nexport const deleteParamWithRouterEvent = function(key, router) {\n    const newQuery = router.query;\n    delete newQuery[key];\n    router.push(\"\".concat(router.pathname, \"?\").concat(toQueryString(newQuery)), undefined, {\n        shallow: true\n    });\n};\n","import { useLocalObservable } from \"mobx-react-lite\";\nimport { Page, updatePageChangedWithRouterEvent } from \"./page\";\nexport const useUpdateRouterHistory = (param)=>{\n    let { router , defaultPageLimit  } = param;\n    const store = useLocalObservable(()=>({\n            filterType: \"all\",\n            filter: {},\n            paging: Page({\n                pageSize: defaultPageLimit\n            }),\n            // 업데이트 할 때, 항상 실행 할 것\n            invalidate: function(forceParams) {\n                let isReplace = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;\n                if (forceParams) {\n                    updatePageChangedWithRouterEvent(forceParams, router, isReplace);\n                } else {\n                    const params = {\n                        ...store.filter,\n                        offset: store.paging.offset,\n                        limit: store.paging.limit\n                    };\n                    updatePageChangedWithRouterEvent(params, router, isReplace);\n                }\n            },\n            updatePagination: (offset, limit)=>{\n                store.paging.setCurrent(offset, limit !== null && limit !== void 0 ? limit : defaultPageLimit);\n            },\n            updateFilterSearch (name, value) {\n                const newFilter = {\n                    ...store.filter\n                };\n                newFilter[name] = value;\n                store.filter = newFilter;\n            },\n            deleteFilterSearch (name) {\n                delete store.filter[name];\n            },\n            clearAllFilterSearch () {\n                store.filter = {};\n            },\n            clearAll () {\n                this.clearAllFilterSearch();\n                this.updatePagination(0);\n            },\n            updateFilterSearchType (searchType) {\n                store.filterType = searchType;\n                if (searchType !== \"all\") {\n                    const [category, value] = searchType.split(\"/\");\n                    store.filter[category] = value.toString();\n                } else {\n                    store.clearAllFilterSearch();\n                }\n            }\n        }));\n    return store;\n};\n","export * from \"./pagination\";\nexport * from \"./page\";\nexport * from \"./helper\";\nexport { useUpdateRouterHistory } from \"./useUpdateRouterHistory\";\n","import { ContentTypesWithString, DataTypesWithString } from \"src/api/product\";\nexport const renderOption = (option)=>{\n    let renderString;\n    switch(option){\n        case 1:\n            renderString = \"라이트\";\n            break;\n        case 2:\n            renderString = \"베이직\";\n            break;\n        case 3:\n            renderString = \"프로\";\n            break;\n        case 20:\n            renderString = \"라이선스\";\n            break;\n        default:\n            renderString = \"\";\n    }\n    return renderString;\n};\nexport const maxUsageType = (option)=>{\n    let renderString;\n    switch(option){\n        case 1:\n            renderString = 5;\n            break;\n        case 2:\n            renderString = 100;\n            break;\n        case 3:\n            renderString = 500;\n            break;\n        default:\n            renderString = 0;\n    }\n    return renderString;\n};\nexport const renderSourceType = (status)=>{\n    let renderString;\n    switch(status){\n        case \"work\":\n            renderString = \"문학 라이선스\";\n            break;\n        case \"textbook\":\n            renderString = \"교과서 라이선스\";\n            break;\n        case \"handout\":\n            renderString = \"수업자료\";\n            break;\n        case \"workbook\":\n            renderString = \"참고서 라이선스\";\n            break;\n        case \"aladinbook\":\n            renderString = \"도서\";\n            break;\n        default:\n            renderString = \"\";\n    }\n    return renderString;\n};\nexport const renderPriceLimit = (status)=>{\n    let renderString;\n    switch(status){\n        case \"lite\":\n            renderString = \"라이트 (최대 5명까지 이용 가능)\";\n            break;\n        case \"basic\":\n            renderString = \"베이직 (최대 100명까지 이용 가능)\";\n            break;\n        case \"pro\":\n            renderString = \"프로 (최대 500명까지 이용 가능)\";\n            break;\n        case \"e-learning\":\n            renderString = \"디지털 교재\";\n            break;\n        case \"e-teaching\":\n            renderString = \"라이선스\";\n            break;\n        default:\n            renderString = \"\";\n    }\n    return renderString;\n};\nexport const PLAN_LEARNING = \"e-learning\";\nexport const PLAN_TEACHING = \"e-teaching\";\nexport const renderPlanDescription = (plan)=>{\n    let renderString;\n    switch(plan){\n        case PLAN_LEARNING:\n            renderString = \"개인 이용 목적, 비상업적 이용\";\n            break;\n        case PLAN_TEACHING:\n            renderString = \"수업 이용 목적, 상업적 이용\";\n            break;\n        default:\n            renderString = \"\";\n            break;\n    }\n    return renderString;\n};\nexport const renderPlanNewType = (plan)=>{\n    let renderString;\n    switch(plan){\n        case PLAN_LEARNING:\n            renderString = \"디지털 교재\";\n            break;\n        case PLAN_TEACHING:\n            renderString = \"라이선스\";\n            break;\n        default:\n            renderString = \"\";\n            break;\n    }\n    return renderString;\n};\nexport const renderDataTypeWithComma = (data)=>{\n    if (!data) return null;\n    return data.map((item)=>DataTypesWithString[item]).join(\", \");\n};\nexport const renderContentTypeWithComma = (data)=>{\n    if (!data) return null;\n    return data.map((item)=>ContentTypesWithString[item]).join(\", \");\n};\n","import { useRef } from \"react\";\nimport { useRouter } from \"next/router\";\n/**\n * Create ref to the functional component (It will not re-run on each render)\n * @param ViewModelConstructor\n * @param props context\n * @return ViewModelConstructor\n */ export function useViewModel(props, ViewModelConstructor) {\n    const router = useRouter();\n    let vmRef = useRef(ViewModelConstructor({\n        ...props,\n        router\n    }));\n    return vmRef.current;\n}\n","export * from \"./interface\";\nexport * from \"./useViewModel\";\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  .search-result-wrapper:has(&) > .section {\\n    padding-top: 0;\\n\\n    @media (max-width: 768px) {\\n      padding-bottom: 0;\\n    }\\n  }\\n\\n  > .section {\\n    padding-top: 16px;\\n\\n    @media (max-width: 768px) {\\n      padding-top: 0;\\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 { SearchCurrentFilter } from \"@/modules/products/views/ProductListView\";\nimport { nanoid } from \"@bookips/nanoid\";\nimport { Button } from \"antd\";\nimport { observer } from \"mobx-react-lite\";\nimport Image from \"next/image\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nconst ProductFilterTagItem = observer((param)=>{\n    let { item , deleteFilterItem  } = param;\n    return /*#__PURE__*/ _jsxs(Button, {\n        onClick: ()=>{\n            deleteFilterItem(item);\n        },\n        \"data-idx\": item.id,\n        children: [\n            item.label ? item.label : item.value,\n            /*#__PURE__*/ _jsx(Image, {\n                src: \"/static/assets/icon_close_m.svg\",\n                alt: \"삭제 아이콘\",\n                width: 16,\n                height: 16\n            })\n        ]\n    }, \"filter-item-\".concat(item.id));\n});\nexport const ProductCurrentFilterTag = observer((param)=>{\n    let { onFilterClick , filterItems , deleteFilterItem  } = param;\n    const items = Object.keys(filterItems).map((key)=>{\n        return filterItems[key].map((item)=>{\n            const uid = nanoid();\n            return /*#__PURE__*/ _jsx(ProductFilterTagItem, {\n                item: item,\n                deleteFilterItem: deleteFilterItem\n            }, uid);\n        });\n    });\n    return /*#__PURE__*/ _jsx(ProductCurrentFilterTagWrapper, {\n        children: /*#__PURE__*/ _jsx(\"div\", {\n            className: \"section\",\n            children: /*#__PURE__*/ _jsxs(SearchCurrentFilter, {\n                children: [\n                    /*#__PURE__*/ _jsx(\"div\", {\n                        className: \"text w\",\n                        children: \"선택한 필터값\"\n                    }),\n                    /*#__PURE__*/ _jsx(\"div\", {\n                        className: \"text m\",\n                        children: /*#__PURE__*/ _jsxs(Button, {\n                            onClick: onFilterClick,\n                            children: [\n                                /*#__PURE__*/ _jsx(Image, {\n                                    src: \"/static/assets/icon_filter_m.svg\",\n                                    alt: \"필터\",\n                                    width: 16,\n                                    height: 16\n                                }),\n                                \"필터\"\n                            ]\n                        })\n                    }),\n                    /*#__PURE__*/ _jsx(\"div\", {\n                        className: \"current-filter-area\",\n                        children: items\n                    })\n                ]\n            })\n        })\n    });\n});\nexport const ProductCurrentFilterTagWrapper = styled.div.withConfig({\n    componentId: \"sc-a61a497a-0\"\n})(_templateObject());\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React, { useEffect, useState } from \"react\";\nimport { Checkbox } from \"antd\";\nimport { SearchCheckboxWrapper } from \"@/modules/products/components/SearchCheckbox\";\nconst CheckboxGroup = Checkbox.Group;\nexport const SearchCheckboxModal = (param)=>{\n    let { idx , checkboxList , filterItems , updateFilterItem , deleteItem  } = param;\n    //체크박스에 들어갈 옵션\n    // const plainOptions = checkboxList.list\n    const [checkedList, setCheckedList] = useState([]);\n    const onChange = (list)=>{\n        setCheckedList(list);\n    };\n    // 리셋 없음\n    /*\n\tuseEffect(() => {\n\t\tif (resetFilter) {\n\t\t\tsetCheckedList([])\n\t\t}\n\t}, [resetFilter])\n\t*/ /*\n\tuseEffect(() => {\n\t\tconst deleteArr = checkedList.filter((item) => item !== deleteItem.name)\n\t\tif (deleteArr.length !== checkedList.length) {\n\t\t\tsetCheckedList(deleteArr)\n\t\t}\n\t}, [deleteItem])\n\t*/ // useEffect(() => {\n    // \tlet newArr = []\n    // \tcheckedList.map((item) => {\n    // \t\tnewArr.push({ idx: idx, name: item.toString() })\n    // \t})\n    //\n    // \tlet arraySum = filterItems.concat(newArr)\n    //\n    // \tlet nArr = arraySum.filter((item, i) => {\n    // \t\treturn (\n    // \t\t\tarraySum.findIndex((item2, j) => {\n    // \t\t\t\treturn item.value === item2.value\n    // \t\t\t}) === i\n    // \t\t)\n    // \t})\n    //\n    // \tupdateFilterItem('unknown', nArr)\n    // }, [checkedList])\n    useEffect(()=>{\n    // 체크 해제했을 때 필터에서도 삭제\n    // !! 여기서는 적용 버튼 눌렀을 때 업데이트 !!\n    /*\n\t\tcheckboxList.map((item) => {\n\t\t\tif (checkedList.indexOf(item) === -1) {\n\t\t\t\tconst testArr = [...filterItems]\n\t\t\t\ttestArr.map((filterItem) => {\n\t\t\t\t\tif (filterItem.name === item) {\n\t\t\t\t\t\ttestArr.splice(testArr.indexOf(filterItem), 1)\n\t\t\t\t\t}\n\t\t\t\t})\n\n\t\t\t\tif (filterItems.length !== testArr.length) {\n\t\t\t\t\trunInAction(() => {\n\t\t\t\t\t\tupdateFilterItem(testArr)\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t})\n\t\t*/ }, [\n        filterItems\n    ]);\n    const [options, setOptions] = useState(checkboxList.slice(0, 3));\n    return /*#__PURE__*/ _jsx(SearchCheckboxWrapper, {});\n};\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, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport { SearchCheckboxModal } from \"@/modules/products/components/SearchCheckboxModal\";\nconst ProductFilterBoxWrapper = styled.div.withConfig({\n    componentId: \"sc-8aadd4d-0\"\n})(_templateObject());\nexport const ProductFilterBox = (param)=>{\n    let { idx , filterItems , currentSelectedInBox , updateFilterItem , deleteItem  } = param;\n    return /*#__PURE__*/ _jsxs(ProductFilterBoxWrapper, {\n        children: [\n            /*#__PURE__*/ _jsx(\"h1\", {\n                children: \"단원/UNIT\"\n            }),\n            /*#__PURE__*/ _jsx(SearchCheckboxModal, {\n                idx: idx,\n                checkboxList: currentSelectedInBox,\n                filterItems: filterItems,\n                updateFilterItem: updateFilterItem,\n                deleteItem: deleteItem\n            })\n        ]\n    });\n};\n","export const getPriceOptionsFromProduct = (product)=>{\n    var _product_product_variants;\n    return ((_product_product_variants = product.product_variants) === null || _product_product_variants === void 0 ? void 0 : _product_product_variants.map((variant)=>{\n        const { label , value  } = variant.options;\n        return {\n            label,\n            value\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  margin-right: 24px;\\n  display: flex;\\n  flex-direction: row;\\n  justify-content: center;\\n  align-items: center;\\n\\n  body:has(&) .price-type-select {\\n    text-align: center;\\n  }\\n\\n  .ant-select {\\n    .ant-select-selector {\\n      text-align: right;\\n      padding-right: 12px;\\n      border: 0;\\n      border-radius: 0;\\n    }\\n    .ant-select-arrow {\\n    }\\n\\n    @media (max-width: 768px) {\\n      display: none;\\n    }\\n  }\\n\\n  .price {\\n    width: auto;\\n    max-width: 102px;\\n    font-size: 14px;\\n    font-weight: bold;\\n    text-align: right;\\n    word-break: break-word;\\n    padding-left: 16px;\\n\\n    @media (max-width: 768px) {\\n      width: 84px;\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    margin-right: 0;\\n  }\\n  @media (max-width: 768px) {\\n    margin-right: 0;\\n  }\\n  .price-desc {\\n    margin-left: 4px;\\n    font-size: 14px;\\n    color: \",\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, { useState } from \"react\";\nimport styled from \"styled-components\";\nimport { priceFormatter } from \"@/lib/utils\";\nimport { getPriceOptionsFromProduct } from \"./GetPriceOptionsFromProduct\";\nimport themeGet from \"@styled-system/theme-get\";\nimport { SmallTypeSelect } from \"./SmallTypeSelect\";\nimport { PLAN_TEACHING } from \"@/lib/utils/renderType\";\nexport const ProductDynamicPrice = (param)=>{\n    let { product , onPriceChange , useNewPlan , useParsingBadge  } = param;\n    var _priceOptions_, _priceOptions_1;\n    const sourceType = product === null || product === void 0 ? void 0 : product.source_type;\n    // const resultPriceStr = useNewPlan ? 'view' : sourceType === 'handout' ? 'lite' : 'basic'\n    const resultPriceStr = useNewPlan ? PLAN_TEACHING : sourceType === \"handout\" ? \"lite\" : \"basic\";\n    const resultPrice = product.product_variants.filter((item)=>item.options.license_plan === resultPriceStr)[0];\n    const [selectedPrice, setSelectedPrice] = useState((resultPrice === null || resultPrice === void 0 ? void 0 : resultPrice.price) || 0);\n    const onPriceUpdateHandle = (value)=>{\n        var _product_product_variants;\n        const variant = (_product_product_variants = product.product_variants) === null || _product_product_variants === void 0 ? void 0 : _product_product_variants.find((variant)=>variant.options.value === value);\n        const nextPrice = (variant === null || variant === void 0 ? void 0 : variant.price) || 0;\n        setSelectedPrice(nextPrice);\n        onPriceChange(product, variant);\n    };\n    const priceOptions = getPriceOptionsFromProduct(product);\n    return /*#__PURE__*/ _jsxs(ProductDynamicPriceWrapper, {\n        children: [\n            !useNewPlan && /*#__PURE__*/ _jsx(SmallTypeSelect, {\n                onChange: onPriceUpdateHandle,\n                defaultValue: sourceType === \"handout\" ? (_priceOptions_ = priceOptions[0]) === null || _priceOptions_ === void 0 ? void 0 : _priceOptions_.value : (_priceOptions_1 = priceOptions[1]) === null || _priceOptions_1 === void 0 ? void 0 : _priceOptions_1.value,\n                popupClassName: \"price-type-select\",\n                style: {\n                    width: 84\n                },\n                options: priceOptions\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"price\",\n                children: [\n                    priceFormatter(selectedPrice),\n                    \"원\"\n                ]\n            })\n        ]\n    });\n};\nconst ProductDynamicPriceWrapper = styled.div.withConfig({\n    componentId: \"sc-9cd0e021-0\"\n})(_templateObject(), themeGet(\"text.2\", \"#BBBBBF\"));\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n  width: 100%;\\n  padding: \",\n        \";\\n  text-align: center;\\n  border-radius: 8px;\\n\\n  @media (max-width: 1200px) {\\n    border: none;\\n  }\\n  @media (max-width: 768px) {\\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  flex-direction: column;\\n  min-height: 240px;\\n  padding: 0;\\n  border-radius: 0;\\n  background-color: \",\n        \";\\n\\n  p {\\n    font-size: 16px;\\n    line-height: 1.5;\\n    font-weight: normal;\\n    color: \",\n        \";\\n    margin-top: 16px;\\n  }\\n\\n  .request-btn {\\n    position: relative;\\n    font-size: 14px;\\n    font-weight: bold;\\n    color: \",\n        \";\\n    text-decoration: underline;\\n    padding: 8px 18px 8px 0;\\n    transition: opacity 0.2s;\\n\\n    @media (hover: hover) {\\n      &:hover {\\n        opacity: 0.7;\\n      }\\n    }\\n\\n    &:after {\\n      display: block;\\n      content: '';\\n      position: absolute;\\n      top: 50%;\\n      right: 0;\\n      width: 16px;\\n      height: 16px;\\n      background: url('/static/assets/ico-window-primary.svg') no-repeat 50% 50%;\\n      background-size: contain;\\n      transform: translateY(-50%);\\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  img {\\n    width: \",\n        \";\\n    max-width: 104px;\\n  }\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject3() {\n    const data = _tagged_template_literal([\n        \"\\n  font-size: \",\n        \";\\n  font-weight: bold;\\n  color: \",\n        \";\\n  margin: 8px 0 0;\\n\\n  span {\\n    color: \",\n        \";\\n  }\\n\"\n    ]);\n    _templateObject3 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject4() {\n    const data = _tagged_template_literal([\n        \"\\n  display: flex;\\n  justify-content: space-between;\\n  padding: 12px 16px;\\n  border: solid 1px #f0f0f0;\\n  background-color: #fff;\\n\\n  /*/ 장바구니버튼 없앨때/*/\\n  .ant-select-single:not(.ant-select-customize-input) {\\n    pointer-events: none;\\n  }\\n  .ant-select-arrow {\\n    display: none;\\n  }\\n  &:not(:nth-last-of-type(1)) {\\n    margin-bottom: 8px;\\n  }\\n\\n  @media (max-width: 1200px) {\\n    margin: 0 36px;\\n\\n    &:not(:nth-last-of-type(1)) {\\n      margin-top: 8px;\\n      margin-bottom: 8px;\\n    }\\n  }\\n  @media (max-width: 768px) {\\n    padding: 16px 8px;\\n    margin: 0 16px;\\n  }\\n\\n  .ant-row {\\n    flex-flow: nowrap;\\n\\n    .ant-col {\\n      &:not(:nth-of-type(1)) {\\n        padding-left: 18px;\\n\\n        @media (max-width: 410px) {\\n          flex: 1;\\n        }\\n      }\\n\\n      .detail-btn {\\n        display: block;\\n        line-height: 1.5;\\n        transition: opacity 0.2s;\\n\\n        &:hover {\\n          opacity: 0.7;\\n        }\\n\\n        .badge-img {\\n          display: inline-block;\\n          width: 75px;\\n          height: 20px;\\n          border: none;\\n          margin-left: 8px;\\n          margin-top: -2px;\\n\\n          &.m {\\n            display: none;\\n            width: 16px;\\n            height: 16px;\\n            margin-left: 4px;\\n          }\\n\\n          @media (max-width: 1200px) {\\n            &.w {\\n              display: none;\\n            }\\n            &.m {\\n              display: inline-block;\\n            }\\n          }\\n        }\\n      }\\n\\n      /* # TODO 체크박스 살리면 주석 해제 */\\n      /*\\n\t\t\t.ant-checkbox-wrapper {\\n\t\t\t\talign-items: center;\\n\\n\t\t\t\tspan {\\n\t\t\t\t\tpadding: 0;\\n\t\t\t\t}\\n\\n\t\t\t\t.ant-checkbox {\\n\t\t\t\t\tmargin-right: 16px;\\n\\n\t\t\t\t\t& + span {\\n\t\t\t\t\t\toverflow: hidden;\\n\t\t\t\t\t\twidth: 60px;\\n\t\t\t\t\t\theight: 72px;\\n\\n\t\t\t\t\t\timg {\\n\t\t\t\t\t\t\tdisplay: block;\\n\t\t\t\t\t\t\twidth: 100%;\\n\t\t\t\t\t\t\theight: 100%;\\n\t\t\t\t\t\t\tobject-fit: cover;\\n\t\t\t\t\t\t\tborder: solid 1px #d9d9d9;\\n\t\t\t\t\t\t}\\n\t\t\t\t\t}\\n\t\t\t\t}\\n\t\t\t}\\n\t\t    */\\n\\n      /* # TODO 체크박스 살리면 삭제 (s) */\\n      img {\\n        display: block;\\n        width: 60px;\\n        height: 72px;\\n        object-fit: cover;\\n        border: solid 1px #d9d9d9;\\n      }\\n      /* # TODO 체크박스 살리면 삭제 (e) */\\n\\n      .title {\\n        font-size: 16px;\\n        font-weight: bold;\\n        color: \",\n        \";\\n\\n        @media (max-width: 768px) {\\n          font-size: 14px;\\n        }\\n\\n        .amount {\\n          display: inline-block;\\n          vertical-align: bottom;\\n          font-size: 10px;\\n          font-weight: bold;\\n          color: rgba(27, 27, 41, 0.7);\\n          padding: 2px 5px;\\n          margin-left: 4px;\\n          border-radius: 8px;\\n          border: solid 1px rgba(27, 27, 41, 0.7);\\n        }\\n      }\\n\\n      .publisher {\\n        font-size: 14px;\\n        color: \",\n        \";\\n        margin-top: 8px;\\n\\n        span {\\n          display: inline-block;\\n          vertical-align: baseline;\\n          color: rgba(27, 27, 41, 0.1);\\n        }\\n      }\\n    }\\n  }\\n\\n  .title {\\n    & > a {\\n      font-size: 16px;\\n      font-weight: bold;\\n      line-height: 1.5;\\n    }\\n  }\\n\\n  .publisher {\\n    display: inline-block;\\n  }\\n\"\n    ]);\n    _templateObject4 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject5() {\n    const data = _tagged_template_literal([\n        \"\\n  padding-top: 24px;\\n  padding-bottom: 72px;\\n\\n  @media (max-width: 1200px) {\\n    border: none;\\n    padding-top: 0;\\n    padding-bottom: 48px;\\n  }\\n  @media (max-width: 768px) {\\n    padding-bottom: 32px;\\n  }\\n\"\n    ]);\n    _templateObject5 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject6() {\n    const data = _tagged_template_literal([\n        \"\\n  width: 100%;\\n  height: 88px;\\n  margin-bottom: 8px;\\n  background-color: #1a1a1a;\\n  @media (max-width: 500px) {\\n    height: 64px;\\n  }\\n  a {\\n    display: block;\\n    width: 100%;\\n    height: 100%;\\n    font-size: 0;\\n    background: url('/static/assets/list-banner-_lab.jpg') no-repeat 50% 50%;\\n    // background-size: contain;\\n    background-size: cover;\\n    transition: opacity 0.2s;\\n\\n    @media (hover: hover) {\\n      &:hover {\\n        opacity: 0.8;\\n      }\\n    }\\n    // 모바일을 위한 이미지 사이즈 조정\\n    @media (max-width: 500px) {\\n      background-size: auto 64px;\\n    }\\n  }\\n\"\n    ]);\n    _templateObject6 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport * as React from \"react\";\nimport { useCallback } from \"react\";\nimport styled from \"styled-components\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { View } from \"@/components\";\nimport { observer } from \"mobx-react-lite\";\nimport { Button, Col, Empty, Row } from \"antd\";\nimport Image from \"next/image\";\nimport { ProductDynamicPrice } from \"./ProductDynamicPrice\";\nimport Link from \"next/link\";\nimport { useRouter } from \"next/router\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { DEFAULT_BOOK_COVER } from \"@/settings/constant\";\nexport const ProductListEmpty = (param)=>{\n    let { title , emptyOptions , onEmptyClick  } = param;\n    const handleEmptyClick = useCallback(()=>{\n        if (onEmptyClick) {\n            onEmptyClick();\n        }\n    }, [\n        onEmptyClick\n    ]);\n    return /*#__PURE__*/ _jsx(Empty, {\n        ...emptyOptions,\n        description: /*#__PURE__*/ _jsx(\"span\", {\n            children: title\n        }),\n        children: /*#__PURE__*/ _jsx(Button, {\n            type: \"primary\",\n            onClick: handleEmptyClick,\n            children: \"새로 만들기\"\n        })\n    });\n};\nexport const ProductListCustomEmpty = (param)=>{\n    let { title , children , /*keyword,*/ smallType , query  } = param;\n    return /*#__PURE__*/ _jsxs(ProductListEmptyWrapper, {\n        smallType: smallType,\n        children: [\n            /*#__PURE__*/ _jsx(EmptyIcon, {\n                smallType: smallType,\n                children: /*#__PURE__*/ _jsx(Image, {\n                    src: \"/static/assets/img_empty.svg\",\n                    alt: \"no data\",\n                    width: 80,\n                    height: 50\n                })\n            }),\n            /*#__PURE__*/ _jsx(EmptyTitle, {\n                smallType: smallType,\n                children: title\n            }),\n            children\n        ]\n    });\n};\nexport const ProductListParsedDataEmpty = (param)=>{\n    let { title , children , smallType  } = param;\n    return /*#__PURE__*/ _jsxs(ProductParsedDataEmptyWrapper, {\n        smallType: smallType,\n        children: [\n            /*#__PURE__*/ _jsx(EmptyIcon, {\n                smallType: smallType,\n                children: /*#__PURE__*/ _jsx(Image, {\n                    src: \"/static/assets/img-construction-01.png\",\n                    alt: \"no data\",\n                    width: 72,\n                    height: 72\n                })\n            }),\n            /*#__PURE__*/ _jsx(EmptyTitle, {\n                smallType: smallType,\n                children: title\n            }),\n            /*#__PURE__*/ _jsx(Link, {\n                href: \"https://solvook.channel.io/support-bots/70272\",\n                target: \"_blank\",\n                className: \"request-btn\",\n                children: \"편집 요청하기\"\n            })\n        ]\n    });\n};\nexport const ProductListItem = observer((param)=>{\n    let { selectedItems , onChangeSelectedItems , allChecked , item , index , onClick , onPriceChange , useNewPlan , useParsingBadge  } = param;\n    var _item_product, _item_product_source;\n    const isChecked = selectedItems.findIndex((selectedItem)=>selectedItem.id === item.id) > -1 || allChecked;\n    var _item_product_thumb_img;\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            useParsingBadge && index === 2 && /*#__PURE__*/ _jsx(StudioPromotionBanner, {}),\n            /*#__PURE__*/ _jsxs(ProductListItemWrapper, {\n                children: [\n                    /*#__PURE__*/ _jsxs(Row, {\n                        align: \"middle\",\n                        children: [\n                            /*#__PURE__*/ _jsx(Col, {\n                                children: /*#__PURE__*/ _jsx(Image, {\n                                    unoptimized: true,\n                                    src: (_item_product_thumb_img = item.product.thumb_img) !== null && _item_product_thumb_img !== void 0 ? _item_product_thumb_img : DEFAULT_BOOK_COVER,\n                                    alt: \"thumb\",\n                                    width: 60,\n                                    height: 72\n                                })\n                            }),\n                            /*#__PURE__*/ _jsx(Col, {\n                                children: /*#__PURE__*/ _jsx(Link, {\n                                    href: \"/products/\".concat(item.product.id),\n                                    className: \"detail-btn\",\n                                    target: \"_blank\",\n                                    children: /*#__PURE__*/ _jsxs(\"div\", {\n                                        children: [\n                                            /*#__PURE__*/ _jsxs(\"div\", {\n                                                className: \"title\",\n                                                children: [\n                                                    item.product.title,\n                                                    (item === null || item === void 0 ? void 0 : (_item_product = item.product) === null || _item_product === void 0 ? void 0 : (_item_product_source = _item_product.source) === null || _item_product_source === void 0 ? void 0 : _item_product_source.studio_version) === \"v2\" && /*#__PURE__*/ _jsxs(_Fragment, {\n                                                        children: [\n                                                            /*#__PURE__*/ _jsx(Image, {\n                                                                src: \"/static/assets/label-edit.svg\",\n                                                                alt: \"parsing badge\",\n                                                                width: 75,\n                                                                height: 20,\n                                                                className: \"badge-img w\",\n                                                                style: {}\n                                                            }),\n                                                            /*#__PURE__*/ _jsx(Image, {\n                                                                src: \"/static/assets/label-can-edit.svg\",\n                                                                alt: \"parsing badge\",\n                                                                width: 75,\n                                                                height: 20,\n                                                                className: \"badge-img m\",\n                                                                style: {}\n                                                            })\n                                                        ]\n                                                    })\n                                                ]\n                                            }),\n                                            /*#__PURE__*/ _jsxs(\"span\", {\n                                                className: \"publisher\",\n                                                children: [\n                                                    item.product.vendor && /*#__PURE__*/ _jsxs(_Fragment, {\n                                                        children: [\n                                                            item.product.vendor,\n                                                            /*#__PURE__*/ _jsx(\"span\", {\n                                                                children: \"|\"\n                                                            })\n                                                        ]\n                                                    }),\n                                                    item.product.author\n                                                ]\n                                            })\n                                        ]\n                                    })\n                                })\n                            })\n                        ]\n                    }),\n                    /*#__PURE__*/ _jsx(ProductDynamicPrice, {\n                        product: item.product,\n                        onPriceChange: onPriceChange,\n                        useNewPlan: useNewPlan,\n                        useParsingBadge: useParsingBadge\n                    })\n                ]\n            })\n        ]\n    });\n});\nexport const StudioPromotionBanner = observer((param)=>{\n    let {} = param;\n    return /*#__PURE__*/ _jsx(StudioPromotionBannerWrapper, {\n        children: /*#__PURE__*/ _jsx(Link, {\n            href: \"https://promotion.solvook.com/lab-home\",\n            onClick: ()=>mixpanelEvent(\"Studio List Banner Clicked\"),\n            target: \"_blank\",\n            children: \"스튜디오 전환율을 높이기 위한 배너\"\n        })\n    });\n});\nexport const ProductList = observer((param)=>{\n    let { selectedItems , onChangeSelectedItems , allChecked , dataSource , onClick , onEmptyClick , onPriceChange , isAllList , // keyword,\n    useNewPlan , useParsingBadge  } = param;\n    if (dataSource.length <= 0) {\n        const router = useRouter();\n        const { query  } = router;\n        if ((query === null || query === void 0 ? void 0 : query.parsing) === \"Y\") {\n            return /*#__PURE__*/ _jsx(ProductListParsedDataEmpty, {\n                title: \"선택한 필터값으로는 편집가능한 자료가 없어요.\",\n                smallType: false\n            });\n        } else {\n            return /*#__PURE__*/ _jsx(ProductListCustomEmpty, {\n                title: \"검색 결과가 없습니다.\",\n                // keyword={keyword}\n                // smallType={isAllList}\n                smallType: false,\n                query: query\n            });\n        }\n    }\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            dataSource.map((item, i)=>/*#__PURE__*/ _jsx(ProductListItem, {\n                    item: item,\n                    index: i,\n                    onClick: onClick,\n                    onPriceChange: onPriceChange,\n                    allChecked: allChecked,\n                    selectedItems: selectedItems,\n                    onChangeSelectedItems: onChangeSelectedItems,\n                    useNewPlan: useNewPlan,\n                    useParsingBadge: useParsingBadge\n                }, item.id)),\n            useParsingBadge && dataSource.length < 3 && /*#__PURE__*/ _jsx(StudioPromotionBanner, {})\n        ]\n    });\n});\nconst ProductListEmptyWrapper = styled.div.withConfig({\n    componentId: \"sc-cb5e327-0\"\n})(_templateObject(), (param)=>{\n    let { smallType  } = param;\n    return smallType ? \"20px 0\" : \"90px 0\";\n});\nconst ProductParsedDataEmptyWrapper = styled(ProductListEmptyWrapper).withConfig({\n    componentId: \"sc-cb5e327-1\"\n})(_templateObject1(), themeGet(\"background.1\", \"#F5F8FB\"), themeGet(\"text.2\", \"#5F5F69\"), themeGet(\"primary.0\", \"#002FA8\"));\nconst EmptyIcon = styled.div.withConfig({\n    componentId: \"sc-cb5e327-2\"\n})(_templateObject2(), (param)=>{\n    let { smallType  } = param;\n    return smallType ? \"40px\" : \"80px\";\n});\nconst EmptyTitle = styled.p.withConfig({\n    componentId: \"sc-cb5e327-3\"\n})(_templateObject3(), (param)=>{\n    let { smallType  } = param;\n    return smallType ? \"14px\" : \"14px\";\n}, themeGet(\"text.3\", \"#BBBBBF\"), themeGet(\"text.0\", \"#1B1B29\"));\nconst ProductListItemWrapper = styled.div.withConfig({\n    componentId: \"sc-cb5e327-4\"\n})(_templateObject4(), themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"text.0\", \"#1B1B29\"));\nexport const ProductIndexPageWrapper = styled(View).withConfig({\n    componentId: \"sc-cb5e327-5\"\n})(_templateObject5());\nexport const StudioPromotionBannerWrapper = styled.div.withConfig({\n    componentId: \"sc-cb5e327-6\"\n})(_templateObject6());\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    min-height: 60vh;\\n  }\\n\\n  .ant-menu {\\n    display: none;\\n\\n    .ant-menu-item {\\n      flex: unset;\\n      padding: 0;\\n      text-align: center;\\n\\n      &:nth-of-type(1) {\\n        width: 15%;\\n        min-width: 70px;\\n      }\\n      &:nth-of-type(2),\\n      &:nth-of-type(3) {\\n        flex: 1;\\n      }\\n    }\\n\\n    .active-link {\\n      height: auto;\\n    }\\n\\n    @media (max-width: 1200px) {\\n      display: block;\\n\\n      .ant-menu-item {\\n        margin: 0;\\n\\n        &:after {\\n          display: none;\\n        }\\n        &:nth-of-type(3),\\n        &:nth-of-type(4) {\\n          width: 140px;\\n        }\\n\\n        span {\\n          a {\\n            color: \",\n        \";\\n          }\\n        }\\n\\n        &.ant-menu-item-selected {\\n          span {\\n            position: relative;\\n            padding: 0 8px;\\n\\n            &:before {\\n              display: block;\\n              content: '';\\n              position: absolute;\\n              bottom: -15px;\\n              left: 0;\\n              right: 0;\\n              width: 100%;\\n              height: 2px;\\n              background: \",\n        \";\\n            }\\n\\n            a {\\n              font-weight: bold;\\n              color: \",\n        \";\\n            }\\n          }\\n        }\\n      }\\n    }\\n    @media (max-width: 768px) {\\n      display: flex;\\n      padding: 0 10px;\\n\\n      .ant-menu-item {\\n        &:nth-of-type(1) {\\n          width: 20%;\\n        }\\n        &:nth-of-type(2) {\\n          width: 20%;\\n        }\\n        &:nth-of-type(3),\\n        &:nth-of-type(4) {\\n          min-width: 100px;\\n        }\\n\\n        &.ant-menu-item-selected {\\n          span {\\n            padding: 0 5px;\\n          }\\n        }\\n      }\\n    }\\n  }\\n\\n  > .section {\\n    padding-top: 32px;\\n    padding-bottom: 16px;\\n\\n    &:nth-of-type(1) {\\n      padding-top: 24px;\\n\\n      @media (max-width: 768px) {\\n        padding-top: 0;\\n      }\\n    }\\n    @media (max-width: 1200px) {\\n      padding-top: 8px;\\n    }\\n    @media (max-width: 768px) {\\n      padding-top: 0;\\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 styled from \"styled-components\";\nimport { observer } from \"mobx-react-lite\";\nimport { ProductList } from \"./ProductList\";\nimport React from \"react\";\nimport { ProductTypeSearchResultHeader } from \"./ProductTypeSearchResultHeader\";\nimport { ProductCurrentFilterTag } from \"@/modules/products/components/ProductCurrentFilterTag\";\nimport { Menu } from \"antd\";\nimport { ActiveLink } from \"@/components/ActiveLink\";\nimport { CATEGORY_HANDOUT_PAGE, CATEGORY_TEXTBOOK_PAGE, CATEGORY_WORKBOOK_PAGE } from \"@/settings/constant\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { useRouter } from \"next/router\";\nimport { includesPath } from \"@/lib/utils/url\";\nexport const ProductUnifiedSearchResultWrapper = styled.div.withConfig({\n    componentId: \"sc-8b85bac5-0\"\n})(_templateObject(), themeGet(\"text.3\", \"#BBBBBF\"), themeGet(\"border.3\", \"#1B1B29\"), themeGet(\"text.0\", \"#1B1B29\"));\nconst mobileMenuFilters = [\n    {\n        label: \"수업자료\",\n        value: \"1\",\n        path: CATEGORY_HANDOUT_PAGE\n    },\n    {\n        label: \"교과서\",\n        value: \"2\",\n        path: CATEGORY_TEXTBOOK_PAGE\n    },\n    {\n        label: \"참고서\",\n        value: \"3\",\n        path: CATEGORY_WORKBOOK_PAGE\n    }\n];\nexport const ProductTypeSearchResult = observer((param)=>{\n    let { dataSource , onItemClick , filterItems , onEmptyClick , onFilterClick , sorting , parsing , parsingState , onPriceChange , deleteFilterItem , onSelectAll , allChecked , selectedItems , onChangeSelectedItems , sortStatus , totalCount , category , useParsingBadge  } = param;\n    const router = useRouter();\n    const { asPath  } = router;\n    const { width  } = useWindowDimensions();\n    return /*#__PURE__*/ _jsxs(ProductUnifiedSearchResultWrapper, {\n        children: [\n            /*#__PURE__*/ _jsx(Menu, {\n                mode: \"horizontal\",\n                children: mobileMenuFilters && mobileMenuFilters.map((item, idx)=>/*#__PURE__*/ _jsx(Menu.Item, {\n                        children: /*#__PURE__*/ _jsx(ActiveLink, {\n                            className: includesPath(asPath, item.path) ? \"active-link active\" : \"active-link\",\n                            href: \"\".concat(item.path),\n                            children: item.label\n                        })\n                    }, \"mobile_filter_\".concat(idx)))\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"section\",\n                children: [\n                    Object.keys(filterItems).length > 0 && width > 1200 && /*#__PURE__*/ _jsx(ProductCurrentFilterTag, {\n                        onFilterClick: onFilterClick,\n                        filterItems: filterItems,\n                        deleteFilterItem: deleteFilterItem\n                    }),\n                    width <= 1200 && /*#__PURE__*/ _jsx(ProductCurrentFilterTag, {\n                        onFilterClick: onFilterClick,\n                        filterItems: filterItems,\n                        deleteFilterItem: deleteFilterItem\n                    }),\n                    /*#__PURE__*/ _jsx(ProductTypeSearchResultHeader, {\n                        sorting: sorting,\n                        parsing: parsing,\n                        parsingState: parsingState,\n                        onEmptyClick: onEmptyClick,\n                        onItemClick: onItemClick,\n                        onSelectAll: onSelectAll,\n                        sortStatus: sortStatus,\n                        totalCount: totalCount,\n                        category: category,\n                        useParsingBadge: useParsingBadge\n                    }),\n                    /*#__PURE__*/ _jsx(ProductList, {\n                        onPriceChange: onPriceChange,\n                        onClick: onItemClick,\n                        dataSource: dataSource,\n                        onEmptyClick: onEmptyClick,\n                        allChecked: allChecked,\n                        selectedItems: selectedItems,\n                        onChangeSelectedItems: onChangeSelectedItems\n                    })\n                ]\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  cursor: pointer;\\n  font-size: 14px;\\n  color: \",\n        \";\\n  font-weight: \",\n        \";\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  position: relative;\\n\\n  .parsing-badge {\\n    position: absolute;\\n    top: 0;\\n    left: 0;\\n\\n    @media (max-width: 1200px) {\\n      position: relative;\\n      padding: 0 16px;\\n      margin-top: -4px;\\n      margin-bottom: 6px;\\n    }\\n\\n    .ant-checkbox-wrapper {\\n      display: flex;\\n      align-items: center;\\n\\n      & > span {\\n        display: block;\\n\\n        &.ant-checkbox {\\n          margin-top: -6px;\\n        }\\n\\n        &:not(.ant-checkbox) {\\n          display: flex;\\n          gap: 4px;\\n          padding-left: 4px;\\n\\n          .badge-img {\\n          }\\n          .badge-desc {\\n            font-size: 14px;\\n            color: \",\n        \";\\n            line-height: 20px;\\n          }\\n        }\\n      }\\n    }\\n\\n    @media (hover: hover) {\\n      &:hover .promotion-tooltip {\\n        visibility: visible;\\n        opacity: 1;\\n      }\\n    }\\n\\n    .promotion-tooltip {\\n      visibility: hidden;\\n      opacity: 0;\\n      position: absolute;\\n      top: 20px;\\n      left: 50%;\\n      transform: translateX(calc(-50% - 5px));\\n      z-index: 9;\\n      transition: all 0.2s;\\n\\n      @media (max-width: 1200px) {\\n        display: none;\\n      }\\n\\n      .tooltip-inner {\\n        position: relative;\\n        padding-top: 20px;\\n\\n        .back {\\n          position: absolute;\\n          top: 0;\\n          left: 0;\\n          width: 100%;\\n          height: 100%;\\n          z-index: 1;\\n          background-color: #fff;\\n        }\\n\\n        a {\\n          position: relative;\\n          display: block;\\n          width: 160px;\\n          height: 40px;\\n          font-size: 16px;\\n          font-weight: bold;\\n          color: #fff;\\n          text-align: center;\\n          line-height: 38px;\\n          border-radius: 4px;\\n          background-color: \",\n        \";\\n          transition: all 0.2s;\\n          z-index: 9;\\n\\n          @media (hover: hover) {\\n            &:hover {\\n              opacity: 0.7;\\n            }\\n          }\\n\\n          &:before,\\n          &:after {\\n            display: block;\\n            content: '';\\n            width: 16px;\\n          }\\n\\n          &:before {\\n            position: absolute;\\n            top: -12px;\\n            left: 50%;\\n            width: 0;\\n            height: 0;\\n            border-left: 8px solid transparent;\\n            border-right: 8px solid transparent;\\n            border-bottom: 12px solid #00bfc8;\\n            transform: translateX(-50%);\\n          }\\n\\n          &:after {\\n            display: inline-block;\\n            vertical-align: text-top;\\n            height: 16px;\\n            margin-top: 4px;\\n            background: url('/static/assets/ico-right-white.svg') no-repeat 50% 50%;\\n          }\\n        }\\n      }\\n    }\\n  }\\n\\n  .inner {\\n    display: flex;\\n    justify-content: space-between;\\n    padding-bottom: 16px;\\n    &.w {\\n      justify-content: flex-end;\\n      padding-bottom: 24px;\\n    }\\n    &.m {\\n      display: none;\\n      padding: 0 36px;\\n\\n      .total {\\n        font-size: 16px;\\n        font-weight: 600;\\n        color: #bbbbbf;\\n\\n        @media (max-width: 1200px) {\\n        }\\n        @media (max-width: 768px) {\\n          font-size: 14px;\\n        }\\n      }\\n\\n      .ant-select {\\n        width: 100px;\\n\\n        .ant-select-selector {\\n          .ant-select-selection-item {\\n            text-align: right;\\n          }\\n        }\\n\\n        @media (max-width: 768px) {\\n          width: 92px;\\n        }\\n      }\\n    }\\n\\n    @media (max-width: 1200px) {\\n      &.w {\\n        display: none;\\n      }\\n      &.m {\\n        display: flex;\\n        align-items: center;\\n        justify-content: space-between;\\n      }\\n    }\\n    @media (max-width: 768px) {\\n      &.m {\\n        padding: 0 16px;\\n      }\\n    }\\n  }\\n  .filterWrapper {\\n    display: flex;\\n  }\\n\\n  .line {\\n    margin: 0 6px;\\n    color: #f0f0f0;\\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 { observer } from \"mobx-react-lite\";\nimport React, { useState } from \"react\";\nimport styled from \"styled-components\";\nimport { SmallTypeSelect } from \"./SmallTypeSelect\";\nimport Image from \"next/image\";\nimport { Checkbox } from \"antd\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport Link from \"next/link\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nconst FilterName = styled.div.withConfig({\n    componentId: \"sc-7840ef83-0\"\n})(_templateObject(), (param)=>{\n    let { active  } = param;\n    return active ? \"#002fa8\" : \"black\";\n}, (param)=>{\n    let { active  } = param;\n    return active ? \"bold\" : \"normal\";\n});\nexport const ProductTypeSearchResultHeader = observer((param)=>{\n    let { onItemClick , onEmptyClick , sorting , parsing , parsingState , onSelectAll , sortStatus , totalCount , category , useParsingBadge  } = param;\n    const [activeTap, setActiveTap] = useState(sortStatus);\n    const handleParsing = (e)=>{\n        parsing(e.target.checked ? \"Y\" : \"N\");\n    };\n    const handleChangeTap = (sort)=>{\n        setActiveTap(sort);\n        sorting(sort);\n    };\n    return /*#__PURE__*/ _jsxs(ProductTypeWrapper, {\n        children: [\n            useParsingBadge && category === \"handout\" && /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"parsing-badge\",\n                children: [\n                    /*#__PURE__*/ _jsxs(Checkbox, {\n                        defaultChecked: parsingState === \"Y\",\n                        onChange: (e)=>{\n                            handleParsing(e);\n                        },\n                        children: [\n                            /*#__PURE__*/ _jsx(Image, {\n                                src: \"/static/assets/label-edit.svg\",\n                                alt: \"parsing badge\",\n                                width: 75,\n                                height: 20,\n                                className: \"badge-img\"\n                            }),\n                            /*#__PURE__*/ _jsx(\"span\", {\n                                className: \"badge-desc\",\n                                children: \"자료만 보기\"\n                            })\n                        ]\n                    }),\n                    /*#__PURE__*/ _jsx(\"div\", {\n                        className: \"promotion-tooltip\",\n                        children: /*#__PURE__*/ _jsxs(\"div\", {\n                            className: \"tooltip-inner\",\n                            children: [\n                                /*#__PURE__*/ _jsx(\"div\", {\n                                    className: \"back\"\n                                }),\n                                /*#__PURE__*/ _jsx(Link, {\n                                    onClick: ()=>mixpanelEvent(\"Studio List Tooltip Clicked\"),\n                                    href: \"https://promotion.solvook.com/promotions/studio\",\n                                    target: \"_blank\",\n                                    children: \"편집가능한 자료란?\"\n                                })\n                            ]\n                        })\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(\"div\", {\n                className: \"inner w\",\n                children: /*#__PURE__*/ _jsxs(\"div\", {\n                    className: \"filterWrapper\",\n                    children: [\n                        /*#__PURE__*/ _jsxs(FilterName, {\n                            active: activeTap === \"new\",\n                            onClick: ()=>handleChangeTap(\"new\"),\n                            className: \"filterName\",\n                            children: [\n                                \"최신순\",\n                                \" \"\n                            ]\n                        }),\n                        /*#__PURE__*/ _jsx(\"span\", {\n                            className: \"line\",\n                            children: \" | \"\n                        }),\n                        /*#__PURE__*/ _jsxs(FilterName, {\n                            active: activeTap === \"price\",\n                            onClick: ()=>handleChangeTap(\"price\"),\n                            className: \"filterName\",\n                            children: [\n                                \"낮은가격순\",\n                                \" \"\n                            ]\n                        })\n                    ]\n                })\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"inner m\",\n                children: [\n                    /*#__PURE__*/ _jsxs(\"div\", {\n                        className: \"total\",\n                        children: [\n                            \"총 \",\n                            totalCount,\n                            \"건\"\n                        ]\n                    }),\n                    /*#__PURE__*/ _jsx(SmallTypeSelect, {\n                        defaultValue: sortStatus,\n                        onChange: (key)=>handleChangeTap(key),\n                        options: [\n                            // {\n                            // \tvalue: 'accurate',\n                            // \tlabel: '정확도순',\n                            // },\n                            {\n                                value: \"new\",\n                                label: \"최신순\"\n                            },\n                            // {\n                            // \tvalue: 'korean',\n                            // \tlabel: '이름순',\n                            // },\n                            {\n                                value: \"price\",\n                                label: \"낮은가격순\"\n                            }\n                        ]\n                    })\n                ]\n            })\n        ]\n    });\n});\nconst ProductTypeWrapper = styled.div.withConfig({\n    componentId: \"sc-7840ef83-1\"\n})(_templateObject1(), themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"primary.1\", \"#00bfc8\"));\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n    const data = _tagged_template_literal([\n        \"\\n      .ant-checkbox-group .ant-checkbox-group-item:nth-child(n + 4) {\\n        display: none;\\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        \"\\n\\n  .ant-checkbox-group {\\n    display: block;\\n    overflow: hidden;\\n    max-height: 230px;\\n    transition: max-height 0.5s;\\n\\n    .ant-checkbox-wrapper {\\n      margin-inline-start: 0;\\n      margin-top: 12px;\\n\\n      span {\\n        font-size: 14px;\\n        line-height: 1.5;\\n        color: \",\n        \";\\n      }\\n\\n      @media (max-width: 1200px) {\\n        display: flex;\\n        align-items: center;\\n        justify-content: space-between;\\n        padding-left: 8px;\\n        margin-top: 20px;\\n\\n        span {\\n          font-size: 18px;\\n\\n          &:not(.ant-checkbox) {\\n            order: 1;\\n            flex: 1;\\n          }\\n\\n          &.ant-checkbox {\\n            order: 2;\\n          }\\n        }\\n      }\\n      @media (max-width: 768px) {\\n        span {\\n          font-size: 16px;\\n        }\\n      }\\n\\n      .ant-checkbox {\\n        display: inline-block;\\n        vertical-align: middle;\\n        width: 16px;\\n        height: 16px;\\n\\n        @media (max-width: 1200px) {\\n          margin-right: 4px;\\n        }\\n        @media (max-width: 768px) {\\n        }\\n\\n        &.ant-checkbox-checked {\\n          .ant-checkbox-inner {\\n            border-color: \",\n        \";\\n            background-color: \",\n        \";\\n          }\\n\\n          & + span {\\n            font-weight: bold;\\n            color: \",\n        \";\\n          }\\n\\n          @media (max-width: 1200px) {\\n            &:after {\\n              opacity: 0;\\n            }\\n\\n            .ant-checkbox-inner {\\n              background-color: transparent;\\n\\n              &:after {\\n                width: 9px;\\n                height: 16px;\\n                border-color: \",\n        \";\\n              }\\n            }\\n          }\\n          @media (max-width: 768px) {\\n          }\\n        }\\n\\n        input {\\n          border-radius: 0;\\n        }\\n\\n        .ant-checkbox-inner {\\n          border: 1px solid \",\n        \";\\n          border-radius: 2px;\\n\\n          @media (max-width: 1200px) {\\n            border: none;\\n          }\\n          @media (max-width: 768px) {\\n          }\\n        }\\n      }\\n    }\\n  }\\n\\n  p {\\n    font-weight: bold;\\n  }\\n\\n  input {\\n    margin-right: 5px;\\n  }\\n\\n  .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {\\n    background-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 { MinusOutlined, PlusOutlined } from \"@ant-design/icons\";\nimport { nanoid } from \"@bookips/nanoid\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { Button, Checkbox } from \"antd\";\nimport { observer } from \"mobx-react-lite\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport styled, { css } from \"styled-components\";\nexport const SearchCheckboxWrapper = styled.div.withConfig({\n    componentId: \"sc-b27c82ea-0\"\n})(_templateObject1(), (param)=>{\n    let { showAll  } = param;\n    return !showAll && css(_templateObject());\n}, themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"primary.0\", \"#002FA8\"), themeGet(\"primary.0\", \"#002FA8\"), themeGet(\"primary.0\", \"#002FA8\"), themeGet(\"primary.1\", \"#008489\"), themeGet(\"border.1\", \"#E8E8EA\"), themeGet(\"background.0\", \"#FDFDFF\"));\n// export interface CheckboxListProps{\n//   options: CheckboxListType[]\n//\n// }\nconst CheckboxGroup = Checkbox.Group;\nexport const SearchCheckbox = observer((param)=>{\n    let { filterKey , options , selectedItems , onChange , maxShowItemNum =3  } = param;\n    var _selectedItems_filterKey, _selectedItems_filterKey1;\n    const [currentOptions, setCurrentOptions] = useState(options.slice(0, maxShowItemNum));\n    const [showAllOptions, setShowAllOptions] = useState(false);\n    useEffect(()=>{\n        Object.keys(selectedItems).map((key)=>{\n            if (key === filterKey) setShowAllOptions(true);\n        });\n    }, []);\n    const toggleShowAllOptions = useCallback(()=>{\n        setShowAllOptions(!showAllOptions);\n    }, [\n        showAllOptions\n    ]);\n    useEffect(()=>{\n        if (showAllOptions) {\n            setCurrentOptions(options);\n        }\n    }, [\n        options,\n        showAllOptions\n    ]);\n    const handleOnChange = useCallback((list)=>{\n        let items;\n        if (options[0] && typeof options[0] === \"object\") {\n            items = list.map((item)=>{\n                // @ts-ignore\n                const option = options.find((option)=>option.value === item);\n                return {\n                    id: nanoid(),\n                    key: filterKey,\n                    label: option.label,\n                    value: item\n                };\n            });\n        } else {\n            items = list.map((item, idx)=>({\n                    id: nanoid(),\n                    value: item.toString(),\n                    key: filterKey\n                }));\n        }\n        onChange(filterKey, items);\n    }, [\n        onChange,\n        filterKey\n    ]);\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(SearchCheckboxWrapper, {\n                className: showAllOptions ? \"spread\" : \"\",\n                showAll: showAllOptions,\n                children: /*#__PURE__*/ _jsx(CheckboxGroup, {\n                    options: currentOptions,\n                    value: (_selectedItems_filterKey = selectedItems[filterKey]) === null || _selectedItems_filterKey === void 0 ? void 0 : _selectedItems_filterKey.map((item)=>item.value),\n                    defaultValue: (_selectedItems_filterKey1 = selectedItems[filterKey]) === null || _selectedItems_filterKey1 === void 0 ? void 0 : _selectedItems_filterKey1.map((item)=>item.value),\n                    onChange: handleOnChange\n                })\n            }),\n            options.length > maxShowItemNum && /*#__PURE__*/ _jsx(Button, {\n                type: \"text\",\n                icon: showAllOptions ? /*#__PURE__*/ _jsx(MinusOutlined, {}) : /*#__PURE__*/ _jsx(PlusOutlined, {}),\n                // # TODO 더보기 팝업 작업시 주석으로 교체기\n                // onClick={() => {\n                // \tonShowModal(tempList, idx)\n                // }}\n                onClick: toggleShowAllOptions,\n                children: \"더보기\"\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  flex-direction: column;\\n  padding: 16px 0;\\n\\n  &.scroll {\\n    &::-webkit-scrollbar {\\n      width: 4px;\\n      background-color: #efefef;\\n    }\\n\\n    &::-webkit-scrollbar-thumb {\\n      border-radius: 2px;\\n      background: #bbbbbf;\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    padding: 20px 0;\\n\\n    &:nth-of-type(1) {\\n      padding-top: 0;\\n    }\\n  }\\n  @media (max-width: 768px) {\\n  }\\n\\n  .ant-btn {\\n    height: auto;\\n  }\\n\\n  @media (hover: hover) {\\n    &:hover {\\n      background-color: transparent;\\n    }\\n  }\\n\\n  &:not(:nth-last-of-type(1)),\\n  .check-area:not(:nth-last-of-type(1)) {\\n    border-bottom: 1px solid \",\n        \";\\n\\n    @media (max-width: 1200px) {\\n      border: none;\\n    }\\n    @media (max-width: 768px) {\\n      position: relative;\\n\\n      &:before {\\n        display: block;\\n        content: '';\\n        position: absolute;\\n        left: -24px;\\n        bottom: 0;\\n        width: 100vw;\\n        height: 1px;\\n        background-color: \",\n        \";\\n      }\\n    }\\n  }\\n\\n  .check-area {\\n    padding-bottom: 16px;\\n    margin-bottom: 16px;\\n\\n    .spread {\\n      .ant-checkbox-group {\\n        max-height: 1000px;\\n\\n        @media (max-width: 1200px) {\\n          max-height: 1500px;\\n        }\\n      }\\n    }\\n\\n    &:nth-of-type(1) {\\n      .spread .ant-checkbox-group {\\n        max-height: 1800px;\\n\\n        @media (max-width: 1200px) {\\n          max-height: 2500px;\\n        }\\n      }\\n    }\\n\\n    &:nth-of-type(2) {\\n      .spread .ant-checkbox-group {\\n        max-height: 4000px;\\n\\n        @media (max-width: 1200px) {\\n          max-height: 4400px;\\n        }\\n      }\\n    }\\n\\n    &:nth-of-type(5) {\\n      .spread .ant-checkbox-group {\\n        max-height: 5000px;\\n\\n        @media (max-width: 1200px) {\\n          max-height: 6000px;\\n        }\\n      }\\n    }\\n\\n    .ant-btn {\\n      padding: 0 12px;\\n      margin: 12px 0 0 -12px;\\n\\n      @media (hover: hover) {\\n        &:hover {\\n          background-color: transparent;\\n\\n          span {\\n            color: rgba(27, 27, 41, 0.7);\\n          }\\n        }\\n      }\\n\\n      span {\\n        font-size: 14px;\\n        font-weight: 600;\\n        color: rgba(27, 27, 41, 0.3);\\n        margin: 0;\\n        transition: color 0.2s;\\n      }\\n\\n      .anticon {\\n        margin-right: 8px;\\n      }\\n    }\\n\\n    @media (max-width: 1200px) {\\n      position: relative;\\n\\n      .ant-btn {\\n        position: absolute;\\n        top: -12px;\\n        right: -12px;\\n        padding: 12px;\\n        margin-top: 0;\\n      }\\n    }\\n    @media (max-width: 768px) {\\n    }\\n  }\\n\\n  input {\\n    margin-right: 5px;\\n  }\\n\\n  .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {\\n    background-color: \",\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  justify-content: space-between;\\n  align-items: center;\\n  padding: 24px 0 16px;\\n  border-bottom: 1px solid \",\n        \";\\n\\n  .reset-btn {\\n    height: auto;\\n    padding: 0 12px;\\n    margin-right: -12px;\\n\\n    img {\\n      vertical-align: text-bottom;\\n      margin-right: 2px;\\n      opacity: 0.3;\\n      transition: opacity 0.2s;\\n    }\\n\\n    span {\\n      font-size: 14px;\\n      font-weight: bold;\\n      color: #bbbbbf;\\n      transition: color 0.2s;\\n    }\\n\\n    @media (hover: hover) {\\n      &:hover {\\n        background-color: transparent;\\n\\n        img {\\n          opacity: 1;\\n        }\\n\\n        span {\\n          color: rgba(27, 27, 27, 0.7);\\n        }\\n      }\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    display: none;\\n  }\\n  @media (max-width: 768px) {\\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: none;\\n  align-items: center;\\n  justify-content: end;\\n  background-color: #fff;\\n\\n  @media (max-width: 1200px) {\\n    display: flex;\\n\\n    .ant-btn {\\n      width: 56px;\\n      height: 56px;\\n    }\\n  }\\n  @media (max-width: 768px) {\\n  }\\n\"\n    ]);\n    _templateObject2 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject3() {\n    const data = _tagged_template_literal([\n        \"\\n  font-size: 16px;\\n  font-weight: 600;\\n  color: \",\n        \";\\n  margin: 0;\\n\\n  @media (max-width: 1200px) {\\n    font-size: 20px;\\n    font-weight: bold;\\n    line-height: 1.5;\\n  }\\n  @media (max-width: 768px) {\\n    font-size: 18px;\\n  }\\n\"\n    ]);\n    _templateObject3 = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject4() {\n    const data = _tagged_template_literal([\n        \"\\n  li {\\n    cursor: pointer;\\n    padding: 8px 0;\\n    transition: opacity 0.2s;\\n\\n    &:nth-of-type(1) {\\n      margin-top: 8px;\\n    }\\n\\n    &:nth-last-of-type(1) {\\n      margin-bottom: -8px;\\n    }\\n\\n    .active-link {\\n      height: auto;\\n\\n      &.active {\\n        div {\\n          font-weight: bold;\\n          color: \",\n        \";\\n        }\\n      }\\n    }\\n\\n    span {\\n      display: none;\\n    }\\n\\n    @media (hover: hover) {\\n      &:hover {\\n        opacity: 0.7;\\n      }\\n    }\\n\\n    @media (max-width: 1200px) {\\n      font-size: 18px;\\n      padding: 10px 0 10px 8px;\\n\\n      &:nth-of-type(1) {\\n        margin-top: 12px;\\n      }\\n    }\\n    @media (max-width: 768px) {\\n      font-size: 16px;\\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  .ant-checkbox-wrapper {\\n    display: flex;\\n    margin-inline-start: 0;\\n\\n    .ant-checkbox {\\n      display: inline-block;\\n      vertical-align: middle;\\n      width: 16px;\\n      height: 16px;\\n\\n      &.ant-checkbox-checked {\\n        .ant-checkbox-inner {\\n          background-color: #002fa8;\\n        }\\n      }\\n\\n      input {\\n        border-radius: 0;\\n      }\\n\\n      .ant-checkbox-inner {\\n        border: 1px solid \",\n        \";\\n        border-radius: 2px;\\n      }\\n    }\\n  }\\n\\n  .filter-content-box {\\n    @media (max-width: 1200px) {\\n      overflow-y: auto;\\n      overflow-x: hidden;\\n      max-height: calc(100vh - 56px);\\n      padding: 24px 24px 112px;\\n    }\\n    @media (max-width: 768px) {\\n    }\\n  }\\n\"\n    ]);\n    _templateObject5 = function() {\n        return data;\n    };\n    return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { Button } from \"antd\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport { SearchCheckbox } from \"./SearchCheckbox\";\nimport { ActiveLink } from \"@/components/ActiveLink\";\nimport { includesPath } from \"@/lib/utils/url\";\nimport { CATEGORY_HANDOUT_PAGE, CATEGORY_TEXTBOOK_PAGE, CATEGORY_WORKBOOK_PAGE } from \"@/settings/constant\";\nimport { nanoid } from \"@bookips/nanoid\";\nimport { observer } from \"mobx-react-lite\";\nimport Image from \"next/image\";\nimport { useRouter } from \"next/router\";\nconst FilterWrapper = styled.div.withConfig({\n    componentId: \"sc-b35ba665-0\"\n})(_templateObject(), themeGet(\"border.1\", \"#E8E8EA\"), themeGet(\"border.1\", \"#E8E8EA\"), themeGet(\"background.0\", \"#FDFDFF\"));\nconst FilterHeader = styled.div.withConfig({\n    componentId: \"sc-b35ba665-1\"\n})(_templateObject1(), themeGet(\"border.1\", \"#E8E8EA\"));\nconst FilterMobileHeader = styled.div.withConfig({\n    componentId: \"sc-b35ba665-2\"\n})(_templateObject2());\nconst FilterSectionTitle = styled.p.withConfig({\n    componentId: \"sc-b35ba665-3\"\n})(_templateObject3(), themeGet(\"text.0\", \"#1B1B29\"));\nconst FilterMenuItem = styled.ul.withConfig({\n    componentId: \"sc-b35ba665-4\"\n})(_templateObject4(), themeGet(\"primary.0\", \"#002FA8\"));\nconst menuFilters = [\n    {\n        label: \"수업자료\",\n        value: \"1\",\n        path: CATEGORY_HANDOUT_PAGE\n    },\n    {\n        label: \"교과서\",\n        value: \"2\",\n        path: CATEGORY_TEXTBOOK_PAGE\n    },\n    {\n        label: \"참고서\",\n        value: \"3\",\n        path: CATEGORY_WORKBOOK_PAGE\n    }\n];\nconst SearchResultFilterWrapper = styled.div.withConfig({\n    componentId: \"sc-b35ba665-5\"\n})(_templateObject5(), themeGet(\"border.1\", \"#E8E8EA\"));\nexport const renderFilterName = (name)=>{\n    let renderString;\n    switch(name){\n        case \"curriculum\":\n            renderString = \"학년\";\n            break;\n        case \"subject\":\n            renderString = \"과목\";\n            break;\n        case \"publisher\":\n            renderString = \"출판사\";\n            break;\n        case \"license\":\n            renderString = \"라이선스\";\n            break;\n        case \"based_textbook\":\n            renderString = \"출처 교과서\";\n            break;\n        case \"based_workbook\":\n            renderString = \"출처 참고서\";\n            break;\n        case \"unit\":\n            renderString = \"단원/UNIT\";\n            break;\n        case \"handout_category\":\n            renderString = \"수업자료 유형\";\n            break;\n        case \"author\":\n            renderString = \"수업자료 브랜드\";\n            break;\n        default:\n            renderString = \"\";\n            break;\n    }\n    return renderString;\n};\nexport const SearchResultFilter = observer((param)=>{\n    let { dataSource , onShowModal , onShowMobileFilter , onReset , selectedItems , onChangeFilterItems , deleteItem , resetFilter , maxShowItemNum =3  } = param;\n    const router = useRouter();\n    const { asPath  } = router;\n    return /*#__PURE__*/ _jsxs(SearchResultFilterWrapper, {\n        children: [\n            /*#__PURE__*/ _jsxs(FilterHeader, {\n                children: [\n                    /*#__PURE__*/ _jsx(FilterSectionTitle, {\n                        children: \"필터\"\n                    }),\n                    /*#__PURE__*/ _jsx(Button, {\n                        className: \"reset-btn\",\n                        onClick: onReset,\n                        type: \"text\",\n                        icon: /*#__PURE__*/ _jsx(Image, {\n                            src: \"/static/assets/icon_reset.svg\",\n                            alt: \"초기화\",\n                            width: 16,\n                            height: 16\n                        }),\n                        children: \"초기화\"\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(FilterMobileHeader, {\n                children: /*#__PURE__*/ _jsx(Button, {\n                    type: \"text\",\n                    icon: /*#__PURE__*/ _jsx(Image, {\n                        src: \"/static/assets/icon_close_m.svg\",\n                        alt: \"닫기\",\n                        width: 24,\n                        height: 24\n                    }),\n                    onClick: onShowMobileFilter\n                })\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"filter-content-box\",\n                children: [\n                    /*#__PURE__*/ _jsxs(FilterWrapper, {\n                        children: [\n                            /*#__PURE__*/ _jsx(FilterSectionTitle, {\n                                children: \"카테고리\"\n                            }),\n                            /*#__PURE__*/ _jsx(FilterMenuItem, {\n                                children: menuFilters && menuFilters.map((item, idx)=>/*#__PURE__*/ _jsx(\"li\", {\n                                        children: /*#__PURE__*/ _jsx(ActiveLink, {\n                                            className: includesPath(asPath, item.path) ? \"active-link active\" : \"active-link\",\n                                            href: \"\".concat(item.path),\n                                            children: /*#__PURE__*/ _jsx(\"div\", {\n                                                children: item.label\n                                            })\n                                        })\n                                    }, \"filter_\" + idx))\n                            })\n                        ]\n                    }),\n                    dataSource && /*#__PURE__*/ _jsx(FilterWrapper, {\n                        className: \"scroll\",\n                        children: Object.keys(dataSource).map((filterKey, idx)=>{\n                            const tempList = dataSource[filterKey];\n                            const uid = nanoid();\n                            return /*#__PURE__*/ _jsxs(\"div\", {\n                                className: \"check-area\",\n                                children: [\n                                    /*#__PURE__*/ _jsx(FilterSectionTitle, {\n                                        children: renderFilterName(filterKey)\n                                    }),\n                                    /*#__PURE__*/ _jsx(SearchCheckbox, {\n                                        filterKey: filterKey,\n                                        options: tempList,\n                                        selectedItems: selectedItems,\n                                        onChange: onChangeFilterItems,\n                                        maxShowItemNum: maxShowItemNum\n                                    })\n                                ]\n                            }, \"category_\" + uid);\n                        })\n                    })\n                ]\n            })\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  flex-direction: row;\\n  justify-content: space-between;\\n  align-items: center;\\n  padding-bottom: 16px;\\n  border-bottom: solid 2px #1b1b29;\\n\\n  .ant-btn {\\n    width: 160px;\\n    height: 48px;\\n    box-shadow: 0 4px 4px 0 rgba(51, 114, 117, 0.2);\\n    border-radius: 2px;\\n    background-color: #002fa8;\\n\\n    &:hover {\\n      background-color: #113ac3;\\n    }\\n\\n    span {\\n      display: block;\\n      font-size: 16px;\\n      font-weight: bold;\\n      color: #fff;\\n    }\\n  }\\n\\n  @media (max-width: 1200px) {\\n    display: none;\\n  }\\n  @media (max-width: 768px) {\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nfunction _templateObject1() {\n    const data = _tagged_template_literal([\n        \"\\n  span {\\n    font-size: 24px;\\n    font-weight: bold;\\n    letter-spacing: -0.25px;\\n  }\\n\\n  .searchKeyword {\\n    display: inline-block;\\n    vertical-align: baseline;\\n    color: #002fa8;\\n  }\\n\\n  .searchResult {\\n    line-height: 1.5;\\n    margin-left: 4px;\\n    margin-right: 8px;\\n  }\\n\\n  .searchResultValue {\\n    font-size: 16px;\\n    color: rgba(27, 27, 41, 0.3);\\n  }\\n\\n  .searchNumber {\\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 React from \"react\";\nimport styled from \"styled-components\";\nimport { Popconfirm } from \"antd\";\nimport { observer } from \"mobx-react-lite\";\nimport { RightOutlined } from \"@ant-design/icons\";\nimport { useRouter } from \"next/router\";\nexport const SearchResultHeader = observer((param)=>{\n    let { keyword , total , onCart , goToCart , isModalOpen  } = param;\n    const handleOnCart = ()=>{\n        if (onCart) {\n            onCart();\n        }\n    };\n    const router = useRouter();\n    // 수업자료일 때는 [수업자료 총 #건]\n    // 교과서일 때는 [교과서 라이선스 총 #건]\n    // 참고서일 때는 [참고서 라이선스 총 #건]\n    const renderType = ()=>{\n        let renderString;\n        const query = router.query;\n        switch(query.slug){\n            case \"textbook\":\n                renderString = \"교과서\";\n                break;\n            case \"handout\":\n                renderString = \"수업자료\";\n                break;\n            case \"workbook\":\n                renderString = \"참고서\";\n                break;\n            default:\n                renderString = \"검색결과\";\n        }\n        return renderString;\n    };\n    return /*#__PURE__*/ _jsxs(HeaderWrapper, {\n        children: [\n            /*#__PURE__*/ _jsxs(SearchTitle, {\n                children: [\n                    keyword && keyword !== \"\" ? /*#__PURE__*/ _jsxs(_Fragment, {\n                        children: [\n                            /*#__PURE__*/ _jsxs(\"span\", {\n                                className: \"searchKeyword\",\n                                children: [\n                                    \"'\",\n                                    keyword,\n                                    \"'\"\n                                ]\n                            }),\n                            /*#__PURE__*/ _jsx(\"span\", {\n                                className: \"searchResult\",\n                                children: \"검색 결과\"\n                            })\n                        ]\n                    }) : /*#__PURE__*/ _jsx(_Fragment, {\n                        children: /*#__PURE__*/ _jsx(\"span\", {\n                            className: \"searchResult\",\n                            children: renderType()\n                        })\n                    }),\n                    /*#__PURE__*/ _jsxs(\"span\", {\n                        className: \"searchResultValue\",\n                        children: [\n                            \"총 \",\n                            total,\n                            \"건\"\n                        ]\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsx(Popconfirm, {\n                title: \"장바구니에 담았습니다.\",\n                // open={addToCart}\n                open: isModalOpen,\n                onConfirm: goToCart,\n                okButtonProps: {\n                    icon: /*#__PURE__*/ _jsx(RightOutlined, {}),\n                    style: {\n                        display: \"flex\",\n                        flexDirection: \"row-reverse\",\n                        alignItems: \"center\",\n                        color: \"black\",\n                        backgroundColor: \"white\"\n                    }\n                },\n                cancelButtonProps: {\n                    style: {\n                        display: \"none\"\n                    }\n                },\n                cancelText: null,\n                okText: \"장바구니로 가기\"\n            })\n        ]\n    });\n});\nconst HeaderWrapper = styled.div.withConfig({\n    componentId: \"sc-5d53c0a1-0\"\n})(_templateObject());\nconst SearchTitle = styled.div.withConfig({\n    componentId: \"sc-5d53c0a1-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  &,\\n  &.ant-select-single:not(.ant-select-customize-input) {\\n    width: 136px;\\n\\n    .ant-select-selector,\\n    .ant-input {\\n      height: 42px;\\n      border: 0;\\n      border-radius: 0;\\n    }\\n\\n    .ant-select-selector {\\n      padding: 0 16px 0 14px;\\n      background-color: transparent;\\n\\n      .ant-select-selection-item {\\n        font-size: 14px;\\n        font-weight: 500;\\n        color: #1b1b29;\\n        line-height: 42px;\\n        padding: 0;\\n\\n        @media (max-width: 768px) {\\n          font-size: 14px;\\n        }\\n      }\\n    }\\n\\n    .ant-select-arrow {\\n      inset-inline-end: 0;\\n\\n      span {\\n        &:before {\\n          display: block;\\n          content: '';\\n          width: 0;\\n          height: 0;\\n          border-left: 4px solid transparent;\\n          border-right: 4px solid transparent;\\n          border-top: 4px solid #1b1b29;\\n        }\\n\\n        svg {\\n          display: none;\\n        }\\n      }\\n    }\\n  }\\n\"\n    ]);\n    _templateObject = function() {\n        return data;\n    };\n    return data;\n}\nimport styled from \"styled-components\";\nimport { Select } from \"antd\";\nexport const SmallTypeSelect = styled(Select).withConfig({\n    componentId: \"sc-b2758e07-0\"\n})(_templateObject());\n","import { Page } from \"@/lib/pagination\";\nimport { useLocalObservable } from \"mobx-react-lite\";\nimport { useRef } from \"react\";\nexport const ProductModel = (props)=>{\n    return {\n        filters: props.filters || [],\n        products: props.products || [],\n        product: props.product || {},\n        pagination: Page({}),\n        updateProducts (products) {\n            this.products = products;\n        },\n        updateProduct (product) {\n            this.products = this.products.map((item)=>{\n                if (product.id === item.id) {\n                    return {\n                        ...item,\n                        ...product\n                    };\n                }\n                return item;\n            });\n            this.product = product;\n        },\n        addProducts (products) {\n            if (products.pagination && products.products) {\n                const { total , limit , offset  } = products.pagination;\n                if (total / (offset + limit) > 1) {\n                    this.pagination = Page(products.pagination);\n                } else {\n                    this.pagination = Page({\n                        ...products.pagination,\n                        offset: total\n                    });\n                }\n                const newProduct = products.products.filter((task)=>{\n                    return !!(task === null || task === void 0 ? void 0 : task.id);\n                }).map((x)=>x);\n                this.products = [\n                    ...this.products,\n                    ...newProduct\n                ];\n            }\n        },\n        update (products) {\n            this.pagination = Page((products === null || products === void 0 ? void 0 : products.pagination) || {});\n            this.products = (products === null || products === void 0 ? void 0 : products.products) || [];\n        },\n        get last () {\n            if (this.products.length > 0) {\n                return this.products[this.products.length - 1];\n            } else {\n                return null;\n            }\n        }\n    };\n};\nexport const useProductModelStore = (props)=>{\n    return useLocalObservable(()=>ProductModel(props));\n};\nexport const createProductStore = function() {\n    let props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};\n    const stores = useRef({\n        products: useProductModelStore(props)\n    });\n    return stores.current;\n};\n","export class AddItemToCartCommand {\n    execute(_, dto) {\n        const url = \"/carts/current/items\";\n        return this.apiService.fetch(url, {\n            method: \"POST\",\n            data: dto\n        }).then((res)=>res.data);\n    }\n    constructor(apiService){\n        this.apiService = apiService;\n    }\n}\n","export class GetFiltersCommand {\n    execute(any) {\n        const url = \"/products/old_filters\";\n        return this.apiService.fetch(url, {}).then((res)=>res.data);\n    }\n    constructor(apiService){\n        this.apiService = apiService;\n    }\n}\n","// function isEmpty(obj: any): boolean {\n// \treturn (\n// \t\tobj === null ||\n// \t\tobj === undefined ||\n// \t\t(obj.length !== undefined && obj.length === 0) ||\n// \t\tObject.keys(obj).length === 0\n// \t)\n// }\n//\n// export default isEmpty\n/**\n * Has own property.\n *\n * @type {Function}\n */ const has = Object.prototype.hasOwnProperty;\n/**\n * To string.\n *\n * @type {Function}\n */ // @ts-ignore\nconst toString = Object.prototype.toString // eslint-disable-line\n;\n/**\n * Test whether a value is \"empty\".\n *\n * @param {Mixed} val\n * @return {Boolean}\n */ export function isEmpty(val) {\n    // Null and Undefined...\n    if (val == null) return true;\n    // Booleans...\n    if (typeof val === \"boolean\") return false;\n    // Numbers...\n    if (typeof val === \"number\") return val === 0;\n    // Strings...\n    if (typeof val === \"string\") return val.length === 0;\n    // Functions...\n    if (typeof val === \"function\") return val.length === 0;\n    // Arrays...\n    if (Array.isArray(val)) return val.length === 0;\n    // Errors...\n    if (val instanceof Error) return val.message === \"\";\n    // Objects...\n    if (val.toString === toString) {\n        switch(val.toString() // eslint-disable-line\n        ){\n            // Maps, Sets, Files and Errors...\n            case \"[object File]\":\n            case \"[object Map]\":\n            case \"[object Set]\":\n                {\n                    return val.size === 0;\n                }\n            // Plain objects...\n            case \"[object Object]\":\n                {\n                    for(const key in val){\n                        // eslint-disable-line\n                        if (has.call(val, key)) return false;\n                    }\n                    return true;\n                }\n        }\n    }\n    // Anything else...\n    return false;\n}\n","import { isImmutable } from \"./isImmutable\";\nimport { isEmpty } from \"./isEmpty\";\nexport function isTruthy(val) {\n    if (typeof val === \"boolean\" && !val) {\n        return false;\n    }\n    if (isEmpty(val)) {\n        return false;\n    }\n    if (isImmutable(val)) {\n        if (isEmpty(val.toJS())) {\n            return false;\n        }\n    }\n    return true;\n}\n","import { isTruthy } from \"./isTruthy\";\nexport function isFalsy(val) {\n    return !isTruthy(val);\n}\n","export * from \"./isEmpty\";\nexport * from \"./isFalsy\";\nexport * from \"./isImmutable\";\nexport * from \"./isTruthy\";\n","import { isEmpty } from \"@/lib/helpers\";\nexport class GetProductsCommand {\n    async execute(dto) {\n        const url = \"/products\";\n        const params = new URLSearchParams();\n        Object.keys(dto).forEach((key)=>{\n            if (dto[key] !== undefined) {\n                if (dto[key] instanceof Array) {\n                    dto[key].forEach((value)=>{\n                        if (!isEmpty(value)) {\n                            params.append(key, value);\n                        }\n                    });\n                } else {\n                    if (!isEmpty(dto[key])) {\n                        params.append(key, dto[key]);\n                    }\n                }\n            }\n        });\n        // if (category) {\n        // \tparams.set('category', category)\n        // }\n        //\n        // if (offset != undefined) {\n        // \tparams.set('offset', offset.toString())\n        // }\n        //\n        // if (limit != undefined) {\n        // \tparams.set('limit', limit.toString())\n        // }\n        // if (filter != undefined) {\n        // \tparams.set('filter', filter)\n        // }\n        //\n        // if (q != undefined) {\n        // \tparams.set('q', q)\n        // }\n        try {\n            const response = await this.apiService.fetch(url, {\n                params\n            });\n            if (this.productStore) {\n                const { products: { products , pagination  }  } = response.data;\n                // const converted = products.map((raw) => toProductFromServer(raw))\n                // console.log('converted', converted)\n                this.productStore.products.update({\n                    products: products,\n                    pagination: pagination\n                });\n            }\n            return response.data;\n        } catch (e) {\n            return null;\n        // if (isAxiosError(e)) {\n        // \tconst axiosError = e as AxiosError<GetProductListCommandError>\n        // \tconsole.error('axiosError', axiosError.message)\n        //\n        // \treturn {\n        // \t\terrors: [axiosError.response.data.message],\n        // \t\tresultCode: 500,\n        // \t\tsuccess: false,\n        // \t}\n        // }\n        }\n    }\n    constructor(apiService, productStore){\n        this.apiService = apiService;\n        this.productStore = productStore;\n    }\n}\n","import { gaViewItemList } from \"@/lib/ga4\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { deleteParamWithRouterEvent, Page, useUpdateRouterHistory } from \"@/lib/pagination\";\nimport { getUrlStringToParams } from \"@/lib/utils/url\";\nimport { LOGIN_PAGE, SHOP_CART_PAGE } from \"@/settings/constant\";\nimport { nanoid } from \"@bookips/nanoid\";\nimport { Modal } from \"antd\";\nimport { debounce } from \"debounce\";\nimport { runInAction, toJS } from \"mobx\";\nimport { useLocalObservable } from \"mobx-react-lite\";\nimport { useEffect, useMemo } from \"react\";\nimport { toQueryString } from \"src/utils/misc\";\nimport { AddItemToCartCommand } from \"../commands/AddItemToCartCommand\";\nimport { GetFiltersCommand } from \"../commands/getFiltersCommand\";\nimport { GetProductsCommand } from \"../commands/getProductsCommand\";\nconst toProductListItemFromProduct = (product)=>{\n    return {\n        id: product.id,\n        title: product.title,\n        product\n    };\n};\nconst allowedFilterKey = [\n    \"q\",\n    \"author\",\n    \"publisher\",\n    \"subject\",\n    \"curriculum\",\n    \"grade\",\n    \"based_textbook\",\n    \"based_workbook\",\n    \"unit\",\n    \"handout_category\"\n];\nconst isV1Url = (query)=>{\n    // https://www.solvook.com/market?type=resource&subject=EN&publisher=&grade=20&originType=%EB%B6%80%EA%B5%90%EC%9E%AC&author=%EC%9D%B4%ED%81%B4%EB%9D%BC%EC%9A%B0%EB%93%9C&series=%EC%88%98%EB%8A%A5%EB%A7%8C%EB%A7%8C%20%EC%8B%9C%EB%A6%AC%EC%A6%88%20%5B%EB%8A%A5%EB%A5%A0%5D&origin=23389&subtype=%EC%9B%8C%ED%81%AC%EB%B6%81&unit=&sort=name&order=descend&keyword=%EC%88%98%EB%8A%A5%EB%A7%8C%EB%A7%8C%20%EA%B8%B0%EB%B3%B8\n    // type=resource&subject=EN&publisher=&grade\n    const v1Filters = [\n        \"subtype\",\n        \"order\",\n        \"type\",\n        \"originType\",\n        \"origin\",\n        \"series\",\n        \"keyword\"\n    ];\n    return Object.keys(query).some((key)=>v1Filters.includes(key));\n};\nconst convertV1UrlToV2 = (query)=>{\n    const isV1 = isV1Url(query);\n    const keys = Object.keys(query);\n    if (isV1) {\n        // @ts-ignore\n        const { keyword , author , ...rest } = query;\n        let nextQuery = {};\n        if (author && author !== \"\") {\n            nextQuery = {\n                ...nextQuery,\n                author\n            };\n        }\n        if (keyword && keyword !== \"\") {\n            nextQuery = {\n                ...nextQuery,\n                q: keyword\n            };\n        }\n        return nextQuery;\n    } else {\n        if (keys.includes(\"grade\")) {\n            delete query[\"grade\"];\n        }\n        if (keys.includes(\"sort\")) {\n            if (query[\"sort\"] === \"updated\") {\n                delete query[\"sort\"];\n            }\n        }\n        return Object.entries(query).filter((param)=>{\n            let [key, value] = param;\n            if (typeof value === \"string\") {\n                return value !== \"\";\n            } else {\n                return true;\n            }\n        }).reduce((acc, param)=>{\n            let [key, value] = param;\n            acc[key] = value;\n            return acc;\n        }, {});\n    }\n};\nexport const ProductListViewModel = (param)=>{\n    let { apiService , config , router , rootStore , products , useNewPlan , useParsingBadge  } = param;\n    const q = router.query.q || router.query.keyword || \"\";\n    const defaultPageLimit = (config === null || config === void 0 ? void 0 : config.defaultPageLimit) || 10;\n    let routerHistory = useUpdateRouterHistory({\n        router,\n        defaultPageLimit\n    });\n    const getProductListCommand = useMemo(()=>new GetProductsCommand(apiService, rootStore), [\n        apiService,\n        rootStore\n    ]);\n    const getFilterCommand = useMemo(()=>new GetFiltersCommand(apiService), [\n        apiService,\n        rootStore\n    ]);\n    const addItemToCartCommand = useMemo(()=>new AddItemToCartCommand(apiService), [\n        apiService\n    ]);\n    useEffect(()=>{\n        const updateCategoryByUrl = async (path, param)=>{\n            let { shallow  } = param;\n            if (shallow) return;\n            const getUrlToSlug = (path)=>{\n                const url = path.split(\"?\")[0];\n                const slug = url.split(\"/\").pop();\n                return slug;\n            };\n            const category = getUrlToSlug(path);\n            const urlStringToParams = getUrlStringToParams(path);\n            if (toJS(rootStore.products.pagination._offset) >= 0 && (urlStringToParams === null || urlStringToParams === void 0 ? void 0 : urlStringToParams.offset) && parseInt(urlStringToParams === null || urlStringToParams === void 0 ? void 0 : urlStringToParams.offset) !== toJS(rootStore.products.pagination._offset)) {\n                ;\n                await actions.fetchProducts({\n                    offset: urlStringToParams === null || urlStringToParams === void 0 ? void 0 : urlStringToParams.offset\n                });\n            }\n            if (category !== actions._category) {\n                actions._category = category;\n                actions._selectedFilters = {};\n                await actions.fetchProducts({\n                    category\n                });\n            }\n        };\n        router.events.on(\"routeChangeComplete\", updateCategoryByUrl);\n        return ()=>{\n            router.events.off(\"routeChangeComplete\", updateCategoryByUrl);\n        };\n    }, [\n        router\n    ]);\n    const actionFilterToQueryString = (filters)=>{\n        const filterQuery = Object.entries(filters).reduce((acc, param)=>{\n            let [key, value] = param;\n            if (Array.isArray(value) && value.length > 0) {\n                acc[key] = value.map((item)=>item.value).join(\",\");\n            }\n            return acc;\n        }, {});\n        return toQueryString(filterQuery, false);\n    };\n    const status = useLocalObservable(()=>({\n            addingItems: false,\n            errors: [],\n            initialized: false,\n            loading: false,\n            refreshing: false,\n            showModal: false,\n            showFilter: false,\n            filterItems: [],\n            deleteFilterItem: \"\",\n            allChecked: false,\n            isModalOpen: false,\n            resetFilter: false,\n            currentSelectedInBox: [],\n            currentModalIdx: 0,\n            sort: \"new\",\n            parsing: router.query.parsing === \"Y\" ? \"Y\" : \"N\",\n            useNewPlan,\n            useParsingBadge\n        }));\n    const actions = useLocalObservable(()=>{\n        var _router_query;\n        return {\n            _keyword: q || \"\",\n            _items: [],\n            _selectedItems: [],\n            paging: Page({\n                pageSize: defaultPageLimit\n            }),\n            _filters: {},\n            _selectedFilters: {},\n            _category: ((_router_query = router.query) === null || _router_query === void 0 ? void 0 : _router_query.slug) || \"\",\n            async invalidateQueryFilterFromRouter (query) {\n                const filterQuery = Object.keys(query);\n                if (filterQuery.length > 0) {\n                    const validatedFilter = filterQuery.filter((key)=>allowedFilterKey.includes(key)).sort();\n                    const newSelectedFilters = validatedFilter.reduce((acc, cur, idx)=>{\n                        var _query_cur;\n                        const currentQuery = query[cur];\n                        if (typeof currentQuery === \"string\" && ((_query_cur = query[cur]) === null || _query_cur === void 0 ? void 0 : _query_cur.includes(\",\"))) {\n                            // query 가 배열인 경우\n                            acc[cur] = query[cur].split(\",\").filter((item)=>item && item !== \"\").map((filter)=>{\n                                return {\n                                    id: nanoid(),\n                                    key: cur,\n                                    value: filter\n                                };\n                            });\n                        } else {\n                            if (query[cur] && query[cur] !== \"\") {\n                                const convertableKeys = [\n                                    \"handout_category\",\n                                    \"curriculum\",\n                                    \"subject\"\n                                ];\n                                if (actions.currentFilters && actions.currentFilters[cur] && convertableKeys.includes(cur)) {\n                                    const currentFilter = actions.currentFilters[cur];\n                                    let filterItem;\n                                    if (currentFilter && currentFilter.length > 0) {\n                                        if (typeof currentFilter[0] === \"string\") {\n                                            filterItem = currentFilter.find((item)=>item === query[cur]);\n                                        } else {\n                                            filterItem = currentFilter.find((item)=>item.value === query[cur]);\n                                        }\n                                    }\n                                    if (filterItem) {\n                                        acc[cur] = [\n                                            {\n                                                id: nanoid(),\n                                                ...filterItem,\n                                                key: cur\n                                            }\n                                        ];\n                                    } else {\n                                        acc[cur] = [\n                                            {\n                                                id: nanoid(),\n                                                key: cur,\n                                                value: query[cur]\n                                            }\n                                        ];\n                                    }\n                                } else {\n                                    acc[cur] = [\n                                        {\n                                            id: nanoid(),\n                                            key: cur,\n                                            value: query[cur]\n                                        }\n                                    ];\n                                }\n                            }\n                        }\n                        return acc;\n                    }, {});\n                    return Promise.resolve(newSelectedFilters);\n                } else {\n                    return Promise.resolve({});\n                }\n            },\n            async initialize (props) {\n                var _actions_items_, _actions_items__product, _actions_items_1, _actions_items__product1, _actions_items_2;\n                const category = router.query.slug || \"handout\";\n                const q = router.query.q || router.query.keyword || \"\";\n                actions._category = category;\n                const offset = Number(router.query.offset);\n                const limit = Number(router.query.limit);\n                await actions.fetchFilters(category);\n                actions._selectedFilters = await actions.invalidateQueryFilterFromRouter(router.query);\n                if (offset) {\n                    await actions.fetchProducts({\n                        q,\n                        category,\n                        offset,\n                        limit: limit !== null && limit !== void 0 ? limit : defaultPageLimit\n                    });\n                } else {\n                    await actions.fetchProducts({\n                        q,\n                        category,\n                        offset: 0,\n                        limit: defaultPageLimit\n                    });\n                }\n                Object.entries(router.query).map((param)=>{\n                    let [key, value] = param;\n                    routerHistory.updateFilterSearch(key, value);\n                });\n                if (rootStore === null || rootStore === void 0 ? void 0 : rootStore.products.pagination) {\n                    routerHistory.updatePagination(rootStore.products.pagination.offset, rootStore.products.pagination.limit);\n                }\n                status.currentSelectedInBox = [];\n                status.currentModalIdx = 0;\n                const items = [\n                    {\n                        item_id: (_actions_items_ = actions.items[0]) === null || _actions_items_ === void 0 ? void 0 : (_actions_items__product = _actions_items_.product) === null || _actions_items__product === void 0 ? void 0 : _actions_items__product.id,\n                        price: (_actions_items_1 = actions.items[0]) === null || _actions_items_1 === void 0 ? void 0 : (_actions_items__product1 = _actions_items_1.product) === null || _actions_items__product1 === void 0 ? void 0 : _actions_items__product1.price,\n                        item_category: (_actions_items_2 = actions.items[0]) === null || _actions_items_2 === void 0 ? void 0 : _actions_items_2.product.source_type\n                    }\n                ];\n                gaViewItemList({\n                    item_list_id: actions.category,\n                    item_list_name: actions.category,\n                    items\n                });\n                status.initialized = true;\n                status.loading = false;\n            },\n            dispose () {},\n            async fetchProducts () {\n                let dto = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {\n                    offset: 0,\n                    limit: defaultPageLimit\n                }, fetchMore = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;\n                const newParams = {\n                    q: this.keyword,\n                    offset: 0,\n                    limit: defaultPageLimit,\n                    category: this.category,\n                    sort: status.sort,\n                    parsing: status.parsing,\n                    ...dto\n                };\n                Object.entries(actions._selectedFilters).map((param)=>{\n                    let [key, value] = param;\n                    if (allowedFilterKey.includes(key)) {\n                        newParams[key] = value.map((item)=>item.value);\n                    }\n                });\n                try {\n                    runInAction(()=>{\n                        status.loading = true;\n                    });\n                    const response = await getProductListCommand.execute(newParams);\n                    // 딜레이 디버그용\n                    // await delay(1000)\n                    runInAction(()=>{\n                        status.loading = false;\n                    });\n                // actions.paging._total = response.products.pagination.total\n                } catch (e) {\n                    Modal.error({\n                        title: \"Error\",\n                        content: e.message\n                    });\n                }\n            },\n            async fetchFilters (slug) {\n                try {\n                    const response = await getFilterCommand.execute({});\n                    if (response.success) {\n                        runInAction(()=>{\n                            actions._filters = {\n                                ...response.filter\n                            };\n                        });\n                        return response.filter;\n                    }\n                } catch (e) {\n                    Modal.error({\n                        title: \"Error\",\n                        content: e.message\n                    });\n                }\n            },\n            async onPriceChange (product, variant) {},\n            async onResetFilter () {\n                actions._selectedFilters = {};\n                status.resetFilter = true;\n                await actions.fetchProducts({\n                    offset: 0,\n                    limit: defaultPageLimit\n                });\n                this.invalidateFilterQuery(actions._selectedFilters);\n                if (router.query.sort && status.sort || router.query.parsing && status.parsing) {\n                    if (router.query.sort && status.sort) routerHistory.updateFilterSearch(\"sort\", status.sort);\n                    if (router.query.parsing && status.parsing) routerHistory.updateFilterSearch(\"parsing\", status.parsing);\n                    routerHistory.invalidate();\n                }\n                status.resetFilter = false;\n            },\n            async onSorting (sort) {\n                status.sort = sort;\n                await actions.fetchProducts({\n                    offset: 0,\n                    limit: defaultPageLimit\n                });\n                routerHistory.updateFilterSearch(\"sort\", status.sort);\n            },\n            async onParsing (parsing) {\n                status.parsing = parsing;\n                await actions.fetchProducts({\n                    offset: 0,\n                    limit: defaultPageLimit\n                });\n                routerHistory.updatePagination(0);\n                routerHistory.updateFilterSearch(\"parsing\", status.parsing);\n                routerHistory.invalidate();\n                setTimeout(()=>{\n                    if (parsing === \"Y\") {\n                        mixpanelEvent(\"Search Filtered\", {\n                            \"Filter Location\": \"legacy\",\n                            \"Filter Category\": \"편집가능\",\n                            \"Filter Option Selected\": \"Y\",\n                            \"# of Results\": actions.getPagination()._total\n                        });\n                    }\n                }, 1000);\n            },\n            get selectedItems () {\n                return actions._selectedItems;\n            },\n            get items () {\n                var _rootStore_products;\n                return (products === null || products === void 0 ? void 0 : products.map(toProductListItemFromProduct)) || (rootStore === null || rootStore === void 0 ? void 0 : (_rootStore_products = rootStore.products) === null || _rootStore_products === void 0 ? void 0 : _rootStore_products.products.map(toProductListItemFromProduct)) || [];\n            },\n            get filters () {\n                return actions._filters;\n            },\n            get currentFilters () {\n                return actions.filters[actions.category];\n            },\n            get currentSelectedFilters () {\n                return actions._selectedFilters;\n            },\n            get searchState () {\n                return undefined;\n            },\n            get category () {\n                return actions._category;\n            },\n            getPagination () {\n                var _rootStore_products_pagination;\n                return (_rootStore_products_pagination = rootStore.products.pagination) !== null && _rootStore_products_pagination !== void 0 ? _rootStore_products_pagination : actions.paging;\n            },\n            async updatePageChange (pageIndex) {\n                var _rootStore_products;\n                const { offset , limit  } = (_rootStore_products = rootStore.products) === null || _rootStore_products === void 0 ? void 0 : _rootStore_products.pagination.next(pageIndex);\n                // await actions.fetchProducts({ offset, limit })\n                actions.paging._offset = offset;\n                routerHistory.updatePagination(offset, limit);\n                const filter = actionFilterToQueryString(toJS(actions._selectedFilters));\n                const pageInfo = toQueryString({\n                    offset,\n                    limit\n                }, false);\n                router.push(\"/category/\".concat(actions.category, \"?\").concat(filter ? \"\".concat(filter, \"&\") : \"\").concat(pageInfo));\n            },\n            setKeyword (keyword) {\n                actions._keyword = keyword;\n            },\n            get keyword () {\n                return actions._keyword;\n            },\n            //체크박스 선택한 애들 배열에 담기\n            get selected () {\n                return actions.selected;\n            },\n            async onItemClick (param) {\n                let { item , metadata  } = param;\n                alert(JSON.stringify(item));\n            },\n            invalidateFilterQuery (newValue) {\n                routerHistory.clearAllFilterSearch();\n                Object.entries(newValue).map((param)=>{\n                    let [key, value] = param;\n                    routerHistory.updateFilterSearch(key, value.map((item)=>item.value));\n                });\n                routerHistory.updateFilterSearch(\"slug\", actions.category);\n                routerHistory.invalidate();\n            },\n            async onChangeFilterItems (filter, items) {\n                var _actions__selectedFilters_filter, _actions__selectedFilters_filter1, _actions__selectedFilters_filter2;\n                //mixpanel\n                let addFilter = [];\n                let removeFilter = [];\n                let searchStatus = false;\n                let itemsArr = items === null || items === void 0 ? void 0 : items.map((item)=>item.value);\n                let selectedFiltersArr = (_actions__selectedFilters_filter = actions._selectedFilters[filter]) === null || _actions__selectedFilters_filter === void 0 ? void 0 : _actions__selectedFilters_filter.map((item)=>item.value);\n                if (!selectedFiltersArr) {\n                    searchStatus = true;\n                    addFilter = itemsArr;\n                } else if (((_actions__selectedFilters_filter1 = actions._selectedFilters[filter]) === null || _actions__selectedFilters_filter1 === void 0 ? void 0 : _actions__selectedFilters_filter1.length) > items.length) {\n                    //삭제\n                    removeFilter = selectedFiltersArr === null || selectedFiltersArr === void 0 ? void 0 : selectedFiltersArr.filter((x)=>!itemsArr.includes(x));\n                    searchStatus = false;\n                } else if (((_actions__selectedFilters_filter2 = actions._selectedFilters[filter]) === null || _actions__selectedFilters_filter2 === void 0 ? void 0 : _actions__selectedFilters_filter2.length) < items.length) {\n                    //추가\n                    addFilter = itemsArr.filter((x)=>!selectedFiltersArr.includes(x));\n                    searchStatus = true;\n                }\n                runInAction(()=>{\n                    actions._selectedFilters[filter] = items;\n                    if (items.length === 0) {\n                        delete actions._selectedFilters[filter];\n                    }\n                });\n                await actions.fetchProducts({});\n                routerHistory.updatePagination(0);\n                if (items.length > 0) {\n                    routerHistory.updateFilterSearch(filter, items.map((item)=>item.value));\n                    router.replace(\"/category/\".concat(actions.category, \"?\").concat(actionFilterToQueryString(toJS(actions._selectedFilters))));\n                // routerHistory.invalidate(undefined, true)\n                } else {\n                    routerHistory.deleteFilterSearch(filter);\n                    deleteParamWithRouterEvent(filter, router);\n                }\n                //mixpanel\n                setTimeout(()=>{\n                    if (searchStatus) {\n                        mixpanelEvent(\"Search Filtered\", {\n                            \"Filter Location\": \"legacy\",\n                            \"Filter Category\": filter,\n                            \"Filter Option Selected\": addFilter[0],\n                            \"# of Results\": actions.getPagination()._total\n                        });\n                    }\n                }, 1000);\n            },\n            async deleteFilterItem (item) {\n                const key = item.key;\n                runInAction(()=>{\n                    actions._selectedFilters[item.key] = actions._selectedFilters[key].filter((sub)=>sub.id !== item.id);\n                    if (actions._selectedFilters[key].length === 0) {\n                        delete actions._selectedFilters[key];\n                    }\n                });\n                router.replace(\"/category/\".concat(actions.category, \"?\").concat(actionFilterToQueryString(toJS(actions._selectedFilters))));\n                await actions.fetchProducts({});\n            },\n            onEmptyClick () {},\n            async onCart () {\n                if (actions.selectedItems.length === 0) {\n                    Modal.error({\n                        title: \"Error\",\n                        content: \"장바구니에 담을 상품을 선택해주세요\"\n                    });\n                    return;\n                }\n                try {\n                    // 베리언트 아이디를 selected item에서 갖고 있는다.\n                    // 장바구니 버튼을 클릭하면 넣어준다. variant id 를 넣어준다.\n                    for(let i = 0; i < actions._selectedItems.length; i++){\n                        const response = await addItemToCartCommand.execute(null, {\n                            product_id: actions._selectedItems[i].id,\n                            product_variant_id: actions._selectedItems[i].product.product_variants[0].id,\n                            quantity: 1\n                        });\n                        status.isModalOpen = true;\n                        setTimeout(()=>status.isModalOpen = false, 1500);\n                        if (response.success) {}\n                    }\n                } catch (e) {\n                    const loginModal = ()=>{\n                        const modal = Modal.success({\n                            title: \"로그인을 해주세요\",\n                            content: \"로그인페이지로 이동합니다.\"\n                        });\n                        setTimeout(()=>{\n                            modal.destroy();\n                        }, 3000);\n                    };\n                    loginModal();\n                    await (router === null || router === void 0 ? void 0 : router.push(LOGIN_PAGE));\n                } finally{}\n            },\n            onLoadMore: debounce(async ()=>{\n                status.addingItems = true;\n                try {} catch (e) {}\n                status.addingItems = false;\n            }, 300, true),\n            onShowModal (items, idx) {\n                status.showModal = !status.showModal;\n            },\n            onShowMobileFilter () {\n                status.showFilter = !status.showFilter;\n            },\n            //전체선택\n            onSelectAll (checked) {\n                status.allChecked = checked;\n                if (checked) {\n                //모든 체크박스의 checked를 true로\n                } else {\n                    actions._selectedItems = [];\n                //체크박스의 checked를 false로\n                }\n            },\n            //체크박스 선택\n            onChangeSelectedItems (checked, item) {\n                if (checked) {\n                    actions._selectedItems.push(item);\n                } else if (!checked) {\n                    actions._selectedItems = actions._selectedItems.filter((selectedItem)=>{\n                        return selectedItem.id !== item.id;\n                    });\n                }\n            },\n            //장바구니로 가기\n            goToCart () {\n                router === null || router === void 0 ? void 0 : router.push(SHOP_CART_PAGE);\n            },\n            onRefresh: debounce(async ()=>{\n                status.refreshing = true;\n                try {} catch (e) {}\n                status.refreshing = false;\n            }, 300, true)\n        };\n    });\n    useEffect(()=>{\n        actions._keyword = router.query.q;\n    }, [\n        router.query.q\n    ]);\n    useEffect(()=>{\n        actions.initialize({});\n    }, []);\n    useEffect(()=>{\n        mixpanelEvent(\"Product List Page Viewed\", {\n            \"Filter Location\": \"legacy\",\n            \"Product Category\": router.query.slug\n        });\n    }, [\n        router.query.slug\n    ]);\n    return useLocalObservable(()=>({\n            status,\n            actions\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    padding: 0 36px;\\n  }\\n  @media (max-width: 768px) {\\n    padding: 0 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  display: flex;\\n  flex-direction: row;\\n  justify-content: space-between;\\n  align-items: center;\\n  width: 100%;\\n  margin-bottom: 16px;\\n\\n  .title {\\n    font-size: 20px;\\n    font-weight: bold;\\n\\n    @media (max-width: 1200px) {\\n    }\\n    @media (max-width: 768px) {\\n      font-size: 16px;\\n    }\\n  }\\n\\n  .categoryName {\\n    font-size: 20px;\\n    font-weight: bold;\\n    color: \",\n        \";\\n\\n    .dataNumber {\\n      font-size: 16px;\\n      font-weight: bold;\\n      color: rgba(27, 27, 41, 0.3);\\n      margin-left: 8px;\\n\\n      @media (max-width: 1200px) {\\n      }\\n      @media (max-width: 768px) {\\n        font-size: 14px;\\n      }\\n    }\\n  }\\n\\n  .ant-btn {\\n    height: auto;\\n    padding: 0 16px;\\n    margin-right: -16px;\\n\\n    @media (hover: hover) {\\n      &:hover {\\n        opacity: 0.7;\\n      }\\n    }\\n\\n    span {\\n      vertical-align: middle;\\n      font-size: 16px;\\n      color: \",\n        \";\\n    }\\n\\n    .anticon {\\n      position: relative;\\n      display: inline-block;\\n      vertical-align: baseline;\\n      margin-left: 4px;\\n\\n      &:before {\\n        display: inline-block;\\n        content: '';\\n        vertical-align: middle;\\n        width: 16px;\\n        height: 16px;\\n        background: url('/static/assets/right_strong_black.svg') no-repeat center center;\\n        background-size: contain;\\n      }\\n\\n      svg {\\n        display: none;\\n      }\\n    }\\n\\n    @media (max-width: 1200px) {\\n      display: none;\\n    }\\n    @media (max-width: 768px) {\\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 React, { useCallback } from \"react\";\nimport styled from \"styled-components\";\nimport { Button } from \"antd\";\nimport { RightOutlined } from \"@ant-design/icons\";\nimport Link from \"next/link\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { useRouter } from \"next/router\";\nimport { PRODUCTS_HANDOUT_PAGE, PRODUCTS_TEXTBOOK_PAGE, PRODUCTS_WORKBOOK_PAGE } from \"@/settings/constant\";\nconst ProductSearchResultHeaderWrapper = styled.div.withConfig({\n    componentId: \"sc-ee10ff95-0\"\n})(_templateObject());\nconst ResultHeader = styled.div.withConfig({\n    componentId: \"sc-ee10ff95-1\"\n})(_templateObject1(), themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"text.0\", \"#1B1B29\"));\nexport const ProductSearchResultHeader = (param)=>{\n    let { title , count , onShowMore , goToUrl  } = param;\n    const router = useRouter();\n    const handleOnShowMore = useCallback(()=>{\n        if (title === \"수업자료\") {\n            router.push(PRODUCTS_HANDOUT_PAGE);\n        } else if (title === \"교과서\") {\n            router.push(PRODUCTS_WORKBOOK_PAGE);\n        } else if (title === \"참고서\") {\n            router.push(PRODUCTS_TEXTBOOK_PAGE);\n        }\n    }, [\n        onShowMore\n    ]);\n    return /*#__PURE__*/ _jsx(ProductSearchResultHeaderWrapper, {\n        children: /*#__PURE__*/ _jsxs(ResultHeader, {\n            children: [\n                /*#__PURE__*/ _jsxs(\"div\", {\n                    className: \"categoryName\",\n                    children: [\n                        /*#__PURE__*/ _jsx(\"span\", {\n                            className: \"title\",\n                            children: title\n                        }),\n                        /*#__PURE__*/ _jsxs(\"span\", {\n                            className: \"dataNumber\",\n                            children: [\n                                count,\n                                \"건\"\n                            ]\n                        })\n                    ]\n                }),\n                goToUrl ? /*#__PURE__*/ _jsx(Link, {\n                    href: goToUrl,\n                    passHref: true,\n                    legacyBehavior: true,\n                    children: /*#__PURE__*/ _jsxs(Button, {\n                        type: \"link\",\n                        // size={'small'}\n                        // icon={<RightOutlined />}\n                        onClick: handleOnShowMore,\n                        children: [\n                            \"더보기\",\n                            /*#__PURE__*/ _jsx(RightOutlined, {})\n                        ]\n                    })\n                }) : /*#__PURE__*/ _jsxs(Button, {\n                    type: \"link\",\n                    // size={'small'}\n                    // icon={<RightOutlined />}\n                    onClick: handleOnShowMore,\n                    children: [\n                        \"더보기\",\n                        /*#__PURE__*/ _jsx(RightOutlined, {})\n                    ]\n                })\n            ]\n        })\n    });\n};\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { observer } from \"mobx-react-lite\";\nimport { ProductSearchResultHeader } from \"./ProductSearchResultHeader\";\nimport { ProductList } from \"./ProductList\";\nimport React from \"react\";\nimport { CATEGORY_HANDOUT_PAGE, CATEGORY_TEXTBOOK_PAGE, CATEGORY_WORKBOOK_PAGE } from \"@/settings/constant\";\nimport { ProductUnifiedSearchResultWrapper } from \"@/modules/products/components/ProductTypeSearchResult\";\nimport { Menu } from \"antd\";\nimport { ActiveLink } from \"@/components/ActiveLink\";\nexport const ProductUnifiedSearchResult = observer((param)=>{\n    let { keywords , onItemClick , onEmptyClick , onPriceChange  } = param;\n    return /*#__PURE__*/ _jsxs(ProductUnifiedSearchResultWrapper, {\n        children: [\n            /*#__PURE__*/ _jsxs(Menu, {\n                mode: \"horizontal\",\n                children: [\n                    /*#__PURE__*/ _jsx(Menu.Item, {\n                        children: /*#__PURE__*/ _jsx(ActiveLink, {\n                            href: \"\".concat(CATEGORY_HANDOUT_PAGE),\n                            children: \"수업자료\"\n                        })\n                    }, \"0\"),\n                    /*#__PURE__*/ _jsx(Menu.Item, {\n                        children: /*#__PURE__*/ _jsx(ActiveLink, {\n                            href: \"\".concat(CATEGORY_TEXTBOOK_PAGE),\n                            children: \"교과서\"\n                        })\n                    }, \"1\"),\n                    /*#__PURE__*/ _jsx(Menu.Item, {\n                        children: /*#__PURE__*/ _jsx(ActiveLink, {\n                            href: \"\".concat(CATEGORY_WORKBOOK_PAGE),\n                            children: \"참고서\"\n                        })\n                    }, \"2\")\n                ]\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"section\",\n                children: [\n                    /*#__PURE__*/ _jsx(ProductSearchResultHeader, {\n                        count: 0,\n                        goToUrl: CATEGORY_HANDOUT_PAGE,\n                        title: \"수업자료\"\n                    }),\n                    /*#__PURE__*/ _jsx(ProductList, {\n                        onPriceChange: onPriceChange,\n                        onClick: onItemClick,\n                        dataSource: [],\n                        onEmptyClick: onEmptyClick,\n                        // keyword={keywords}\n                        isAllList: true\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"section\",\n                children: [\n                    /*#__PURE__*/ _jsx(ProductSearchResultHeader, {\n                        count: 0,\n                        goToUrl: CATEGORY_TEXTBOOK_PAGE,\n                        title: \"교과서 라이선스\"\n                    }),\n                    /*#__PURE__*/ _jsx(ProductList, {\n                        onPriceChange: onPriceChange,\n                        onClick: onItemClick,\n                        dataSource: [],\n                        onEmptyClick: onEmptyClick,\n                        isAllList: true\n                    })\n                ]\n            }),\n            /*#__PURE__*/ _jsxs(\"div\", {\n                className: \"section\",\n                children: [\n                    /*#__PURE__*/ _jsx(ProductSearchResultHeader, {\n                        count: 0,\n                        goToUrl: CATEGORY_WORKBOOK_PAGE,\n                        title: \"참고서 라이선스\"\n                    }),\n                    /*#__PURE__*/ _jsx(ProductList, {\n                        onPriceChange: onPriceChange,\n                        onClick: onItemClick,\n                        dataSource: [],\n                        onEmptyClick: onEmptyClick,\n                        isAllList: true\n                    })\n                ]\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  & > .ant-row {\\n    @media (max-width: 1200px) {\\n      display: block;\\n      margin: 0 -16px !important;\\n    }\\n    @media (max-width: 768px) {\\n    }\\n\\n    .ant-col {\\n      &.filter-box {\\n        @media (max-width: 1200px) {\\n          display: none;\\n          position: fixed;\\n          top: 0;\\n          left: 0;\\n          right: 0;\\n          bottom: 0;\\n          flex: unset;\\n          width: 100vw;\\n          max-width: 100vw;\\n          padding: 0 !important;\\n          background-color: #fff;\\n          z-index: 3000;\\n\\n          &.show {\\n            display: block;\\n          }\\n        }\\n        @media (max-width: 768px) {\\n        }\\n      }\\n\\n      &.result-box {\\n        display: flex;\\n        flex-direction: column;\\n        justify-content: space-between;\\n\\n        @media (max-width: 1200px) {\\n          flex: unset;\\n          max-width: 100vw;\\n          width: 100vw;\\n          padding: 0 !important;\\n        }\\n        @media (max-width: 768px) {\\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: start;\\n  min-height: 48px;\\n  padding: 4px 0 12px;\\n  margin-bottom: 22px;\\n  background-color: \",\n        \";\\n  border-bottom: 1px solid \",\n        \";\\n\\n  @media (max-width: 1200px) {\\n    padding: 8px 24px;\\n    margin-top: -24px;\\n  }\\n  @media (max-width: 768px) {\\n    padding: 8px 16px;\\n    margin-top: 0;\\n  }\\n\\n  .text {\\n    font-size: 16px;\\n    margin-right: 16px;\\n\\n    &.w {\\n      min-width: 88px;\\n    }\\n\\n    &.m {\\n      display: none;\\n      margin-right: 0;\\n\\n      .ant-btn {\\n        padding: 0 16px;\\n        margin-left: -16px;\\n        border: none;\\n        background-color: transparent;\\n      }\\n    }\\n\\n    @media (max-width: 1200px) {\\n      &.w {\\n        display: none;\\n      }\\n      &.m {\\n        display: block;\\n      }\\n    }\\n    @media (max-width: 768px) {\\n      &.m {\\n        min-width: 50px;\\n      }\\n    }\\n\\n    img {\\n    }\\n  }\\n\\n  .current-filter-area {\\n    display: flex;\\n    gap: 8px;\\n    flex-wrap: wrap;\\n\\n    .ant-btn {\\n      display: flex;\\n      align-items: center;\\n      justify-content: center;\\n      padding: 0 8px;\\n      box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.03) !important;\\n\\n      span {\\n        font-size: 14px;\\n        font-weight: 600;\\n        color: rgba(27, 27, 27, 0.7);\\n        margin-right: 2px;\\n      }\\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 { useViewModel } from \"@/lib/viewModels\";\nimport { ProductListViewModel } from \"../viewModels/ProductListViewModel\";\nimport styled from \"styled-components\";\nimport { observer } from \"mobx-react-lite\";\nimport { useStores } from \"@/hooks/useStores\";\nimport React from \"react\";\nimport { useRouter } from \"next/router\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { SearchResultHeader } from \"../components/SearchResultHeader\";\nimport { Col, Row } from \"antd\";\nimport { SearchResultFilter } from \"../components/SearchResultFilter\";\nimport { DefaultLoadingContainer } from \"@/components/DefaultLoadingContainer\";\nimport { ProductUnifiedSearchResult } from \"../components/ProductUnifiedSearchResult\";\nimport { GenericPanelWithModal } from \"@/components/GenericPanel\";\nimport { ProductFilterBox } from \"../components/ProductFilterBox\";\nexport const ProductListViewWrapper = styled.div.withConfig({\n    componentId: \"sc-e0305ee7-0\"\n})(_templateObject());\nexport const SearchCurrentFilter = styled.div.withConfig({\n    componentId: \"sc-e0305ee7-1\"\n})(_templateObject1(), themeGet(\"background.0\", \"#FDFDFF\"), themeGet(\"border.1\", \"#E8E8EA\"));\nexport const ProductListView = observer((props)=>{\n    const productStore = useStores();\n    const router = useRouter();\n    const { status , actions  } = useViewModel({\n        rootStore: productStore,\n        router\n    }, ProductListViewModel);\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            !status.initialized && /*#__PURE__*/ _jsx(DefaultLoadingContainer, {\n                title: \"데이터를 불러오는 중입니다.\"\n            }),\n            status.initialized && /*#__PURE__*/ _jsxs(ProductListViewWrapper, {\n                children: [\n                    /*#__PURE__*/ _jsx(SearchResultHeader, {\n                        keyword: actions.keyword,\n                        total: actions.items.length,\n                        onCart: actions.onCart\n                    }),\n                    /*#__PURE__*/ _jsxs(Row, {\n                        gutter: 72,\n                        children: [\n                            /*#__PURE__*/ _jsx(Col, {\n                                span: 6,\n                                className: status.showFilter ? \"filter-box show\" : \"filter-box\",\n                                children: /*#__PURE__*/ _jsx(SearchResultFilter, {\n                                    dataSource: actions.currentFilters,\n                                    category: actions.category,\n                                    onShowModal: actions.onShowModal,\n                                    onShowMobileFilter: actions.onShowMobileFilter,\n                                    onReset: actions.onResetFilter,\n                                    selectedItems: actions.currentSelectedFilters,\n                                    onChangeFilterItems: actions.onChangeFilterItems,\n                                    deleteItem: status.deleteFilterItem\n                                })\n                            }),\n                            /*#__PURE__*/ _jsxs(Col, {\n                                span: 18,\n                                className: \"result-box\",\n                                children: [\n                                    status.loading ? /*#__PURE__*/ _jsx(DefaultLoadingContainer, {\n                                        title: \"데이터를 불러오는 중입니다.\"\n                                    }) : /*#__PURE__*/ _jsx(ProductUnifiedSearchResult, {\n                                        onPriceChange: actions.onPriceChange,\n                                        keywords: actions.keyword,\n                                        onItemClick: actions.onItemClick,\n                                        onEmptyClick: actions.onEmptyClick\n                                    }),\n                                    /*#__PURE__*/ _jsx(GenericPanelWithModal, {\n                                        title: \"단원/UNIT\",\n                                        closeIcon: true,\n                                        okText: \"확인\",\n                                        open: status.showModal,\n                                        cancelText: \"초기화\",\n                                        onClose: ()=>actions.onShowModal(null, null),\n                                        onOk: ()=>actions.onShowModal(null, null),\n                                        children: /*#__PURE__*/ _jsx(ProductFilterBox, {\n                                            idx: status.currentModalIdx,\n                                            filterItems: actions.currentSelectedFilters,\n                                            currentSelectedInBox: status.currentSelectedInBox,\n                                            updateFilterItem: actions.onChangeFilterItems,\n                                            deleteItem: status.deleteFilterItem\n                                        })\n                                    })\n                                ]\n                            })\n                        ]\n                    })\n                ]\n            })\n        ]\n    });\n});\n"],"names":[],"sourceRoot":""}