@anker-in/headless-ui 1.0.16-alpha.8 → 1.0.16-temp-09101

package/dist/cjs/apps/playground/utils/classnames.d.ts

@@ -0,0 +1 @@
+export declare function classNames(...arr: unknown[]): string;

package/dist/cjs/apps/storefront/lib/utils/classnames.d.ts

@@ -0,0 +1,2 @@
+import { type ClassValue } from 'clsx';
+export declare function classNames(...inputs: ClassValue[]): string;

package/dist/cjs/biz-components/AccordionCards/useDebounce.d.ts

@@ -0,0 +1,6 @@
+type DebounceOptions = {
+    leading?: boolean;
+    trailing?: boolean;
+};
+export declare function useDebounce<T extends any[]>(func: (...args: T) => void, delay?: number, options?: DebounceOptions): (...args: T) => void;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/AnimatedUL.d.ts

@@ -0,0 +1,9 @@
+type AnimatedULProps = React.HTMLAttributes<HTMLUListElement> & {
+    isOpen: boolean;
+};
+/**
+ * AnimatedUL - 用于替换 <motion.ul>
+ * 保持 overflow hidden，height 由 gsap 动态控制
+ */
+export default function AnimatedUL({ isOpen, children, className, ...rest }: AnimatedULProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.d.ts

@@ -0,0 +1,8 @@
+type FilterCardWrapProps = {
+    children: React.ReactNode;
+    isShowMore?: boolean;
+    closeFilter: boolean;
+    onViewMoreChange: () => void;
+};
+export default function FilterCardWrap(props: FilterCardWrapProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js

@@ -0,0 +1,2 @@
+"use strict";var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var m=(r,e)=>{for(var i in e)l(r,i,{get:e[i],enumerable:!0})},v=(r,e,i,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of w(e))!g.call(r,t)&&t!==i&&l(r,t,{get:()=>e[t],enumerable:!(a=p(e,t))||a.enumerable});return r};var f=r=>v(l({},"__esModule",{value:!0}),r);var u={};m(u,{default:()=>c});module.exports=f(u);var o=require("react/jsx-runtime"),d=require("../../helpers/utils.js"),n=require("react-responsive");function c(r){const{children:e,closeFilter:i,isShowMore:a,onViewMoreChange:t}=r,s=(0,n.useMediaQuery)({query:"(max-width: 768px)"});return(0,o.jsxs)("div",{className:"filter-card-wrap-container",children:[(0,o.jsx)("div",{className:(0,d.cn)("w-full grid gap-3 grid-cols-2",{"laptop:grid-cols-4 tablet:grid-cols-3":i&&!s,"laptop:grid-cols-3 tablet:grid-cols-2":!i&&!s},"filter-card-wrap"),children:e}),!a&&(0,o.jsxs)("div",{className:"mt-6 text-base font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more",onClick:t,children:[(0,o.jsx)("span",{children:"View More"}),(0,o.jsx)("div",{className:"size-[18px]",children:(0,o.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,o.jsx)("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"})})})]})]})}
+//# sourceMappingURL=FilterCardWrap.js.map

package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrap.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrap.tsx"],
+  "sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useMediaQuery } from 'react-responsive'\n\ntype FilterCardWrapProps = {\n  children: React.ReactNode\n  isShowMore?: boolean\n  closeFilter: boolean\n  onViewMoreChange: () => void\n}\n\nexport default function FilterCardWrap(props: FilterCardWrapProps) {\n  const { children, closeFilter, isShowMore, onViewMoreChange } = props\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n  return (\n    <div className=\"filter-card-wrap-container\">\n      <div\n        className={cn(\n          'w-full grid gap-3 grid-cols-2',\n          {\n            'laptop:grid-cols-4 tablet:grid-cols-3': closeFilter && !isMobile,\n            'laptop:grid-cols-3 tablet:grid-cols-2': !closeFilter && !isMobile,\n          },\n          'filter-card-wrap'\n        )}\n      >\n        {children}\n      </div>\n      {!isShowMore && (\n        <div\n          className=\"mt-6 text-base font-bold cursor-pointer flex items-center justify-center gap-1 filter-card-wrap-more\"\n          onClick={onViewMoreChange}\n        >\n          <span>View More</span>\n          <div className=\"size-[18px]\">\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      )}\n    </div>\n  )\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAiBM,IAAAI,EAAA,6BAjBNC,EAAmB,kCACnBC,EAA8B,4BASf,SAARJ,EAAgCK,EAA4B,CACjE,KAAM,CAAE,SAAAC,EAAU,YAAAC,EAAa,WAAAC,EAAY,iBAAAC,CAAiB,EAAIJ,EAE1DK,KAAW,iBAAc,CAAE,MAAO,oBAAqB,CAAC,EAE9D,SACE,QAAC,OAAI,UAAU,6BACb,oBAAC,OACC,aAAW,MACT,gCACA,CACE,wCAAyCH,GAAe,CAACG,EACzD,wCAAyC,CAACH,GAAe,CAACG,CAC5D,EACA,kBACF,EAEC,SAAAJ,EACH,EACC,CAACE,MACA,QAAC,OACC,UAAU,uGACV,QAASC,EAET,oBAAC,QAAK,qBAAS,KACf,OAAC,OAAI,UAAU,cACb,mBAAC,OACC,MAAM,6BACN,KAAK,OACL,QAAQ,YACR,eAAa,MACb,OAAO,eACP,cAAY,OACZ,YAAU,OAEV,mBAAC,QAAK,iBAAe,QAAQ,kBAAgB,QAAQ,EAAE,6BAA6B,EACtF,EACF,GACF,GAEJ,CAEJ",
+  "names": ["FilterCardWrap_exports", "__export", "FilterCardWrap", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_react_responsive", "props", "children", "closeFilter", "isShowMore", "onViewMoreChange", "isMobile"]
+}

package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.d.ts

@@ -0,0 +1,11 @@
+declare const FilterCardWrapItem: ({ data, itemShape, isLogin, plusMemberStatus, memberPrice, memberText, onPrimaryChange, onSecondaryChange, }: {
+    data: any;
+    isLogin?: boolean;
+    plusMemberStatus?: boolean;
+    memberPrice?: string;
+    memberText?: string;
+    itemShape?: string;
+    onPrimaryChange?: (item: any, sku: string) => void;
+    onSecondaryChange?: (item: any, sku: string) => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default FilterCardWrapItem;

package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js

@@ -0,0 +1,2 @@
+"use strict";var q=Object.create;var b=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,Q=Object.prototype.hasOwnProperty;var X=(e,s)=>{for(var r in s)b(e,r,{get:s[r],enumerable:!0})},L=(e,s,r,m)=>{if(s&&typeof s=="object"||typeof s=="function")for(let a of J(s))!Q.call(e,a)&&a!==r&&b(e,a,{get:()=>s[a],enumerable:!(m=G(s,a))||m.enumerable});return e};var y=(e,s,r)=>(r=e!=null?q(K(e)):{},L(s||!e||!e.__esModule?b(r,"default",{value:e,enumerable:!0}):r,e)),Y=e=>L(b({},"__esModule",{value:!0}),e);var se={};X(se,{default:()=>oe});module.exports=Y(se);var t=require("react/jsx-runtime"),d=require("../../helpers/utils.js"),P=require("../AiuiProvider/index.js"),B=require("../ShelfDisplay/shelfDisplay.js"),j=y(require("../../components/badge.js")),F=require("../../components/heading.js"),O=require("../../components/text.js"),N=y(require("../../components/button.js")),_=y(require("../../components/picture.js")),x=require("../../shared/trackUrlRef.js"),i=require("react");const h="image",k="product_shelf",Z=999999999e-2,ee=e=>{let s;return e?.includes("products")?s=e?.split("products")[0]+"files/":s=e?.replace(e?.split("files")?.pop()||"","")+"/",s},te=({data:e,itemShape:s,isLogin:r=!1,plusMemberStatus:m=!1,memberPrice:a="",memberText:H="",onPrimaryChange:M,onSecondaryChange:A})=>{const[g,C]=(0,i.useState)(""),[U,S]=(0,i.useState)(""),[u,w]=(0,i.useState)(""),[D,E]=(0,i.useState)({}),[$,V]=(0,i.useState)({}),[I,T]=(0,i.useState)({price:"",basePrice:""}),{locale:c="us",copyWriting:W}=(0,P.useAiuiContext)(),f=e?.custom_name||e?.title,z=e?.custom_description||e?.description,R=o=>w(o);return(0,i.useEffect)(()=>{const o=e?.variants;if(u){const n=o?.find(v=>v?.name?.includes?.(u));C(n?.sku||""),S(n?.image?.url||"");return}const l=e?.options?.find(n=>n?.displayName==="color")?.values?.[0]?.label;w(l);const p=o?.find(n=>n?.name?.includes?.(l));C(p?.sku||""),S(p?.image?.url||o?.[0]?.image?.url||"")},[u]),(0,i.useEffect)(()=>{const o=e?.variants?.find(v=>v?.sku===g)||e?.variants?.[0]||{};V(o),E(!o?.availableForSale&&o?.price?.amount===Z);const l=o?.coupons?.[0],{price:p,basePrice:n}=(0,B.formatVariantPrice)({locale:c,amount:l?l.variant_price4wscode:o.price,baseAmount:l?o.price:0,currencyCode:e?.price?.currencyCode||"USD"});if(r&&m){T({price:a,basePrice:n||""});return}T({price:p,basePrice:n||""})},[e]),(0,t.jsx)("div",{className:(0,d.cn)(s==="round"?"rounded-2xl":"rounded-none","lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white","bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300",{"aiui-dark":e.theme==="dark"}),children:e?.mImage?(0,t.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,t.jsxs)("a",{className:"relative inset-0 size-full",href:(0,x.trackUrlRef)(e?.link,`${h}_${k}`),children:[(0,t.jsx)(_.default,{alt:"",source:e?.mImage?.url||e?.mImage,className:"size-full [&_img]:object-cover [&_img]:size-full"}),(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4",children:[(0,t.jsx)("p",{className:"text-info-primary desktop:text-base text-sm font-bold",dangerouslySetInnerHTML:{__html:e?.subTitle}}),(0,t.jsx)("span",{className:"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6",dangerouslySetInnerHTML:{__html:e?.title}})]})]})}):(0,t.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4",children:[(0,t.jsx)("div",{className:"h-6 flex flex-wrap gap-1 overflow-hidden",children:e?.tags?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,2)?.map?.((o,l)=>(0,t.jsx)(j.default,{children:o},l))}),(0,t.jsx)("a",{"aria-label":f,target:"_blank",href:(0,x.trackUrlRef)(`${c==="us"||!c?"":`/${c}`}/products/${e?.handle}`,`${h}_${k}`),children:(0,t.jsx)("div",{className:(0,d.cn)("m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden"),children:(0,t.jsx)(_.default,{alt:"",source:U,className:"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit"})})}),e?.options?.map(o=>{if(o?.displayName==="color")return(0,t.jsx)("div",{className:"flex items-center gap-1",children:o?.values?.map(l=>{const p=l?.hexColors?l.hexColors?.[0]:l?.label;return(0,t.jsx)("button",{onClick:()=>R(l?.label),className:(0,d.cn)("size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent",`${u===l?.label?"border-[#00BEFA]":""}`),children:(0,t.jsx)("img",{alt:p,className:"h-full w-full object-cover",src:`${ee(e?.images?.[0]?.url)}${p?.toLowerCase().split(" ")?.join("-")}_50x.png`})},l?.label)})})}),(0,t.jsxs)("div",{children:[f?(0,t.jsx)(F.Heading,{as:"h3",size:2,html:f||"",title:f||"",className:"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base"}):null,(0,t.jsx)("a",{className:"font-bold text-xs [&_.jdgm-star]:text-[#F77234]",dangerouslySetInnerHTML:{__html:e?.metafields?.judgemeBadge},href:(0,x.trackUrlRef)(`${c==="us"||!c?"":`/${c}`}/products/${e?.handle}`,`${h}_${k}`),target:"_blank"}),z?(0,t.jsx)(O.Text,{size:2,className:"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs",html:z||""}):null,(0,t.jsxs)("div",{className:"mt-3 mb-2",children:[(0,t.jsx)("p",{dangerouslySetInnerHTML:{__html:r&&m&&H||""},className:"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold"}),(0,t.jsx)("div",{className:"flex items-center",children:D?(0,t.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:W?.soldOutText}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"final-price tablet:text-2xl text-info-primary text-base font-bold",children:$?.availableForSale&&I?.price||""}),(0,t.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-base font-bold line-through",children:$?.availableForSale&&I?.basePrice||""})]})})]}),(0,t.jsxs)("div",{className:(0,d.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col"),children:[(0,t.jsx)(N.default,{variant:"secondary",onClick:()=>M?.(e,g),className:"m-tablet:w-full",children:"Learn More"}),(0,t.jsx)(N.default,{variant:"primary",onClick:()=>A?.(e,g),className:"m-tablet:w-full",children:"Shop Now"})]})]})]})},e?.id||e?.handle)};var oe=te;
+//# sourceMappingURL=FilterCardWrapItem.js.map

package/dist/cjs/biz-components/CollectionsFilters/FilterCardWrapItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/CollectionsFilters/FilterCardWrapItem.tsx"],
+  "sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useState, useEffect } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nconst getShopifyCdnBaseUrl = (imagePath: string | null) => {\n  // \u76EE\u524D\u77E5\u9053\u7684 shopify \u56FE\u7247\u8DEF\u7531\u7684\u5F62\u5F0F\n  // https://cdn.shopify.com/s/files/1/0493/9834/9974/files/Group_5581_2.jpg?v=1662379184\n  // https://cdn.shopify.com/s/files/1/0493/9834/9974/products/B2633123.jpg?v=1631264041_3840x\n  // \u8FD4\u56DE https://cdn.shopify.com/s/files/1/0493/9834/9974/files/\n  let path\n  if (imagePath?.includes('products')) {\n    path = imagePath?.split('products')[0] + 'files/'\n  } else {\n    path = imagePath?.replace(imagePath?.split('files')?.pop() || '', '') + '/'\n  }\n  return path\n}\n\nconst FilterCardWrapItem = ({\n  data,\n  itemShape,\n  isLogin = false,\n  plusMemberStatus = false,\n  memberPrice = '',\n  memberText = '',\n  onPrimaryChange,\n  onSecondaryChange,\n}: {\n  data: any\n  isLogin?: boolean\n  plusMemberStatus?: boolean // \u662F\u4E0D\u662Fplus\u4F1A\u5458\n  memberPrice?: string // \u4F1A\u5458\u4EF7\u683C\n  memberText?: string // \u4F1A\u5458\u5B57\u6BB5\n  itemShape?: string\n  onPrimaryChange?: (item: any, sku: string) => void\n  onSecondaryChange?: (item: any, sku: string) => void\n}) => {\n  const [currentSku, setCurrentSku] = useState<string>('')\n  const [currentImage, setCurrentImage] = useState<string>('')\n  const [selectedColor, setSelectedColor] = useState<string>('')\n  const [isSoldOut, setIsSoldOut] = useState<any>({})\n  const [currentVariant, setCurrentVariant] = useState<any>({})\n  const [priceCollection, setPriceCollection] = useState<{ price: string; basePrice: string }>({\n    price: '',\n    basePrice: '',\n  })\n\n  const { locale = 'us', copyWriting } = useAiuiContext()\n\n  const displayTitle = data?.custom_name || data?.title\n  const displayDescription = data?.custom_description || data?.description\n\n  const onColorClick = (color: string) => setSelectedColor(color)\n\n  useEffect(() => {\n    const skuArray = data?.variants\n    if (selectedColor) {\n      const findSku = skuArray?.find((item: any) => item?.name?.includes?.(selectedColor))\n      setCurrentSku(findSku?.sku || '')\n      setCurrentImage(findSku?.image?.url || '')\n      return\n    }\n    const firstOption = data?.options?.find((item: any) => item?.displayName === 'color')?.values?.[0]?.label\n    setSelectedColor(firstOption)\n    const findSku = skuArray?.find((item: any) => item?.name?.includes?.(firstOption))\n    setCurrentSku(findSku?.sku || '')\n    setCurrentImage(findSku?.image?.url || skuArray?.[0]?.image?.url || '')\n  }, [selectedColor])\n\n  useEffect(() => {\n    const variant = data?.variants?.find((item: any) => item?.sku === currentSku) || data?.variants?.[0] || {}\n    setCurrentVariant(variant)\n    setIsSoldOut(!variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE)\n    // active \u7684 \u901A\u7528\u6298\u6263\n    const coupon = variant?.coupons?.[0]\n    const { price, basePrice } = formatVariantPrice({\n      locale: locale,\n      amount: coupon ? coupon.variant_price4wscode : variant.price,\n      baseAmount: coupon ? variant.price : 0,\n      currencyCode: data?.price?.currencyCode || 'USD',\n    })\n    // \u4F1A\u5458\u6298\u6263\n    if (isLogin && plusMemberStatus) {\n      setPriceCollection({ price: memberPrice, basePrice: basePrice || '' })\n      return\n    }\n    setPriceCollection({ price: price, basePrice: basePrice || '' })\n  }, [data])\n\n  return (\n    <div\n      key={data?.id || data?.handle}\n      className={cn(\n        itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n        'lg-desktop:h-[493px] laptop:h-[433px] h-[398px] relative tablet:hover:bg-info-white',\n        'bg-container-secondary-1 box-border w-full cursor-pointer overflow-hidden duration-300',\n        {\n          'aiui-dark': data.theme === 'dark',\n        }\n      )}\n    >\n      {data?.mImage ? (\n        <div className=\"absolute inset-0 box-border overflow-hidden\">\n          <a className=\"relative inset-0 size-full\" href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}>\n            <Picture\n              alt=\"\"\n              source={data?.mImage?.url || data?.mImage}\n              className=\"size-full [&_img]:object-cover [&_img]:size-full\"\n            />\n            <div className=\"desktop:p-6 absolute inset-x-0 top-0 box-border overflow-hidden p-4\">\n              <p\n                className=\"text-info-primary desktop:text-base text-sm font-bold\"\n                dangerouslySetInnerHTML={{ __html: data?.subTitle }}\n              />\n              <span\n                className=\"text-info-secondary desktop:text-[32px] text-xl font-bold leading-6\"\n                dangerouslySetInnerHTML={{ __html: data?.title }}\n              />\n            </div>\n          </a>\n        </div>\n      ) : (\n        <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden tablet:p-4 p-2 pb-4\">\n          <div className=\"h-6 flex flex-wrap gap-1 overflow-hidden\">\n            {data?.tags\n              ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n              ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n              ?.slice?.(0, 2)\n              ?.map?.((item: any, index: number) => <Badge key={index}>{item}</Badge>)}\n          </div>\n          <a\n            aria-label={displayTitle}\n            target=\"_blank\"\n            href={trackUrlRef(\n              `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n              `${componentType}_${componentName}`\n            )}\n          >\n            <div className={cn('m-auto lg-desktop:size-[196px] desktop:size-[138px] size-[120px] overflow-hidden')}>\n              <Picture\n                alt=\"\"\n                source={currentImage}\n                className=\"h-full [&_img]:object-cover [&_img]:h-full [&_img]:w-fit\"\n              />\n            </div>\n          </a>\n          {data?.options?.map((option: any) => {\n            if (option?.displayName === 'color') {\n              return (\n                <div className=\"flex items-center gap-1\">\n                  {option?.values?.map((item: any) => {\n                    const color = item?.hexColors ? item.hexColors?.[0] : item?.label\n                    return (\n                      <button\n                        key={item?.label}\n                        onClick={() => onColorClick(item?.label)}\n                        className={cn(\n                          'size-4 rounded-full cursor-pointer overflow-hidden border-2 border-transparent',\n                          `${selectedColor === item?.label ? 'border-[#00BEFA]' : ''}`\n                        )}\n                      >\n                        <img\n                          alt={color}\n                          className=\"h-full w-full object-cover\"\n                          src={`${getShopifyCdnBaseUrl(data?.images?.[0]?.url)}${color\n                            ?.toLowerCase()\n                            .split(' ')\n                            ?.join('-')}_${'50x'}.png`}\n                        />\n                      </button>\n                    )\n                  })}\n                </div>\n              )\n            }\n          })}\n          <div>\n            {displayTitle ? (\n              <Heading\n                as=\"h3\"\n                size={2}\n                html={displayTitle || ''}\n                title={displayTitle || ''}\n                className=\"shelf-display-product-title line-clamp-2 lg-desktop:text-2xl laptop:test-xl test-base\"\n              />\n            ) : null}\n            <a\n              className=\"font-bold text-xs [&_.jdgm-star]:text-[#F77234]\"\n              dangerouslySetInnerHTML={{ __html: data?.metafields?.judgemeBadge }}\n              href={trackUrlRef(\n                `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n                `${componentType}_${componentName}`\n              )}\n              target=\"_blank\"\n            />\n            {displayDescription ? (\n              <Text\n                size={2}\n                className=\"desktop:text-base laptop:text-sm shelf-display-product-description line-clamp-1 text-xs\"\n                html={displayDescription || ''}\n              />\n            ) : null}\n            <div className=\"mt-3 mb-2\">\n              <p\n                dangerouslySetInnerHTML={{ __html: isLogin && plusMemberStatus ? memberText || '' : '' }}\n                className=\"text-info-primary lg-desktop:text-lg desktop:text-base laptop:text-sm text-xs font-bold\"\n              />\n              <div className=\"flex items-center\">\n                {isSoldOut ? (\n                  <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n                ) : (\n                  <>\n                    <div className=\"final-price tablet:text-2xl text-info-primary text-base font-bold\">\n                      {currentVariant?.availableForSale ? priceCollection?.price || '' : ''}\n                    </div>\n                    <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-base font-bold line-through\">\n                      {currentVariant?.availableForSale ? priceCollection?.basePrice || '' : ''}\n                    </div>\n                  </>\n                )}\n              </div>\n            </div>\n            {/* \u6309\u94AE\u7EC4 */}\n            <div\n              className={cn('shelf-flex-button-group', 'lg-desktop:gap-3 flex items-center gap-2 m-tablet:flex-col')}\n            >\n              <Button\n                variant=\"secondary\"\n                onClick={() => onPrimaryChange?.(data, currentSku)}\n                className=\"m-tablet:w-full\"\n              >\n                {'Learn More'}\n              </Button>\n              <Button\n                variant=\"primary\"\n                onClick={() => onSecondaryChange?.(data, currentSku)}\n                className=\"m-tablet:w-full\"\n              >\n                {'Shop Now'}\n              </Button>\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\nexport default FilterCardWrapItem\n"],
+  "mappings": "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",
+  "names": ["FilterCardWrapItem_exports", "__export", "FilterCardWrapItem_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_AiuiProvider", "import_shelfDisplay", "import_badge", "import_heading", "import_text", "import_button", "import_picture", "import_trackUrlRef", "import_react", "componentType", "componentName", "SOLD_OUT_PRICE", "getShopifyCdnBaseUrl", "imagePath", "path", "FilterCardWrapItem", "data", "itemShape", "isLogin", "plusMemberStatus", "memberPrice", "memberText", "onPrimaryChange", "onSecondaryChange", "currentSku", "setCurrentSku", "currentImage", "setCurrentImage", "selectedColor", "setSelectedColor", "isSoldOut", "setIsSoldOut", "currentVariant", "setCurrentVariant", "priceCollection", "setPriceCollection", "locale", "copyWriting", "displayTitle", "displayDescription", "onColorClick", "color", "skuArray", "findSku", "item", "firstOption", "variant", "coupon", "price", "basePrice", "Picture", "index", "Badge", "option", "Button"]
+}

package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.d.ts

@@ -0,0 +1,17 @@
+type FilterHeaderProps = {
+    filtered: {
+        [key: string]: string[];
+    };
+    total?: number;
+    filtersPair: any[];
+    sortKeyIndx: number;
+    metafields: any;
+    closeFilter: boolean;
+    onClearFiltered: () => void;
+    onTabChange?: (tab: any) => void;
+    onSortChange: (sortKeyIndx: number) => void;
+    onCloseFilter: (closeFilter: boolean) => void;
+    onMobileOpenDrawer: (openDrawer: boolean) => void;
+};
+export default function FilterHeader(props: FilterHeaderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.js

@@ -0,0 +1,2 @@
+"use strict";var I=Object.create;var b=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var H=(t,l)=>{for(var o in l)b(t,o,{get:l[o],enumerable:!0})},h=(t,l,o,d)=>{if(l&&typeof l=="object"||typeof l=="function")for(let n of O(l))!z.call(t,n)&&n!==o&&b(t,n,{get:()=>l[n],enumerable:!(d=D(l,n))||d.enumerable});return t};var M=(t,l,o)=>(o=t!=null?I($(t)):{},h(l||!t||!t.__esModule?b(o,"default",{value:t,enumerable:!0}):o,t)),L=t=>h(b({},"__esModule",{value:!0}),t);var E={};H(E,{default:()=>g});module.exports=L(E);var e=require("react/jsx-runtime"),c=require("../../helpers/utils"),i=require("../../components/index.js"),N=M(require("./component/TabFilter")),y=require("es-toolkit"),f=require("react");function g(t){const{total:l,filtered:o,filtersPair:d,closeFilter:n,metafields:C,onSortChange:F,onTabChange:k,onCloseFilter:_,onClearFiltered:w,onMobileOpenDrawer:P,sortKeyIndx:x}=t,{shop_filters_pair:s}=C,[p,u]=(0,f.useState)(!1),v=a=>_?.(a),S=(0,f.useMemo)(()=>d?.find(a=>a.mainPair),[d]);return(0,e.jsxs)("div",{className:"filter-header",children:[(0,e.jsx)("div",{className:"mb-6",children:(0,e.jsx)(N.default,{tabs:S,tabShape:"square",onTabClick:(a,r)=>{const m=(0,y.cloneDeep)(o),T=m?.[a?.value]||[];m[a?.value]=r?.value?[r?.value]:[],T.length<=0&&Reflect.deleteProperty(m,r?.label),k?.(m)}})}),(0,e.jsxs)("div",{className:(0,c.cn)("desktop:gap-x-16 tablet:gap-x-8","relative flex md-tablet:p-0 text-base font-bold box-border","tablet:border-b tablet:border-[#E4E5E6] tablet:pb-4 tablet:mb-4 mb-2"),children:[!n&&(0,e.jsxs)("div",{className:(0,c.cn)("md-tablet:hidden flex-shrink-0 flex justify-between items-center","desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:w-fit box-border"),children:[(0,e.jsxs)("div",{className:"flex items-center cursor-pointer",onClick:()=>v(!0),children:[(0,e.jsx)(i.Picture,{className:"mb-1 size-5",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),(0,e.jsx)("span",{className:"font-bold inline-block pl-2 leading-none",children:s?.filter_txt?.filter||"Close Filter"})]}),(0,e.jsx)("span",{onClick:()=>w(),className:"text-center text-base md:hidden font-bold text-[#1D1D1F] cursor-pointer box-border",children:"Clear"})]}),(0,e.jsxs)("div",{className:"flex-1 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"md-tablet:hidden flex items-center gap-x-4",children:[n&&(0,e.jsxs)("div",{className:"flex items-center cursor-pointer",onClick:()=>v(!1),children:[(0,e.jsx)(i.Picture,{className:"mb-1 size-5",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),(0,e.jsx)("span",{className:"font-bold inline-block pl-2 leading-none",children:s?.filter_txt?.filter||"Open Filter"})]}),s?.filter_txt?.found?(0,e.jsx)(i.Text,{className:"text-base font-bold text-[#86868C] md:hidden",html:s?.filter_txt?.found?.replace("${number}",l||0)}):(0,e.jsx)(i.Text,{className:"text-base font-bold text-[#86868C] md:hidden",html:`${l||0} Item(s) Found`})]}),(0,e.jsx)("div",{className:"hidden md-tablet:block",children:(0,e.jsxs)("div",{className:"flex items-center",onClick:()=>P?.(!0),children:[(0,e.jsx)(i.Picture,{className:"inline-block size-[20px]",source:"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638"}),(0,e.jsx)("span",{className:"font-bold inline-block pl-2 leading-none",children:s?.filter_txt?.filter||"Close Filter"})]})}),(0,e.jsxs)("div",{className:"flex items-center relative cursor-pointer",onClick:()=>u(!p),children:[(0,e.jsx)("span",{className:"text-base pr-1 text-[#777]",dangerouslySetInnerHTML:{__html:`${s?.filter_txt?.sort}: `||"Sort by: "}}),(0,e.jsx)(i.Text,{html:s?.filter_txt.sortList?.[x]?.txt||"Recommended",className:"text-base font-[700] text-[#333]"}),(0,e.jsx)("div",{className:`ml-1 size-4 duration-300 ease-in-out ${p&&"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)("ul",{className:(0,c.cn)("w-full bg-[#FFFFFF] z-10 py-2 px-0 rounded-lg transition-all duration-400 ease-in-out","md-tablet:left-0 md-tablet:top-[120%] md-tablet:text-left absolute top-[110%] right-0",p?"visibility opacity-100":"invisible opacity-0"),children:s?.filter_txt?.sortList?.map((a,r)=>(0,e.jsx)("li",{className:(0,c.cn)("cursor-pointer w-full py-3 px-4 text-base font-semibold text-[#333] [&:hover]:bg-[#f7f8f9]",r===x?"opacity-60":""),children:(0,e.jsx)("button",{name:a?.txt,className:"md-tablet:text-left",dangerouslySetInnerHTML:{__html:a?.txt},onClick:()=>{u(!1),F(r)}})},a?.txt+r))})]})]})]}),(0,e.jsx)("div",{className:"mb-2 hidden md-tablet:block",children:s?.filter_txt?.found?(0,e.jsx)(i.Text,{className:"text-base font-bold text-[#86868C]",html:s?.filter_txt?.found?.replace("${number}",l||0)}):(0,e.jsx)(i.Text,{className:"text-base font-bold text-[#86868C]",html:`${l||0} Item(s) Found`})})]})}
+//# sourceMappingURL=FilterHeader.js.map

package/dist/cjs/biz-components/CollectionsFilters/FilterHeader.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/CollectionsFilters/FilterHeader.tsx"],
+  "sourcesContent": ["import { cn } from '../../helpers/utils'\nimport { Picture, Text } from '../../components/index.js'\nimport TabFilter from './component/TabFilter'\nimport { cloneDeep } from 'es-toolkit'\nimport { useState, useMemo } from 'react'\n\ntype FilterHeaderProps = {\n  filtered: {\n    [key: string]: string[]\n  }\n  total?: number\n  filtersPair: any[]\n  sortKeyIndx: number\n  metafields: any\n  closeFilter: boolean\n  onClearFiltered: () => void\n  onTabChange?: (tab: any) => void\n  onSortChange: (sortKeyIndx: number) => void\n  onCloseFilter: (closeFilter: boolean) => void\n  onMobileOpenDrawer: (openDrawer: boolean) => void\n}\n\nexport default function FilterHeader(props: FilterHeaderProps) {\n  const {\n    total,\n    filtered,\n    filtersPair,\n    closeFilter,\n    metafields,\n    onSortChange,\n    onTabChange,\n    onCloseFilter,\n    onClearFiltered,\n    onMobileOpenDrawer,\n    sortKeyIndx,\n  } = props\n\n  const { shop_filters_pair: shopFiltersPair } = metafields\n\n  const [openSort, setOpenSort] = useState<boolean>(false)\n\n  const onCloseOrOpenFilter = (closeFilter: boolean) => onCloseFilter?.(closeFilter)\n\n  const mainPair = useMemo(() => {\n    return filtersPair?.find(item => item.mainPair)\n  }, [filtersPair])\n\n  const onTabClick = (tabs: any, tab: any) => {\n    const clonefiltered = cloneDeep(filtered)\n    const current = clonefiltered?.[tabs?.value] || []\n    clonefiltered[tabs?.value] = tab?.value ? [tab?.value] : []\n    if (current.length <= 0) {\n      Reflect.deleteProperty(clonefiltered, tab?.label)\n    }\n    onTabChange?.(clonefiltered)\n  }\n\n  return (\n    <div className=\"filter-header\">\n      <div className=\"mb-6\">\n        <TabFilter tabs={mainPair} tabShape=\"square\" onTabClick={onTabClick} />\n      </div>\n      <div\n        className={cn(\n          'desktop:gap-x-16 tablet:gap-x-8',\n          'relative flex md-tablet:p-0 text-base font-bold box-border',\n          'tablet:border-b tablet:border-[#E4E5E6] tablet:pb-4 tablet:mb-4 mb-2'\n        )}\n      >\n        {/* pc\u5C55\u793A\u7684\u7B5B\u9009(open\u72B6\u6001) */}\n        {!closeFilter && (\n          <div\n            className={cn(\n              'md-tablet:hidden flex-shrink-0 flex justify-between items-center',\n              'desktop:w-60 tablet:w-48 laptop:w-[210px] md-tablet:w-fit box-border'\n            )}\n          >\n            <div className=\"flex items-center cursor-pointer\" onClick={() => onCloseOrOpenFilter(true)}>\n              <Picture\n                className=\"mb-1 size-5\"\n                source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n              />\n              <span className=\"font-bold inline-block pl-2 leading-none\">\n                {shopFiltersPair?.filter_txt?.filter || 'Close Filter'}\n              </span>\n            </div>\n            <span\n              onClick={() => onClearFiltered()}\n              className=\"text-center text-base md:hidden font-bold text-[#1D1D1F] cursor-pointer box-border\"\n            >\n              Clear\n            </span>\n          </div>\n        )}\n        <div className=\"flex-1 flex items-center justify-between\">\n          {/* pc\u7AEF\u5C55\u793A\u7684\u7B5B\u9009\uFF08close\u72B6\u6001\uFF09 */}\n          <div className=\"md-tablet:hidden flex items-center gap-x-4\">\n            {closeFilter && (\n              <div className=\"flex items-center cursor-pointer\" onClick={() => onCloseOrOpenFilter(false)}>\n                <Picture\n                  className=\"mb-1 size-5\"\n                  source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n                />\n                <span className=\"font-bold inline-block pl-2 leading-none\">\n                  {shopFiltersPair?.filter_txt?.filter || 'Open Filter'}\n                </span>\n              </div>\n            )}\n            {shopFiltersPair?.filter_txt?.found ? (\n              <Text\n                className=\"text-base font-bold text-[#86868C] md:hidden\"\n                html={shopFiltersPair?.filter_txt?.found?.replace('${number}', total || 0)}\n              />\n            ) : (\n              <Text className=\"text-base font-bold text-[#86868C] md:hidden\" html={`${total || 0} Item(s) Found`} />\n            )}\n          </div>\n          {/* \u79FB\u52A8\u7AEF\u5C55\u793A\u7684\u7B5B\u9009 */}\n          <div className=\"hidden md-tablet:block\">\n            <div className=\"flex items-center\" onClick={() => onMobileOpenDrawer?.(true)}>\n              <Picture\n                className=\"inline-block size-[20px]\"\n                source=\"https://cdn.shopify.com/s/files/1/0508/1815/4652/files/icon_table-of-contents.svg?v=1694054638\"\n              />\n              <span className=\"font-bold inline-block pl-2 leading-none\">\n                {shopFiltersPair?.filter_txt?.filter || 'Close Filter'}\n              </span>\n            </div>\n          </div>\n          {/* \u6392\u5E8F */}\n          <div className=\"flex items-center relative cursor-pointer\" onClick={() => setOpenSort(!openSort)}>\n            <span\n              className=\"text-base pr-1 text-[#777]\"\n              dangerouslySetInnerHTML={{\n                __html: `${shopFiltersPair?.filter_txt?.sort}: ` || 'Sort by: ',\n              }}\n            />\n            <Text\n              html={shopFiltersPair?.filter_txt.sortList?.[sortKeyIndx]?.txt || 'Recommended'}\n              className=\"text-base font-[700] text-[#333]\"\n            />\n            <div className={`ml-1 size-4 duration-300 ease-in-out ${openSort && '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            <ul\n              className={cn(\n                'w-full bg-[#FFFFFF] z-10 py-2 px-0 rounded-lg transition-all duration-400 ease-in-out',\n                'md-tablet:left-0 md-tablet:top-[120%] md-tablet:text-left absolute top-[110%] right-0',\n                openSort ? 'visibility opacity-100' : 'invisible opacity-0'\n              )}\n            >\n              {shopFiltersPair?.filter_txt?.sortList?.map((l: any, k: number) => (\n                <li\n                  key={l?.txt + k}\n                  className={cn(\n                    'cursor-pointer w-full py-3 px-4 text-base font-semibold text-[#333] [&:hover]:bg-[#f7f8f9]',\n                    k === sortKeyIndx ? 'opacity-60' : ''\n                  )}\n                >\n                  <button\n                    name={l?.txt}\n                    className={'md-tablet:text-left'}\n                    dangerouslySetInnerHTML={{ __html: l?.txt }}\n                    onClick={() => {\n                      setOpenSort(false)\n                      onSortChange(k)\n                    }}\n                  />\n                </li>\n              ))}\n            </ul>\n          </div>\n        </div>\n      </div>\n      <div className=\"mb-2 hidden md-tablet:block\">\n        {shopFiltersPair?.filter_txt?.found ? (\n          <Text\n            className=\"text-base font-bold text-[#86868C]\"\n            html={shopFiltersPair?.filter_txt?.found?.replace('${number}', total || 0)}\n          />\n        ) : (\n          <Text className=\"text-base font-bold text-[#86868C]\" html={`${total || 0} Item(s) Found`} />\n        )}\n      </div>\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["FilterHeader_exports", "__export", "FilterHeader", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_components", "import_TabFilter", "import_es_toolkit", "import_react", "props", "total", "filtered", "filtersPair", "closeFilter", "metafields", "onSortChange", "onTabChange", "onCloseFilter", "onClearFiltered", "onMobileOpenDrawer", "sortKeyIndx", "shopFiltersPair", "openSort", "setOpenSort", "onCloseOrOpenFilter", "mainPair", "item", "TabFilter", "tabs", "tab", "clonefiltered", "current", "l", "k"]
+}

package/dist/cjs/biz-components/CollectionsFilters/FilterList.d.ts

@@ -0,0 +1,13 @@
+interface FilterListProps {
+    onFilteredChange: (filtered: any, filter: any, opt: any) => void;
+    onOpenOptions: (openOpt: any[]) => void;
+    noShowList: any[];
+    closeFilter: boolean;
+    filtersPair: any[];
+    filtered: any;
+    openOptions: any[];
+    mobileDrawerVisible: boolean;
+    onCloseDrawer: (closeDrawer: boolean) => void;
+}
+export default function FilterList(props: FilterListProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/FilterList.js

@@ -0,0 +1,2 @@
+"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"})]})})]})})]})}
+//# sourceMappingURL=FilterList.js.map

package/dist/cjs/biz-components/CollectionsFilters/FilterList.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/CollectionsFilters/FilterList.tsx"],
+  "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"],
+  "mappings": "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",
+  "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"]
+}

package/dist/cjs/biz-components/CollectionsFilters/Helper.d.ts

@@ -0,0 +1,8 @@
+export declare const deepMerger: (obj1: any, obj2: any) => any;
+export declare function paginate(arr: any[], pageSize: number, currentPage: number): {
+    pageItems: any[];
+    totalPages: number;
+    currentPage: number;
+    startIndex: number;
+    endIndex: number;
+};

package/dist/cjs/biz-components/CollectionsFilters/MoblieSortFilter.d.ts

@@ -0,0 +1,8 @@
+interface SortFilterProps {
+    openSort: boolean;
+    setOpenSort: (openSort: boolean) => void;
+    shopFiltersPair: any;
+    setSortKeyIndx: (sortKeyIndx: number) => void;
+}
+export default function SortFilter(props: SortFilterProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/SortFilter.d.ts

@@ -0,0 +1,8 @@
+interface SortFilterProps {
+    openSort: boolean;
+    setOpenSort: (openSort: boolean) => void;
+    shopFiltersPair: any;
+    setSortKeyIndx: (sortKeyIndx: number) => void;
+}
+export default function SortFilter(props: SortFilterProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/component/AnimatedUL.d.ts

@@ -0,0 +1,5 @@
+type AnimatedULProps = React.HTMLAttributes<HTMLUListElement> & {
+    isOpen: boolean;
+};
+export default function AnimatedUL({ isOpen, children, className, ...rest }: AnimatedULProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/biz-components/CollectionsFilters/component/AnimatedUL.js

@@ -0,0 +1,2 @@
+"use strict";var f=Object.create;var s=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var T=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var y=(e,t)=>{for(var i in t)s(e,i,{get:t[i],enumerable:!0})},d=(e,t,i,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of c(t))!m.call(e,p)&&p!==i&&s(e,p,{get:()=>t[p],enumerable:!(a=g(t,p))||a.enumerable});return e};var L=(e,t,i)=>(i=e!=null?f(T(e)):{},d(t||!e||!e.__esModule?s(i,"default",{value:e,enumerable:!0}):i,e)),H=e=>d(s({},"__esModule",{value:!0}),e);var w={};y(w,{default:()=>u});module.exports=H(w);var h=require("react/jsx-runtime"),r=require("react"),n=L(require("gsap"));function u({isOpen:e,children:t,className:i,...a}){const p=(0,r.useRef)(null);return(0,r.useLayoutEffect)(()=>{const o=p.current;if(o){if(n.default.killTweensOf(o),e){n.default.set(o,{height:"auto",paddingTop:"24px",opacity:1});const l=o.offsetHeight;n.default.set(o,{height:0,paddingTop:"0px",opacity:0}),n.default.to(o,{height:l,paddingTop:"24px",opacity:1,duration:.35,ease:"power2.out",onComplete:()=>{n.default.set(o,{height:"auto"})}})}else{const l=o.offsetHeight;n.default.set(o,{height:l,paddingTop:o.style.paddingTop||"16px",opacity:1}),n.default.to(o,{height:0,paddingTop:"0px",opacity:0,duration:.28,ease:"power2.in",onComplete:()=>{n.default.set(o,{height:0})}})}return()=>{p.current&&n.default.killTweensOf(p.current)}}},[e]),(0,h.jsx)("ul",{ref:p,className:i,style:{height:0,overflow:"hidden",paddingTop:0},...a,children:t})}
+//# sourceMappingURL=AnimatedUL.js.map

package/dist/cjs/biz-components/CollectionsFilters/component/AnimatedUL.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/CollectionsFilters/component/AnimatedUL.tsx"],
+  "sourcesContent": ["// \u9876\u90E8 imports\nimport { useLayoutEffect, useRef } from 'react'\nimport gsap from 'gsap'\n\ntype AnimatedULProps = React.HTMLAttributes<HTMLUListElement> & {\n  isOpen: boolean\n}\n\nexport default function AnimatedUL({ isOpen, children, className, ...rest }: AnimatedULProps) {\n  const ref = useRef<HTMLUListElement | null>(null)\n\n  useLayoutEffect(() => {\n    const el = ref.current\n    if (!el) return\n    // \u5148\u505C\u6B62\u5DF2\u6709 tween\uFF0C\u907F\u514D\u51B2\u7A81\n    gsap.killTweensOf(el)\n\n    if (isOpen) {\n      // \u5C55\u5F00\u6D41\u7A0B\uFF1A\u5148\u8BBE\u7F6E\u4E3A auto \u4EE5\u6D4B\u91CF\u5B8C\u6574\u9AD8\u5EA6\uFF0C\u518D\u56DE\u5230 0 \u5F00\u59CB\u52A8\u753B\n      gsap.set(el, { height: 'auto', paddingTop: '24px', opacity: 1 })\n      const fullHeight = el.offsetHeight // \u83B7\u53D6\u5C55\u5F00\u540E\u603B\u9AD8\u5EA6\n      // \u4ECE\u6536\u8D77\u72B6\u6001\u5F00\u59CB\u52A8\u753B\n      gsap.set(el, { height: 0, paddingTop: '0px', opacity: 0 })\n      gsap.to(el, {\n        height: fullHeight,\n        paddingTop: '24px',\n        opacity: 1,\n        duration: 0.35,\n        ease: 'power2.out',\n        onComplete: () => {\n          // \u52A8\u753B\u7ED3\u675F\u540E\u628A height \u8BBE\u4E3A auto \u4FDD\u6301\u81EA\u9002\u5E94\n          gsap.set(el, { height: 'auto' })\n        },\n      })\n    } else {\n      // \u6536\u8D77\u6D41\u7A0B\uFF1A\u5148\u628A\u5F53\u524D\u9AD8\u5EA6\u56FA\u5B9A\uFF0C\u518D\u52A8\u753B\u5230 0\n      const curHeight = el.offsetHeight\n      gsap.set(el, { height: curHeight, paddingTop: el.style.paddingTop || '16px', opacity: 1 })\n      gsap.to(el, {\n        height: 0,\n        paddingTop: '0px',\n        opacity: 0,\n        duration: 0.28,\n        ease: 'power2.in',\n        onComplete: () => {\n          // \u5B8C\u5168\u6536\u8D77\u540E\u4FDD\u6301 height \u4E3A 0\uFF08\u6216\u53EF\u79FB\u9664\u5185\u8054\u6837\u5F0F\uFF09\n          gsap.set(el, { height: 0 })\n        },\n      })\n    }\n\n    return () => {\n      // \u6E05\u7406\n      if (ref.current) gsap.killTweensOf(ref.current)\n    }\n  }, [isOpen])\n\n  // \u521D\u59CB\u6837\u5F0F\uFF1A\u6536\u8D77\u72B6\u6001\uFF08\u548C motion.ul \u7684 hidden \u72B6\u6001\u7B49\u4EF7\uFF09\n  return (\n    <ul ref={ref} className={className} style={{ height: 0, overflow: 'hidden', paddingTop: 0 }} {...rest}>\n      {children}\n    </ul>\n  )\n}\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA2DI,IAAAI,EAAA,6BA1DJC,EAAwC,iBACxCC,EAAiB,mBAMF,SAARJ,EAA4B,CAAE,OAAAK,EAAQ,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAK,EAAoB,CAC5F,MAAMC,KAAM,UAAgC,IAAI,EAEhD,4BAAgB,IAAM,CACpB,MAAMC,EAAKD,EAAI,QACf,GAAKC,EAIL,IAFA,EAAAC,QAAK,aAAaD,CAAE,EAEhBL,EAAQ,CAEV,EAAAM,QAAK,IAAID,EAAI,CAAE,OAAQ,OAAQ,WAAY,OAAQ,QAAS,CAAE,CAAC,EAC/D,MAAME,EAAaF,EAAG,aAEtB,EAAAC,QAAK,IAAID,EAAI,CAAE,OAAQ,EAAG,WAAY,MAAO,QAAS,CAAE,CAAC,EACzD,EAAAC,QAAK,GAAGD,EAAI,CACV,OAAQE,EACR,WAAY,OACZ,QAAS,EACT,SAAU,IACV,KAAM,aACN,WAAY,IAAM,CAEhB,EAAAD,QAAK,IAAID,EAAI,CAAE,OAAQ,MAAO,CAAC,CACjC,CACF,CAAC,CACH,KAAO,CAEL,MAAMG,EAAYH,EAAG,aACrB,EAAAC,QAAK,IAAID,EAAI,CAAE,OAAQG,EAAW,WAAYH,EAAG,MAAM,YAAc,OAAQ,QAAS,CAAE,CAAC,EACzF,EAAAC,QAAK,GAAGD,EAAI,CACV,OAAQ,EACR,WAAY,MACZ,QAAS,EACT,SAAU,IACV,KAAM,YACN,WAAY,IAAM,CAEhB,EAAAC,QAAK,IAAID,EAAI,CAAE,OAAQ,CAAE,CAAC,CAC5B,CACF,CAAC,CACH,CAEA,MAAO,IAAM,CAEPD,EAAI,SAAS,EAAAE,QAAK,aAAaF,EAAI,OAAO,CAChD,EACF,EAAG,CAACJ,CAAM,CAAC,KAIT,OAAC,MAAG,IAAKI,EAAK,UAAWF,EAAW,MAAO,CAAE,OAAQ,EAAG,SAAU,SAAU,WAAY,CAAE,EAAI,GAAGC,EAC9F,SAAAF,EACH,CAEJ",
+  "names": ["AnimatedUL_exports", "__export", "AnimatedUL", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "isOpen", "children", "className", "rest", "ref", "el", "gsap", "fullHeight", "curHeight"]
+}

package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface TabsProps {
+    tabs: {
+        options: any[];
+    };
+    tabShape?: 'rounded' | 'square';
+    onTabClick?: (tabs: any, value: any) => void;
+}
+declare const TabFilter: React.FC<TabsProps>;
+export default TabFilter;

package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var p=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var y=(t,e)=>{for(var n in e)p(t,n,{get:e[n],enumerable:!0})},v=(t,e,n,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of k(e))!m.call(t,a)&&a!==n&&p(t,a,{get:()=>e[a],enumerable:!(l=h(e,a))||l.enumerable});return t};var w=t=>v(p({},"__esModule",{value:!0}),t);var R={};y(R,{default:()=>C});module.exports=w(R);var s=require("react/jsx-runtime"),b=require("react"),r=require("../../../helpers/utils.js");const T=({tabs:t,onTabClick:e,tabShape:n="square"})=>{const l=(0,b.useRef)(null),a=t?.options?.find(o=>o?.checked),c=o=>{e?.(t,o);const i=document.getElementById(`tab-${o?.tab}`),d=l.current;if(i&&d){const f=i.offsetLeft,u=i.offsetWidth,x=d.offsetWidth,g=f-x/2+u/2;d.scrollTo({left:g,behavior:"smooth"})}};return t?.options?.length>0?(0,s.jsxs)("div",{ref:l,className:(0,r.cn)(n==="rounded"?"rounded-[28px]":"","tab-switch-wrap bg-tabs-list-bg relative flex gap-x-1 w-fit max-w-full overflow-x-auto overflow-y-hidden p-1 m-auto"),children:[(0,s.jsx)("button",{id:"tab-all",onClick:()=>c(""),className:(0,r.cn)("text-info-primary px-5 py-2.5 text-sm font-bold","relative flex-1 shrink-0 whitespace-nowrap transition-all","lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5",a?"":"bg-btn-primary-disabled-foreground",n==="rounded"?"rounded-[28px]":""),children:"All"}),t?.options?.map(o=>(0,s.jsx)("button",{id:`tab-${o?.label}`,onClick:()=>c(o),className:(0,r.cn)("text-info-primary px-5 py-2.5 text-sm font-bold","relative flex-1 shrink-0 whitespace-nowrap transition-all","lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5",o?.checked?"bg-btn-primary-disabled-foreground":"",n==="rounded"?"rounded-[28px]":""),children:o?.label||""},o?.label))]}):null};var C=T;
+//# sourceMappingURL=TabFilter.js.map

package/dist/cjs/biz-components/CollectionsFilters/component/TabFilter.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/CollectionsFilters/component/TabFilter.tsx"],
+  "sourcesContent": ["'use client'\nimport React, { useRef } from 'react'\nimport { cn } from '../../../helpers/utils.js'\n\ninterface TabsProps {\n  tabs: {\n    options: any[]\n  }\n  tabShape?: 'rounded' | 'square'\n  onTabClick?: (tabs: any, value: any) => void\n}\n\nconst TabFilter: React.FC<TabsProps> = ({ tabs, onTabClick, tabShape = 'square' }) => {\n  const tabRef = useRef<HTMLDivElement>(null)\n\n  const isActive = tabs?.options?.find(item => item?.checked)\n\n  const handleTabClick = (item: any) => {\n    onTabClick?.(tabs, item)\n    // \u83B7\u53D6\u5F53\u524D\u9009\u4E2D\u7684 tab \u5E76\u8BA1\u7B97\u4E0B\u5212\u7EBF\u4F4D\u7F6E\n    const tabElement = document.getElementById(`tab-${item?.tab}`)\n    // **\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E**\n    const container = tabRef.current\n    if (tabElement && container) {\n      const tabLeft = tabElement.offsetLeft // \u9009\u4E2D tab \u7684\u5DE6\u4FA7\u504F\u79FB\u91CF\n      const tabWidth = tabElement.offsetWidth\n      const containerWidth = container.offsetWidth\n      // \u8BA1\u7B97\u76EE\u6807\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u4F7F tab \u5C45\u4E2D\n      const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n      container.scrollTo({\n        left: scrollTo,\n        behavior: 'smooth',\n      })\n    }\n  }\n\n  return tabs?.options?.length > 0 ? (\n    <div\n      ref={tabRef}\n      className={cn(\n        tabShape === 'rounded' ? 'rounded-[28px]' : '',\n        'tab-switch-wrap bg-tabs-list-bg relative flex gap-x-1 w-fit max-w-full overflow-x-auto overflow-y-hidden p-1 m-auto'\n      )}\n    >\n      <button\n        id=\"tab-all\"\n        onClick={() => handleTabClick('')}\n        className={cn(\n          'text-info-primary px-5 py-2.5 text-sm font-bold',\n          'relative flex-1 shrink-0 whitespace-nowrap transition-all',\n          'lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5',\n          !isActive ? 'bg-btn-primary-disabled-foreground' : '',\n          tabShape === 'rounded' ? 'rounded-[28px]' : ''\n        )}\n      >\n        {'All'}\n      </button>\n      {tabs?.options?.map(item => (\n        <button\n          key={item?.label}\n          id={`tab-${item?.label}`}\n          onClick={() => handleTabClick(item)}\n          className={cn(\n            'text-info-primary px-5 py-2.5 text-sm font-bold',\n            'relative flex-1 shrink-0 whitespace-nowrap transition-all',\n            'lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5',\n            item?.checked ? 'bg-btn-primary-disabled-foreground' : '',\n            tabShape === 'rounded' ? 'rounded-[28px]' : ''\n          )}\n        >\n          {item?.label || ''}\n        </button>\n      ))}\n    </div>\n  ) : null\n}\n\nexport default TabFilter\n"],
+  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqCI,IAAAI,EAAA,6BApCJC,EAA8B,iBAC9BC,EAAmB,qCAUnB,MAAMC,EAAiC,CAAC,CAAE,KAAAC,EAAM,WAAAC,EAAY,SAAAC,EAAW,QAAS,IAAM,CACpF,MAAMC,KAAS,UAAuB,IAAI,EAEpCC,EAAWJ,GAAM,SAAS,KAAKK,GAAQA,GAAM,OAAO,EAEpDC,EAAkBD,GAAc,CACpCJ,IAAaD,EAAMK,CAAI,EAEvB,MAAME,EAAa,SAAS,eAAe,OAAOF,GAAM,GAAG,EAAE,EAEvDG,EAAYL,EAAO,QACzB,GAAII,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAE3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EAEA,OAAOZ,GAAM,SAAS,OAAS,KAC7B,QAAC,OACC,IAAKG,EACL,aAAW,MACTD,IAAa,UAAY,iBAAmB,GAC5C,qHACF,EAEA,oBAAC,UACC,GAAG,UACH,QAAS,IAAMI,EAAe,EAAE,EAChC,aAAW,MACT,kDACA,4DACA,yDACCF,EAAkD,GAAvC,qCACZF,IAAa,UAAY,iBAAmB,EAC9C,EAEC,eACH,EACCF,GAAM,SAAS,IAAIK,MAClB,OAAC,UAEC,GAAI,OAAOA,GAAM,KAAK,GACtB,QAAS,IAAMC,EAAeD,CAAI,EAClC,aAAW,MACT,kDACA,4DACA,yDACAA,GAAM,QAAU,qCAAuC,GACvDH,IAAa,UAAY,iBAAmB,EAC9C,EAEC,SAAAG,GAAM,OAAS,IAXXA,GAAM,KAYb,CACD,GACH,EACE,IACN,EAEA,IAAOX,EAAQK",
+  "names": ["TabFilter_exports", "__export", "TabFilter_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "TabFilter", "tabs", "onTabClick", "tabShape", "tabRef", "isActive", "item", "handleTabClick", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo"]
+}

package/dist/cjs/biz-components/CollectionsFilters/component/helper.d.ts

@@ -0,0 +1,8 @@
+export declare const deepMerger: (obj1: any, obj2: any) => any;
+export declare function paginate(arr: any[], pageSize: number, currentPage: number): {
+    pageItems: any[];
+    totalPages: number;
+    currentPage: number;
+    startIndex: number;
+    endIndex: number;
+};

package/dist/cjs/biz-components/CollectionsFilters/component/helper.js

@@ -0,0 +1,2 @@
+"use strict";var d=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var x=(s,n)=>{for(var t in n)d(s,t,{get:n[t],enumerable:!0})},M=(s,n,t,f)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of h(n))!m.call(s,e)&&e!==t&&d(s,e,{get:()=>n[e],enumerable:!(f=a(n,e))||f.enumerable});return s};var I=s=>M(d({},"__esModule",{value:!0}),s);var y={};x(y,{deepMerger:()=>o,paginate:()=>c});module.exports=I(y);const o=(s,n)=>{if(s===void 0)return n;for(let t in n)s[t]=s?.[t]||"",s[t].toString=="[object Object]"?s[t]=o(s[t],n[t]):s[t]=n?.[t]||"";return s};function c(s,n,t){n=Math.max(1,Math.floor(n||1));const f=s.length,e=Math.max(1,Math.ceil(f/n));t=Math.floor(t)||1,t<1&&(t=1),t>e&&(t=e);const l=(t-1)*n,i=Math.min(l+n,f);return{pageItems:s.slice(l,i),totalPages:e,currentPage:t,startIndex:l,endIndex:i-1}}
+//# sourceMappingURL=helper.js.map

package/dist/cjs/biz-components/CollectionsFilters/component/helper.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/biz-components/CollectionsFilters/component/helper.ts"],
+  "sourcesContent": ["//merge object\nexport const deepMerger = (obj1: any, obj2: any) => {\n  if (obj1 === undefined) return obj2\n  for (let key in obj2) {\n    obj1[key] = obj1?.[key] || ''\n    if (obj1[key].toString == '[object Object]') {\n      obj1[key] = deepMerger(obj1[key], obj2[key])\n    } else {\n      obj1[key] = obj2?.[key] || ''\n    }\n  }\n  return obj1\n}\n\nexport function paginate(arr: any[], pageSize: number, currentPage: number) {\n  pageSize = Math.max(1, Math.floor(pageSize || 1));\n  const total = arr.length;\n  const totalPages = Math.max(1, Math.ceil(total / pageSize));\n\n  // \u628A currentPage \u9650\u5236\u5728 [1, totalPages]\n  currentPage = Math.floor(currentPage) || 1;\n  if (currentPage < 1) currentPage = 1;\n  if (currentPage > totalPages) currentPage = totalPages;\n\n  const startIndex = (currentPage - 1) * pageSize;\n  const endIndex = Math.min(startIndex + pageSize, total); // \u4E0D\u5305\u542B endIndex \u7684 slice \u7ED3\u675F\u4F4D\u7F6E\n\n  const pageItems = arr.slice(startIndex, endIndex);\n\n  return {\n    pageItems,\n    totalPages,\n    currentPage,\n    startIndex,\n    endIndex: endIndex - 1, // \u66F4\u76F4\u89C2\u7684\u7ED3\u675F\u4E0B\u6807\uFF08\u5305\u542B\uFF09\n  };\n}"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,EAAA,aAAAC,IAAA,eAAAC,EAAAJ,GACO,MAAME,EAAa,CAACG,EAAWC,IAAc,CAClD,GAAID,IAAS,OAAW,OAAOC,EAC/B,QAASC,KAAOD,EACdD,EAAKE,CAAG,EAAIF,IAAOE,CAAG,GAAK,GACvBF,EAAKE,CAAG,EAAE,UAAY,kBACxBF,EAAKE,CAAG,EAAIL,EAAWG,EAAKE,CAAG,EAAGD,EAAKC,CAAG,CAAC,EAE3CF,EAAKE,CAAG,EAAID,IAAOC,CAAG,GAAK,GAG/B,OAAOF,CACT,EAEO,SAASF,EAASK,EAAYC,EAAkBC,EAAqB,CAC1ED,EAAW,KAAK,IAAI,EAAG,KAAK,MAAMA,GAAY,CAAC,CAAC,EAChD,MAAME,EAAQH,EAAI,OACZI,EAAa,KAAK,IAAI,EAAG,KAAK,KAAKD,EAAQF,CAAQ,CAAC,EAG1DC,EAAc,KAAK,MAAMA,CAAW,GAAK,EACrCA,EAAc,IAAGA,EAAc,GAC/BA,EAAcE,IAAYF,EAAcE,GAE5C,MAAMC,GAAcH,EAAc,GAAKD,EACjCK,EAAW,KAAK,IAAID,EAAaJ,EAAUE,CAAK,EAItD,MAAO,CACL,UAHgBH,EAAI,MAAMK,EAAYC,CAAQ,EAI9C,WAAAF,EACA,YAAAF,EACA,WAAAG,EACA,SAAUC,EAAW,CACvB,CACF",
+  "names": ["helper_exports", "__export", "deepMerger", "paginate", "__toCommonJS", "obj1", "obj2", "key", "arr", "pageSize", "currentPage", "total", "totalPages", "startIndex", "endIndex"]
+}