@anker-in/headless-ui 0.0.27-alpha.37 → 0.0.27-alpha.39

package/dist/esm/biz-components/Category/index.d.ts

@@ -1,9 +1,7 @@
 export interface CategoryItem {
     /** 产品图片*/
-    img: {
-        url: string;
-    };
-    title: string;
+    image: string;
+    name: string;
 }
 export interface CategoryProps {
     className?: string;
@@ -15,6 +13,10 @@ export interface CategoryProps {
         shape?: 'round' | 'square';
         title?: string;
     };
+    buildData?: {
+        categories: any[];
+        products: any[];
+    };
     key?: string;
 }
 declare const _default: {

package/dist/esm/biz-components/Category/index.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import"react";import{cn as o}from"../../helpers/utils.js";import l from"../../components/picture.js";import{withStyles as a}from"../../shared/Styles.js";import p from"../Title/index.js";import n from"../SwiperBox/index.js";const c=({data:e,configuration:r})=>s("div",{className:o("box-border flex w-full flex-col overflow-hidden bg-[#EAEAEC]","laptop:p-6 desktop:p-8 p-4 hover:bg-[#FFFFFF] cursor-pointer",r?.shape==="round"?"rounded-[16px]":"rounded-none"),children:[t(l,{className:"flex h-full items-center object-cover",source:e?.img?.url}),t("p",{className:"desktop:text-lg flex-1 text-center text-sm font-semibold",children:e?.title})]}),d=({data:e,className:r="",key:i})=>s("div",{className:o("w-full",r),children:[e?.title&&t(p,{data:{title:e?.title}}),t(n,{className:"!overflow-visible",id:"Category"+i,data:{list:e?.products,configuration:{shape:e?.shape}},Slide:c,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:2.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:5}}})]});var h=a(d);export{h as default};
+"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import"react";import{cn as o}from"../../helpers/utils.js";import l from"../../components/picture.js";import{withStyles as p}from"../../shared/Styles.js";import n from"../Title/index.js";import c from"../SwiperBox/index.js";const m=({data:e,configuration:r})=>s("div",{className:o("box-border flex w-full flex-col overflow-hidden bg-[#EAEAEC]","laptop:p-6 desktop:p-8 cursor-pointer p-4 hover:bg-[#FFFFFF]",r?.shape==="round"?"rounded-[16px]":"rounded-none"),children:[t(l,{className:"tablet:h-[146px] mb-2 flex h-[74px] w-full items-center object-cover",source:e?.image}),t("p",{className:"tablet:text-lg flex-1 text-center text-sm font-semibold",children:e?.name})]}),d=({data:e,buildData:r,className:a="",key:i})=>(console.log(e,r,"54444"),s("div",{className:o("w-full",a),children:[e?.title&&t(n,{data:{title:e?.title}}),t(c,{className:"!overflow-visible",id:"Category"+i,data:{list:e?.products,configuration:{shape:e?.shape}},Slide:m,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:2.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:5}}})]}));var h=p(d);export{h as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Category/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Category/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\n\nexport interface CategoryItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img: {\n    url: string\n  }\n  title: string\n}\n\nexport interface CategoryProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  theme?: 'light' | 'dark'\n  data: {\n    products: CategoryItem[]\n    /** \u5361\u7247\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    title?: string\n  }\n  key?: string\n}\n\nconst CategoryItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'box-border flex w-full flex-col overflow-hidden bg-[#EAEAEC]',\n        'laptop:p-6 desktop:p-8 p-4 hover:bg-[#FFFFFF] cursor-pointer',\n        configuration?.shape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n      )}\n    >\n      <Picture className=\"flex h-full items-center object-cover\" source={data?.img?.url} />\n      <p className=\"desktop:text-lg flex-1 text-center text-sm font-semibold\">{data?.title}</p>\n    </div>\n  )\n}\n\nconst Category: React.FC<CategoryProps> = ({ data, className = '', key }) => {\n  return (\n    <div className={cn('w-full', className)}>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <SwiperBox\n        className=\"!overflow-visible\"\n        id={'Category' + key}\n        data={{ list: data?.products, configuration: { shape: data?.shape } }}\n        Slide={CategoryItem}\n        breakpoints={{\n          0: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 1,\n          },\n          374: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 2.3,\n          },\n          768: {\n            spaceBetween: '16px',\n            freeMode: false,\n            slidesPerView: 5,\n          },\n        }}\n      />\n    </div>\n  )\n}\n\nexport default withStyles(Category)\n"],
-  "mappings": "aA+BI,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBA9BJ,MAAkB,QAClB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAS,cAAAC,MAAkB,yBAC3B,OAAOC,MAAW,oBAClB,OAAOC,MAAe,wBAuBtB,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAExCR,EAAC,OACC,UAAWC,EACT,+DACA,+DACAO,GAAe,QAAU,QAAU,iBAAmB,cACxD,EAEA,UAAAT,EAACG,EAAA,CAAQ,UAAU,wCAAwC,OAAQK,GAAM,KAAK,IAAK,EACnFR,EAAC,KAAE,UAAU,2DAA4D,SAAAQ,GAAM,MAAM,GACvF,EAIEE,EAAoC,CAAC,CAAE,KAAAF,EAAM,UAAAG,EAAY,GAAI,IAAAC,CAAI,IAEnEX,EAAC,OAAI,UAAWC,EAAG,SAAUS,CAAS,EACnC,UAAAH,GAAM,OAASR,EAACK,EAAA,CAAM,KAAM,CAAE,MAAOG,GAAM,KAAM,EAAG,EACrDR,EAACM,EAAA,CACC,UAAU,oBACV,GAAI,WAAaM,EACjB,KAAM,CAAE,KAAMJ,GAAM,SAAU,cAAe,CAAE,MAAOA,GAAM,KAAM,CAAE,EACpE,MAAOD,EACP,YAAa,CACX,EAAG,CACD,aAAc,OACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,EAIJ,IAAOM,EAAQT,EAAWM,CAAQ",
-  "names": ["jsx", "jsxs", "cn", "Picture", "withStyles", "Title", "SwiperBox", "CategoryItem", "data", "configuration", "Category", "className", "key", "Category_default"]
+  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\n\nexport interface CategoryItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  image: string\n  name: string\n}\n\nexport interface CategoryProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  theme?: 'light' | 'dark'\n  data: {\n    products: CategoryItem[]\n    /** \u5361\u7247\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    title?: string\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  key?: string\n}\n\nconst CategoryItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'box-border flex w-full flex-col overflow-hidden bg-[#EAEAEC]',\n        'laptop:p-6 desktop:p-8 cursor-pointer p-4 hover:bg-[#FFFFFF]',\n        configuration?.shape === 'round' ? 'rounded-[16px]' : 'rounded-none'\n      )}\n    >\n      <Picture className=\"tablet:h-[146px] mb-2 flex h-[74px] w-full items-center object-cover\" source={data?.image} />\n      <p className=\"tablet:text-lg flex-1 text-center text-sm font-semibold\">{data?.name}</p>\n    </div>\n  )\n}\n\nconst Category: React.FC<CategoryProps> = ({ data, buildData, className = '', key }) => {\n  console.log(data, buildData, '54444')\n  return (\n    <div className={cn('w-full', className)}>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <SwiperBox\n        className=\"!overflow-visible\"\n        id={'Category' + key}\n        data={{ list: data?.products, configuration: { shape: data?.shape } }}\n        Slide={CategoryItem}\n        breakpoints={{\n          0: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 1,\n          },\n          374: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 2.3,\n          },\n          768: {\n            spaceBetween: '16px',\n            freeMode: false,\n            slidesPerView: 5,\n          },\n        }}\n      />\n    </div>\n  )\n}\n\nexport default withStyles(Category)\n"],
+  "mappings": "aAiCI,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBAhCJ,MAAkB,QAClB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAS,cAAAC,MAAkB,yBAC3B,OAAOC,MAAW,oBAClB,OAAOC,MAAe,wBAyBtB,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAExCR,EAAC,OACC,UAAWC,EACT,+DACA,+DACAO,GAAe,QAAU,QAAU,iBAAmB,cACxD,EAEA,UAAAT,EAACG,EAAA,CAAQ,UAAU,uEAAuE,OAAQK,GAAM,MAAO,EAC/GR,EAAC,KAAE,UAAU,0DAA2D,SAAAQ,GAAM,KAAK,GACrF,EAIEE,EAAoC,CAAC,CAAE,KAAAF,EAAM,UAAAG,EAAW,UAAAC,EAAY,GAAI,IAAAC,CAAI,KAChF,QAAQ,IAAIL,EAAMG,EAAW,OAAO,EAElCV,EAAC,OAAI,UAAWC,EAAG,SAAUU,CAAS,EACnC,UAAAJ,GAAM,OAASR,EAACK,EAAA,CAAM,KAAM,CAAE,MAAOG,GAAM,KAAM,EAAG,EACrDR,EAACM,EAAA,CACC,UAAU,oBACV,GAAI,WAAaO,EACjB,KAAM,CAAE,KAAML,GAAM,SAAU,cAAe,CAAE,MAAOA,GAAM,KAAM,CAAE,EACpE,MAAOD,EACP,YAAa,CACX,EAAG,CACD,aAAc,OACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,GAIJ,IAAOO,EAAQV,EAAWM,CAAQ",
+  "names": ["jsx", "jsxs", "cn", "Picture", "withStyles", "Title", "SwiperBox", "CategoryItem", "data", "configuration", "Category", "buildData", "className", "key", "Category_default"]
 }

package/dist/esm/biz-components/Evaluate/index.js

@@ -1,2 +1,2 @@
-"use client";import{Fragment as w,jsx as e,jsxs as r}from"react/jsx-runtime";import"react";import d from"../Title/index.js";import{cn as i}from"../../helpers/utils.js";import m from"../../components/picture.js";import p from"../SwiperBox/index.js";import{withStyles as c}from"../../shared/Styles.js";import{Avatar as v,AvatarImage as f,AvatarFallback as u}from"../../components/avatar.js";const x=({data:t,configuration:s})=>{const o=l=>l?Array.from(new Array(Number(l)))||[]:[];return r("div",{className:i("box-border flex w-full flex-col overflow-hidden bg-[#EAEAEC] p-4","hover:bg-[#FFFFFF] cursor-pointer",s?.shape==="round"?"rounded-2xl":"rounded-none"),children:[r("div",{className:i("laptop:mb-11 desktop:mb-16 mb-8 flex w-full justify-between"),children:[r("div",{className:"flex-1",children:[e("h4",{className:"laptop:text-lg text-sm font-semibold",children:t?.title}),e("div",{className:"mt-1 flex items-center",children:o(t?.rating)?.map?.((l,a)=>e("div",{className:"mr-1",children:e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})})},a))})]}),e("div",{className:"desktop:size-12 size-10 overflow-hidden",children:r(v,{className:"size-full",children:[e(f,{src:t?.avatar?.url}),e(u,{children:t?.title})]})})]}),e("p",{className:"desktop:text-2xl line-clamp-6 flex-1 text-xl font-bold text-[#1D1D1F]",children:t?.description||""}),r("div",{className:i("mt-11 flex items-center overflow-hidden bg-[#F7F8F9] p-3",s?.shape==="round"?"rounded-[8px]":"rounded-none"),children:[e("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:e(m,{className:"w-full object-cover",source:t?.img?.url})}),e("p",{className:"desktop:text-lg line-clamp-2 flex-1 text-sm font-semibold",children:t?.subTitle||""})]})]})},g=({className:t="",data:s,key:o})=>{const{products:l,title:a,...n}=s;return e(w,{children:r("div",{className:i("w-full",t),children:[a&&e(d,{data:{title:a}}),e(p,{className:"!overflow-visible",id:"Evaluate"+o,data:{list:l,configuration:{...n}},Slide:x,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:4}}})]})})};var A=c(g);export{A as default};
+"use client";import{Fragment as w,jsx as e,jsxs as r}from"react/jsx-runtime";import"react";import d from"../Title/index.js";import{cn as i}from"../../helpers/utils.js";import m from"../../components/picture.js";import p from"../SwiperBox/index.js";import{withStyles as c}from"../../shared/Styles.js";import{Avatar as v,AvatarImage as f,AvatarFallback as u}from"../../components/avatar.js";const x=({data:t,configuration:s})=>{const o=l=>l?Array.from(new Array(Number(l)))||[]:[];return r("div",{className:i("box-border flex w-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4 hover:bg-[#FFFFFF]",s?.shape==="round"?"rounded-2xl":"rounded-none"),children:[r("div",{className:i("laptop:mb-11 desktop:mb-16 mb-8 flex w-full justify-between"),children:[r("div",{className:"flex-1",children:[e("h4",{className:"laptop:text-lg text-sm font-semibold",children:t?.title}),e("div",{className:"mt-1 flex items-center",children:o(t?.rating)?.map?.((l,a)=>e("div",{className:"mr-1",children:e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})})},a))})]}),e("div",{className:"desktop:size-12 size-10 overflow-hidden",children:r(v,{className:"size-full",children:[e(f,{src:t?.avatar?.url}),e(u,{children:t?.title})]})})]}),e("p",{className:"desktop:text-2xl line-clamp-6 flex-1 text-xl font-bold text-[#1D1D1F]",children:t?.description||""}),r("div",{className:i("mt-11 flex items-center overflow-hidden bg-[#F7F8F9] p-3",s?.shape==="round"?"rounded-[8px]":"rounded-none"),children:[e("div",{className:"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center",children:e(m,{className:"w-full object-cover",source:t?.img?.url})}),e("p",{className:"desktop:text-lg line-clamp-2 flex-1 text-sm font-semibold",children:t?.subTitle||""})]})]})},g=({className:t="",data:s,key:o})=>{const{products:l,title:a,...n}=s;return e(w,{children:r("div",{className:i("w-full",t),children:[a&&e(d,{data:{title:a}}),e(p,{className:"!overflow-visible",id:"Evaluate"+o,data:{list:l,configuration:{...n}},Slide:x,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:4}}})]})})};var A=c(g);export{A as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Evaluate/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Evaluate/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Avatar, AvatarImage, AvatarFallback } from '../../components/avatar.js'\n\nexport interface EvaluateItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img: {\n    url: string\n  }\n  title: string\n  subTitle: string\n  description: string\n  avatar?: {\n    url: string\n  }\n  rating: number\n}\n\nexport interface EvaluateProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  theme?: 'light' | 'dark'\n  data: {\n    title?: string\n    products: EvaluateItem[]\n    /** \u5F62\u72B6 */\n    shape?: 'round' | 'square'\n  }\n  key?: string\n}\n\nconst EvaluateItem = ({ data, configuration }: { data: EvaluateItem; configuration?: any }) => {\n  const handleRating = (num: number) => {\n    if (num) {\n      return Array.from(new Array(Number(num))) || []\n    }\n    return []\n  }\n\n  return (\n    <div\n      className={cn(\n        'box-border flex w-full flex-col overflow-hidden bg-[#EAEAEC] p-4',\n        'hover:bg-[#FFFFFF] cursor-pointer',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className={cn('laptop:mb-11 desktop:mb-16 mb-8 flex w-full justify-between')}>\n        <div className=\"flex-1\">\n          <h4 className=\"laptop:text-lg text-sm font-semibold\">{data?.title}</h4>\n          <div className=\"mt-1 flex items-center\">\n            {handleRating(data?.rating)?.map?.((_, index) => {\n              return (\n                <div key={index} className=\"mr-1\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n                    <path\n                      d=\"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z\"\n                      fill=\"#F77234\"\n                    />\n                  </svg>\n                </div>\n              )\n            })}\n          </div>\n        </div>\n        <div className=\"desktop:size-12 size-10 overflow-hidden\">\n          <Avatar className=\"size-full\">\n            <AvatarImage src={data?.avatar?.url} />\n            <AvatarFallback>{data?.title}</AvatarFallback>\n          </Avatar>\n        </div>\n      </div>\n      <p className=\"desktop:text-2xl line-clamp-6 flex-1 text-xl font-bold text-[#1D1D1F]\">{data?.description || ''}</p>\n      <div\n        className={cn(\n          'mt-11 flex items-center overflow-hidden bg-[#F7F8F9] p-3',\n          configuration?.shape === 'round' ? 'rounded-[8px]' : 'rounded-none'\n        )}\n      >\n        <div className=\"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center\">\n          <Picture className=\"w-full object-cover\" source={data?.img?.url} />\n        </div>\n        <p className=\"desktop:text-lg line-clamp-2 flex-1 text-sm font-semibold\">{data?.subTitle || ''}</p>\n      </div>\n    </div>\n  )\n}\n\nconst Evaluate: React.FC<EvaluateProps> = ({ className = '', data, key }) => {\n  const { products, title, ...ohter } = data\n  return (\n    <>\n      <div className={cn('w-full', className)}>\n        {title && <Title data={{ title: title }} />}\n        <SwiperBox\n          className=\"!overflow-visible\"\n          id={'Evaluate' + key}\n          data={{ list: products, configuration: { ...ohter } }}\n          Slide={EvaluateItem}\n          breakpoints={{\n            0: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1.3,\n            },\n            768: {\n              spaceBetween: '16px',\n              freeMode: false,\n              slidesPerView: 4,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nexport default withStyles(Evaluate)\n"],
-  "mappings": "aAqDQ,OA2CJ,YAAAA,EA1CM,OAAAC,EADF,QAAAC,MAAA,oBApDR,MAAkB,QAClB,OAAOC,MAAW,oBAClB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAOC,MAAe,wBACtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,UAAAC,EAAQ,eAAAC,EAAa,kBAAAC,MAAsB,6BA6BpD,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAAmD,CAC7F,MAAMC,EAAgBC,GAChBA,EACK,MAAM,KAAK,IAAI,MAAM,OAAOA,CAAG,CAAC,CAAC,GAAK,CAAC,EAEzC,CAAC,EAGV,OACEb,EAAC,OACC,UAAWE,EACT,mEACA,oCACAS,GAAe,QAAU,QAAU,cAAgB,cACrD,EAEA,UAAAX,EAAC,OAAI,UAAWE,EAAG,6DAA6D,EAC9E,UAAAF,EAAC,OAAI,UAAU,SACb,UAAAD,EAAC,MAAG,UAAU,uCAAwC,SAAAW,GAAM,MAAM,EAClEX,EAAC,OAAI,UAAU,yBACZ,SAAAa,EAAaF,GAAM,MAAM,GAAG,MAAM,CAACI,EAAGC,IAEnChB,EAAC,OAAgB,UAAU,OACzB,SAAAA,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,GANQgB,CAOV,CAEH,EACH,GACF,EACAhB,EAAC,OAAI,UAAU,0CACb,SAAAC,EAACM,EAAA,CAAO,UAAU,YAChB,UAAAP,EAACQ,EAAA,CAAY,IAAKG,GAAM,QAAQ,IAAK,EACrCX,EAACS,EAAA,CAAgB,SAAAE,GAAM,MAAM,GAC/B,EACF,GACF,EACAX,EAAC,KAAE,UAAU,wEAAyE,SAAAW,GAAM,aAAe,GAAG,EAC9GV,EAAC,OACC,UAAWE,EACT,2DACAS,GAAe,QAAU,QAAU,gBAAkB,cACvD,EAEA,UAAAZ,EAAC,OAAI,UAAU,gEACb,SAAAA,EAACI,EAAA,CAAQ,UAAU,sBAAsB,OAAQO,GAAM,KAAK,IAAK,EACnE,EACAX,EAAC,KAAE,UAAU,4DAA6D,SAAAW,GAAM,UAAY,GAAG,GACjG,GACF,CAEJ,EAEMM,EAAoC,CAAC,CAAE,UAAAC,EAAY,GAAI,KAAAP,EAAM,IAAAQ,CAAI,IAAM,CAC3E,KAAM,CAAE,SAAAC,EAAU,MAAAC,EAAO,GAAGC,CAAM,EAAIX,EACtC,OACEX,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,UAAWE,EAAG,SAAUe,CAAS,EACnC,UAAAG,GAASrB,EAACE,EAAA,CAAM,KAAM,CAAE,MAAOmB,CAAM,EAAG,EACzCrB,EAACK,EAAA,CACC,UAAU,oBACV,GAAI,WAAac,EACjB,KAAM,CAAE,KAAMC,EAAU,cAAe,CAAE,GAAGE,CAAM,CAAE,EACpD,MAAOZ,EACP,YAAa,CACX,EAAG,CACD,aAAc,OACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,EACF,CAEJ,EAEA,IAAOa,EAAQjB,EAAWW,CAAQ",
+  "sourcesContent": ["'use client'\nimport React from 'react'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { Avatar, AvatarImage, AvatarFallback } from '../../components/avatar.js'\n\nexport interface EvaluateItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img: {\n    url: string\n  }\n  title: string\n  subTitle: string\n  description: string\n  avatar?: {\n    url: string\n  }\n  rating: number\n}\n\nexport interface EvaluateProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  theme?: 'light' | 'dark'\n  data: {\n    title?: string\n    products: EvaluateItem[]\n    /** \u5F62\u72B6 */\n    shape?: 'round' | 'square'\n  }\n  key?: string\n}\n\nconst EvaluateItem = ({ data, configuration }: { data: EvaluateItem; configuration?: any }) => {\n  const handleRating = (num: number) => {\n    if (num) {\n      return Array.from(new Array(Number(num))) || []\n    }\n    return []\n  }\n\n  return (\n    <div\n      className={cn(\n        'box-border flex w-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4 hover:bg-[#FFFFFF]',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className={cn('laptop:mb-11 desktop:mb-16 mb-8 flex w-full justify-between')}>\n        <div className=\"flex-1\">\n          <h4 className=\"laptop:text-lg text-sm font-semibold\">{data?.title}</h4>\n          <div className=\"mt-1 flex items-center\">\n            {handleRating(data?.rating)?.map?.((_, index) => {\n              return (\n                <div key={index} className=\"mr-1\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n                    <path\n                      d=\"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z\"\n                      fill=\"#F77234\"\n                    />\n                  </svg>\n                </div>\n              )\n            })}\n          </div>\n        </div>\n        <div className=\"desktop:size-12 size-10 overflow-hidden\">\n          <Avatar className=\"size-full\">\n            <AvatarImage src={data?.avatar?.url} />\n            <AvatarFallback>{data?.title}</AvatarFallback>\n          </Avatar>\n        </div>\n      </div>\n      <p className=\"desktop:text-2xl line-clamp-6 flex-1 text-xl font-bold text-[#1D1D1F]\">{data?.description || ''}</p>\n      <div\n        className={cn(\n          'mt-11 flex items-center overflow-hidden bg-[#F7F8F9] p-3',\n          configuration?.shape === 'round' ? 'rounded-[8px]' : 'rounded-none'\n        )}\n      >\n        <div className=\"laptop:size-16 desktop:size-20 mr-3 flex size-12 items-center\">\n          <Picture className=\"w-full object-cover\" source={data?.img?.url} />\n        </div>\n        <p className=\"desktop:text-lg line-clamp-2 flex-1 text-sm font-semibold\">{data?.subTitle || ''}</p>\n      </div>\n    </div>\n  )\n}\n\nconst Evaluate: React.FC<EvaluateProps> = ({ className = '', data, key }) => {\n  const { products, title, ...ohter } = data\n  return (\n    <>\n      <div className={cn('w-full', className)}>\n        {title && <Title data={{ title: title }} />}\n        <SwiperBox\n          className=\"!overflow-visible\"\n          id={'Evaluate' + key}\n          data={{ list: products, configuration: { ...ohter } }}\n          Slide={EvaluateItem}\n          breakpoints={{\n            0: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: '12px',\n              freeMode: false,\n              slidesPerView: 1.3,\n            },\n            768: {\n              spaceBetween: '16px',\n              freeMode: false,\n              slidesPerView: 4,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nexport default withStyles(Evaluate)\n"],
+  "mappings": "aAoDQ,OA2CJ,YAAAA,EA1CM,OAAAC,EADF,QAAAC,MAAA,oBAnDR,MAAkB,QAClB,OAAOC,MAAW,oBAClB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAa,8BACpB,OAAOC,MAAe,wBACtB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,UAAAC,EAAQ,eAAAC,EAAa,kBAAAC,MAAsB,6BA6BpD,MAAMC,EAAe,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,IAAmD,CAC7F,MAAMC,EAAgBC,GAChBA,EACK,MAAM,KAAK,IAAI,MAAM,OAAOA,CAAG,CAAC,CAAC,GAAK,CAAC,EAEzC,CAAC,EAGV,OACEb,EAAC,OACC,UAAWE,EACT,qGACAS,GAAe,QAAU,QAAU,cAAgB,cACrD,EAEA,UAAAX,EAAC,OAAI,UAAWE,EAAG,6DAA6D,EAC9E,UAAAF,EAAC,OAAI,UAAU,SACb,UAAAD,EAAC,MAAG,UAAU,uCAAwC,SAAAW,GAAM,MAAM,EAClEX,EAAC,OAAI,UAAU,yBACZ,SAAAa,EAAaF,GAAM,MAAM,GAAG,MAAM,CAACI,EAAGC,IAEnChB,EAAC,OAAgB,UAAU,OACzB,SAAAA,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,EAAE,6oBACF,KAAK,UACP,EACF,GANQgB,CAOV,CAEH,EACH,GACF,EACAhB,EAAC,OAAI,UAAU,0CACb,SAAAC,EAACM,EAAA,CAAO,UAAU,YAChB,UAAAP,EAACQ,EAAA,CAAY,IAAKG,GAAM,QAAQ,IAAK,EACrCX,EAACS,EAAA,CAAgB,SAAAE,GAAM,MAAM,GAC/B,EACF,GACF,EACAX,EAAC,KAAE,UAAU,wEAAyE,SAAAW,GAAM,aAAe,GAAG,EAC9GV,EAAC,OACC,UAAWE,EACT,2DACAS,GAAe,QAAU,QAAU,gBAAkB,cACvD,EAEA,UAAAZ,EAAC,OAAI,UAAU,gEACb,SAAAA,EAACI,EAAA,CAAQ,UAAU,sBAAsB,OAAQO,GAAM,KAAK,IAAK,EACnE,EACAX,EAAC,KAAE,UAAU,4DAA6D,SAAAW,GAAM,UAAY,GAAG,GACjG,GACF,CAEJ,EAEMM,EAAoC,CAAC,CAAE,UAAAC,EAAY,GAAI,KAAAP,EAAM,IAAAQ,CAAI,IAAM,CAC3E,KAAM,CAAE,SAAAC,EAAU,MAAAC,EAAO,GAAGC,CAAM,EAAIX,EACtC,OACEX,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,UAAWE,EAAG,SAAUe,CAAS,EACnC,UAAAG,GAASrB,EAACE,EAAA,CAAM,KAAM,CAAE,MAAOmB,CAAM,EAAG,EACzCrB,EAACK,EAAA,CACC,UAAU,oBACV,GAAI,WAAac,EACjB,KAAM,CAAE,KAAMC,EAAU,cAAe,CAAE,GAAGE,CAAM,CAAE,EACpD,MAAOZ,EACP,YAAa,CACX,EAAG,CACD,aAAc,OACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,OACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,GACF,EACF,CAEJ,EAEA,IAAOa,EAAQjB,EAAWW,CAAQ",
   "names": ["Fragment", "jsx", "jsxs", "Title", "cn", "Picture", "SwiperBox", "withStyles", "Avatar", "AvatarImage", "AvatarFallback", "EvaluateItem", "data", "configuration", "handleRating", "num", "_", "index", "Evaluate", "className", "key", "products", "title", "ohter", "Evaluate_default"]
 }

package/dist/esm/biz-components/ShelfDisplay/index.d.ts

@@ -17,6 +17,10 @@ export interface ShelfDisplayItem {
     tab?: string;
     data?: ShelfDisplayItem[];
 }
+type EventType = {
+    primaryButton?: (v: any) => void;
+    secondaryButton?: (v: any) => void;
+};
 export interface ShelfDisplayProps {
     data: {
         title?: string;
@@ -39,18 +43,11 @@ export interface ShelfDisplayProps {
         categories: any[];
         products: any[];
     };
+    /** 按钮事件*/
+    event?: EventType;
     /** 主题色*/
     theme?: 'light' | 'dark';
     className?: string;
-    /** 按钮事件*/
-    event?: {
-        primaryButton?: {
-            onClick: (v: any) => void;
-        };
-        secondaryButton?: {
-            onClick: (v: any) => void;
-        };
-    };
     key?: string;
 }
 declare const _default: {

package/dist/esm/biz-components/ShelfDisplay/index.js

@@ -1,10 +1,10 @@
-"use client";import{jsx as t,jsxs as d}from"react/jsx-runtime";import{useState as g,useEffect as N}from"react";import{cn as f}from"../../helpers/utils.js";import T from"../../components/picture.js";import{Tabs as C,TabsList as I,TabsTrigger as P}from"../../components/tabs.js";import v from"../../components/button.js";import F from"../Title/index.js";import A from"../SwiperBox/index.js";import{withStyles as E}from"../../shared/Styles.js";import{formatVariantPrice as V}from"./shelfDisplay.js";const q=({data:e,configuration:s})=>{const c=a=>{},m=a=>{},{price:u,basePrice:l}=V({amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD",locale:"us"}),x=()=>{const a=e?.sku,r=e?.variants;return r?.find(p=>p?.sku===a)?.image?.url||r?.[0]?.image?.url||""};return d("div",{className:f("desktop:pt-4 desktop:px-6 desktop:pb-6 flex size-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4",s?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:f("relative mb-2 inline-block h-[137px] overflow-hidden","desktop:mb-3 desktop:h-[195px]"),children:t(T,{source:x(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),t("div",{className:"desktop:mb-2 mb-1 flex h-8 flex-wrap gap-1",children:e?.tags?.slice(0,1)?.map?.((a,r)=>t("div",{className:"desktop:text-base rounded-3xl border-2 border-[#00BEFA] px-2 py-1 text-sm font-bold text-[#00BEFA]",children:a},r))}),t("p",{title:e?.title||"",className:"desktop:text-2xl line-clamp-2 max-h-[48px] flex-1 text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]",children:e?.title||""}),t("h3",{title:e?.description||"",className:"desktop:mt-2 desktop:mb-6 desktop:text-lg mb-5 mt-1 truncate text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]",children:e?.description||""}),d("div",{className:"mb-2 flex items-center",children:[t("div",{className:"desktop:text-2xl text-xl font-bold text-[#1D1D1F]",children:u||""}),t("div",{className:"desktop:text-2xl ml-1 text-xl font-bold text-[#86868C]",children:l||""})]}),d("div",{className:"flex items-center gap-3",children:[t(v,{variant:"primary",onClick:()=>c(e),className:`
+"use client";import{jsx as t,jsxs as d}from"react/jsx-runtime";import{useState as D,useEffect as N}from"react";import{cn as y}from"../../helpers/utils.js";import C from"../../components/picture.js";import{Tabs as I,TabsList as P,TabsTrigger as F}from"../../components/tabs.js";import k from"../../components/button.js";import E from"../Title/index.js";import A from"../SwiperBox/index.js";import{withStyles as V}from"../../shared/Styles.js";import{formatVariantPrice as q}from"./shelfDisplay.js";const M=({data:e,configuration:r})=>{const m=a=>r?.event?.primaryButton?.(a),c=a=>r?.event?.secondaryButton?.(a),{price:u,basePrice:b}=q({locale:"us",amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD"}),p=()=>{const a=e?.sku,o=e?.variants;return o?.find(x=>x?.sku===a)?.image?.url||o?.[0]?.image?.url||""};return d("div",{className:y("laptop:pt-4 laptop:px-6 laptop:pb-6 flex size-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4",r?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:y("relative mb-2 inline-block h-[137px] overflow-hidden","tablet:mb-3 tablet:h-[195px]"),children:t(C,{source:p(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),t("div",{className:"tablet:mb-2 mb-1 flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.slice(0,1)?.map?.((a,o)=>t("div",{className:"tablet:text-base rounded-2xl border-2 border-[#86868C] px-2 pt-1 text-sm font-bold text-[#1D1D1F]",children:a},o))}),t("p",{title:e?.title||"",className:"desktop:text-2xl desktop:leading-7 line-clamp-2 max-h-[48px] flex-1 text-xl font-bold text-[#1D1D1F]",children:e?.title||""}),t("h3",{title:e?.description||"",className:"tablet:mt-2 tablet:mb-3 desktop:text-lg mb-2 mt-1 h-6 truncate text-sm font-semibold text-[#1D1D1F]",children:e?.description||""}),d("div",{className:"mb-2 flex items-center",children:[t("div",{className:"tablet:text-2xl text-xl font-bold text-[#1D1D1F]",children:u||""}),t("div",{className:"tablet:text-2xl ml-1 text-xl font-bold text-[#86868C]",children:b||""})]}),d("div",{className:"flex items-center gap-3",children:[t(k,{variant:"primary",onClick:()=>m(e),className:`
             laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border
-            border-[#1D1D1F] bg-transparent px-4 py-2 text-xs tracking-[-0.04em] text-[#1D1D1F] hover:bg-transparent hover:text-black
-            ${s?.shape==="round"?"desktop:rounded-3xl rounded-[20px]":""}
-          `,children:s?.primaryButton||""}),t(v,{variant:"secondary",onClick:()=>m(e),className:`
+            border-[#1D1D1F] bg-transparent px-4 py-2 text-xs text-[#1D1D1F] hover:bg-transparent hover:text-black
+            ${r?.shape==="round"?"desktop:rounded-3xl rounded-[20px]":""}
+          `,children:r?.primaryButton||""}),t(k,{variant:"secondary",onClick:()=>c(e),className:`
             laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border
             border-[#1D1D1F] bg-[#1D1D1F] px-4 py-2 text-xs tracking-[-0.04em] text-white
-            ${s?.shape==="round"?"desktop:rounded-3xl rounded-[20px]":""}
-          `,children:s?.secondaryButton||""})]})]},e?.id||e?.handle)},M=({data:e,buildData:s,className:c="",key:m})=>{const[u,l]=g(""),[x,a]=g([]),{productsTab:r=[],productsCard:y=[],title:p,align:D="left",isShowTab:k=!0,tabShape:S="square",...w}=e,b=o=>{const i=o?.map(n=>{const h=s?.products?.find(B=>B?.handle===n?.handle);if(h)return{sku:n.sku,...h}})?.filter(n=>n);a(i)};return N(()=>{if(k){l(r?.[0]?.tab||""),b(r?.[0]?.data||[]);return}b(y)},[]),d("div",{className:f("w-full",c),children:[p&&t(F,{data:{title:p}}),k&&t(C,{shape:S,align:D,value:u,onValueChange:o=>{l(o);const i=r?.find(n=>n?.tab===o);b(i?.data||[])},className:"mb-8",children:t(I,{children:r?.map((o,i)=>t(P,{value:o?.tab||"",children:o?.tab},i))})}),t(A,{className:"!overflow-visible",id:"ShelfDisplay"+m,data:{list:x,configuration:{...w}},Slide:q,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:4}}})]})};var K=E(M);export{K as default};
+            ${r?.shape==="round"?"desktop:rounded-3xl rounded-[20px]":""}
+          `,children:r?.secondaryButton||""})]})]},e?.id||e?.handle)},L=({data:e,buildData:r,className:m="",key:c,event:u})=>{const[b,p]=D(""),[a,o]=D([]),{productsTab:l=[],productsCard:x=[],title:h,align:S="left",isShowTab:v=!0,tabShape:w="square",...T}=e,f=s=>{const i=s?.map(n=>{const g=r?.products?.find(B=>B?.handle===n?.handle);if(g)return{sku:n.sku,...g}})?.filter(n=>n);o(i)};return N(()=>{if(v){p(l?.[0]?.tab||""),f(l?.[0]?.data||[]);return}f(x)},[]),d("div",{className:y("w-full",m),children:[h&&t(E,{data:{title:h}}),v&&t(I,{shape:w,align:S,value:b,onValueChange:s=>{p(s);const i=l?.find(n=>n?.tab===s);f(i?.data||[])},className:"mb-8",children:t(P,{children:l?.map((s,i)=>t(F,{value:s?.tab||"",children:s?.tab},i))})}),t(A,{className:"!overflow-visible",id:"ShelfDisplay"+c,data:{list:a,configuration:{...T,event:u}},Slide:M,breakpoints:{0:{spaceBetween:"12px",freeMode:!1,slidesPerView:1},374:{spaceBetween:"12px",freeMode:!1,slidesPerView:1.3},768:{spaceBetween:"16px",freeMode:!1,slidesPerView:4}}})]})};var O=V(L);export{O as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/ShelfDisplay/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nexport interface ShelfDisplayItem {\n  id?: string\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img?: {\n    url: string\n  }\n  handle?: string\n  sku?: string\n  /** \u6298\u6263\u540E\u4EF7\u683C*/\n  price?: string\n  title?: string\n  /** \u6298\u6263\u524D\u4EF7\u683C*/\n  basePrice?: string\n  subTitle?: string\n  /** \u6807\u7B7E*/\n  tagItems?: string[]\n  tab?: string\n  data?: ShelfDisplayItem[]\n}\n\nexport interface ShelfDisplayProps {\n  data: {\n    title?: string\n    isShowTab?: boolean\n    align?: 'left' | 'center' | 'right'\n    productsTab?: any\n    productsCard?: any\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n    tabShape?: 'rounded' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    /** \u526F\u6309\u94AE\u914D\u7F6E */\n    secondaryButton?: string\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u4E3B\u9898\u8272*/\n  theme?: 'light' | 'dark'\n  className?: string\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: {\n      onClick: (v: any) => void\n    }\n    secondaryButton?: {\n      onClick: (v: any) => void\n    }\n  }\n  key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const onPrimaryButton = (params: ShelfDisplayItem) => {\n    // event?.primaryButton?.onClick?.(params)\n  }\n\n  const onSecondaryButton = (params: ShelfDisplayItem) => {\n    // event?.secondaryButton?.onClick(params)\n  }\n\n  const { price, basePrice } = formatVariantPrice({\n    amount: data?.price.amount || 0,\n    baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 0,\n    currencyCode: data?.price.currencyCode || 'USD',\n    locale: 'us',\n  })\n\n  const handleUrl = () => {\n    const sku = data?.sku\n    const skuArray = data?.variants\n    const findSku = skuArray?.find((item: any) => item?.sku === sku)\n    return findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n  }\n\n  return (\n    <div\n      key={data?.id || data?.handle}\n      className={cn(\n        'desktop:pt-4 desktop:px-6 desktop:pb-6 flex size-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4',\n        configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className={cn('relative mb-2 inline-block h-[137px] overflow-hidden', 'desktop:mb-3 desktop:h-[195px]')}>\n        <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n      </div>\n      <div className=\"desktop:mb-2 mb-1 flex h-8 flex-wrap gap-1\">\n        {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n          return (\n            <div\n              key={index}\n              className=\"desktop:text-base rounded-3xl border-2 border-[#00BEFA] px-2 py-1 text-sm font-bold text-[#00BEFA]\"\n            >\n              {item}\n            </div>\n          )\n        })}\n      </div>\n      <p\n        title={data?.title || ''}\n        className=\"desktop:text-2xl line-clamp-2 max-h-[48px] flex-1 text-xl font-bold leading-[1.2] tracking-[-0.04em] text-[#1D1D1F]\"\n      >\n        {data?.title || ''}\n      </p>\n      <h3\n        title={data?.description || ''}\n        className=\"desktop:mt-2 desktop:mb-6 desktop:text-lg mb-5 mt-1 truncate text-sm font-semibold leading-[1.2] tracking-[-0.02em] text-[#1D1D1F]\"\n      >\n        {data?.description || ''}\n      </h3>\n      <div className=\"mb-2 flex items-center\">\n        <div className=\"desktop:text-2xl text-xl font-bold text-[#1D1D1F]\">{price || ''}</div>\n        <div className=\"desktop:text-2xl ml-1 text-xl font-bold text-[#86868C]\">{basePrice || ''}</div>\n      </div>\n      {/* \u6309\u94AE\u7EC4 */}\n      <div className=\"flex items-center gap-3\">\n        <Button\n          variant=\"primary\"\n          onClick={() => onPrimaryButton(data)}\n          className={`\n            laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border\n            border-[#1D1D1F] bg-transparent px-4 py-2 text-xs tracking-[-0.04em] text-[#1D1D1F] hover:bg-transparent hover:text-black\n            ${configuration?.shape === 'round' ? 'desktop:rounded-3xl rounded-[20px]' : ''}\n          `}\n        >\n          {configuration?.primaryButton || ''}\n        </Button>\n        <Button\n          variant=\"secondary\"\n          onClick={() => onSecondaryButton(data)}\n          className={`\n            laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border\n            border-[#1D1D1F] bg-[#1D1D1F] px-4 py-2 text-xs tracking-[-0.04em] text-white\n            ${configuration?.shape === 'round' ? 'desktop:rounded-3xl rounded-[20px]' : ''}\n          `}\n        >\n          {configuration?.secondaryButton || ''}\n        </Button>\n      </div>\n    </div>\n  )\n}\n\nconst ShelfDisplay: React.FC<ShelfDisplayProps> = ({ data, buildData, className = '', key }) => {\n  const [tabId, setTabId] = useState<string>('')\n  const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n  const {\n    productsTab = [],\n    productsCard = [],\n    title,\n    align = 'left',\n    isShowTab = true,\n    tabShape = 'square',\n    ...other\n  } = data\n\n  const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\n    const newCurrentData = currentData\n      ?.map(item => {\n        const findData = buildData?.products?.find(params => params?.handle === item?.handle)\n        if (findData) {\n          return {\n            sku: item.sku,\n            ...findData,\n          }\n        }\n      })\n      ?.filter(item => item)\n    setCurrentItems(newCurrentData)\n  }\n\n  useEffect(() => {\n    if (isShowTab) {\n      setTabId(productsTab?.[0]?.tab || '')\n      handleCurrentTab(productsTab?.[0]?.data || [])\n      return\n    }\n    handleCurrentTab(productsCard)\n  }, [])\n\n  return (\n    <div className={cn('w-full', className)}>\n      {title && <Title data={{ title: title }} />}\n      {isShowTab && (\n        <Tabs\n          shape={tabShape}\n          align={align}\n          value={tabId}\n          onValueChange={v => {\n            setTabId(v)\n            const findData = productsTab?.find((item: any) => item?.tab === v)\n            handleCurrentTab(findData?.data || [])\n          }}\n          className=\"mb-8\"\n        >\n          <TabsList>\n            {productsTab?.map((item: any, index: number) => {\n              return (\n                <TabsTrigger key={index} value={item?.tab || ''}>\n                  {item?.tab}\n                </TabsTrigger>\n              )\n            })}\n          </TabsList>\n        </Tabs>\n      )}\n      <SwiperBox\n        className=\"!overflow-visible\"\n        id={'ShelfDisplay' + key}\n        data={{ list: currentItems, configuration: { ...other } }}\n        Slide={ShelfDisplayItem}\n        breakpoints={{\n          0: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 1,\n          },\n          374: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 1.3,\n          },\n          768: {\n            spaceBetween: '16px',\n            freeMode: false,\n            slidesPerView: 4,\n          },\n        }}\n      />\n    </div>\n  )\n}\n\nexport default withStyles(ShelfDisplay)\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "useState", "useEffect", "cn", "Picture", "Tabs", "TabsList", "TabsTrigger", "Button", "Title", "SwiperBox", "withStyles", "formatVariantPrice", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "index", "ShelfDisplay", "buildData", "className", "key", "tabId", "setTabId", "currentItems", "setCurrentItems", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "v", "ShelfDisplay_default"]
+  "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nexport interface ShelfDisplayItem {\n  id?: string\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img?: {\n    url: string\n  }\n  handle?: string\n  sku?: string\n  /** \u6298\u6263\u540E\u4EF7\u683C*/\n  price?: string\n  title?: string\n  /** \u6298\u6263\u524D\u4EF7\u683C*/\n  basePrice?: string\n  subTitle?: string\n  /** \u6807\u7B7E*/\n  tagItems?: string[]\n  tab?: string\n  data?: ShelfDisplayItem[]\n}\n\ntype EventType = {\n  primaryButton?: (v: any) => void\n  secondaryButton?: (v: any) => void\n}\n\nexport interface ShelfDisplayProps {\n  data: {\n    title?: string\n    isShowTab?: boolean\n    align?: 'left' | 'center' | 'right'\n    productsTab?: any\n    productsCard?: any\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n    tabShape?: 'rounded' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    /** \u526F\u6309\u94AE\u914D\u7F6E */\n    secondaryButton?: string\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  /** \u4E3B\u9898\u8272*/\n  theme?: 'light' | 'dark'\n  className?: string\n  key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const onPrimaryButton = (params: ShelfDisplayItem) => configuration?.event?.primaryButton?.(params)\n\n  const onSecondaryButton = (params: ShelfDisplayItem) => configuration?.event?.secondaryButton?.(params)\n\n  const { price, basePrice } = formatVariantPrice({\n    locale: 'us',\n    amount: data?.price.amount || 0,\n    baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 0,\n    currencyCode: data?.price.currencyCode || 'USD',\n  })\n\n  const handleUrl = () => {\n    const sku = data?.sku\n    const skuArray = data?.variants\n    const findSku = skuArray?.find((item: any) => item?.sku === sku)\n    return findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n  }\n\n  return (\n    <div\n      key={data?.id || data?.handle}\n      className={cn(\n        'laptop:pt-4 laptop:px-6 laptop:pb-6 flex size-full cursor-pointer flex-col overflow-hidden bg-[#EAEAEC] p-4',\n        configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className={cn('relative mb-2 inline-block h-[137px] overflow-hidden', 'tablet:mb-3 tablet:h-[195px]')}>\n        <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n      </div>\n      <div className=\"tablet:mb-2 mb-1 flex h-8 flex-wrap gap-1 overflow-hidden\">\n        {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n          return (\n            <div\n              key={index}\n              className=\"tablet:text-base rounded-2xl border-2 border-[#86868C] px-2 pt-1 text-sm font-bold text-[#1D1D1F]\"\n            >\n              {item}\n            </div>\n          )\n        })}\n      </div>\n      <p\n        title={data?.title || ''}\n        className=\"desktop:text-2xl desktop:leading-7 line-clamp-2 max-h-[48px] flex-1 text-xl font-bold text-[#1D1D1F]\"\n      >\n        {data?.title || ''}\n      </p>\n      <h3\n        title={data?.description || ''}\n        className=\"tablet:mt-2 tablet:mb-3 desktop:text-lg mb-2 mt-1 h-6 truncate text-sm font-semibold text-[#1D1D1F]\"\n      >\n        {data?.description || ''}\n      </h3>\n      <div className=\"mb-2 flex items-center\">\n        <div className=\"tablet:text-2xl text-xl font-bold text-[#1D1D1F]\">{price || ''}</div>\n        <div className=\"tablet:text-2xl ml-1 text-xl font-bold text-[#86868C]\">{basePrice || ''}</div>\n      </div>\n      {/* \u6309\u94AE\u7EC4 */}\n      <div className=\"flex items-center gap-3\">\n        <Button\n          variant=\"primary\"\n          onClick={() => onPrimaryButton(data)}\n          className={`\n            laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border\n            border-[#1D1D1F] bg-transparent px-4 py-2 text-xs text-[#1D1D1F] hover:bg-transparent hover:text-black\n            ${configuration?.shape === 'round' ? 'desktop:rounded-3xl rounded-[20px]' : ''}\n          `}\n        >\n          {configuration?.primaryButton || ''}\n        </Button>\n        <Button\n          variant=\"secondary\"\n          onClick={() => onSecondaryButton(data)}\n          className={`\n            laptop:text-sm desktop:text-base laptop:px-6 desktop:px-7 laptop:py-2.5 desktop:py-3 box-border flex-1 border\n            border-[#1D1D1F] bg-[#1D1D1F] px-4 py-2 text-xs tracking-[-0.04em] text-white\n            ${configuration?.shape === 'round' ? 'desktop:rounded-3xl rounded-[20px]' : ''}\n          `}\n        >\n          {configuration?.secondaryButton || ''}\n        </Button>\n      </div>\n    </div>\n  )\n}\n\nconst ShelfDisplay: React.FC<ShelfDisplayProps> = ({ data, buildData, className = '', key, event }) => {\n  const [tabId, setTabId] = useState<string>('')\n  const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n  const {\n    productsTab = [],\n    productsCard = [],\n    title,\n    align = 'left',\n    isShowTab = true,\n    tabShape = 'square',\n    ...other\n  } = data\n\n  const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\n    const newCurrentData = currentData\n      ?.map(item => {\n        const findData = buildData?.products?.find(params => params?.handle === item?.handle)\n        if (findData) {\n          return {\n            sku: item.sku,\n            ...findData,\n          }\n        }\n      })\n      ?.filter(item => item)\n    setCurrentItems(newCurrentData)\n  }\n\n  useEffect(() => {\n    if (isShowTab) {\n      setTabId(productsTab?.[0]?.tab || '')\n      handleCurrentTab(productsTab?.[0]?.data || [])\n      return\n    }\n    handleCurrentTab(productsCard)\n  }, [])\n\n  return (\n    <div className={cn('w-full', className)}>\n      {title && <Title data={{ title: title }} />}\n      {isShowTab && (\n        <Tabs\n          shape={tabShape}\n          align={align}\n          value={tabId}\n          onValueChange={v => {\n            setTabId(v)\n            const findData = productsTab?.find((item: any) => item?.tab === v)\n            handleCurrentTab(findData?.data || [])\n          }}\n          className=\"mb-8\"\n        >\n          <TabsList>\n            {productsTab?.map((item: any, index: number) => {\n              return (\n                <TabsTrigger key={index} value={item?.tab || ''}>\n                  {item?.tab}\n                </TabsTrigger>\n              )\n            })}\n          </TabsList>\n        </Tabs>\n      )}\n      <SwiperBox\n        className=\"!overflow-visible\"\n        id={'ShelfDisplay' + key}\n        data={{ list: currentItems, configuration: { ...other, event: event } }}\n        Slide={ShelfDisplayItem}\n        breakpoints={{\n          0: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 1,\n          },\n          374: {\n            spaceBetween: '12px',\n            freeMode: false,\n            slidesPerView: 1.3,\n          },\n          768: {\n            spaceBetween: '16px',\n            freeMode: false,\n            slidesPerView: 4,\n          },\n        }}\n      />\n    </div>\n  )\n}\n\nexport default withStyles(ShelfDisplay)\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "useState", "useEffect", "cn", "Picture", "Tabs", "TabsList", "TabsTrigger", "Button", "Title", "SwiperBox", "withStyles", "formatVariantPrice", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "index", "ShelfDisplay", "buildData", "className", "key", "event", "tabId", "setTabId", "currentItems", "setCurrentItems", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "v", "ShelfDisplay_default"]
 }

package/dist/esm/cpn-components/CpnBanner/index.d.ts

@@ -0,0 +1,3 @@
+import type { BannerProps } from './types.js';
+declare const CpnBanner: (props: BannerProps) => import("react/jsx-runtime").JSX.Element;
+export default CpnBanner;

package/dist/esm/cpn-components/CpnBanner/index.js

@@ -0,0 +1,2 @@
+import{jsx as e,jsxs as k}from"react/jsx-runtime";import{cn as a}from"../../helpers/utils.js";import{Picture as f,Text as o,Button as p}from"../../components/index.js";import v from"../CpnCountDown/index.js";const w=b=>{const{id:m,image:c,imageMob:u,imageLink:i,content:x=[],cns:n}=b,r=t=>{if(t?.startsWith("http")&&(location.href=t),t?.startsWith("#")){const l=document.querySelector(t);l&&l.scrollIntoView({behavior:"smooth"})}};return k("div",{id:m,className:a("cpn-banner-container relative w-full",n?.container),children:[e(f,{loading:"eager",source:`${c}, ${u||c} 768`,className:a("cpn-banner-picture",n?.picture),imgClassName:a("cpn-banner-image h-full object-cover",n?.image),alt:""}),i&&e("a",{href:i,className:"absolute left-0 top-0 z-[1] size-full"}),e("div",{className:a("cpn-banner-box tablet:flex tablet:flex-col tablet:justify-center tablet:pt-0 tablet:text-left absolute left-0 top-0 size-full pt-10 text-center",n?.box),children:e("div",{className:"tablet:px-10 desktop:px-20 px-6",children:e("div",{className:a("cpn-banner-content tablet:mx-0 tablet:max-w-[40vw] mx-auto max-w-[70vw]",n?.content),children:x?.map((t,l)=>{switch(t.type){case"subheading":return e(o,{as:"div",html:t.text,className:a("cpn-banner-subheading tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium",n?.subheading)},l);case"title":return e(o,{as:"div",html:t.text,className:a("cpn-banner-title tablet:mt-5 tablet:text-[2.7vw] lg-desktop:text-[56px] mt-4 text-[32px] font-bold leading-[1.12]",n?.title)},l);case"subtitle":return e(o,{as:"div",html:t.text,className:a("cpn-banner-subtitle tablet:mt-5 tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium",n?.subtitle)},l);case"button":return e("div",{className:a("cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center",n?.buttonBox),children:e(p,{className:a("cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5",n?.button,t.cns),onClick:t.onClick?t.onClick:()=>r(t.target||""),children:t.text},l)});case"buttons":return e("div",{className:a("cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center",n?.buttonBox),children:t.buttons.map((s,d)=>e(p,{className:a("cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5",n?.button,s.cns),onClick:s.onClick?s.onClick:()=>r(s.target||""),children:s.text},d))});case"countdown":return e("div",{className:"cpn-banner-countdown tablet:mt-6 tablet:justify-start mt-4 flex justify-center",children:e(v,{endTime:t.endTime,copy:t.copy,cns:n?.countdown})},l)}})})})})]})};var N=w;export{N as default};
+//# sourceMappingURL=index.js.map

package/dist/esm/cpn-components/CpnBanner/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/cpn-components/CpnBanner/index.tsx"],
+  "sourcesContent": ["import type { BannerProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Picture, Text, Button } from '../../components/index.js'\nimport CountDown from '../CpnCountDown/index.js'\n\nconst CpnBanner = (props: BannerProps) => {\n  const { id, image, imageMob, imageLink, content = [], cns } = props\n\n  const btnClick = (target: string) => {\n    if (target?.startsWith('http')) {\n      location.href = target\n    }\n    if (target?.startsWith('#')) {\n      const element = document.querySelector(target)\n      if (element) {\n        element.scrollIntoView({ behavior: 'smooth' })\n      }\n    }\n  }\n\n  return (\n    <div id={id} className={cn('cpn-banner-container relative w-full', cns?.container)}>\n      <Picture\n        loading=\"eager\"\n        source={`${image}, ${imageMob || image} 768`}\n        className={cn('cpn-banner-picture', cns?.picture)}\n        imgClassName={cn('cpn-banner-image h-full object-cover', cns?.image)}\n        alt=\"\"\n      />\n      {imageLink && <a href={imageLink} className=\"absolute left-0 top-0 z-[1] size-full\"></a>}\n      <div\n        className={cn(\n          'cpn-banner-box tablet:flex tablet:flex-col tablet:justify-center tablet:pt-0 tablet:text-left absolute left-0 top-0 size-full pt-10 text-center',\n          cns?.box\n        )}\n      >\n        <div className=\"tablet:px-10 desktop:px-20 px-6\">\n          <div className={cn('cpn-banner-content tablet:mx-0 tablet:max-w-[40vw] mx-auto max-w-[70vw]', cns?.content)}>\n            {content?.map((item, index) => {\n              switch (item.type) {\n                case 'subheading':\n                  return (\n                    <Text\n                      key={index}\n                      as=\"div\"\n                      html={item.text}\n                      className={cn(\n                        'cpn-banner-subheading tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium',\n                        cns?.subheading\n                      )}\n                    />\n                  )\n                case 'title':\n                  return (\n                    <Text\n                      key={index}\n                      as=\"div\"\n                      html={item.text}\n                      className={cn(\n                        'cpn-banner-title tablet:mt-5 tablet:text-[2.7vw] lg-desktop:text-[56px] mt-4 text-[32px] font-bold leading-[1.12]',\n                        cns?.title\n                      )}\n                    />\n                  )\n                case 'subtitle':\n                  return (\n                    <Text\n                      key={index}\n                      as=\"div\"\n                      html={item.text}\n                      className={cn(\n                        'cpn-banner-subtitle tablet:mt-5 tablet:text-[1.25vw] lg-desktop:text-[24px] mt-4 font-medium',\n                        cns?.subtitle\n                      )}\n                    />\n                  )\n                case 'button':\n                  return (\n                    <div\n                      className={cn(\n                        'cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center',\n                        cns?.buttonBox\n                      )}\n                    >\n                      <Button\n                        key={index}\n                        className={cn(\n                          'cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5',\n                          cns?.button,\n                          item.cns\n                        )}\n                        onClick={item.onClick ? item.onClick : () => btnClick(item.target || '')}\n                      >\n                        {item.text}\n                      </Button>\n                    </div>\n                  )\n                case 'buttons':\n                  return (\n                    <div\n                      className={cn(\n                        'cpn-banner-buttonBox tablet:mt-6 tablet:justify-start mt-4 flex justify-center',\n                        cns?.buttonBox\n                      )}\n                    >\n                      {item.buttons.map((button, index) => (\n                        <Button\n                          key={index}\n                          className={cn(\n                            'cpn-banner-button tablet:min-w-[138px] tablet:px-7 lg-desktop:min-w-[156px] lg-desktop:px-8 !w-auto min-w-[120px] !max-w-full px-5',\n                            cns?.button,\n                            button.cns\n                          )}\n                          onClick={button.onClick ? button.onClick : () => btnClick(button.target || '')}\n                        >\n                          {button.text}\n                        </Button>\n                      ))}\n                    </div>\n                  )\n                case 'countdown':\n                  return (\n                    <div\n                      key={index}\n                      className=\"cpn-banner-countdown tablet:mt-6 tablet:justify-start mt-4 flex justify-center\"\n                    >\n                      <CountDown endTime={item.endTime} copy={item.copy} cns={cns?.countdown} />\n                    </div>\n                  )\n              }\n            })}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default CpnBanner\n"],
+  "mappings": "AAqBI,OACE,OAAAA,EADF,QAAAC,MAAA,oBApBJ,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,EAAS,QAAAC,EAAM,UAAAC,MAAc,4BACtC,OAAOC,MAAe,2BAEtB,MAAMC,EAAaC,GAAuB,CACxC,KAAM,CAAE,GAAAC,EAAI,MAAAC,EAAO,SAAAC,EAAU,UAAAC,EAAW,QAAAC,EAAU,CAAC,EAAG,IAAAC,CAAI,EAAIN,EAExDO,EAAYC,GAAmB,CAInC,GAHIA,GAAQ,WAAW,MAAM,IAC3B,SAAS,KAAOA,GAEdA,GAAQ,WAAW,GAAG,EAAG,CAC3B,MAAMC,EAAU,SAAS,cAAcD,CAAM,EACzCC,GACFA,EAAQ,eAAe,CAAE,SAAU,QAAS,CAAC,CAEjD,CACF,EAEA,OACEhB,EAAC,OAAI,GAAIQ,EAAI,UAAWP,EAAG,uCAAwCY,GAAK,SAAS,EAC/E,UAAAd,EAACG,EAAA,CACC,QAAQ,QACR,OAAQ,GAAGO,CAAK,KAAKC,GAAYD,CAAK,OACtC,UAAWR,EAAG,qBAAsBY,GAAK,OAAO,EAChD,aAAcZ,EAAG,uCAAwCY,GAAK,KAAK,EACnE,IAAI,GACN,EACCF,GAAaZ,EAAC,KAAE,KAAMY,EAAW,UAAU,wCAAwC,EACpFZ,EAAC,OACC,UAAWE,EACT,kJACAY,GAAK,GACP,EAEA,SAAAd,EAAC,OAAI,UAAU,kCACb,SAAAA,EAAC,OAAI,UAAWE,EAAG,0EAA2EY,GAAK,OAAO,EACvG,SAAAD,GAAS,IAAI,CAACK,EAAMC,IAAU,CAC7B,OAAQD,EAAK,KAAM,CACjB,IAAK,aACH,OACElB,EAACI,EAAA,CAEC,GAAG,MACH,KAAMc,EAAK,KACX,UAAWhB,EACT,qFACAY,GAAK,UACP,GANKK,CAOP,EAEJ,IAAK,QACH,OACEnB,EAACI,EAAA,CAEC,GAAG,MACH,KAAMc,EAAK,KACX,UAAWhB,EACT,oHACAY,GAAK,KACP,GANKK,CAOP,EAEJ,IAAK,WACH,OACEnB,EAACI,EAAA,CAEC,GAAG,MACH,KAAMc,EAAK,KACX,UAAWhB,EACT,+FACAY,GAAK,QACP,GANKK,CAOP,EAEJ,IAAK,SACH,OACEnB,EAAC,OACC,UAAWE,EACT,iFACAY,GAAK,SACP,EAEA,SAAAd,EAACK,EAAA,CAEC,UAAWH,EACT,qIACAY,GAAK,OACLI,EAAK,GACP,EACA,QAASA,EAAK,QAAUA,EAAK,QAAU,IAAMH,EAASG,EAAK,QAAU,EAAE,EAEtE,SAAAA,EAAK,MARDC,CASP,EACF,EAEJ,IAAK,UACH,OACEnB,EAAC,OACC,UAAWE,EACT,iFACAY,GAAK,SACP,EAEC,SAAAI,EAAK,QAAQ,IAAI,CAACE,EAAQD,IACzBnB,EAACK,EAAA,CAEC,UAAWH,EACT,qIACAY,GAAK,OACLM,EAAO,GACT,EACA,QAASA,EAAO,QAAUA,EAAO,QAAU,IAAML,EAASK,EAAO,QAAU,EAAE,EAE5E,SAAAA,EAAO,MARHD,CASP,CACD,EACH,EAEJ,IAAK,YACH,OACEnB,EAAC,OAEC,UAAU,iFAEV,SAAAA,EAACM,EAAA,CAAU,QAASY,EAAK,QAAS,KAAMA,EAAK,KAAM,IAAKJ,GAAK,UAAW,GAHnEK,CAIP,CAEN,CACF,CAAC,EACH,EACF,EACF,GACF,CAEJ,EAEA,IAAOE,EAAQd",
+  "names": ["jsx", "jsxs", "cn", "Picture", "Text", "Button", "CountDown", "CpnBanner", "props", "id", "image", "imageMob", "imageLink", "content", "cns", "btnClick", "target", "element", "item", "index", "button", "CpnBanner_default"]
+}

package/dist/esm/cpn-components/CpnBanner/types.d.ts

@@ -0,0 +1,42 @@
+import type { CountDownProps } from '../CpnCountDown/types';
+type TextType = 'title' | 'subtitle' | 'subheading';
+type TextContent = {
+    type: TextType;
+    text: string;
+};
+type ButtonContent = {
+    type: 'button';
+    text: string;
+    target?: string;
+    cns?: string;
+    onClick?: () => void;
+};
+type ButtonsContent = {
+    type: 'buttons';
+    buttons: Omit<ButtonContent, 'type'>[];
+};
+type CountDownContent = {
+    type: 'countdown';
+} & CountDownProps;
+type BannerContent = TextContent | ButtonContent | ButtonsContent | CountDownContent;
+export type BannerProps = {
+    id?: string;
+    image: string;
+    imageMob?: string;
+    imageLink?: string;
+    content?: BannerContent[];
+    cns?: {
+        container?: string;
+        picture?: string;
+        image?: string;
+        box?: string;
+        content?: string;
+        subheading?: string;
+        title?: string;
+        subtitle?: string;
+        buttonBox?: string;
+        button?: string;
+        countdown?: CountDownProps['cns'];
+    };
+};
+export {};

package/dist/esm/cpn-components/CpnBanner/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/cpn-components/CpnBanner/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/esm/cpn-components/CpnCountDown/index.d.ts

@@ -0,0 +1,3 @@
+import type { CountDownProps } from './types.js';
+declare const CpnCountDown: (props: CountDownProps) => import("react/jsx-runtime").JSX.Element;
+export default CpnCountDown;

package/dist/esm/cpn-components/CpnCountDown/index.js

@@ -0,0 +1,2 @@
+import{Fragment as x,jsx as e,jsxs as i}from"react/jsx-runtime";import{cn as n}from"../../helpers/utils.js";import{Picture as u}from"../../components/index.js";import d from"../../hooks/useCountDown.js";const c=({time:s,copy:p,image:o,cns:t})=>e(x,{children:s?i("div",{className:n("cpn-countdown-item laptop:size-[54px] tablet:size-[3.2vw] relative size-[34px] rounded bg-black",t?.item),children:[o&&e(u,{className:n("cpn-countdown-picture absolute left-0 top-0 size-full",t?.picture),imgClassName:n("cpn-countdown-image h-full object-cover",t?.image),source:`${o}`}),e("div",{className:n("cpn-countdown-time tablet:text-[1.25vw] laptop:text-[24px] absolute left-0 top-0 flex size-full items-center justify-center text-[16px] font-[600] text-white",t?.time),children:s}),p&&e("div",{className:n("cpn-countdown-copy tablet:text-[12px] laptop:text-[14px] tablet:-bottom-6 absolute -bottom-4 left-1/2 -translate-x-1/2 text-[9px] font-medium",t?.copy),children:p})]}):e("div",{className:n("cpn-countdown-colonBox relative flex flex-col gap-1",t?.colonBox),children:Array.from({length:2}).map((l,a)=>e("span",{className:n("cpn-countdown-colon size-1 rounded-full bg-black",t?.colon)},a))})}),f=s=>{const{endTime:p,copy:o,cns:t}=s,{days:l,hours:a,minutes:m,seconds:r}=d({endTime:p});return i("div",{className:n("cpn-countdown-container laptop:gap-4 relative flex items-center justify-center gap-2",{"mb-5":o?.days},t?.container),children:[e(c,{time:l,copy:o?.days,cns:t}),e(c,{}),e(c,{time:a,copy:o?.hours,cns:t}),e(c,{}),e(c,{time:m,copy:o?.minutes,cns:t}),e(c,{}),e(c,{time:r,copy:o?.seconds,cns:t})]})};var y=f;export{y as default};
+//# sourceMappingURL=index.js.map

package/dist/esm/cpn-components/CpnCountDown/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/cpn-components/CpnCountDown/index.tsx"],
+  "sourcesContent": ["import type { CountDownProps, ItemProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Picture } from '../../components/index.js'\nimport useCountDown from '../../hooks/useCountDown.js'\n\nconst Item = ({ time, copy, image, cns }: ItemProps) => (\n  <>\n    {time ? (\n      <div\n        className={cn(\n          'cpn-countdown-item laptop:size-[54px] tablet:size-[3.2vw] relative size-[34px] rounded bg-black',\n          cns?.item\n        )}\n      >\n        {image && (\n          <Picture\n            className={cn('cpn-countdown-picture absolute left-0 top-0 size-full', cns?.picture)}\n            imgClassName={cn('cpn-countdown-image h-full object-cover', cns?.image)}\n            source={`${image}`}\n          />\n        )}\n        <div\n          className={cn(\n            'cpn-countdown-time tablet:text-[1.25vw] laptop:text-[24px] absolute left-0 top-0 flex size-full items-center justify-center text-[16px] font-[600] text-white',\n            cns?.time\n          )}\n        >\n          {time}\n        </div>\n        {copy && (\n          <div\n            className={cn(\n              'cpn-countdown-copy tablet:text-[12px] laptop:text-[14px] tablet:-bottom-6 absolute -bottom-4 left-1/2 -translate-x-1/2 text-[9px] font-medium',\n              cns?.copy\n            )}\n          >\n            {copy}\n          </div>\n        )}\n      </div>\n    ) : (\n      <div className={cn('cpn-countdown-colonBox relative flex flex-col gap-1', cns?.colonBox)}>\n        {Array.from({ length: 2 }).map((_, index) => (\n          <span key={index} className={cn('cpn-countdown-colon size-1 rounded-full bg-black', cns?.colon)}></span>\n        ))}\n      </div>\n    )}\n  </>\n)\n\nconst CpnCountDown = (props: CountDownProps) => {\n  const { endTime, copy, cns } = props\n\n  const { days, hours, minutes, seconds } = useCountDown({ endTime })\n\n  return (\n    <div\n      className={cn(\n        'cpn-countdown-container laptop:gap-4 relative flex items-center justify-center gap-2',\n        {\n          'mb-5': copy?.days,\n        },\n        cns?.container\n      )}\n    >\n      <Item time={days} copy={copy?.days} cns={cns} />\n      <Item />\n      <Item time={hours} copy={copy?.hours} cns={cns} />\n      <Item />\n      <Item time={minutes} copy={copy?.minutes} cns={cns} />\n      <Item />\n      <Item time={seconds} copy={copy?.seconds} cns={cns} />\n    </div>\n  )\n}\n\nexport default CpnCountDown\n"],
+  "mappings": "AAME,mBAAAA,EASQ,OAAAC,EAPJ,QAAAC,MAFJ,oBALF,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,MAAe,4BACxB,OAAOC,MAAkB,8BAEzB,MAAMC,EAAO,CAAC,CAAE,KAAAC,EAAM,KAAAC,EAAM,MAAAC,EAAO,IAAAC,CAAI,IACrCT,EAAAD,EAAA,CACG,SAAAO,EACCL,EAAC,OACC,UAAWC,EACT,kGACAO,GAAK,IACP,EAEC,UAAAD,GACCR,EAACG,EAAA,CACC,UAAWD,EAAG,wDAAyDO,GAAK,OAAO,EACnF,aAAcP,EAAG,0CAA2CO,GAAK,KAAK,EACtE,OAAQ,GAAGD,CAAK,GAClB,EAEFR,EAAC,OACC,UAAWE,EACT,gKACAO,GAAK,IACP,EAEC,SAAAH,EACH,EACCC,GACCP,EAAC,OACC,UAAWE,EACT,gJACAO,GAAK,IACP,EAEC,SAAAF,EACH,GAEJ,EAEAP,EAAC,OAAI,UAAWE,EAAG,sDAAuDO,GAAK,QAAQ,EACpF,eAAM,KAAK,CAAE,OAAQ,CAAE,CAAC,EAAE,IAAI,CAACC,EAAGC,IACjCX,EAAC,QAAiB,UAAWE,EAAG,mDAAoDO,GAAK,KAAK,GAAnFE,CAAsF,CAClG,EACH,EAEJ,EAGIC,EAAgBC,GAA0B,CAC9C,KAAM,CAAE,QAAAC,EAAS,KAAAP,EAAM,IAAAE,CAAI,EAAII,EAEzB,CAAE,KAAAE,EAAM,MAAAC,EAAO,QAAAC,EAAS,QAAAC,CAAQ,EAAId,EAAa,CAAE,QAAAU,CAAQ,CAAC,EAElE,OACEb,EAAC,OACC,UAAWC,EACT,uFACA,CACE,OAAQK,GAAM,IAChB,EACAE,GAAK,SACP,EAEA,UAAAT,EAACK,EAAA,CAAK,KAAMU,EAAM,KAAMR,GAAM,KAAM,IAAKE,EAAK,EAC9CT,EAACK,EAAA,EAAK,EACNL,EAACK,EAAA,CAAK,KAAMW,EAAO,KAAMT,GAAM,MAAO,IAAKE,EAAK,EAChDT,EAACK,EAAA,EAAK,EACNL,EAACK,EAAA,CAAK,KAAMY,EAAS,KAAMV,GAAM,QAAS,IAAKE,EAAK,EACpDT,EAACK,EAAA,EAAK,EACNL,EAACK,EAAA,CAAK,KAAMa,EAAS,KAAMX,GAAM,QAAS,IAAKE,EAAK,GACtD,CAEJ,EAEA,IAAOU,EAAQP",
+  "names": ["Fragment", "jsx", "jsxs", "cn", "Picture", "useCountDown", "Item", "time", "copy", "image", "cns", "_", "index", "CpnCountDown", "props", "endTime", "days", "hours", "minutes", "seconds", "CpnCountDown_default"]
+}

package/dist/esm/cpn-components/CpnCountDown/types.d.ts

@@ -0,0 +1,28 @@
+type Cns = {
+    container?: string;
+    item?: string;
+    picture?: string;
+    image?: string;
+    time?: string;
+    copy?: string;
+    colonBox?: string;
+    colon?: string;
+};
+type Copy = {
+    days?: string;
+    hours?: string;
+    minutes?: string;
+    seconds?: string;
+};
+export type CountDownProps = {
+    endTime?: string;
+    copy?: Copy;
+    cns?: Cns;
+};
+export type ItemProps = {
+    time?: string;
+    copy?: string;
+    image?: string;
+    cns?: Cns;
+};
+export {};

package/dist/esm/cpn-components/CpnCountDown/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/cpn-components/CpnCountDown/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/esm/cpn-components/CpnNavigation/index.d.ts

@@ -0,0 +1,3 @@
+import type { NavigationProps } from './types.js';
+declare const CpnNavigation: (props: NavigationProps) => import("react/jsx-runtime").JSX.Element;
+export default CpnNavigation;

package/dist/esm/cpn-components/CpnNavigation/index.js

@@ -0,0 +1,2 @@
+import{jsx as s}from"react/jsx-runtime";import{useEffect as g,useRef as x,useState as C}from"react";import{cn as l}from"../../helpers/utils.js";import w from"lodash.debounce";const y=d=>{const{lists:n,styles:a,cns:r,offset:v=0}=d,[u,f]=C(0),p=x(null),b=e=>{e.scrollIntoView({behavior:"smooth",inline:"center"})},h=(e,o,t)=>{f(o);const i=t.target;b(i),e.anchor&&document.querySelector(`#${e.anchor}`)?.scrollIntoView({behavior:"smooth"}),t.preventDefault()};return g(()=>{const e=w(()=>{const t=[];n?.forEach(c=>{const m=document.querySelector(`#${c.anchor}`);m&&t.push(m.getBoundingClientRect().top)});const i=t.findIndex(c=>c>o+v)-1;f(i)},100),o=p.current?.getBoundingClientRect().height||0;return window.addEventListener("scroll",e),()=>{window.removeEventListener("scroll",e)}},[n,v]),s("div",{id:"nav",className:l("cpn-nav-container sticky top-0 z-10 w-full bg-[var(--bgColor)]",r?.container),style:{"--bgColor":a?.bgColor||"#C6F1FF","--color":a?.color||"#333","--activeColor":a?.activeColor||"#000"},children:s("div",{className:l("cpn-nav-box relative flex items-center justify-start gap-[18px] overflow-scroll px-6 text-center [&::-webkit-scrollbar]:hidden","tablet:gap-[80px] tablet:justify-center",r?.box),ref:p,children:n?.map((e,o)=>s("a",{href:`#${e.anchor}`,className:l("cpn-nav-item relative cursor-pointer whitespace-nowrap py-[14px] text-[16px] font-medium leading-[1.2] text-[var(--color)] transition-all duration-200",r?.item,{[`border-[var(--activeColor)] text-[var(--activeColor)] after:absolute after:bottom-0 after:left-0 after:h-[2px] after:w-full after:bg-[var(--activeColor)] after:transition-all after:duration-200 after:content-[""] ${r?.activeItem}`]:u===o}),onClick:t=>h(e,o,t),children:e.label},e.label))})})};var S=y;export{S as default};
+//# sourceMappingURL=index.js.map

package/dist/esm/cpn-components/CpnNavigation/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/cpn-components/CpnNavigation/index.tsx"],
+  "sourcesContent": ["import React, { useEffect, useRef, useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport type { Nav, NavigationProps } from './types.js'\nimport debounce from 'lodash.debounce'\n\nconst CpnNavigation = (props: NavigationProps) => {\n  const { lists, styles, cns, offset = 0 } = props\n  const [activeIndex, setActiveIndex] = useState(0)\n  const navBox = useRef<HTMLDivElement>(null)\n\n  const scrollIntoView = (ele: HTMLElement) => {\n    ele.scrollIntoView({ behavior: 'smooth', inline: 'center' })\n  }\n\n  const handleNavItemClick = (nav: Nav, index: number, e: React.SyntheticEvent<EventTarget>) => {\n    setActiveIndex(index)\n    const ele = e.target as HTMLAnchorElement\n    scrollIntoView(ele)\n    if (nav.anchor) {\n      document.querySelector(`#${nav.anchor}`)?.scrollIntoView({ behavior: 'smooth' })\n    }\n    e.preventDefault()\n  }\n\n  useEffect(() => {\n    const scrollHandler = debounce(() => {\n      const sectionTops: number[] = []\n      lists?.forEach(nav => {\n        const section = document.querySelector(`#${nav.anchor}`)\n        if (section) {\n          sectionTops.push(section.getBoundingClientRect().top)\n        }\n      })\n      const index = sectionTops.findIndex(sectionTop => sectionTop > navHeight + offset) - 1\n      setActiveIndex(index)\n    }, 100)\n    const navHeight = navBox.current?.getBoundingClientRect().height || 0\n    window.addEventListener('scroll', scrollHandler)\n    return () => {\n      window.removeEventListener('scroll', scrollHandler)\n    }\n  }, [lists, offset])\n\n  return (\n    <div\n      id=\"nav\"\n      className={cn('cpn-nav-container sticky top-0 z-10 w-full bg-[var(--bgColor)]', cns?.container)}\n      style={\n        {\n          '--bgColor': styles?.bgColor || '#C6F1FF',\n          '--color': styles?.color || '#333',\n          '--activeColor': styles?.activeColor || '#000',\n        } as React.CSSProperties\n      }\n    >\n      <div\n        className={cn(\n          'cpn-nav-box relative flex items-center justify-start gap-[18px] overflow-scroll px-6 text-center [&::-webkit-scrollbar]:hidden',\n          'tablet:gap-[80px] tablet:justify-center',\n          cns?.box\n        )}\n        ref={navBox}\n      >\n        {lists?.map((nav, index) => {\n          return (\n            <a\n              key={nav.label}\n              href={`#${nav.anchor}`}\n              className={cn(\n                'cpn-nav-item relative cursor-pointer whitespace-nowrap py-[14px] text-[16px] font-medium leading-[1.2] text-[var(--color)] transition-all duration-200',\n                cns?.item,\n                {\n                  [`border-[var(--activeColor)] text-[var(--activeColor)] after:absolute after:bottom-0 after:left-0 after:h-[2px] after:w-full after:bg-[var(--activeColor)] after:transition-all after:duration-200 after:content-[\"\"] ${cns?.activeItem}`]:\n                    activeIndex === index,\n                }\n              )}\n              onClick={e => handleNavItemClick(nav, index, e)}\n            >\n              {nav.label}\n            </a>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\nexport default CpnNavigation\n"],
+  "mappings": "AAiEY,cAAAA,MAAA,oBAjEZ,OAAgB,aAAAC,EAAW,UAAAC,EAAQ,YAAAC,MAAgB,QACnD,OAAS,MAAAC,MAAU,yBAEnB,OAAOC,MAAc,kBAErB,MAAMC,EAAiBC,GAA2B,CAChD,KAAM,CAAE,MAAAC,EAAO,OAAAC,EAAQ,IAAAC,EAAK,OAAAC,EAAS,CAAE,EAAIJ,EACrC,CAACK,EAAaC,CAAc,EAAIV,EAAS,CAAC,EAC1CW,EAASZ,EAAuB,IAAI,EAEpCa,EAAkBC,GAAqB,CAC3CA,EAAI,eAAe,CAAE,SAAU,SAAU,OAAQ,QAAS,CAAC,CAC7D,EAEMC,EAAqB,CAACC,EAAUC,EAAeC,IAAyC,CAC5FP,EAAeM,CAAK,EACpB,MAAMH,EAAMI,EAAE,OACdL,EAAeC,CAAG,EACdE,EAAI,QACN,SAAS,cAAc,IAAIA,EAAI,MAAM,EAAE,GAAG,eAAe,CAAE,SAAU,QAAS,CAAC,EAEjFE,EAAE,eAAe,CACnB,EAEA,OAAAnB,EAAU,IAAM,CACd,MAAMoB,EAAgBhB,EAAS,IAAM,CACnC,MAAMiB,EAAwB,CAAC,EAC/Bd,GAAO,QAAQU,GAAO,CACpB,MAAMK,EAAU,SAAS,cAAc,IAAIL,EAAI,MAAM,EAAE,EACnDK,GACFD,EAAY,KAAKC,EAAQ,sBAAsB,EAAE,GAAG,CAExD,CAAC,EACD,MAAMJ,EAAQG,EAAY,UAAUE,GAAcA,EAAaC,EAAYd,CAAM,EAAI,EACrFE,EAAeM,CAAK,CACtB,EAAG,GAAG,EACAM,EAAYX,EAAO,SAAS,sBAAsB,EAAE,QAAU,EACpE,cAAO,iBAAiB,SAAUO,CAAa,EACxC,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAa,CACpD,CACF,EAAG,CAACb,EAAOG,CAAM,CAAC,EAGhBX,EAAC,OACC,GAAG,MACH,UAAWI,EAAG,iEAAkEM,GAAK,SAAS,EAC9F,MACE,CACE,YAAaD,GAAQ,SAAW,UAChC,UAAWA,GAAQ,OAAS,OAC5B,gBAAiBA,GAAQ,aAAe,MAC1C,EAGF,SAAAT,EAAC,OACC,UAAWI,EACT,iIACA,0CACAM,GAAK,GACP,EACA,IAAKI,EAEJ,SAAAN,GAAO,IAAI,CAACU,EAAKC,IAEdnB,EAAC,KAEC,KAAM,IAAIkB,EAAI,MAAM,GACpB,UAAWd,EACT,yJACAM,GAAK,KACL,CACE,CAAC,wNAAwNA,GAAK,UAAU,EAAE,EACxOE,IAAgBO,CACpB,CACF,EACA,QAASC,GAAKH,EAAmBC,EAAKC,EAAOC,CAAC,EAE7C,SAAAF,EAAI,OAZAA,EAAI,KAaX,CAEH,EACH,EACF,CAEJ,EAEA,IAAOQ,EAAQpB",
+  "names": ["jsx", "useEffect", "useRef", "useState", "cn", "debounce", "CpnNavigation", "props", "lists", "styles", "cns", "offset", "activeIndex", "setActiveIndex", "navBox", "scrollIntoView", "ele", "handleNavItemClick", "nav", "index", "e", "scrollHandler", "sectionTops", "section", "sectionTop", "navHeight", "CpnNavigation_default"]
+}

package/dist/esm/cpn-components/CpnNavigation/types.d.ts

@@ -0,0 +1,19 @@
+type Cns = {
+    container?: string;
+    box?: string;
+    item?: string;
+    activeItem?: string;
+};
+export interface Nav {
+    label: string;
+    anchor: string;
+}
+export type NavigationProps = {
+    lists: Nav[];
+    styles?: {
+        [key: string]: string;
+    };
+    cns?: Cns;
+    offset?: number;
+};
+export {};

package/dist/esm/cpn-components/CpnNavigation/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/cpn-components/CpnNavigation/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/esm/cpn-components/CpnProductCard/index.d.ts

@@ -0,0 +1,3 @@
+import type { ProductCardProps } from './types.js';
+declare const CpnProductCard: (props: ProductCardProps) => import("react/jsx-runtime").JSX.Element;
+export default CpnProductCard;

package/dist/esm/cpn-components/CpnProductCard/index.js

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";import{cn as a}from"../../helpers/utils.js";import{Button as m,Picture as i,Text as c}from"../../components/index.js";const d=o=>{const{content:l,cns:n}=o;return e("div",{className:a("cpn-card-container relative box-border w-[177px] px-2 pb-3 pt-4 text-center",n?.container),children:l?.map((t,r)=>{switch(t.type){case"tag":return e(c,{as:"div",html:t.text},r);case"image":return e(i,{source:`${t.image}, ${t.imageMob||t.image} 768`,className:a("mx-auto h-[100px]"),imgClassName:a("h-full object-cover")},r);case"title":return e(c,{as:"div",html:t.text,className:a("text-[14px] font-semibold text-[#333]")},r);case"price":return e("div",{className:"mt-3",children:e(c,{html:`${t.text}`,className:a("text-[14px] font-semibold text-[#333]")})});case"buttons":return e("div",{className:"mt-2 flex flex-col gap-2",children:t.buttons?.map((s,p)=>e(m,{variant:s.variant,className:"w-full",onClick:s.onClick,children:s.text},p))})}})})};var v=d;export{v as default};
+//# sourceMappingURL=index.js.map

package/dist/esm/cpn-components/CpnProductCard/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/cpn-components/CpnProductCard/index.tsx"],
+  "sourcesContent": ["import { cn } from '../../helpers/utils.js'\nimport type { ProductCardProps } from './types.js'\nimport { Button, Picture, Text } from '../../components/index.js'\n\nconst CpnProductCard = (props: ProductCardProps) => {\n  const { content, cns } = props\n\n  return (\n    <div className={cn('cpn-card-container relative box-border w-[177px] px-2 pb-3 pt-4 text-center', cns?.container)}>\n      {content?.map((item, index) => {\n        switch (item.type) {\n          case 'tag':\n            return <Text key={index} as=\"div\" html={item.text} />\n          case 'image':\n            return (\n              <Picture\n                key={index}\n                source={`${item.image}, ${item.imageMob || item.image} 768`}\n                className={cn('mx-auto h-[100px]')}\n                imgClassName={cn('h-full object-cover')}\n              />\n            )\n          case 'title':\n            return (\n              <Text key={index} as=\"div\" html={item.text} className={cn('text-[14px] font-semibold text-[#333]')} />\n            )\n          case 'price':\n            return (\n              <div className=\"mt-3\">\n                <Text html={`${item.text}`} className={cn('text-[14px] font-semibold text-[#333]')} />\n              </div>\n            )\n          case 'buttons':\n            return (\n              <div className=\"mt-2 flex flex-col gap-2\">\n                {item.buttons?.map((button, index) => (\n                  <Button key={index} variant={button.variant} className=\"w-full\" onClick={button.onClick}>\n                    {button.text}\n                  </Button>\n                ))}\n              </div>\n            )\n        }\n      })}\n    </div>\n  )\n}\n\nexport default CpnProductCard\n"],
+  "mappings": "AAYmB,cAAAA,MAAA,oBAZnB,OAAS,MAAAC,MAAU,yBAEnB,OAAS,UAAAC,EAAQ,WAAAC,EAAS,QAAAC,MAAY,4BAEtC,MAAMC,EAAkBC,GAA4B,CAClD,KAAM,CAAE,QAAAC,EAAS,IAAAC,CAAI,EAAIF,EAEzB,OACEN,EAAC,OAAI,UAAWC,EAAG,8EAA+EO,GAAK,SAAS,EAC7G,SAAAD,GAAS,IAAI,CAACE,EAAMC,IAAU,CAC7B,OAAQD,EAAK,KAAM,CACjB,IAAK,MACH,OAAOT,EAACI,EAAA,CAAiB,GAAG,MAAM,KAAMK,EAAK,MAA3BC,CAAiC,EACrD,IAAK,QACH,OACEV,EAACG,EAAA,CAEC,OAAQ,GAAGM,EAAK,KAAK,KAAKA,EAAK,UAAYA,EAAK,KAAK,OACrD,UAAWR,EAAG,mBAAmB,EACjC,aAAcA,EAAG,qBAAqB,GAHjCS,CAIP,EAEJ,IAAK,QACH,OACEV,EAACI,EAAA,CAAiB,GAAG,MAAM,KAAMK,EAAK,KAAM,UAAWR,EAAG,uCAAuC,GAAtFS,CAAyF,EAExG,IAAK,QACH,OACEV,EAAC,OAAI,UAAU,OACb,SAAAA,EAACI,EAAA,CAAK,KAAM,GAAGK,EAAK,IAAI,GAAI,UAAWR,EAAG,uCAAuC,EAAG,EACtF,EAEJ,IAAK,UACH,OACED,EAAC,OAAI,UAAU,2BACZ,SAAAS,EAAK,SAAS,IAAI,CAACE,EAAQD,IAC1BV,EAACE,EAAA,CAAmB,QAASS,EAAO,QAAS,UAAU,SAAS,QAASA,EAAO,QAC7E,SAAAA,EAAO,MADGD,CAEb,CACD,EACH,CAEN,CACF,CAAC,EACH,CAEJ,EAEA,IAAOE,EAAQP",
+  "names": ["jsx", "cn", "Button", "Picture", "Text", "CpnProductCard", "props", "content", "cns", "item", "index", "button", "CpnProductCard_default"]
+}