@anker-in/headless-ui 1.0.16-temp-09111 → 1.0.16-temp-09112

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,6 @@
1
1
  interface FilterListProps {
2
2
  onFilteredChange: (filtered: any, filter: any, opt: any) => void;
3
3
  onOpenOptions: (openOpt: any[]) => void;
4
- noShowList: any[];
5
4
  closeFilter: boolean;
6
5
  filtersPair: any[];
7
6
  filtered: any;
@@ -1,2 +1,2 @@
1
- "use strict";var M=Object.create;var h=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var z=(n,l)=>{for(var r in l)h(n,r,{get:l[r],enumerable:!0})},k=(n,l,r,p)=>{if(l&&typeof l=="object"||typeof l=="function")for(let m of A(l))!S.call(n,m)&&m!==r&&h(n,m,{get:()=>l[m],enumerable:!(p=P(l,m))||p.enumerable});return n};var T=(n,l,r)=>(r=n!=null?M(H(n)):{},k(l||!n||!n.__esModule?h(r,"default",{value:n,enumerable:!0}):r,n)),j=n=>k(h({},"__esModule",{value:!0}),n);var U={};z(U,{default:()=>F});module.exports=j(U);var e=require("react/jsx-runtime"),C=T(require("./component/AnimatedUL")),b=require("../../helpers/utils"),f=require("es-toolkit"),y=require("react"),D=require("react-responsive"),i=require("../../components/index.js");function F(n){const l=(0,D.useMediaQuery)({query:"(max-width: 768px)"}),{noShowList:r,filtersPair:p,closeFilter:m,filtered:O,openOptions:v,mobileDrawerVisible:L,onCloseDrawer:g,onFilteredChange:$,onOpenOptions:x}=n,B=(t,s,o,d)=>{const a=t.target,c=(0,f.cloneDeep)(O);let u=c?.[a.name]||[];a.checked?d==="checkbox"?u.push(a.value):u=[a.value]:(0,f.remove)(u,w=>w===a.value),c[a.name]=u,u.length<=0&&Reflect.deleteProperty(c,a.name),$?.({...c},s,o)},E=t=>{let s=v.concat();s.map(o=>o.label===t?o.show=!o.show:o),x(s)},N=()=>p?.length>0&&(0,e.jsx)("div",{className:"filter-list",children:p.map((t,s)=>{if(r?.indexOf?.(t?.value)>-1)return null;const d=v?.find?.(a=>a.label==t.label);return(0,e.jsxs)("div",{className:(0,b.cn)("mb-6 flex-1 overflow-hidden text-left duration-300 ease-in-out"),children:[(0,e.jsxs)("div",{onClick:()=>E(t.label),className:"relative flex items-center justify-between md-tablet:justify-center text-base font-bold cursor-pointer leading-none",children:[(0,e.jsx)("button",{className:"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border",children:(0,e.jsx)("span",{className:"pr-2 font-bold truncate",children:t.label})}),(0,e.jsx)("div",{className:`size-4 duration-300 ease-in-out ${d?.show&&"rotate-180"}`,children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon",children:(0,e.jsx)("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})})]}),(0,e.jsx)("div",{className:"transition-all duration-400 ease-in-out overflow-hidden",children:(0,e.jsx)(C.default,{className:"pt-5 transition-all duration-400 ease-in-out","data-label":t.label,isOpen:!!d?.show,children:t.options.map((a,c)=>{const u=t.type?t.type==="checkbox"?"checkbox":"radio":"checkbox";return(0,e.jsx)("li",{className:(0,b.cn)("w-full mb-3 box-border",{disabled:a?.count<=0,"mb-0":c>=t?.options?.length-1}),children:(0,e.jsxs)("label",{className:"flex items-center overflow-hidden box-border",htmlFor:`${t.value}-${c}`,children:[(0,e.jsx)("input",{type:u,name:t.value,value:a.value,id:`${t.value}-${c}`,disabled:a?.count<=0,checked:a.checked,className:"size-4 cursor-pointer accent-[#000000]",onChange:w=>B(w,t,a,u)}),(0,e.jsx)("p",{className:(0,b.cn)("pt-0.5 pl-3 inline-block cursor-pointer font-bold leading-none text-base"),children:a.label})]})},a.value)})})})]},`${t.label}${s}`)})});return(0,y.useEffect)(()=>{if(v?.length===0){let t=[];const s=document?.getElementsByClassName("pt-5 transition-all duration-400 ease-in-out");for(let o=0;o<s.length;o++){let d={};d.label=s[o]?.getAttribute("data-label"),d.show=l?!1:o<6,d.height=document?.getElementsByClassName("pt-5 transition-all duration-400 ease-in-out")?.[o]?.clientHeight,t.push(d)}x?.(t)}},[p]),(0,y.useEffect)(()=>{!l&&g(!1)},[l]),(0,e.jsxs)("div",{className:(0,b.cn)("transition-all duration-400 ease-in-out","desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:hidden","md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]",m?"md-tablet:pointer-events-auto md-tablet:opacity-100":"md-tablet:pointer-events-none md-tablet:opacity-0"),children:[(0,e.jsx)("div",{className:(0,b.cn)("transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full",m?"md-tablet:translate-y-0":"md-tablet:translate-y-[100%]"),children:N()}),(0,e.jsx)(i.Drawer,{open:L,onOpenChange:()=>g(!1),children:(0,e.jsxs)(i.DrawerContent,{className:"px-4 pb-4 max-h-[94.5vh] flex flex-col",children:[(0,e.jsx)(i.DrawerHeader,{className:"sticky top-0 inset-x-0 py-0 mb-6",children:(0,e.jsx)(i.DrawerTitle,{children:"Mobile Filter"})}),(0,e.jsx)("div",{className:"flex-1 overflow-y-auto",children:N()}),(0,e.jsx)(i.DrawerFooter,{className:"py-0 pt-4",children:(0,e.jsxs)("div",{className:(0,b.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2"),children:[(0,e.jsx)(i.Button,{variant:"secondary",className:"m-tablet:w-full",children:"Clear"}),(0,e.jsx)(i.Button,{variant:"primary",className:"m-tablet:w-full",children:"Apply"})]})})]})})]})}
1
+ "use strict";var E=Object.create;var f=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var z=(a,n)=>{for(var i in n)f(a,i,{get:n[i],enumerable:!0})},N=(a,n,i,u)=>{if(n&&typeof n=="object"||typeof n=="function")for(let m of P(n))!H.call(a,m)&&m!==i&&f(a,m,{get:()=>n[m],enumerable:!(u=M(n,m))||u.enumerable});return a};var T=(a,n,i)=>(i=a!=null?E(A(a)):{},N(n||!a||!a.__esModule?f(i,"default",{value:a,enumerable:!0}):i,a)),j=a=>N(f({},"__esModule",{value:!0}),a);var U={};z(U,{default:()=>D});module.exports=j(U);var e=require("react/jsx-runtime"),k=T(require("./component/AnimatedUL")),p=require("../../helpers/utils"),v=require("es-toolkit"),w=require("react"),C=require("react-responsive"),r=require("../../components/index.js");function D(a){const n=(0,C.useMediaQuery)({query:"(max-width: 768px)"}),{filtersPair:i,closeFilter:u,filtered:m,openOptions:h,mobileDrawerVisible:F,onCloseDrawer:y,onFilteredChange:O,onOpenOptions:g}=a,L=(t,d,o,l)=>{const s=t.target,c=(0,v.cloneDeep)(m);let b=c?.[s.name]||[];s.checked?l==="checkbox"?b.push(s.value):b=[s.value]:(0,v.remove)(b,B=>B===s.value),c[s.name]=b,b.length<=0&&Reflect.deleteProperty(c,s.name),O?.({...c},d,o)},$=t=>{let d=h.concat();d.map(o=>o.label===t?o.show=!o.show:o),g(d)},x=()=>i?.length>0&&(0,e.jsx)("div",{className:"filter-list",children:i.map((t,d)=>{const o=h?.find?.(l=>l.label==t.label);return(0,e.jsxs)("div",{className:(0,p.cn)("mb-6 flex-1 overflow-hidden text-left duration-300 ease-in-out"),children:[(0,e.jsxs)("div",{onClick:()=>$(t.label),className:"relative flex items-center justify-between md-tablet:justify-center text-base font-bold cursor-pointer leading-none",children:[(0,e.jsx)("button",{className:"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border",children:(0,e.jsx)("span",{className:"pr-2 font-bold truncate",children:t.label})}),(0,e.jsx)("div",{className:`size-4 duration-300 ease-in-out ${o?.show&&"rotate-180"}`,children:(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon",children:(0,e.jsx)("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})})]}),(0,e.jsx)("div",{className:"transition-all duration-400 ease-in-out overflow-hidden",children:(0,e.jsx)(k.default,{className:"pt-5 transition-all duration-400 ease-in-out","data-label":t.label,isOpen:!!o?.show,children:t.options.map((l,s)=>{const c=t.type?t.type==="checkbox"?"checkbox":"radio":"checkbox";return(0,e.jsx)("li",{className:(0,p.cn)("w-full mb-3 box-border",{disabled:l?.count<=0,"mb-0":s>=t?.options?.length-1}),children:(0,e.jsxs)("label",{className:"flex items-center overflow-hidden box-border",htmlFor:`${t.value}-${s}`,children:[(0,e.jsx)("input",{type:c,name:t.value,value:l.value,id:`${t.value}-${s}`,disabled:l?.count<=0,checked:l.checked,className:"size-4 cursor-pointer accent-[#000000]",onChange:b=>L(b,t,l,c)}),(0,e.jsx)("p",{className:(0,p.cn)("pt-0.5 pl-3 inline-block cursor-pointer font-bold leading-none text-base"),children:l.label})]})},l.value)})})})]},`${t.label}${d}`)})});return(0,w.useEffect)(()=>{if(h?.length===0){let t=[];const d=document?.getElementsByClassName("pt-5 transition-all duration-400 ease-in-out");for(let o=0;o<d.length;o++){let l={};l.label=d[o]?.getAttribute("data-label"),l.show=n?!1:o<6,l.height=document?.getElementsByClassName("pt-5 transition-all duration-400 ease-in-out")?.[o]?.clientHeight,t.push(l)}g?.(t)}},[i]),(0,w.useEffect)(()=>{!n&&y(!1)},[n]),(0,e.jsxs)("div",{className:(0,p.cn)("transition-all duration-400 ease-in-out","desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:hidden","md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]",u?"md-tablet:pointer-events-auto md-tablet:opacity-100":"md-tablet:pointer-events-none md-tablet:opacity-0"),children:[(0,e.jsx)("div",{className:(0,p.cn)("transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full",u?"md-tablet:translate-y-0":"md-tablet:translate-y-[100%]"),children:x()}),(0,e.jsx)(r.Drawer,{open:F,onOpenChange:()=>y(!1),children:(0,e.jsxs)(r.DrawerContent,{className:"px-4 pb-4 max-h-[94.5vh] flex flex-col",children:[(0,e.jsx)(r.DrawerHeader,{className:"sticky top-0 inset-x-0 py-0 mb-6",children:(0,e.jsx)(r.DrawerTitle,{children:"Mobile Filter"})}),(0,e.jsx)("div",{className:"flex-1 overflow-y-auto",children:x()}),(0,e.jsx)(r.DrawerFooter,{className:"py-0 pt-4",children:(0,e.jsxs)("div",{className:(0,p.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2"),children:[(0,e.jsx)(r.Button,{variant:"secondary",className:"m-tablet:w-full",children:"Clear"}),(0,e.jsx)(r.Button,{variant:"primary",className:"m-tablet:w-full",children:"Apply"})]})})]})})]})}
2
2
  //# sourceMappingURL=FilterList.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/CollectionsFilters/FilterList.tsx"],
4
- "sourcesContent": ["import AnimatedUL from './component/AnimatedUL'\nimport { cn } from '../../helpers/utils'\nimport type { ChangeEvent } from 'react'\nimport { remove, cloneDeep } from 'es-toolkit'\nimport { useEffect } from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport { Button, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerFooter } from '../../components/index.js'\n\ninterface FilterListProps {\n onFilteredChange: (filtered: any, filter: any, opt: any) => void\n onOpenOptions: (openOpt: any[]) => void\n noShowList: any[] // \u4E0D\u663E\u793A\u7684\u7B5B\u9009\u9879\n closeFilter: boolean // \u662F\u5426\u5173\u95ED\u7B5B\u9009\u9879\u5C55\u793A\n filtersPair: any[] // \u7B5B\u9009\u9879\n filtered: any // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n openOptions: any[] // \u5C55\u5F00\u7B5B\u9009\u9879\n mobileDrawerVisible: boolean\n onCloseDrawer: (closeDrawer: boolean) => void\n}\n\nexport default function FilterList(props: FilterListProps) {\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const {\n noShowList,\n filtersPair,\n closeFilter,\n filtered,\n openOptions,\n mobileDrawerVisible,\n onCloseDrawer,\n onFilteredChange,\n onOpenOptions,\n } = props\n\n const filterChange = (event: ChangeEvent<HTMLInputElement>, filter: any, opt: any, type: string) => {\n const target = event.target\n const clonefiltered = cloneDeep(filtered)\n let current = clonefiltered?.[target.name] || []\n if (target.checked) {\n type === 'checkbox' ? current.push(target.value) : current = [target.value]\n } else {\n remove(current, (v: string) => v === target.value)\n }\n clonefiltered[target.name] = current\n if (current.length <= 0) {\n Reflect.deleteProperty(clonefiltered, target.name)\n }\n onFilteredChange?.({ ...clonefiltered }, filter, opt)\n }\n\n const handleFilterOpt = (label: string) => {\n let res = openOptions.concat()\n res.map((item: any) => {\n if (item.label === label) return (item.show = !item.show)\n return item\n })\n onOpenOptions(res)\n }\n\n const MobileFilterList = () => {\n return (\n filtersPair?.length > 0 && (\n <div className=\"filter-list\">\n {filtersPair.map((filter: any, i: number) => {\n const isNoShow = noShowList?.indexOf?.(filter?.value) > -1\n if (isNoShow) return null\n const openOption = openOptions?.find?.((item: any) => item.label == filter.label) as any\n return (\n <div\n key={`${filter.label}${i}`}\n className={cn('mb-6 flex-1 overflow-hidden text-left duration-300 ease-in-out')}\n >\n <div\n onClick={() => handleFilterOpt(filter.label)}\n className={\n 'relative flex items-center justify-between md-tablet:justify-center text-base font-bold cursor-pointer leading-none'\n }\n >\n <button className=\"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border\">\n <span className=\"pr-2 font-bold truncate\">{filter.label}</span>\n </button>\n <div className={`size-4 duration-300 ease-in-out ${openOption?.show && 'rotate-180'}`}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n data-slot=\"icon\"\n >\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" />\n </svg>\n </div>\n </div>\n <div className={'transition-all duration-400 ease-in-out overflow-hidden'}>\n <AnimatedUL\n className={'pt-5 transition-all duration-400 ease-in-out'}\n data-label={filter.label}\n isOpen={!!openOption?.show}\n >\n {filter.options.map((opt: any, p: number) => {\n const type = filter.type ? (filter.type === 'checkbox' ? 'checkbox' : 'radio') : 'checkbox'\n return (\n <li\n key={opt.value}\n className={cn('w-full mb-3 box-border', {\n ['disabled']: opt?.count <= 0,\n 'mb-0': p >= filter?.options?.length - 1,\n })}\n >\n <label\n className=\"flex items-center overflow-hidden box-border\"\n htmlFor={`${filter.value}-${p}`}\n >\n <input\n type={type}\n name={filter.value}\n value={opt.value}\n id={`${filter.value}-${p}`}\n disabled={opt?.count <= 0}\n checked={opt.checked}\n className=\"size-4 cursor-pointer accent-[#000000]\"\n onChange={e => filterChange(e, filter, opt, type)}\n />\n <p\n className={cn('pt-0.5 pl-3 inline-block cursor-pointer font-bold leading-none text-base')}\n >\n {opt.label}\n </p>\n </label>\n </li>\n )\n })}\n </AnimatedUL>\n </div>\n </div>\n )\n })}\n </div>\n )\n )\n }\n\n useEffect(() => {\n if (openOptions?.length === 0) {\n let res = []\n const domList = document?.getElementsByClassName('pt-5 transition-all duration-400 ease-in-out')\n for (let index = 0; index < domList.length; index++) {\n let data = {} as any\n data.label = domList[index]?.getAttribute('data-label')\n data.show = isMobile ? false : index < 6 ? true : false\n data.height = document?.getElementsByClassName('pt-5 transition-all duration-400 ease-in-out')?.[\n index\n ]?.clientHeight\n res.push(data)\n }\n onOpenOptions?.(res)\n }\n }, [filtersPair])\n\n useEffect(() => {\n !isMobile && onCloseDrawer(false)\n }, [isMobile])\n\n return (\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out',\n 'desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:hidden',\n 'md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]',\n closeFilter\n ? 'md-tablet:pointer-events-auto md-tablet:opacity-100'\n : 'md-tablet:pointer-events-none md-tablet:opacity-0'\n )}\n >\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full',\n closeFilter ? 'md-tablet:translate-y-0' : 'md-tablet:translate-y-[100%]'\n )}\n >\n {MobileFilterList()}\n </div>\n <Drawer open={mobileDrawerVisible} onOpenChange={() => onCloseDrawer(false)}>\n <DrawerContent className=\"px-4 pb-4 max-h-[94.5vh] flex flex-col\">\n <DrawerHeader className=\"sticky top-0 inset-x-0 py-0 mb-6\">\n <DrawerTitle>Mobile Filter</DrawerTitle>\n </DrawerHeader>\n <div className=\"flex-1 overflow-y-auto\">\n {MobileFilterList()}\n </div>\n <DrawerFooter className=\"py-0 pt-4\">\n <div className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2')}>\n <Button variant=\"secondary\" className=\"m-tablet:w-full\">\n {'Clear'}\n </Button>\n <Button variant=\"primary\" className=\"m-tablet:w-full\">\n {'Apply'}\n </Button>\n </div>\n </DrawerFooter>\n </DrawerContent>\n </Drawer>\n </div>\n )\n}\n"],
5
- "mappings": "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",
6
- "names": ["FilterList_exports", "__export", "FilterList", "__toCommonJS", "import_jsx_runtime", "import_AnimatedUL", "import_utils", "import_es_toolkit", "import_react", "import_react_responsive", "import_components", "props", "isMobile", "noShowList", "filtersPair", "closeFilter", "filtered", "openOptions", "mobileDrawerVisible", "onCloseDrawer", "onFilteredChange", "onOpenOptions", "filterChange", "event", "filter", "opt", "type", "target", "clonefiltered", "current", "v", "handleFilterOpt", "label", "res", "item", "MobileFilterList", "i", "openOption", "AnimatedUL", "p", "e", "domList", "index", "data"]
4
+ "sourcesContent": ["import AnimatedUL from './component/AnimatedUL'\nimport { cn } from '../../helpers/utils'\nimport type { ChangeEvent } from 'react'\nimport { remove, cloneDeep } from 'es-toolkit'\nimport { useEffect } from 'react'\nimport { useMediaQuery } from 'react-responsive'\nimport { Button, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerFooter } from '../../components/index.js'\n\ninterface FilterListProps {\n onFilteredChange: (filtered: any, filter: any, opt: any) => void\n onOpenOptions: (openOpt: any[]) => void\n closeFilter: boolean // \u662F\u5426\u5173\u95ED\u7B5B\u9009\u9879\u5C55\u793A\n filtersPair: any[] // \u7B5B\u9009\u9879\n filtered: any // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n openOptions: any[] // \u5C55\u5F00\u7B5B\u9009\u9879\n mobileDrawerVisible: boolean\n onCloseDrawer: (closeDrawer: boolean) => void\n}\n\nexport default function FilterList(props: FilterListProps) {\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const {\n filtersPair,\n closeFilter,\n filtered,\n openOptions,\n mobileDrawerVisible,\n onCloseDrawer,\n onFilteredChange,\n onOpenOptions,\n } = props\n\n const filterChange = (event: ChangeEvent<HTMLInputElement>, filter: any, opt: any, type: string) => {\n const target = event.target\n const clonefiltered = cloneDeep(filtered)\n let current = clonefiltered?.[target.name] || []\n if (target.checked) {\n type === 'checkbox' ? current.push(target.value) : current = [target.value]\n } else {\n remove(current, (v: string) => v === target.value)\n }\n clonefiltered[target.name] = current\n if (current.length <= 0) {\n Reflect.deleteProperty(clonefiltered, target.name)\n }\n onFilteredChange?.({ ...clonefiltered }, filter, opt)\n }\n\n const handleFilterOpt = (label: string) => {\n let res = openOptions.concat()\n res.map((item: any) => {\n if (item.label === label) return (item.show = !item.show)\n return item\n })\n onOpenOptions(res)\n }\n\n const MobileFilterList = () => {\n return (\n filtersPair?.length > 0 && (\n <div className=\"filter-list\">\n {filtersPair.map((filter: any, i: number) => {\n const openOption = openOptions?.find?.((item: any) => item.label == filter.label) as any\n return (\n <div\n key={`${filter.label}${i}`}\n className={cn('mb-6 flex-1 overflow-hidden text-left duration-300 ease-in-out')}\n >\n <div\n onClick={() => handleFilterOpt(filter.label)}\n className={\n 'relative flex items-center justify-between md-tablet:justify-center text-base font-bold cursor-pointer leading-none'\n }\n >\n <button className=\"w-full whitespace-nowrap text-left font-medium overflow-hidden box-border\">\n <span className=\"pr-2 font-bold truncate\">{filter.label}</span>\n </button>\n <div className={`size-4 duration-300 ease-in-out ${openOption?.show && 'rotate-180'}`}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n data-slot=\"icon\"\n >\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" />\n </svg>\n </div>\n </div>\n <div className={'transition-all duration-400 ease-in-out overflow-hidden'}>\n <AnimatedUL\n className={'pt-5 transition-all duration-400 ease-in-out'}\n data-label={filter.label}\n isOpen={!!openOption?.show}\n >\n {filter.options.map((opt: any, p: number) => {\n const type = filter.type ? (filter.type === 'checkbox' ? 'checkbox' : 'radio') : 'checkbox'\n return (\n <li\n key={opt.value}\n className={cn('w-full mb-3 box-border', {\n ['disabled']: opt?.count <= 0,\n 'mb-0': p >= filter?.options?.length - 1,\n })}\n >\n <label\n className=\"flex items-center overflow-hidden box-border\"\n htmlFor={`${filter.value}-${p}`}\n >\n <input\n type={type}\n name={filter.value}\n value={opt.value}\n id={`${filter.value}-${p}`}\n disabled={opt?.count <= 0}\n checked={opt.checked}\n className=\"size-4 cursor-pointer accent-[#000000]\"\n onChange={e => filterChange(e, filter, opt, type)}\n />\n <p\n className={cn('pt-0.5 pl-3 inline-block cursor-pointer font-bold leading-none text-base')}\n >\n {opt.label}\n </p>\n </label>\n </li>\n )\n })}\n </AnimatedUL>\n </div>\n </div>\n )\n })}\n </div>\n )\n )\n }\n\n useEffect(() => {\n if (openOptions?.length === 0) {\n let res = []\n const domList = document?.getElementsByClassName('pt-5 transition-all duration-400 ease-in-out')\n for (let index = 0; index < domList.length; index++) {\n let data = {} as any\n data.label = domList[index]?.getAttribute('data-label')\n data.show = isMobile ? false : index < 6 ? true : false\n data.height = document?.getElementsByClassName('pt-5 transition-all duration-400 ease-in-out')?.[\n index\n ]?.clientHeight\n res.push(data)\n }\n onOpenOptions?.(res)\n }\n }, [filtersPair])\n\n useEffect(() => {\n !isMobile && onCloseDrawer(false)\n }, [isMobile])\n\n return (\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out',\n 'desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:hidden',\n 'md-tablet:fixed md-tablet:bottom-0 md-tablet:left-0 md-tablet:right-0 md-tablet:top-0 md-tablet:z-[99]',\n closeFilter\n ? 'md-tablet:pointer-events-auto md-tablet:opacity-100'\n : 'md-tablet:pointer-events-none md-tablet:opacity-0'\n )}\n >\n <div\n className={cn(\n 'transition-all duration-400 ease-in-out md-tablet:absolute md-tablet:bottom-0 md-tablet:h-[90vh] md-tablet:w-full',\n closeFilter ? 'md-tablet:translate-y-0' : 'md-tablet:translate-y-[100%]'\n )}\n >\n {MobileFilterList()}\n </div>\n <Drawer open={mobileDrawerVisible} onOpenChange={() => onCloseDrawer(false)}>\n <DrawerContent className=\"px-4 pb-4 max-h-[94.5vh] flex flex-col\">\n <DrawerHeader className=\"sticky top-0 inset-x-0 py-0 mb-6\">\n <DrawerTitle>Mobile Filter</DrawerTitle>\n </DrawerHeader>\n <div className=\"flex-1 overflow-y-auto\">\n {MobileFilterList()}\n </div>\n <DrawerFooter className=\"py-0 pt-4\">\n <div className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2')}>\n <Button variant=\"secondary\" className=\"m-tablet:w-full\">\n {'Clear'}\n </Button>\n <Button variant=\"primary\" className=\"m-tablet:w-full\">\n {'Apply'}\n </Button>\n </div>\n </DrawerFooter>\n </DrawerContent>\n </Drawer>\n </div>\n )\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["FilterList_exports", "__export", "FilterList", "__toCommonJS", "import_jsx_runtime", "import_AnimatedUL", "import_utils", "import_es_toolkit", "import_react", "import_react_responsive", "import_components", "props", "isMobile", "filtersPair", "closeFilter", "filtered", "openOptions", "mobileDrawerVisible", "onCloseDrawer", "onFilteredChange", "onOpenOptions", "filterChange", "event", "filter", "opt", "type", "target", "clonefiltered", "current", "v", "handleFilterOpt", "label", "res", "item", "MobileFilterList", "i", "openOption", "AnimatedUL", "p", "e", "domList", "index", "data"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var T=Object.create;var m=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var B=(e,o)=>{for(var l in o)m(e,l,{get:o[l],enumerable:!0})},x=(e,o,l,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of H(o))!A.call(e,r)&&r!==l&&m(e,r,{get:()=>o[r],enumerable:!(c=E(o,r))||c.enumerable});return e};var a=(e,o,l)=>(l=e!=null?T(q(e)):{},x(o||!e||!e.__esModule?m(l,"default",{value:e,enumerable:!0}):l,e)),G=e=>x(m({},"__esModule",{value:!0}),e);var J={};B(J,{default:()=>M});module.exports=G(J);var n=require("react/jsx-runtime"),t=require("react"),S=a(require("./FilterList")),O=a(require("./FilterHeader")),P=a(require("./FilterCardWrap")),D=a(require("./FilterCardWrapItem")),I=a(require("./FiterTab"));function M(e){const{filters:o,noShowList:l=[],metafields:c={},data:r=[]}=e,[d,N]=(0,t.useState)(!1),[V,g]=(0,t.useState)(!1),[k,K]=(0,t.useState)([]),[f,p]=(0,t.useState)({}),[L,R]=(0,t.useState)(0),[h,W]=(0,t.useState)(1),[u,F]=(0,t.useState)([]),C=(0,t.useRef)(18),w=(0,t.useRef)(!1),y=r?.length<=u?.length,v=(0,t.useMemo)(()=>o?.map?.(s=>({...s,options:s?.options?.map?.(i=>({...i,checked:f?.[s?.value]?.indexOf?.(i?.value)>-1}))})),[f,o]),z=()=>p?.({});return(0,t.useEffect)(()=>{if(!(r?.length<=0))if(!w.current)w.current=!0,F(r?.slice(0,C.current));else{const s=r?.slice?.(C.current,r?.length)||[];F([...u,...s])}},[r,h]),(0,n.jsxs)("div",{className:"size-full box-border",children:[(0,n.jsx)("div",{className:"mb-6",children:(0,n.jsx)(I.default,{filtered:f,filtersPair:v,onTabChange:p})}),(0,n.jsx)(O.default,{total:r?.length,metafields:c,closeFilter:d,sortKeyIndx:L,onSortChange:R,onCloseFilter:N,onClearFiltered:z,onMobileOpenDrawer:g}),(0,n.jsxs)("div",{className:"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8",children:[!d&&(0,n.jsx)(S.default,{filtered:f,noShowList:l,openOptions:k,filtersPair:v,closeFilter:d,mobileDrawerVisible:V,onFilteredChange:p,onOpenOptions:K,onCloseDrawer:g}),(0,n.jsx)("div",{className:"flex-1 overflow-y-auto",children:(0,n.jsx)(P.default,{closeFilter:d,isShowMore:y,onViewMoreChange:()=>{y||W(h+1)},children:u.map(s=>(0,n.jsx)(D.default,{data:s,onPrimaryChange:(i,b)=>console.log("e",i,b),onSecondaryChange:(i,b)=>console.log("e",i,b)},s.id))})})]})]})}
1
+ "use strict";var T=Object.create;var f=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var A=(e,t)=>{for(var n in t)f(e,n,{get:t[n],enumerable:!0})},w=(e,t,n,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of H(t))!q.call(e,s)&&s!==n&&f(e,s,{get:()=>t[s],enumerable:!(l=E(t,s))||l.enumerable});return e};var c=(e,t,n)=>(n=e!=null?T(L(e)):{},w(t||!e||!e.__esModule?f(n,"default",{value:e,enumerable:!0}):n,e)),B=e=>w(f({},"__esModule",{value:!0}),e);var G={};A(G,{default:()=>I});module.exports=B(G);var o=require("react/jsx-runtime"),r=require("react"),x=c(require("./FilterList")),O=c(require("./FilterHeader")),P=c(require("./FilterCardWrap")),S=c(require("./FilterCardWrapItem")),D=c(require("./FiterTab"));function I(e){const{filters:t,metafields:n={},data:l=[]}=e,[s,M]=(0,r.useState)(!1),[N,b]=(0,r.useState)(!1),[V,k]=(0,r.useState)([]),[d,m]=(0,r.useState)({}),[K,R]=(0,r.useState)(0),[F,W]=(0,r.useState)(1),[p,h]=(0,r.useState)([]),C=(0,r.useRef)(18),y=(0,r.useRef)(!1),v=l?.length<=p?.length,u=(0,r.useMemo)(()=>t?.map?.(i=>({...i,options:i?.options?.map?.(a=>({...a,checked:d?.[i?.value]?.indexOf?.(a?.value)>-1}))})),[d,t]);console.log("filtersPair",u);const z=()=>m?.({});return(0,r.useEffect)(()=>{if(!(l?.length<=0))if(!y.current)y.current=!0,h(l?.slice(0,C.current));else{const i=l?.slice?.(C.current,l?.length)||[];h([...p,...i])}},[l,F]),(0,o.jsxs)("div",{className:"size-full box-border",children:[(0,o.jsx)("div",{className:"mb-6",children:(0,o.jsx)(D.default,{filtered:d,filtersPair:u,onTabChange:m})}),(0,o.jsx)(O.default,{total:l?.length,metafields:n,closeFilter:s,sortKeyIndx:K,onSortChange:R,onCloseFilter:M,onClearFiltered:z,onMobileOpenDrawer:b}),(0,o.jsxs)("div",{className:"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8",children:[!s&&(0,o.jsx)(x.default,{filtered:d,openOptions:V,filtersPair:u,closeFilter:s,mobileDrawerVisible:N,onFilteredChange:m,onOpenOptions:k,onCloseDrawer:b}),(0,o.jsx)("div",{className:"flex-1 overflow-y-auto",children:(0,o.jsx)(P.default,{closeFilter:s,isShowMore:v,onViewMoreChange:()=>{v||W(F+1)},children:p.map(i=>(0,o.jsx)(S.default,{data:i,onPrimaryChange:(a,g)=>console.log("e",a,g),onSecondaryChange:(a,g)=>console.log("e",a,g)},i.id))})})]})]})}
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/CollectionsFilters/index.tsx"],
4
- "sourcesContent": ["import { useState, useMemo, useEffect, useRef } from 'react'\nimport FilterList from './FilterList'\nimport FilterHeader from './FilterHeader'\nimport FilterCardWrap from './FilterCardWrap'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport FiterTab from './FiterTab'\n\nexport default function CollectionsFilters(props: any) {\n const {\n filters, // \u7B5B\u9009\u9879\n noShowList = [], // \u4E0D\u663E\u793A\u7684\u7B5B\u9009\u9879\n metafields = {},\n data = [], // \u5361\u7247\u6570\u636E\n } = props\n const [closeFilter, setCloseFilter] = useState<boolean>(false)\n const [mobileDrawerVisible, setMobileDrawerVisible] = useState<boolean>(false) // \u79FB\u52A8\u7AEF\u7B5B\u9009\u9009\u9879\u5C55\u793A\u72B6\u6001\n const [openOptions, setOpenOptions] = useState<any[]>([]) // \u5C55\u5F00\u7684\u7B5B\u9009\u9879\n const [filtered, setFiltered] = useState<any>({}) // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n const [sortKeyIndx, setSortKeyIndx] = useState<number>(0) // \u6392\u5E8F\u65B9\u5F0F\n const [currentPage, setCurrentPage] = useState<number>(1) // \u5F53\u524D\u9875\u7801\n const [pageItems, setPageItems] = useState<any[]>([]) // \u5F53\u524D\u5C55\u793A\u7684\u6570\u636E\n\n const pageSizeRef = useRef<number>(18)\n const onceRef = useRef<boolean>(false)\n\n const isShowMore = data?.length <= pageItems?.length\n\n // \u5904\u7406\u7B5B\u9009\u9879\u6570\u636E\n const filtersPair = useMemo(() => {\n return filters?.map?.((filter: any) => {\n return {\n ...filter,\n options: filter?.options?.map?.((opt: any) => {\n return {\n ...opt,\n checked: filtered?.[filter?.value]?.indexOf?.(opt?.value) > -1,\n }\n }),\n }\n })\n }, [filtered, filters])\n\n const clearFiltered = () => setFiltered?.({})\n\n useEffect(() => {\n if (data?.length <= 0) return\n if (!onceRef.current) {\n onceRef.current = true\n setPageItems(data?.slice(0, pageSizeRef.current))\n } else {\n const newData = data?.slice?.(pageSizeRef.current, data?.length) || []\n setPageItems([...pageItems, ...newData])\n }\n }, [data, currentPage])\n\n return (\n <div className=\"size-full box-border\">\n {/* \u5934\u90E8 */}\n <div className=\"mb-6\">\n <FiterTab filtered={filtered} filtersPair={filtersPair} onTabChange={setFiltered} />\n </div>\n <FilterHeader\n total={data?.length}\n metafields={metafields}\n closeFilter={closeFilter}\n sortKeyIndx={sortKeyIndx}\n onSortChange={setSortKeyIndx}\n onCloseFilter={setCloseFilter}\n onClearFiltered={clearFiltered}\n onMobileOpenDrawer={setMobileDrawerVisible}\n />\n {/* PC\u7B5B\u9009\u9009\u9879 */}\n <div className=\"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8\">\n {!closeFilter && (\n <FilterList\n filtered={filtered}\n noShowList={noShowList}\n openOptions={openOptions}\n filtersPair={filtersPair}\n closeFilter={closeFilter}\n mobileDrawerVisible={mobileDrawerVisible}\n onFilteredChange={setFiltered}\n onOpenOptions={setOpenOptions}\n onCloseDrawer={setMobileDrawerVisible}\n />\n )}\n <div className=\"flex-1 overflow-y-auto\">\n <FilterCardWrap\n closeFilter={closeFilter}\n isShowMore={isShowMore}\n onViewMoreChange={() => {\n if (isShowMore) return\n setCurrentPage(currentPage + 1)\n }}\n >\n {pageItems.map(item => (\n <FilterCardWrapItem\n key={item.id}\n data={item}\n onPrimaryChange={(e, data) => console.log('e', e, data)}\n onSecondaryChange={(e, data) => console.log('e', e, data)}\n />\n ))}\n </FilterCardWrap>\n </div>\n </div>\n </div>\n )\n}\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA2DQ,IAAAI,EAAA,6BA3DRC,EAAqD,iBACrDC,EAAuB,2BACvBC,EAAyB,6BACzBC,EAA2B,+BAC3BC,EAA+B,mCAC/BC,EAAqB,yBAEN,SAARR,EAAoCS,EAAY,CACrD,KAAM,CACJ,QAAAC,EACA,WAAAC,EAAa,CAAC,EACd,WAAAC,EAAa,CAAC,EACd,KAAAC,EAAO,CAAC,CACV,EAAIJ,EACE,CAACK,EAAaC,CAAc,KAAI,YAAkB,EAAK,EACvD,CAACC,EAAqBC,CAAsB,KAAI,YAAkB,EAAK,EACvE,CAACC,EAAaC,CAAc,KAAI,YAAgB,CAAC,CAAC,EAClD,CAACC,EAAUC,CAAW,KAAI,YAAc,CAAC,CAAC,EAC1C,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,EAClD,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,EAClD,CAACC,EAAWC,CAAY,KAAI,YAAgB,CAAC,CAAC,EAE9CC,KAAc,UAAe,EAAE,EAC/BC,KAAU,UAAgB,EAAK,EAE/BC,EAAajB,GAAM,QAAUa,GAAW,OAGxCK,KAAc,WAAQ,IACnBrB,GAAS,MAAOsB,IACd,CACL,GAAGA,EACH,QAASA,GAAQ,SAAS,MAAOC,IACxB,CACL,GAAGA,EACH,QAASb,IAAWY,GAAQ,KAAK,GAAG,UAAUC,GAAK,KAAK,EAAI,EAC9D,EACD,CACH,EACD,EACA,CAACb,EAAUV,CAAO,CAAC,EAEhBwB,EAAgB,IAAMb,IAAc,CAAC,CAAC,EAE5C,sBAAU,IAAM,CACd,GAAI,EAAAR,GAAM,QAAU,GACpB,GAAI,CAACgB,EAAQ,QACXA,EAAQ,QAAU,GAClBF,EAAad,GAAM,MAAM,EAAGe,EAAY,OAAO,CAAC,MAC3C,CACL,MAAMO,EAAUtB,GAAM,QAAQe,EAAY,QAASf,GAAM,MAAM,GAAK,CAAC,EACrEc,EAAa,CAAC,GAAGD,EAAW,GAAGS,CAAO,CAAC,CACzC,CACF,EAAG,CAACtB,EAAMW,CAAW,CAAC,KAGpB,QAAC,OAAI,UAAU,uBAEb,oBAAC,OAAI,UAAU,OACb,mBAAC,EAAAY,QAAA,CAAS,SAAUhB,EAAU,YAAaW,EAAa,YAAaV,EAAa,EACpF,KACA,OAAC,EAAAgB,QAAA,CACC,MAAOxB,GAAM,OACb,WAAYD,EACZ,YAAaE,EACb,YAAaQ,EACb,aAAcC,EACd,cAAeR,EACf,gBAAiBmB,EACjB,mBAAoBjB,EACtB,KAEA,QAAC,OAAI,UAAU,qEACZ,WAACH,MACA,OAAC,EAAAwB,QAAA,CACC,SAAUlB,EACV,WAAYT,EACZ,YAAaO,EACb,YAAaa,EACb,YAAajB,EACb,oBAAqBE,EACrB,iBAAkBK,EAClB,cAAeF,EACf,cAAeF,EACjB,KAEF,OAAC,OAAI,UAAU,yBACb,mBAAC,EAAAsB,QAAA,CACC,YAAazB,EACb,WAAYgB,EACZ,iBAAkB,IAAM,CAClBA,GACJL,EAAeD,EAAc,CAAC,CAChC,EAEC,SAAAE,EAAU,IAAIc,MACb,OAAC,EAAAC,QAAA,CAEC,KAAMD,EACN,gBAAiB,CAACE,EAAG7B,IAAS,QAAQ,IAAI,IAAK6B,EAAG7B,CAAI,EACtD,kBAAmB,CAAC6B,EAAG7B,IAAS,QAAQ,IAAI,IAAK6B,EAAG7B,CAAI,GAHnD2B,EAAK,EAIZ,CACD,EACH,EACF,GACF,GACF,CAEJ",
6
- "names": ["CollectionsFilters_exports", "__export", "CollectionsFilters", "__toCommonJS", "import_jsx_runtime", "import_react", "import_FilterList", "import_FilterHeader", "import_FilterCardWrap", "import_FilterCardWrapItem", "import_FiterTab", "props", "filters", "noShowList", "metafields", "data", "closeFilter", "setCloseFilter", "mobileDrawerVisible", "setMobileDrawerVisible", "openOptions", "setOpenOptions", "filtered", "setFiltered", "sortKeyIndx", "setSortKeyIndx", "currentPage", "setCurrentPage", "pageItems", "setPageItems", "pageSizeRef", "onceRef", "isShowMore", "filtersPair", "filter", "opt", "clearFiltered", "newData", "FiterTab", "FilterHeader", "FilterList", "FilterCardWrap", "item", "FilterCardWrapItem", "e"]
4
+ "sourcesContent": ["import { useState, useMemo, useEffect, useRef } from 'react'\nimport FilterList from './FilterList'\nimport FilterHeader from './FilterHeader'\nimport FilterCardWrap from './FilterCardWrap'\nimport FilterCardWrapItem from './FilterCardWrapItem'\nimport FiterTab from './FiterTab'\n\nexport default function CollectionsFilters(props: any) {\n const {\n filters, // \u7B5B\u9009\u9879\n metafields = {},\n data = [], // \u5361\u7247\u6570\u636E\n } = props\n const [closeFilter, setCloseFilter] = useState<boolean>(false)\n const [mobileDrawerVisible, setMobileDrawerVisible] = useState<boolean>(false) // \u79FB\u52A8\u7AEF\u7B5B\u9009\u9009\u9879\u5C55\u793A\u72B6\u6001\n const [openOptions, setOpenOptions] = useState<any[]>([]) // \u5C55\u5F00\u7684\u7B5B\u9009\u9879\n const [filtered, setFiltered] = useState<any>({}) // \u9009\u62E9\u7684\u7B5B\u9009\u9009\u9879\n const [sortKeyIndx, setSortKeyIndx] = useState<number>(0) // \u6392\u5E8F\u65B9\u5F0F\n const [currentPage, setCurrentPage] = useState<number>(1) // \u5F53\u524D\u9875\u7801\n const [pageItems, setPageItems] = useState<any[]>([]) // \u5F53\u524D\u5C55\u793A\u7684\u6570\u636E\n\n const pageSizeRef = useRef<number>(18)\n const onceRef = useRef<boolean>(false)\n\n const isShowMore = data?.length <= pageItems?.length\n\n // \u5904\u7406\u7B5B\u9009\u9879\u6570\u636E\n const filtersPair = useMemo(() => {\n return filters?.map?.((filter: any) => {\n return {\n ...filter,\n options: filter?.options?.map?.((opt: any) => {\n return {\n ...opt,\n checked: filtered?.[filter?.value]?.indexOf?.(opt?.value) > -1,\n }\n }),\n }\n })\n }, [filtered, filters])\n\n console.log('filtersPair', filtersPair)\n\n const clearFiltered = () => setFiltered?.({})\n\n useEffect(() => {\n if (data?.length <= 0) return\n if (!onceRef.current) {\n onceRef.current = true\n setPageItems(data?.slice(0, pageSizeRef.current))\n } else {\n const newData = data?.slice?.(pageSizeRef.current, data?.length) || []\n setPageItems([...pageItems, ...newData])\n }\n }, [data, currentPage])\n\n return (\n <div className=\"size-full box-border\">\n {/* \u5934\u90E8 */}\n <div className=\"mb-6\">\n <FiterTab filtered={filtered} filtersPair={filtersPair} onTabChange={setFiltered} />\n </div>\n <FilterHeader\n total={data?.length}\n metafields={metafields}\n closeFilter={closeFilter}\n sortKeyIndx={sortKeyIndx}\n onSortChange={setSortKeyIndx}\n onCloseFilter={setCloseFilter}\n onClearFiltered={clearFiltered}\n onMobileOpenDrawer={setMobileDrawerVisible}\n />\n {/* PC\u7B5B\u9009\u9009\u9879 */}\n <div className=\"flex-1 overflow-hidden tablet:flex desktop:gap-x-16 tablet:gap-x-8\">\n {!closeFilter && (\n <FilterList\n filtered={filtered}\n openOptions={openOptions}\n filtersPair={filtersPair}\n closeFilter={closeFilter}\n mobileDrawerVisible={mobileDrawerVisible}\n onFilteredChange={setFiltered}\n onOpenOptions={setOpenOptions}\n onCloseDrawer={setMobileDrawerVisible}\n />\n )}\n <div className=\"flex-1 overflow-y-auto\">\n <FilterCardWrap\n closeFilter={closeFilter}\n isShowMore={isShowMore}\n onViewMoreChange={() => {\n if (isShowMore) return\n setCurrentPage(currentPage + 1)\n }}\n >\n {pageItems.map(item => (\n <FilterCardWrapItem\n key={item.id}\n data={item}\n onPrimaryChange={(e, data) => console.log('e', e, data)}\n onSecondaryChange={(e, data) => console.log('e', e, data)}\n />\n ))}\n </FilterCardWrap>\n </div>\n </div>\n </div>\n )\n}\n"],
5
+ "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA4DQ,IAAAI,EAAA,6BA5DRC,EAAqD,iBACrDC,EAAuB,2BACvBC,EAAyB,6BACzBC,EAA2B,+BAC3BC,EAA+B,mCAC/BC,EAAqB,yBAEN,SAARR,EAAoCS,EAAY,CACrD,KAAM,CACJ,QAAAC,EACA,WAAAC,EAAa,CAAC,EACd,KAAAC,EAAO,CAAC,CACV,EAAIH,EACE,CAACI,EAAaC,CAAc,KAAI,YAAkB,EAAK,EACvD,CAACC,EAAqBC,CAAsB,KAAI,YAAkB,EAAK,EACvE,CAACC,EAAaC,CAAc,KAAI,YAAgB,CAAC,CAAC,EAClD,CAACC,EAAUC,CAAW,KAAI,YAAc,CAAC,CAAC,EAC1C,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,EAClD,CAACC,EAAaC,CAAc,KAAI,YAAiB,CAAC,EAClD,CAACC,EAAWC,CAAY,KAAI,YAAgB,CAAC,CAAC,EAE9CC,KAAc,UAAe,EAAE,EAC/BC,KAAU,UAAgB,EAAK,EAE/BC,EAAajB,GAAM,QAAUa,GAAW,OAGxCK,KAAc,WAAQ,IACnBpB,GAAS,MAAOqB,IACd,CACL,GAAGA,EACH,QAASA,GAAQ,SAAS,MAAOC,IACxB,CACL,GAAGA,EACH,QAASb,IAAWY,GAAQ,KAAK,GAAG,UAAUC,GAAK,KAAK,EAAI,EAC9D,EACD,CACH,EACD,EACA,CAACb,EAAUT,CAAO,CAAC,EAEtB,QAAQ,IAAI,cAAeoB,CAAW,EAEtC,MAAMG,EAAgB,IAAMb,IAAc,CAAC,CAAC,EAE5C,sBAAU,IAAM,CACd,GAAI,EAAAR,GAAM,QAAU,GACpB,GAAI,CAACgB,EAAQ,QACXA,EAAQ,QAAU,GAClBF,EAAad,GAAM,MAAM,EAAGe,EAAY,OAAO,CAAC,MAC3C,CACL,MAAMO,EAAUtB,GAAM,QAAQe,EAAY,QAASf,GAAM,MAAM,GAAK,CAAC,EACrEc,EAAa,CAAC,GAAGD,EAAW,GAAGS,CAAO,CAAC,CACzC,CACF,EAAG,CAACtB,EAAMW,CAAW,CAAC,KAGpB,QAAC,OAAI,UAAU,uBAEb,oBAAC,OAAI,UAAU,OACb,mBAAC,EAAAY,QAAA,CAAS,SAAUhB,EAAU,YAAaW,EAAa,YAAaV,EAAa,EACpF,KACA,OAAC,EAAAgB,QAAA,CACC,MAAOxB,GAAM,OACb,WAAYD,EACZ,YAAaE,EACb,YAAaQ,EACb,aAAcC,EACd,cAAeR,EACf,gBAAiBmB,EACjB,mBAAoBjB,EACtB,KAEA,QAAC,OAAI,UAAU,qEACZ,WAACH,MACA,OAAC,EAAAwB,QAAA,CACC,SAAUlB,EACV,YAAaF,EACb,YAAaa,EACb,YAAajB,EACb,oBAAqBE,EACrB,iBAAkBK,EAClB,cAAeF,EACf,cAAeF,EACjB,KAEF,OAAC,OAAI,UAAU,yBACb,mBAAC,EAAAsB,QAAA,CACC,YAAazB,EACb,WAAYgB,EACZ,iBAAkB,IAAM,CAClBA,GACJL,EAAeD,EAAc,CAAC,CAChC,EAEC,SAAAE,EAAU,IAAIc,MACb,OAAC,EAAAC,QAAA,CAEC,KAAMD,EACN,gBAAiB,CAACE,EAAG7B,IAAS,QAAQ,IAAI,IAAK6B,EAAG7B,CAAI,EACtD,kBAAmB,CAAC6B,EAAG7B,IAAS,QAAQ,IAAI,IAAK6B,EAAG7B,CAAI,GAHnD2B,EAAK,EAIZ,CACD,EACH,EACF,GACF,GACF,CAEJ",
6
+ "names": ["CollectionsFilters_exports", "__export", "CollectionsFilters", "__toCommonJS", "import_jsx_runtime", "import_react", "import_FilterList", "import_FilterHeader", "import_FilterCardWrap", "import_FilterCardWrapItem", "import_FiterTab", "props", "filters", "metafields", "data", "closeFilter", "setCloseFilter", "mobileDrawerVisible", "setMobileDrawerVisible", "openOptions", "setOpenOptions", "filtered", "setFiltered", "sortKeyIndx", "setSortKeyIndx", "currentPage", "setCurrentPage", "pageItems", "setPageItems", "pageSizeRef", "onceRef", "isShowMore", "filtersPair", "filter", "opt", "clearFiltered", "newData", "FiterTab", "FilterHeader", "FilterList", "FilterCardWrap", "item", "FilterCardWrapItem", "e"]
7
7
  }