npm - @anker-in/headless-ui - Versions diffs - 0.0.32 → 0.0.33 - Mend

@anker-in/headless-ui 0.0.32 → 0.0.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (84) hide show

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

@@ -1,6 +1,6 @@
-"use client";import{Fragment as X,jsx as t,jsxs as c}from"react/jsx-runtime";import _,{useState as S,useEffect as M,useRef as E,useImperativeHandle as H}from"react";import{cn as m}from"../../helpers/utils.js";import V from"../../components/picture.js";import q from"./tabSwitch.js";import T from"../../components/button.js";import R from"../Title/index.js";import $ from"../SwiperBox/index.js";import{withStyles as z}from"../../shared/Styles.js";import{formatVariantPrice as A}from"./shelfDisplay.js";import{useMediaQuery as L}from"react-responsive";import{useExposure as O}from"../../hooks/useExposure.js";import{gaTrack as U}from"../../shared/track.js";import{useAiuiContext as j}from"../AiuiProvider/index.js";import F from"../../components/badge.js";import{Heading as Q}from"../../components/heading.js";import{Text as W}from"../../components/text.js";const B="image",N="product_shelf",G=999999999e-2,J=({data:e,configuration:r})=>{const{locale:d="us",copyWriting:u}=j(),f=(i,n)=>r?.event?.primaryButton?.(i,n+1),v=(i,n)=>r?.event?.secondaryButton?.(i,n+1),o=e?.variants?.find(i=>i?.sku===e?.sku)||e?.variants?.[0]||{},s=!o?.availableForSale&&o?.price?.amount===G,{price:x,basePrice:y}=A({locale:d,amount:o?.price?.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price?.amount||0,currencyCode:e?.price?.currencyCode||"USD"}),h=()=>{const i=e?.sku,n=e?.variants;return n?.find(l=>l?.sku===i)?.image?.url||n?.[0]?.image?.url||""};return c("div",{className:m("laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300",r?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:m("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden"),children:t(V,{source:h(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),t("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.slice(0,1)?.map?.((i,n)=>t(F,{children:i},n))}),t(Q,{title:e?.title||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] mb-1 line-clamp-2 h-[48px]",children:e?.title||""}),t(W,{size:2,className:"shelf-display-product-description lg-desktop:text-[18px] lg-desktop:h-[26px] desktop:text-[16px] desktop:h-[24px] line-clamp-1 h-[20px] text-[14px]",children:e?.description||""}),t("div",{className:"mb-2 mt-[20px] flex items-center",children:s?t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:u?.soldOutText}):c(X,{children:[t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:x||""}),t("div",{className:"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold",children:y||""})]})}),c("div",{className:m("lg-desktop:gap-3 flex items-center gap-2",r.direction==="vertical"?"flex-col":""),children:[t(T,{variant:"primary",onClick:()=>f(e,r?.index),className:`
-            ${r.direction==="vertical"?"w-full":""}
-          `,children:r?.primaryButton||""}),t(T,{variant:"secondary",onClick:()=>v(e,r?.index),className:`
-            ${r.direction==="vertical"?"w-full":""}
-          `,children:r?.secondaryButton||""})]})]},e?.id||e?.handle)},K=_.forwardRef(({data:e,buildData:r,className:d="",key:u,event:f},v)=>{const[o,s]=S(""),[x,y]=S([]),h=L({query:"(max-width: 768px)"}),i=E(null);H(v,()=>i.current),O(i,{componentType:B,componentName:N,componentTitle:e?.title,navigation:o});const{productsTab:n=[],productsCard:g=[],title:l,align:Y="left",isShowTab:k=!0,tabShape:D="square",...P}=e,b=a=>{const I=a?.map(p=>{const w=r?.products?.find(C=>C?.handle===p?.handle);if(w)return{sku:p.sku,...w}})?.filter(p=>p);y(I)};return M(()=>{if(k){s(n?.[0]?.tab||""),b(n?.[0]?.data||[]);return}b(g)},[]),c("div",{ref:i,className:m("w-full",d,{"aiui-dark":e?.theme==="dark"}),children:[l&&t(R,{data:{title:l}}),k&&t("div",{className:`${h?"w-full overflow-hidden":""}`,children:t(q,{value:o,tabs:n,tabShape:D,onTabClick:a=>{s(a?.tab),b(a?.data||[]),U({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:B,component_name:N,component_title:e?.title,component_position:1,navigation:a?.tab}})}})}),t("div",{className:"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]",children:t($,{className:"mt-6 !overflow-visible",id:`ShelfDisplay${u}${o}`,data:{list:x,configuration:{...P,event:f}},Slide:J,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})})]})});var ve=z(K);export{ve as default};
+"use client";import{Fragment as Z,jsx as t,jsxs as u}from"react/jsx-runtime";import H,{useState as S,useEffect as q,useRef as L,useImperativeHandle as V}from"react";import{cn as m}from"../../helpers/utils.js";import R from"../../components/picture.js";import $ from"./tabSwitch.js";import T from"../../components/button.js";import A from"../Title/index.js";import O from"../SwiperBox/index.js";import{withStyles as z}from"../../shared/Styles.js";import{formatVariantPrice as U}from"./shelfDisplay.js";import"../../components/container.js";import{useMediaQuery as N}from"react-responsive";import{useExposure as j}from"../../hooks/useExposure.js";import{gaTrack as W}from"../../shared/track.js";import{useAiuiContext as F}from"../AiuiProvider/index.js";import Q from"../../components/badge.js";import{Heading as G}from"../../components/heading.js";import{Text as J}from"../../components/text.js";const B="image",D="product_shelf",K=999999999e-2,X=({data:e,configuration:o})=>{const{locale:f="us",copyWriting:h}=F(),v=N({query:"(max-width: 768px)"}),x=(i,r)=>o?.event?.primaryButton?.(i,r+1),a=(i,r)=>o?.event?.secondaryButton?.(i,r+1),s=e?.variants?.find(i=>i?.sku===e?.sku)||e?.variants?.[0]||{},y=!s?.availableForSale&&s?.price?.amount===K,b=o?.isShowTag,{price:g,basePrice:n}=U({locale:f,amount:s?.price?.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price?.amount||0,currencyCode:e?.price?.currencyCode||"USD"}),l=()=>{const i=e?.sku,r=e?.variants;return r?.find(c=>c?.sku===i)?.image?.url||r?.[0]?.image?.url||""};return t("div",{className:m("bg-container-secondary-1 tablet:hover:bg-info-white box-border w-full cursor-pointer overflow-hidden duration-300",o?.shape==="round"?"rounded-2xl":"rounded-none","lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480] desktop:aspect-w-[316] desktop:aspect-h-[384]","laptop:aspect-w-[288] laptop:aspect-h-[360] aspect-w-[296] aspect-h-[360] relative",{"h-[360px]":v}),children:u("div",{className:"absolute inset-0 box-border flex flex-col overflow-hidden p-4",children:[t("div",{className:m("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden"),children:t(R,{source:l(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),t("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:b?e?.tags?.filter(i=>i.startsWith("CLtag"))?.map(i=>i.replace("CLtag:",""))?.slice(0,2)?.map?.((i,r)=>t(Q,{children:i},r)):t("div",{className:"lg-desktop:h-[28px] h-[24px] w-full"})}),t(G,{title:e?.title||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] mb-1 line-clamp-2 h-[48px]",children:e?.title||""}),t(J,{size:2,className:"shelf-display-product-description lg-desktop:text-[18px] lg-desktop:h-[26px] desktop:text-[16px] desktop:h-[24px] line-clamp-1 h-[20px] text-[14px]",children:e?.description||""}),t("div",{className:"mb-2 mt-[20px] flex items-center",children:y?t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:h?.soldOutText}):u(Z,{children:[t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:g||""}),t("div",{className:"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold",children:n||""})]})}),u("div",{className:m("lg-desktop:gap-3 flex items-center gap-2",o.direction==="vertical"?"flex-col":""),children:[t(T,{variant:"secondary",onClick:()=>a(e,o?.index),className:`
+            ${o.direction==="vertical"?"w-full":""}
+          `,children:o?.secondaryButton||""}),t(T,{variant:"primary",onClick:()=>x(e,o?.index),className:`
+            ${o.direction==="vertical"?"w-full":""}
+          `,children:o?.primaryButton||""})]})]})},e?.id||e?.handle)},Y=H.forwardRef(({data:e,buildData:o,className:f="",key:h,event:v},x)=>{const[a,s]=S(""),[y,b]=S([]),g=N({query:"(max-width: 768px)"}),n=L(null);V(x,()=>n.current),j(n,{componentType:B,componentName:D,componentTitle:e?.title,navigation:a});const{productsTab:l=[],productsCard:i=[],title:r,align:P="left",isShowTab:c=!0,tabShape:C="square",isShowTag:I=!1,..._}=e,w=p=>{const M=p?.map(d=>{const k=o?.products?.find(E=>E?.handle===d?.handle);if(k)return{sku:d.sku,...k}})?.filter(d=>d);b(M)};return q(()=>{if(c){s(l?.[0]?.tab||""),w(l?.[0]?.data||[]);return}w(i)},[]),u("div",{ref:n,className:m("w-full",f,{"aiui-dark":e?.theme==="dark"}),children:[r&&t(A,{data:{title:r}}),c&&t("div",{className:`${g?"w-full overflow-hidden":""}`,children:t($,{value:a,tabs:l,tabShape:C,onTabClick:p=>{s(p?.tab),w(p?.data||[]),W({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:B,component_name:D,component_title:e?.title,component_position:1,navigation:p?.tab}})}})}),t("div",{className:"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]",children:t(O,{className:"mt-6 !overflow-visible",id:`ShelfDisplay${h}${a}`,data:{list:y,configuration:{..._,event:v,isShowTag:I}},Slide:X,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})})]})});var ye=z(Y);export{ye as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useEffect, useRef, useImperativeHandle } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport TabSwitch from './tabSwitch.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'\nimport { useMediaQuery } from 'react-responsive'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\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, index: number) => void\n  secondaryButton?: (v: any, index: number) => void\n}\n\nexport interface ShelfDisplayProps {\n  data: {\n    title?: string\n    isShowTab?: boolean\n    direction?: 'horizontal' | 'vertical'\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    theme?: 'light' | 'dark'\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  className?: string\n  key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number) =>\n    configuration?.event?.primaryButton?.(params, index + 1)\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number) =>\n    configuration?.event?.secondaryButton?.(params, index + 1)\n\n  const variant = data?.variants?.find((item: any) => item?.sku === data?.sku) || data?.variants?.[0] || {}\n\n  const isSoldOut = !variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE\n\n  const { price, basePrice } = formatVariantPrice({\n    locale: locale,\n    amount: variant?.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 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n        configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className={cn('lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden')}>\n        <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n      </div>\n      <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n        {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n          return <Badge key={index}>{item}</Badge>\n        })}\n      </div>\n      <Heading\n        title={data?.title || ''}\n        size={2}\n        className=\"shelf-display-product-title lg-desktop:h-[58px] mb-1 line-clamp-2 h-[48px]\"\n      >\n        {data?.title || ''}\n      </Heading>\n      <Text\n        size={2}\n        className=\"shelf-display-product-description lg-desktop:text-[18px] lg-desktop:h-[26px] desktop:text-[16px] desktop:h-[24px] line-clamp-1 h-[20px] text-[14px]\"\n      >\n        {data?.description || ''}\n      </Text>\n      <div className=\"mb-2 mt-[20px] 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=\"tablet:text-2xl text-info-primary text-xl font-bold\">{price || ''}</div>\n            <div className=\"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold\">{basePrice || ''}</div>\n          </>\n        )}\n      </div>\n      {/* \u6309\u94AE\u7EC4 */}\n      <div\n        className={cn(\n          'lg-desktop:gap-3 flex items-center gap-2',\n          configuration.direction === 'vertical' ? 'flex-col' : ''\n        )}\n      >\n        <Button\n          variant=\"primary\"\n          onClick={() => onPrimaryButton(data, configuration?.index)}\n          className={`\n            ${configuration.direction === 'vertical' ? 'w-full' : ''}\n          `}\n        >\n          {configuration?.primaryButton || ''}\n        </Button>\n        <Button\n          variant=\"secondary\"\n          onClick={() => onSecondaryButton(data, configuration?.index)}\n          className={`\n            ${configuration.direction === 'vertical' ? 'w-full' : ''}\n          `}\n        >\n          {configuration?.secondaryButton || ''}\n        </Button>\n      </div>\n    </div>\n  )\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n  ({ data, buildData, className = '', key, event }, ref) => {\n    const [tabId, setTabId] = useState<string>('')\n    const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n    const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n    const innerRef = useRef<HTMLDivElement>(null)\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n    useExposure(innerRef, {\n      componentType: componentType,\n      componentName: componentName,\n      componentTitle: data?.title,\n      navigation: tabId,\n    })\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 ref={innerRef} className={cn('w-full', className, { 'aiui-dark': data?.theme === 'dark' })}>\n        {title && <Title data={{ title: title }} />}\n        {isShowTab && (\n          <div className={`${isMobile ? 'w-full overflow-hidden' : ''}`}>\n            <TabSwitch\n              value={tabId}\n              tabs={productsTab}\n              tabShape={tabShape}\n              onTabClick={v => {\n                setTabId(v?.tab)\n                handleCurrentTab(v?.data || [])\n                gaTrack({\n                  event: 'ga4Event',\n                  event_name: 'component_click',\n                  event_parameters: {\n                    page_group: 'Home Page',\n                    component_type: componentType,\n                    component_name: componentName,\n                    component_title: data?.title,\n                    component_position: 1,\n                    navigation: v?.tab,\n                  },\n                })\n              }}\n            />\n          </div>\n        )}\n        <div className=\"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]\">\n          <SwiperBox\n            className=\"mt-6 !overflow-visible\"\n            id={`ShelfDisplay${key}${tabId}`}\n            data={{ list: currentItems, configuration: { ...other, event: event } }}\n            Slide={ShelfDisplayItem}\n            breakpoints={{\n              0: {\n                spaceBetween: 12,\n                freeMode: false,\n                slidesPerView: 1,\n              },\n              374: {\n                spaceBetween: 12,\n                freeMode: false,\n                slidesPerView: 1.1,\n              },\n              768: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 2.3,\n              },\n              1024: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 3,\n              },\n              1440: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 4,\n              },\n            }}\n          />\n        </div>\n      </div>\n    )\n  }\n)\n\nexport default withStyles(ShelfDisplay)\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "React", "useState", "useEffect", "useRef", "useImperativeHandle", "cn", "Picture", "TabSwitch", "Button", "Title", "SwiperBox", "withStyles", "formatVariantPrice", "useMediaQuery", "useExposure", "gaTrack", "useAiuiContext", "Badge", "Heading", "Text", "componentType", "componentName", "SOLD_OUT_PRICE", "ShelfDisplayItem", "data", "configuration", "locale", "copyWriting", "onPrimaryButton", "params", "index", "onSecondaryButton", "variant", "item", "isSoldOut", "price", "basePrice", "handleUrl", "sku", "skuArray", "ShelfDisplay", "buildData", "className", "key", "event", "ref", "tabId", "setTabId", "currentItems", "setCurrentItems", "isMobile", "innerRef", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "v", "ShelfDisplay_default"]
+  "sourcesContent": ["'use client'\nimport React, { useState, useEffect, useRef, useImperativeHandle } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport TabSwitch from './tabSwitch.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'\nimport { Container } from '../../components/container.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport Badge from '../../components/badge.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport type { ContainerProps } from '../../types/props.js'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\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, index: number) => void\n  secondaryButton?: (v: any, index: number) => void\n}\n\nexport interface ShelfDisplayProps {\n  data: {\n    title?: string\n    isShowTab?: boolean\n    isShowTag?: boolean\n    direction?: 'horizontal' | 'vertical'\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    theme?: 'light' | 'dark'\n    containerProps?: ContainerProps\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  className?: string\n  key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number) =>\n    configuration?.event?.primaryButton?.(params, index + 1)\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number) =>\n    configuration?.event?.secondaryButton?.(params, index + 1)\n\n  const variant = data?.variants?.find((item: any) => item?.sku === data?.sku) || data?.variants?.[0] || {}\n\n  const isSoldOut = !variant?.availableForSale && variant?.price?.amount === SOLD_OUT_PRICE\n  const isShowTag = configuration?.isShowTag\n\n  const { price, basePrice } = formatVariantPrice({\n    locale: locale,\n    amount: variant?.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        'bg-container-secondary-1 tablet:hover:bg-info-white box-border w-full cursor-pointer overflow-hidden duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none',\n        'lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480] desktop:aspect-w-[316] desktop:aspect-h-[384]',\n        'laptop:aspect-w-[288] laptop:aspect-h-[360] aspect-w-[296] aspect-h-[360] relative',\n        {\n          'h-[360px]': isMobile,\n        }\n      )}\n    >\n      <div className=\"absolute inset-0 box-border flex flex-col overflow-hidden p-4\">\n        <div\n          className={cn('lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden')}\n        >\n          <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n        </div>\n        <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n          {isShowTag ? (\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          ) : (\n            <div className=\"lg-desktop:h-[28px] h-[24px] w-full\"></div>\n          )}\n        </div>\n        <Heading\n          title={data?.title || ''}\n          size={2}\n          className=\"shelf-display-product-title lg-desktop:h-[58px] mb-1 line-clamp-2 h-[48px]\"\n        >\n          {data?.title || ''}\n        </Heading>\n        <Text\n          size={2}\n          className=\"shelf-display-product-description lg-desktop:text-[18px] lg-desktop:h-[26px] desktop:text-[16px] desktop:h-[24px] line-clamp-1 h-[20px] text-[14px]\"\n        >\n          {data?.description || ''}\n        </Text>\n        <div className=\"mb-2 mt-[20px] 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=\"tablet:text-2xl text-info-primary text-xl font-bold\">{price || ''}</div>\n              <div className=\"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold\">{basePrice || ''}</div>\n            </>\n          )}\n        </div>\n        {/* \u6309\u94AE\u7EC4 */}\n        <div\n          className={cn(\n            'lg-desktop:gap-3 flex items-center gap-2',\n            configuration.direction === 'vertical' ? 'flex-col' : ''\n          )}\n        >\n          <Button\n            variant=\"secondary\"\n            onClick={() => onSecondaryButton(data, configuration?.index)}\n            className={`\n            ${configuration.direction === 'vertical' ? 'w-full' : ''}\n          `}\n          >\n            {configuration?.secondaryButton || ''}\n          </Button>\n          <Button\n            variant=\"primary\"\n            onClick={() => onPrimaryButton(data, configuration?.index)}\n            className={`\n            ${configuration.direction === 'vertical' ? 'w-full' : ''}\n          `}\n          >\n            {configuration?.primaryButton || ''}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n  ({ data, buildData, className = '', key, event }, ref) => {\n    const [tabId, setTabId] = useState<string>('')\n    const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n    const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n    const innerRef = useRef<HTMLDivElement>(null)\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n    useExposure(innerRef, {\n      componentType: componentType,\n      componentName: componentName,\n      componentTitle: data?.title,\n      navigation: tabId,\n    })\n\n    const {\n      productsTab = [],\n      productsCard = [],\n      title,\n      align = 'left',\n      isShowTab = true,\n      tabShape = 'square',\n      isShowTag = false,\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 ref={innerRef} className={cn('w-full', className, { 'aiui-dark': data?.theme === 'dark' })}>\n        {title && <Title data={{ title: title }} />}\n        {isShowTab && (\n          <div className={`${isMobile ? 'w-full overflow-hidden' : ''}`}>\n            <TabSwitch\n              value={tabId}\n              tabs={productsTab}\n              tabShape={tabShape}\n              onTabClick={v => {\n                setTabId(v?.tab)\n                handleCurrentTab(v?.data || [])\n                gaTrack({\n                  event: 'ga4Event',\n                  event_name: 'component_click',\n                  event_parameters: {\n                    page_group: 'Home Page',\n                    component_type: componentType,\n                    component_name: componentName,\n                    component_title: data?.title,\n                    component_position: 1,\n                    navigation: v?.tab,\n                  },\n                })\n              }}\n            />\n          </div>\n        )}\n        <div className=\"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]\">\n          <SwiperBox\n            className=\"mt-6 !overflow-visible\"\n            id={`ShelfDisplay${key}${tabId}`}\n            data={{ list: currentItems, configuration: { ...other, event: event, isShowTag } }}\n            Slide={ShelfDisplayItem}\n            breakpoints={{\n              0: {\n                spaceBetween: 12,\n                freeMode: false,\n                slidesPerView: 1,\n              },\n              374: {\n                spaceBetween: 12,\n                freeMode: false,\n                slidesPerView: 1.1,\n              },\n              768: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 2.3,\n              },\n              1024: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 3,\n              },\n              1440: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 4,\n              },\n            }}\n          />\n        </div>\n      </div>\n    )\n  }\n)\n\nexport default withStyles(ShelfDisplay)\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "React", "useState", "useEffect", "useRef", "useImperativeHandle", "cn", "Picture", "TabSwitch", "Button", "Title", "SwiperBox", "withStyles", "formatVariantPrice", "useMediaQuery", "useExposure", "gaTrack", "useAiuiContext", "Badge", "Heading", "Text", "componentType", "componentName", "SOLD_OUT_PRICE", "ShelfDisplayItem", "data", "configuration", "locale", "copyWriting", "isMobile", "onPrimaryButton", "params", "index", "onSecondaryButton", "variant", "item", "isSoldOut", "isShowTag", "price", "basePrice", "handleUrl", "sku", "skuArray", "ShelfDisplay", "buildData", "className", "key", "event", "ref", "tabId", "setTabId", "currentItems", "setCurrentItems", "innerRef", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "v", "ShelfDisplay_default"]
 }

package/dist/esm/biz-components/Slogan/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{jsx as l,jsxs as G}from"react/jsx-runtime";import s,{useImperativeHandle as F,useRef as x}from"react";import{useGSAP as U}from"@gsap/react";import{gsap as h}from"gsap";import{SplitText as R}from"gsap/dist/SplitText";import{ScrollTrigger as v}from"gsap/dist/ScrollTrigger";import{cn as p}from"../../helpers/utils.js";import{Heading as Y,Text as _}from"../../components/index.js";import{withStyles as q}from"../../shared/Styles.js";import{useExposure as B}from"../../hooks/useExposure.js";const J="copy",K="brand_slogan";function O(c=[],u=3){const m=[];for(let e=0;e<c.length;e+=u)m.push(c.slice(e,e+u));return m}const $=s.forwardRef(({data:c,className:u=""},m)=>{const{title:e,features:o=[],featureChunkSize:H=3}=c,[y,N]=s.useState(0),[L,w]=s.useState(!0),b=x(null),f=O(o,H),T=f.length,a=o.length>H,D=a?[...f,f[0]]:f,E=40;F(m,()=>b.current),B(b,{componentType:J,componentName:K,componentTitle:e}),s.useEffect(()=>{if(!a)return;const t=setInterval(()=>{N(r=>r+1),w(!0)},3e3);return()=>clearInterval(t)},[T,a]),s.useEffect(()=>{if(a)if(y===T){const t=setTimeout(()=>{w(!1),N(0)},500);return()=>clearTimeout(t)}else w(!0)},[y,T,a]);const i=x(null),k=x(null),g=x(null);return U(()=>{if(h.registerPlugin(v,R),!i.current)return;g.current=new R(i.current,{type:"words",wordsClass:"word"});const t=i.current?.clientHeight||100,r=g.current.words;return h.set(r,{opacity:0}),v.create({trigger:i.current,start:"bottom bottom-=4%",end:`bottom+=${t*1.5}px bottom-=4%`,scrub:!0,onUpdate:n=>{const d=n.progress,I=r.length,P=1/I,M=.5;r.forEach((z,A)=>{const C=A/I*(1-M),j=P*(1+M);let S=(d-C)/j;S=Math.max(0,Math.min(S,1)),h.set(z,{opacity:S})})}}),o&&o.length>0&&v.create({trigger:k.current,start:`bottom+=${t*2}px bottom-=6%`,end:`bottom+=${t*2+100}px bottom-=6%`,onUpdate:n=>{h.set(k.current,{opacity:n.progress})}}),()=>{g.current&&g.current.revert(),v.getAll().forEach(n=>n.kill())}},[]),G("div",{ref:b,className:p("slogan-container laptop:flex-row laptop:items-end laptop:justify-between text-info-primary flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center",u),children:[l(Y,{ref:i,as:"h2",size:2,weight:"bold",align:"left",className:p("slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none"),html:e}),o&&o.length>0&&l("div",{className:p("relative w-full max-w-[500px] overflow-hidden",`tablet:h-[${E}px]`),children:l("div",{className:p(["flex flex-col",L?"transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]":"!transition-none"]),style:{transform:`translateY(-${y*E}px)`},children:D.map((t,r)=>l("div",{className:p("flex w-full flex-row items-stretch gap-3 overflow-hidden",`tablet:h-[${E}px]`),children:t.map((n,d)=>G(s.Fragment,{children:[d>0&&l("div",{className:"slogan-feature-divider w-px self-stretch bg-[#E4E5E6]"}),l(_,{size:3,align:"left",as:"p",className:"slogan-feature-text laptop:text-[14px] line-clamp-3 text-[12px] leading-[1.4]",html:n.title})]},d))},r))})})]})});$.displayName="Slogan";var ot=q($);export{K as componentName,J as componentType,ot as default};
+"use client";import{jsx as l,jsxs as G}from"react/jsx-runtime";import s,{useImperativeHandle as F,useRef as x}from"react";import{useGSAP as U}from"@gsap/react";import{gsap as h}from"gsap";import{SplitText as R}from"gsap/dist/SplitText";import{ScrollTrigger as v}from"gsap/dist/ScrollTrigger";import{cn as p}from"../../helpers/utils.js";import{Heading as Y,Text as _}from"../../components/index.js";import{withStyles as q}from"../../shared/Styles.js";import{useExposure as B}from"../../hooks/useExposure.js";const J="copy",K="brand_slogan";function O(c=[],u=3){const m=[];for(let e=0;e<c.length;e+=u)m.push(c.slice(e,e+u));return m}const $=s.forwardRef(({data:c,className:u=""},m)=>{const{title:e,features:o=[],featureChunkSize:H=3}=c,[y,N]=s.useState(0),[L,w]=s.useState(!0),b=x(null),f=O(o,H),T=f.length,a=o.length>H,D=a?[...f,f[0]]:f,E=40;F(m,()=>b.current),B(b,{componentType:J,componentName:K,componentTitle:e}),s.useEffect(()=>{if(!a)return;const t=setInterval(()=>{N(r=>r+1),w(!0)},3e3);return()=>clearInterval(t)},[T,a]),s.useEffect(()=>{if(a)if(y===T){const t=setTimeout(()=>{w(!1),N(0)},500);return()=>clearTimeout(t)}else w(!0)},[y,T,a]);const i=x(null),k=x(null),g=x(null);return U(()=>{if(h.registerPlugin(v,R),!i.current)return;g.current=new R(i.current,{type:"words",wordsClass:"word"});const t=i.current?.clientHeight||100,r=g.current.words;return h.set(r,{opacity:0}),v.create({trigger:i.current,start:"bottom bottom-=4%",end:`bottom+=${t*1.5}px bottom-=4%`,scrub:!0,onUpdate:n=>{const d=n.progress,I=r.length,P=1/I,M=.5;r.forEach((j,z)=>{const A=z/I*(1-M),C=P*(1+M);let S=(d-A)/C;S=Math.max(0,Math.min(S,1)),h.set(j,{opacity:S})})}}),o&&o.length>0&&v.create({trigger:k.current,start:`bottom+=${t*2}px bottom-=6%`,end:`bottom+=${t*2+100}px bottom-=6%`,onUpdate:n=>{h.set(k.current,{opacity:n.progress})}}),()=>{g.current&&g.current.revert(),v.getAll().forEach(n=>n.kill())}},[]),G("div",{ref:b,className:p("slogan-container laptop:flex-row laptop:items-end laptop:justify-between text-info-primary flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center",u),children:[l(Y,{ref:i,as:"h2",size:2,weight:"bold",align:"left",className:p("slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none"),html:e}),o&&o.length>0&&l("div",{className:p("relative w-full max-w-[500px] overflow-hidden",`tablet:h-[${E}px]`),children:l("div",{className:p(["flex flex-col",L?"transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]":"!transition-none"]),style:{transform:`translateY(-${y*E}px)`},children:D.map((t,r)=>l("div",{className:p("laptop:justify-end flex w-full flex-row items-stretch gap-3 overflow-hidden",`tablet:h-[${E}px]`),children:t.map((n,d)=>G(s.Fragment,{children:[d>0&&l("div",{className:"slogan-feature-divider w-px self-stretch bg-[#E4E5E6]"}),l(_,{size:3,align:"left",as:"p",className:"slogan-feature-text laptop:text-[14px] line-clamp-3 text-[12px] leading-[1.4]",html:n.title})]},d))},r))})})]})});$.displayName="Slogan";var ot=q($);export{K as componentName,J as componentType,ot as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Slogan/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Slogan/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SloganProps } from './types.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nexport const componentType = 'copy'\nexport const componentName = 'brand_slogan'\n\nfunction chunkArray(array: { title: string }[] = [], size: number = 3) {\n  const result = []\n  for (let i = 0; i < array.length; i += size) {\n    result.push(array.slice(i, i + size))\n  }\n  return result\n}\n\nconst Slogan = React.forwardRef<HTMLDivElement, SloganProps>(({ data, className = '' }, ref) => {\n  const { title, features = [], featureChunkSize = 3 } = data\n  const [groupIndex, setGroupIndex] = React.useState(0)\n  const [isTransitioning, setIsTransitioning] = React.useState(true)\n  const innerRef = useRef<HTMLDivElement>(null)\n  const featuresGroups = chunkArray(features, featureChunkSize)\n  const totalGroups = featuresGroups.length\n  const needCarousel = features.length > featureChunkSize\n  const displayGroups = needCarousel ? [...featuresGroups, featuresGroups[0]] : featuresGroups\n  const groupHeight = 40\n\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n  })\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u542F\u7528\u5B9A\u65F6\u5668\n  React.useEffect(() => {\n    if (!needCarousel) return\n    const timer = setInterval(() => {\n      setGroupIndex(i => i + 1)\n      setIsTransitioning(true)\n    }, 3000)\n    return () => clearInterval(timer)\n  }, [totalGroups, needCarousel])\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u5904\u7406\u65E0\u7F1D\u8DF3\u8F6C\n  React.useEffect(() => {\n    if (!needCarousel) return\n    if (groupIndex === totalGroups) {\n      const handle = setTimeout(() => {\n        setIsTransitioning(false)\n        setGroupIndex(0)\n      }, 500) // 500ms\u7B49\u4E8E\u52A8\u753B\u65F6\u957F\n      return () => clearTimeout(handle)\n    } else {\n      setIsTransitioning(true)\n    }\n  }, [groupIndex, totalGroups, needCarousel])\n\n  // \u6807\u9898\u52A8\u753B\u903B\u8F91\u4FDD\u6301\u4E0D\u53D8\n  const titleRef = useRef<HTMLHeadingElement>(null)\n  const featuresRef = useRef<HTMLDivElement>(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    gsap.registerPlugin(ScrollTrigger, SplitText)\n    if (!titleRef.current) return\n    splitTextInstance.current = new SplitText(titleRef.current, {\n      type: 'words',\n      wordsClass: 'word',\n    })\n    const height = titleRef.current?.clientHeight || 100\n\n    const words = splitTextInstance.current.words\n    gsap.set(words, { opacity: 0 })\n    ScrollTrigger.create({\n      trigger: titleRef.current,\n      start: 'bottom bottom-=4%',\n      end: `bottom+=${height * 1.5}px bottom-=4%`,\n      scrub: true,\n      onUpdate: (self: any) => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word: any, i: number) => {\n          const start = (i / total) * (1 - overlap)\n          const width = interval * (1 + overlap)\n          let opacity = (progress - start) / width\n          opacity = Math.max(0, Math.min(opacity, 1))\n          gsap.set(word, { opacity })\n        })\n      },\n    })\n\n    if (features && features.length > 0) {\n      ScrollTrigger.create({\n        trigger: featuresRef.current,\n        start: `bottom+=${height * 2}px bottom-=6%`,\n        end: `bottom+=${height * 2 + 100}px bottom-=6%`,\n        onUpdate: (self: any) => {\n          gsap.set(featuresRef.current, { opacity: self.progress })\n        },\n      })\n    }\n\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach((t: any) => t.kill())\n    }\n  }, [])\n\n  return (\n    <div\n      ref={innerRef}\n      className={cn(\n        'slogan-container laptop:flex-row laptop:items-end laptop:justify-between text-info-primary flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center',\n        className\n      )}\n    >\n      <Heading\n        ref={titleRef}\n        as=\"h2\"\n        size={2}\n        weight={'bold'}\n        align={'left'}\n        className={cn(\n          'slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none'\n        )}\n        html={title}\n      />\n      {features && features.length > 0 && (\n        <div className={cn('relative w-full max-w-[500px] overflow-hidden', `tablet:h-[${groupHeight}px]`)}>\n          <div\n            className={cn([\n              'flex flex-col',\n              isTransitioning ? 'transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]' : '!transition-none',\n            ])}\n            style={{\n              transform: `translateY(-${groupIndex * groupHeight}px)`,\n            }}\n          >\n            {displayGroups.map((group, idx) => (\n              <div\n                className={cn(\n                  'flex w-full flex-row items-stretch gap-3 overflow-hidden',\n                  `tablet:h-[${groupHeight}px]`\n                )}\n                key={idx}\n              >\n                {group.map((feature, index) => (\n                  <React.Fragment key={index}>\n                    {index > 0 && <div className=\"slogan-feature-divider w-px self-stretch bg-[#E4E5E6]\" />}\n                    <Text\n                      size={3}\n                      align=\"left\"\n                      as=\"p\"\n                      className=\"slogan-feature-text laptop:text-[14px] line-clamp-3 text-[12px] leading-[1.4]\"\n                      html={feature.title}\n                    />\n                  </React.Fragment>\n                ))}\n              </div>\n            ))}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n\nSlogan.displayName = 'Slogan'\n\nexport default withStyles(Slogan)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { useGSAP } from '@gsap/react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading, Text } from '../../components/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SloganProps } from './types.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nexport const componentType = 'copy'\nexport const componentName = 'brand_slogan'\n\nfunction chunkArray(array: { title: string }[] = [], size: number = 3) {\n  const result = []\n  for (let i = 0; i < array.length; i += size) {\n    result.push(array.slice(i, i + size))\n  }\n  return result\n}\n\nconst Slogan = React.forwardRef<HTMLDivElement, SloganProps>(({ data, className = '' }, ref) => {\n  const { title, features = [], featureChunkSize = 3 } = data\n  const [groupIndex, setGroupIndex] = React.useState(0)\n  const [isTransitioning, setIsTransitioning] = React.useState(true)\n  const innerRef = useRef<HTMLDivElement>(null)\n  const featuresGroups = chunkArray(features, featureChunkSize)\n  const totalGroups = featuresGroups.length\n  const needCarousel = features.length > featureChunkSize\n  const displayGroups = needCarousel ? [...featuresGroups, featuresGroups[0]] : featuresGroups\n  const groupHeight = 40\n\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  useExposure(innerRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n  })\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u542F\u7528\u5B9A\u65F6\u5668\n  React.useEffect(() => {\n    if (!needCarousel) return\n    const timer = setInterval(() => {\n      setGroupIndex(i => i + 1)\n      setIsTransitioning(true)\n    }, 3000)\n    return () => clearInterval(timer)\n  }, [totalGroups, needCarousel])\n\n  // \u53EA\u5728\u9700\u8981\u8F6E\u64AD\u65F6\u5904\u7406\u65E0\u7F1D\u8DF3\u8F6C\n  React.useEffect(() => {\n    if (!needCarousel) return\n    if (groupIndex === totalGroups) {\n      const handle = setTimeout(() => {\n        setIsTransitioning(false)\n        setGroupIndex(0)\n      }, 500) // 500ms\u7B49\u4E8E\u52A8\u753B\u65F6\u957F\n      return () => clearTimeout(handle)\n    } else {\n      setIsTransitioning(true)\n    }\n  }, [groupIndex, totalGroups, needCarousel])\n\n  // \u6807\u9898\u52A8\u753B\u903B\u8F91\u4FDD\u6301\u4E0D\u53D8\n  const titleRef = useRef<HTMLHeadingElement>(null)\n  const featuresRef = useRef<HTMLDivElement>(null)\n  const splitTextInstance = useRef<SplitText | null>(null)\n  useGSAP(() => {\n    gsap.registerPlugin(ScrollTrigger, SplitText)\n    if (!titleRef.current) return\n    splitTextInstance.current = new SplitText(titleRef.current, {\n      type: 'words',\n      wordsClass: 'word',\n    })\n    const height = titleRef.current?.clientHeight || 100\n\n    const words = splitTextInstance.current.words\n    gsap.set(words, { opacity: 0 })\n    ScrollTrigger.create({\n      trigger: titleRef.current,\n      start: 'bottom bottom-=4%',\n      end: `bottom+=${height * 1.5}px bottom-=4%`,\n      scrub: true,\n      onUpdate: (self: any) => {\n        const progress = self.progress\n        const total = words.length\n        const interval = 1 / total\n        const overlap = 0.5\n        words.forEach((word: any, i: number) => {\n          const start = (i / total) * (1 - overlap)\n          const width = interval * (1 + overlap)\n          let opacity = (progress - start) / width\n          opacity = Math.max(0, Math.min(opacity, 1))\n          gsap.set(word, { opacity })\n        })\n      },\n    })\n\n    if (features && features.length > 0) {\n      ScrollTrigger.create({\n        trigger: featuresRef.current,\n        start: `bottom+=${height * 2}px bottom-=6%`,\n        end: `bottom+=${height * 2 + 100}px bottom-=6%`,\n        onUpdate: (self: any) => {\n          gsap.set(featuresRef.current, { opacity: self.progress })\n        },\n      })\n    }\n\n    return () => {\n      splitTextInstance.current && splitTextInstance.current.revert()\n      ScrollTrigger.getAll().forEach((t: any) => t.kill())\n    }\n  }, [])\n\n  return (\n    <div\n      ref={innerRef}\n      className={cn(\n        'slogan-container laptop:flex-row laptop:items-end laptop:justify-between text-info-primary flex h-auto w-full flex-col items-start justify-center gap-[24px] text-center',\n        className\n      )}\n    >\n      <Heading\n        ref={titleRef}\n        as=\"h2\"\n        size={2}\n        weight={'bold'}\n        align={'left'}\n        className={cn(\n          'slogan-title laptop:text-[40px] desktop:text-[48px] lg-desktop:text-[64px] text-[40px] !leading-none'\n        )}\n        html={title}\n      />\n      {features && features.length > 0 && (\n        <div className={cn('relative w-full max-w-[500px] overflow-hidden', `tablet:h-[${groupHeight}px]`)}>\n          <div\n            className={cn([\n              'flex flex-col',\n              isTransitioning ? 'transition-transform duration-500 ease-[cubic-bezier(.4,0,.2,1)]' : '!transition-none',\n            ])}\n            style={{\n              transform: `translateY(-${groupIndex * groupHeight}px)`,\n            }}\n          >\n            {displayGroups.map((group, idx) => (\n              <div\n                className={cn(\n                  'laptop:justify-end flex w-full flex-row items-stretch gap-3 overflow-hidden',\n                  `tablet:h-[${groupHeight}px]`\n                )}\n                key={idx}\n              >\n                {group.map((feature, index) => (\n                  <React.Fragment key={index}>\n                    {index > 0 && <div className=\"slogan-feature-divider w-px self-stretch bg-[#E4E5E6]\" />}\n                    <Text\n                      size={3}\n                      align=\"left\"\n                      as=\"p\"\n                      className=\"slogan-feature-text laptop:text-[14px] line-clamp-3 text-[12px] leading-[1.4]\"\n                      html={feature.title}\n                    />\n                  </React.Fragment>\n                ))}\n              </div>\n            ))}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n\nSlogan.displayName = 'Slogan'\n\nexport default withStyles(Slogan)\n"],
+  "mappings": "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",
   "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "useGSAP", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "Text", "withStyles", "useExposure", "componentType", "componentName", "chunkArray", "array", "size", "result", "i", "Slogan", "data", "className", "ref", "title", "features", "featureChunkSize", "groupIndex", "setGroupIndex", "isTransitioning", "setIsTransitioning", "innerRef", "featuresGroups", "totalGroups", "needCarousel", "displayGroups", "groupHeight", "timer", "handle", "titleRef", "featuresRef", "splitTextInstance", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "start", "width", "opacity", "t", "group", "idx", "feature", "index", "Slogan_default"]
 }

package/dist/esm/biz-components/Spacer/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{jsx as c}from"react/jsx-runtime";import a from"react";import{cn as o}from"../../helpers/utils.js";import{withStyles as s}from"../../shared/Styles.js";const p=a.forwardRef(({className:t,data:r})=>{const{space:e="default"}=r;return c("div",{className:o("ipc_spacer",e==="default"&&"laptop:h-16 lg-desktop:h-[128px] tablet:h-8 h-16",e==="fixed"&&"h-16",t)})});p.displayName="Spacer";var m=s(p);export{m as default};
+"use client";import{jsx as c}from"react/jsx-runtime";import o from"react";import{cn as a}from"../../helpers/utils.js";import{withStyles as s}from"../../shared/Styles.js";const p=o.forwardRef(({className:t,data:r})=>{const{space:e="default"}=r;return c("div",{className:a("ipc_spacer",e==="default"&&"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16",e==="fixed"&&"h-16",t)})});p.displayName="Spacer";var f=s(p);export{f as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/biz-components/Spacer/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Spacer/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SpacerProps } from './types.js'\n\nconst Spacer = React.forwardRef<HTMLDivElement, SpacerProps>(({ className, data }) => {\n  const { space = 'default' } = data\n  return (\n    <div\n      className={cn(\n        'ipc_spacer',\n        space === 'default' && 'laptop:h-16 lg-desktop:h-[128px] tablet:h-8 h-16',\n        space === 'fixed' && 'h-16',\n        className\n      )}\n    ></div>\n  )\n})\n\nSpacer.displayName = 'Spacer'\n\nexport default withStyles(Spacer)\n"],
-  "mappings": "aASI,cAAAA,MAAA,oBARJ,OAAOC,MAAW,QAClB,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAG3B,MAAMC,EAASH,EAAM,WAAwC,CAAC,CAAE,UAAAI,EAAW,KAAAC,CAAK,IAAM,CACpF,KAAM,CAAE,MAAAC,EAAQ,SAAU,EAAID,EAC9B,OACEN,EAAC,OACC,UAAWE,EACT,aACAK,IAAU,WAAa,mDACvBA,IAAU,SAAW,OACrBF,CACF,EACD,CAEL,CAAC,EAEDD,EAAO,YAAc,SAErB,IAAOI,EAAQL,EAAWC,CAAM",
+  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport type { SpacerProps } from './types.js'\n\nconst Spacer = React.forwardRef<HTMLDivElement, SpacerProps>(({ className, data }) => {\n  const { space = 'default' } = data\n  return (\n    <div\n      className={cn(\n        'ipc_spacer',\n        space === 'default' && 'laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16',\n        space === 'fixed' && 'h-16',\n        className\n      )}\n    ></div>\n  )\n})\n\nSpacer.displayName = 'Spacer'\n\nexport default withStyles(Spacer)\n"],
+  "mappings": "aASI,cAAAA,MAAA,oBARJ,OAAOC,MAAW,QAClB,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAG3B,MAAMC,EAASH,EAAM,WAAwC,CAAC,CAAE,UAAAI,EAAW,KAAAC,CAAK,IAAM,CACpF,KAAM,CAAE,MAAAC,EAAQ,SAAU,EAAID,EAC9B,OACEN,EAAC,OACC,UAAWE,EACT,aACAK,IAAU,WAAa,qEACvBA,IAAU,SAAW,OACrBF,CACF,EACD,CAEL,CAAC,EAEDD,EAAO,YAAc,SAErB,IAAOI,EAAQL,EAAWC,CAAM",
   "names": ["jsx", "React", "cn", "withStyles", "Spacer", "className", "data", "space", "Spacer_default"]
 }

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

@@ -1,2 +1,2 @@
-import{Fragment as v,jsx as e,jsxs as d}from"react/jsx-runtime";import{cn as n}from"../../helpers/utils.js";import{Picture as u}from"../../components/index.js";import x from"../../hooks/useCountDown.js";const c=({time:s,copy:p,image:o,cns:t})=>e(v,{children:s?d("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((a,i)=>e("span",{className:n("cpn-countdown-colon size-1 rounded-full bg-black",t?.colon)},i))})}),f=s=>{const{endTime:p,copy:o,cns:t,expiredHidden:a}=s,{days:i,hours:l,minutes:m,seconds:r}=x({endTime:p});return d("div",{className:n("cpn-countdown-container laptop:gap-4 relative flex items-center justify-center gap-2",{"mb-5":o?.days,"!hidden":a&&i==="00"&&l==="00"&&m==="00"&&r==="00"},t?.container),children:[e(c,{time:i,copy:o?.days,cns:t}),e(c,{cns:t}),e(c,{time:l,copy:o?.hours,cns:t}),e(c,{cns:t}),e(c,{time:m,copy:o?.minutes,cns:t}),e(c,{cns:t}),e(c,{time:r,copy:o?.seconds,cns:t})]})};var g=f;export{g as default};
+import{Fragment as v,jsx as e,jsxs as d}from"react/jsx-runtime";import{cn as n}from"../../helpers/utils.js";import{Picture as u}from"../../components/index.js";import x from"../../hooks/useCountDown.js";const c=({time:s,copy:p,image:o,cns:t})=>e(v,{children:s?d("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}`,alt:""}),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((i,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,expiredHidden:i}=s,{days:a,hours:l,minutes:m,seconds:r}=x({endTime:p});return d("div",{className:n("cpn-countdown-container laptop:gap-4 relative flex items-center justify-center gap-2",{"mb-5":o?.days,"!hidden":i&&a==="00"&&l==="00"&&m==="00"&&r==="00"},t?.container),children:[e(c,{time:a,copy:o?.days,cns:t}),e(c,{cns:t}),e(c,{time:l,copy:o?.hours,cns:t}),e(c,{cns:t}),e(c,{time:m,copy:o?.minutes,cns:t}),e(c,{cns:t}),e(c,{time:r,copy:o?.seconds,cns:t})]})};var g=f;export{g as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +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, expiredHidden } = 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          '!hidden': expiredHidden && days === '00' && hours === '00' && minutes === '00' && seconds === '00',\n        },\n        cns?.container\n      )}\n    >\n      <Item time={days} copy={copy?.days} cns={cns} />\n      <Item cns={cns} />\n      <Item time={hours} copy={copy?.hours} cns={cns} />\n      <Item cns={cns} />\n      <Item time={minutes} copy={copy?.minutes} cns={cns} />\n      <Item cns={cns} />\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,EAAK,cAAAM,CAAc,EAAIF,EAExC,CAAE,KAAAG,EAAM,MAAAC,EAAO,QAAAC,EAAS,QAAAC,CAAQ,EAAIf,EAAa,CAAE,QAAAU,CAAQ,CAAC,EAElE,OACEb,EAAC,OACC,UAAWC,EACT,uFACA,CACE,OAAQK,GAAM,KACd,UAAWQ,GAAiBC,IAAS,MAAQC,IAAU,MAAQC,IAAY,MAAQC,IAAY,IACjG,EACAV,GAAK,SACP,EAEA,UAAAT,EAACK,EAAA,CAAK,KAAMW,EAAM,KAAMT,GAAM,KAAM,IAAKE,EAAK,EAC9CT,EAACK,EAAA,CAAK,IAAKI,EAAK,EAChBT,EAACK,EAAA,CAAK,KAAMY,EAAO,KAAMV,GAAM,MAAO,IAAKE,EAAK,EAChDT,EAACK,EAAA,CAAK,IAAKI,EAAK,EAChBT,EAACK,EAAA,CAAK,KAAMa,EAAS,KAAMX,GAAM,QAAS,IAAKE,EAAK,EACpDT,EAACK,EAAA,CAAK,IAAKI,EAAK,EAChBT,EAACK,EAAA,CAAK,KAAMc,EAAS,KAAMZ,GAAM,QAAS,IAAKE,EAAK,GACtD,CAEJ,EAEA,IAAOW,EAAQR",
+  "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            alt=\"\"\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, expiredHidden } = 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          '!hidden': expiredHidden && days === '00' && hours === '00' && minutes === '00' && seconds === '00',\n        },\n        cns?.container\n      )}\n    >\n      <Item time={days} copy={copy?.days} cns={cns} />\n      <Item cns={cns} />\n      <Item time={hours} copy={copy?.hours} cns={cns} />\n      <Item cns={cns} />\n      <Item time={minutes} copy={copy?.minutes} cns={cns} />\n      <Item cns={cns} />\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,GAChB,IAAI,GACN,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,EAAK,cAAAM,CAAc,EAAIF,EAExC,CAAE,KAAAG,EAAM,MAAAC,EAAO,QAAAC,EAAS,QAAAC,CAAQ,EAAIf,EAAa,CAAE,QAAAU,CAAQ,CAAC,EAElE,OACEb,EAAC,OACC,UAAWC,EACT,uFACA,CACE,OAAQK,GAAM,KACd,UAAWQ,GAAiBC,IAAS,MAAQC,IAAU,MAAQC,IAAY,MAAQC,IAAY,IACjG,EACAV,GAAK,SACP,EAEA,UAAAT,EAACK,EAAA,CAAK,KAAMW,EAAM,KAAMT,GAAM,KAAM,IAAKE,EAAK,EAC9CT,EAACK,EAAA,CAAK,IAAKI,EAAK,EAChBT,EAACK,EAAA,CAAK,KAAMY,EAAO,KAAMV,GAAM,MAAO,IAAKE,EAAK,EAChDT,EAACK,EAAA,CAAK,IAAKI,EAAK,EAChBT,EAACK,EAAA,CAAK,KAAMa,EAAS,KAAMX,GAAM,QAAS,IAAKE,EAAK,EACpDT,EAACK,EAAA,CAAK,IAAKI,EAAK,EAChBT,EAACK,EAAA,CAAK,KAAMc,EAAS,KAAMZ,GAAM,QAAS,IAAKE,EAAK,GACtD,CAEJ,EAEA,IAAOW,EAAQR",
   "names": ["Fragment", "jsx", "jsxs", "cn", "Picture", "useCountDown", "Item", "time", "copy", "image", "cns", "_", "index", "CpnCountDown", "props", "endTime", "expiredHidden", "days", "hours", "minutes", "seconds", "CpnCountDown_default"]
 }

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

@@ -1,2 +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};
+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]"),alt:"",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 CHANGED Viewed

@@ -1,7 +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",
+  "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                alt={''}\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,IAAK,GACL,aAAcA,EAAG,qBAAqB,GAJjCS,CAKP,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"]
 }

package/dist/esm/cpn-components/CpnTitle/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as c,jsxs as a}from"react/jsx-runtime";import{cn as e}from"../../helpers/utils.js";import{Picture as n,Text as s}from"../../components/index.js";const p=l=>{const{html:r,icon_l:o,icon_r:i,cns:t}=l;return a("div",{className:e("cpn-title-container flex items-start justify-center gap-5 text-center",t?.container),children:[o&&c(n,{source:o,className:e("cpn-title-icon-l",t?.icon_l)}),c(s,{html:r,className:"cpn-title-text laptop:text-[40px] text-[24px] font-bold"}),i&&c(n,{source:i,className:e("cpn-title-icon-r",t?.icon_r)})]})};var f=p;export{f as default};
+import{jsx as c,jsxs as a}from"react/jsx-runtime";import{cn as e}from"../../helpers/utils.js";import{Picture as l,Text as s}from"../../components/index.js";const p=n=>{const{html:r,icon_l:o,icon_r:i,cns:t}=n;return a("div",{className:e("cpn-title-container flex items-start justify-center gap-5 text-center",t?.container),children:[o&&c(l,{source:o,alt:"",className:e("cpn-title-icon-l",t?.icon_l)}),c(s,{html:r,className:"cpn-title-text laptop:text-[40px] text-[24px] font-bold"}),i&&c(l,{source:i,alt:"",className:e("cpn-title-icon-r",t?.icon_r)})]})};var f=p;export{f as default};
 //# sourceMappingURL=index.js.map

package/dist/esm/cpn-components/CpnTitle/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/cpn-components/CpnTitle/index.tsx"],
-  "sourcesContent": ["import type { TitleProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Picture, Text } from '../../components/index.js'\n\nconst CpnTitle = (props: TitleProps) => {\n  const { html, icon_l, icon_r, cns } = props\n\n  return (\n    <div className={cn('cpn-title-container flex items-start justify-center gap-5 text-center', cns?.container)}>\n      {icon_l && <Picture source={icon_l} className={cn('cpn-title-icon-l', cns?.icon_l)} />}\n      <Text html={html} className=\"cpn-title-text laptop:text-[40px] text-[24px] font-bold\" />\n      {icon_r && <Picture source={icon_r} className={cn('cpn-title-icon-r', cns?.icon_r)} />}\n    </div>\n  )\n}\n\nexport default CpnTitle\n"],
-  "mappings": "AAQI,OACa,OAAAA,EADb,QAAAC,MAAA,oBAPJ,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAE9B,MAAMC,EAAYC,GAAsB,CACtC,KAAM,CAAE,KAAAC,EAAM,OAAAC,EAAQ,OAAAC,EAAQ,IAAAC,CAAI,EAAIJ,EAEtC,OACEL,EAAC,OAAI,UAAWC,EAAG,wEAAyEQ,GAAK,SAAS,EACvG,UAAAF,GAAUR,EAACG,EAAA,CAAQ,OAAQK,EAAQ,UAAWN,EAAG,mBAAoBQ,GAAK,MAAM,EAAG,EACpFV,EAACI,EAAA,CAAK,KAAMG,EAAM,UAAU,0DAA0D,EACrFE,GAAUT,EAACG,EAAA,CAAQ,OAAQM,EAAQ,UAAWP,EAAG,mBAAoBQ,GAAK,MAAM,EAAG,GACtF,CAEJ,EAEA,IAAOC,EAAQN",
+  "sourcesContent": ["import type { TitleProps } from './types.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Picture, Text } from '../../components/index.js'\n\nconst CpnTitle = (props: TitleProps) => {\n  const { html, icon_l, icon_r, cns } = props\n\n  return (\n    <div className={cn('cpn-title-container flex items-start justify-center gap-5 text-center', cns?.container)}>\n      {icon_l && <Picture source={icon_l} alt={''} className={cn('cpn-title-icon-l', cns?.icon_l)} />}\n      <Text html={html} className=\"cpn-title-text laptop:text-[40px] text-[24px] font-bold\" />\n      {icon_r && <Picture source={icon_r} alt={''} className={cn('cpn-title-icon-r', cns?.icon_r)} />}\n    </div>\n  )\n}\n\nexport default CpnTitle\n"],
+  "mappings": "AAQI,OACa,OAAAA,EADb,QAAAC,MAAA,oBAPJ,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAE9B,MAAMC,EAAYC,GAAsB,CACtC,KAAM,CAAE,KAAAC,EAAM,OAAAC,EAAQ,OAAAC,EAAQ,IAAAC,CAAI,EAAIJ,EAEtC,OACEL,EAAC,OAAI,UAAWC,EAAG,wEAAyEQ,GAAK,SAAS,EACvG,UAAAF,GAAUR,EAACG,EAAA,CAAQ,OAAQK,EAAQ,IAAK,GAAI,UAAWN,EAAG,mBAAoBQ,GAAK,MAAM,EAAG,EAC7FV,EAACI,EAAA,CAAK,KAAMG,EAAM,UAAU,0DAA0D,EACrFE,GAAUT,EAACG,EAAA,CAAQ,OAAQM,EAAQ,IAAK,GAAI,UAAWP,EAAG,mBAAoBQ,GAAK,MAAM,EAAG,GAC/F,CAEJ,EAEA,IAAOC,EAAQN",
   "names": ["jsx", "jsxs", "cn", "Picture", "Text", "CpnTitle", "props", "html", "icon_l", "icon_r", "cns", "CpnTitle_default"]
 }

package/dist/esm/stories/accordionCards.stories.d.ts CHANGED Viewed

@@ -8,12 +8,8 @@ declare const meta: {
             title?: string;
             products: Array<{
                 title: string;
-                img: {
-                    url: string;
-                };
-                mobileImg?: {
-                    url: string;
-                };
+                img: import("../types/props.js").Img;
+                mobileImg?: import("../types/props.js").Img;
                 subTitle: string;
                 link?: string;
             }>;
@@ -38,3 +34,4 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const Round: Story;
+export declare const CustomLayout: () => import("react/jsx-runtime").JSX.Element;

package/dist/esm/stories/accordionCards.stories.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"../biz-components/AccordionCards/index.js";const t={title:"Biz-Components/AccordionCards",component:o,parameters:{layout:"fullscreen"},tags:["autodocs"]};var p=t;const e=[{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."},{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."},{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."},{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."}],r={args:{data:{products:e,primaryButton:"Learn More",theme:"dark",shape:"round",itemShape:"round"}}},a={args:{data:{products:e,shape:"round",itemShape:"round",primaryButton:"Learn More"}}};export{r as Default,a as Round,p as default};
+import{jsx as o}from"react/jsx-runtime";import t from"../biz-components/AccordionCards/index.js";import{Container as s}from"../components/container.js";const r={title:"Biz-Components/AccordionCards",component:t,parameters:{layout:"fullscreen"},tags:["autodocs"]};var i=r;const e=[{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."},{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."},{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."},{title:"Apple Charging Solutions",img:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768"},subTitle:"Dependable Charging for Your Entire Apple Ecosystem."}],n={args:{data:{products:e,primaryButton:"Learn More",theme:"dark",shape:"round",itemShape:"round"}}},d={args:{data:{products:e,shape:"round",itemShape:"round",primaryButton:"Learn More"}}},c=()=>o("div",{className:"py-10",children:o(s,{children:o(t,{data:{products:e,shape:"round",itemShape:"round",primaryButton:"Learn More",theme:"dark"}})})});export{c as CustomLayout,n as Default,d as Round,i as default};
 //# sourceMappingURL=accordionCards.stories.js.map

package/dist/esm/stories/accordionCards.stories.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/accordionCards.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport AccordionCards from '../biz-components/AccordionCards/index.js'\n\nconst meta = {\n  title: 'Biz-Components/AccordionCards',\n  component: AccordionCards,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof AccordionCards>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nconst mock = [\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n]\n\nexport const Default: Story = {\n  args: {\n    data: {\n      products: mock,\n      primaryButton: 'Learn More',\n      theme: 'dark',\n      shape: 'round',\n      itemShape: 'round',\n    },\n  },\n}\n\nexport const Round: Story = {\n  args: {\n    data: {\n      products: mock,\n      shape: 'round',\n      itemShape: 'round',\n      primaryButton: 'Learn More',\n    },\n  },\n}\n"],
-  "mappings": "AACA,OAAOA,MAAoB,4CAE3B,MAAMC,EAAO,CACX,MAAO,gCACP,UAAWD,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOE,EAAQD,EAGf,MAAME,EAAO,CACX,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,EACA,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,EACA,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,EACA,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,SAAUD,EACV,cAAe,aACf,MAAO,OACP,MAAO,QACP,UAAW,OACb,CACF,CACF,EAEaE,EAAe,CAC1B,KAAM,CACJ,KAAM,CACJ,SAAUF,EACV,MAAO,QACP,UAAW,QACX,cAAe,YACjB,CACF,CACF",
-  "names": ["AccordionCards", "meta", "accordionCards_stories_default", "mock", "Default", "Round"]
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport AccordionCards from '../biz-components/AccordionCards/index.js'\nimport { Container } from '../components/container.js'\n\nconst meta = {\n  title: 'Biz-Components/AccordionCards',\n  component: AccordionCards,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof AccordionCards>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nconst mock = [\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n  {\n    title: 'Apple Charging Solutions',\n    img: {\n      url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/Mask_group_3_f2d0041d-7b54-4d6a-a504-1dbe6c2de6ee.png?v=1718245219, https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_c67da28a-50c5-4821-8712-330259ea6039.png?v=1718245627 768',\n    },\n    subTitle: 'Dependable Charging for Your Entire Apple Ecosystem.',\n  },\n]\n\nexport const Default: Story = {\n  args: {\n    data: {\n      products: mock,\n      primaryButton: 'Learn More',\n      theme: 'dark',\n      shape: 'round',\n      itemShape: 'round',\n    },\n  },\n}\n\nexport const Round: Story = {\n  args: {\n    data: {\n      products: mock,\n      shape: 'round',\n      itemShape: 'round',\n      primaryButton: 'Learn More',\n    },\n  },\n}\n\nexport const CustomLayout = () => {\n  return (\n    <div className=\"py-10\">\n      <Container>\n        <AccordionCards\n          data={{ products: mock, shape: 'round', itemShape: 'round', primaryButton: 'Learn More', theme: 'dark' }}\n        />\n      </Container>\n    </div>\n  )\n}\n"],
+  "mappings": "AA0EQ,cAAAA,MAAA,oBAzER,OAAOC,MAAoB,4CAC3B,OAAS,aAAAC,MAAiB,6BAE1B,MAAMC,EAAO,CACX,MAAO,gCACP,UAAWF,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOG,EAAQD,EAGf,MAAME,EAAO,CACX,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,EACA,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,EACA,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,EACA,CACE,MAAO,2BACP,IAAK,CACH,IAAK,+OACP,EACA,SAAU,sDACZ,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,SAAUD,EACV,cAAe,aACf,MAAO,OACP,MAAO,QACP,UAAW,OACb,CACF,CACF,EAEaE,EAAe,CAC1B,KAAM,CACJ,KAAM,CACJ,SAAUF,EACV,MAAO,QACP,UAAW,QACX,cAAe,YACjB,CACF,CACF,EAEaG,EAAe,IAExBR,EAAC,OAAI,UAAU,QACb,SAAAA,EAACE,EAAA,CACC,SAAAF,EAACC,EAAA,CACC,KAAM,CAAE,SAAUI,EAAM,MAAO,QAAS,UAAW,QAAS,cAAe,aAAc,MAAO,MAAO,EACzG,EACF,EACF",
+  "names": ["jsx", "AccordionCards", "Container", "meta", "accordionCards_stories_default", "mock", "Default", "Round", "CustomLayout"]
 }

package/dist/esm/stories/category.stories.d.ts CHANGED Viewed

@@ -14,3 +14,4 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const Round: Story;
+export declare const MoreThanFive: () => import("react/jsx-runtime").JSX.Element;

package/dist/esm/stories/category.stories.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import e from"../biz-components/Category/index.js";import"gsap";import"@gsap/react";import"gsap/dist/ScrollTrigger";import"gsap/dist/SplitText";const o={title:"Biz-Components/Category",component:e,parameters:{layout:"fullscreen"},tags:["autodocs"]};var l=o;const t=[{name:"Anker Prime 27",image:"https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554"},{name:"Anker Prime 27",image:"https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554"},{name:"Anker Prime 27",image:"https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554"}],g={args:{data:{isShowSelect:!0,productData:[],products:t},className:"p-4"}},u={args:{data:{isShowSelect:!0,productData:[],shape:"round",products:t},className:"p-4"}};export{g as Default,u as Round,l as default};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import o from"../biz-components/Category/index.js";import"gsap";import"@gsap/react";import"gsap/dist/ScrollTrigger";import"gsap/dist/SplitText";const r={title:"Biz-Components/Category",component:o,parameters:{layout:"fullscreen"},tags:["autodocs"]};var u=r;const t=[{name:"Anker Prime 27",image:{url:"https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554",alt:"Anker Prime 27"}},{name:"Anker Prime 27",image:{url:"https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554",alt:"Anker Prime 27"}},{name:"Anker Prime 27",image:{url:"https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554",alt:"Anker Prime 27"}}],y={args:{data:{isShowSelect:!0,productData:[],products:t},className:"p-4"}},g={args:{data:{isShowSelect:!0,productData:[],shape:"round",products:t},className:"p-4"}},b=()=>a("div",{className:"flex size-full flex-col gap-6 p-4",children:[e("span",{className:"text-info-primary text-center text-sm font-bold",children:" 5 Items"}),e(o,{data:{shape:"round",isShowSelect:!0,productData:[],products:[...t,...t.slice(0,2)]}}),e("span",{className:"text-info-primary text-center text-sm font-bold",children:" 6 Items"}),e(o,{data:{shape:"round",isShowSelect:!0,productData:[],products:[...t,...t]}}),e("span",{className:"text-info-primary text-center text-sm font-bold",children:" 9 Items"}),e(o,{data:{shape:"round",isShowSelect:!0,productData:[],products:[...t,...t,...t]}})]});export{y as Default,b as MoreThanFive,g as Round,u as default};
 //# sourceMappingURL=category.stories.js.map

package/dist/esm/stories/category.stories.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/category.stories.tsx"],
-  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport Category from '../biz-components/Category/index.js'\nimport { gsap } from 'gsap'\nimport { useGSAP } from '@gsap/react'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { SplitText } from 'gsap/dist/SplitText'\n\nconst meta = {\n  title: 'Biz-Components/Category',\n  component: Category,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof Category>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nconst mock = [\n  {\n    name: 'Anker Prime 27',\n    image:\n      'https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554',\n  },\n  {\n    name: 'Anker Prime 27',\n    image:\n      'https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554',\n  },\n  {\n    name: 'Anker Prime 27',\n    image:\n      'https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554',\n  },\n]\n\nexport const Default: Story = {\n  args: {\n    data: {\n      isShowSelect: true,\n      productData: [],\n      products: mock,\n    },\n    className: 'p-4',\n  },\n}\n\nexport const Round: Story = {\n  args: {\n    data: {\n      isShowSelect: true,\n      productData: [],\n      shape: 'round',\n      products: mock,\n    },\n    className: 'p-4',\n  },\n}\n"],
-  "mappings": "AACA,OAAOA,MAAc,sCACrB,MAAqB,OACrB,MAAwB,cACxB,MAA8B,0BAC9B,MAA0B,sBAE1B,MAAMC,EAAO,CACX,MAAO,0BACP,UAAWD,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOE,EAAQD,EAGf,MAAME,EAAO,CACX,CACE,KAAM,iBACN,MACE,8HACJ,EACA,CACE,KAAM,iBACN,MACE,8HACJ,EACA,CACE,KAAM,iBACN,MACE,8HACJ,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,aAAc,GACd,YAAa,CAAC,EACd,SAAUD,CACZ,EACA,UAAW,KACb,CACF,EAEaE,EAAe,CAC1B,KAAM,CACJ,KAAM,CACJ,aAAc,GACd,YAAa,CAAC,EACd,MAAO,QACP,SAAUF,CACZ,EACA,UAAW,KACb,CACF",
-  "names": ["Category", "meta", "category_stories_default", "mock", "Default", "Round"]
+  "sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport Category from '../biz-components/Category/index.js'\nimport { gsap } from 'gsap'\nimport { useGSAP } from '@gsap/react'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { SplitText } from 'gsap/dist/SplitText'\n\nconst meta = {\n  title: 'Biz-Components/Category',\n  component: Category,\n  parameters: {\n    layout: 'fullscreen',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof Category>\n\nexport default meta\ntype Story = StoryObj<typeof meta>\n\nconst mock = [\n  {\n    name: 'Anker Prime 27',\n    image: {\n      url: 'https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554',\n      alt: 'Anker Prime 27',\n    },\n  },\n  {\n    name: 'Anker Prime 27',\n    image: {\n      url: 'https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554',\n      alt: 'Anker Prime 27',\n    },\n  },\n  {\n    name: 'Anker Prime 27',\n    image: {\n      url: 'https://cdn.shopify.com/s/files/1/0517/6767/3016/files/e7be0a68-29b9-431c-8c0f-21bf968b1545_Product_Image_2.png?v=1744274554',\n      alt: 'Anker Prime 27',\n    },\n  },\n]\n\nexport const Default: Story = {\n  args: {\n    data: {\n      isShowSelect: true,\n      productData: [],\n      products: mock,\n    },\n    className: 'p-4',\n  },\n}\n\nexport const Round: Story = {\n  args: {\n    data: {\n      isShowSelect: true,\n      productData: [],\n      shape: 'round',\n      products: mock,\n    },\n    className: 'p-4',\n  },\n}\n\nexport const MoreThanFive = () => {\n  return (\n    <div className=\"flex size-full flex-col gap-6 p-4\">\n      <span className=\"text-info-primary text-center text-sm font-bold\"> 5 Items</span>\n      <Category\n        data={{\n          shape: 'round',\n          isShowSelect: true,\n          productData: [],\n          products: [...mock, ...mock.slice(0, 2)],\n        }}\n      />\n      <span className=\"text-info-primary text-center text-sm font-bold\"> 6 Items</span>\n      <Category\n        data={{\n          shape: 'round',\n          isShowSelect: true,\n          productData: [],\n          products: [...mock, ...mock],\n        }}\n      />\n      <span className=\"text-info-primary text-center text-sm font-bold\"> 9 Items</span>\n      <Category\n        data={{\n          shape: 'round',\n          isShowSelect: true,\n          productData: [],\n          products: [...mock, ...mock, ...mock],\n        }}\n      />\n    </div>\n  )\n}\n"],
+  "mappings": "AAoEI,OACE,OAAAA,EADF,QAAAC,MAAA,oBAnEJ,OAAOC,MAAc,sCACrB,MAAqB,OACrB,MAAwB,cACxB,MAA8B,0BAC9B,MAA0B,sBAE1B,MAAMC,EAAO,CACX,MAAO,0BACP,UAAWD,EACX,WAAY,CACV,OAAQ,YACV,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOE,EAAQD,EAGf,MAAME,EAAO,CACX,CACE,KAAM,iBACN,MAAO,CACL,IAAK,+HACL,IAAK,gBACP,CACF,EACA,CACE,KAAM,iBACN,MAAO,CACL,IAAK,+HACL,IAAK,gBACP,CACF,EACA,CACE,KAAM,iBACN,MAAO,CACL,IAAK,+HACL,IAAK,gBACP,CACF,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAM,CACJ,aAAc,GACd,YAAa,CAAC,EACd,SAAUD,CACZ,EACA,UAAW,KACb,CACF,EAEaE,EAAe,CAC1B,KAAM,CACJ,KAAM,CACJ,aAAc,GACd,YAAa,CAAC,EACd,MAAO,QACP,SAAUF,CACZ,EACA,UAAW,KACb,CACF,EAEaG,EAAe,IAExBP,EAAC,OAAI,UAAU,oCACb,UAAAD,EAAC,QAAK,UAAU,kDAAkD,oBAAQ,EAC1EA,EAACE,EAAA,CACC,KAAM,CACJ,MAAO,QACP,aAAc,GACd,YAAa,CAAC,EACd,SAAU,CAAC,GAAGG,EAAM,GAAGA,EAAK,MAAM,EAAG,CAAC,CAAC,CACzC,EACF,EACAL,EAAC,QAAK,UAAU,kDAAkD,oBAAQ,EAC1EA,EAACE,EAAA,CACC,KAAM,CACJ,MAAO,QACP,aAAc,GACd,YAAa,CAAC,EACd,SAAU,CAAC,GAAGG,EAAM,GAAGA,CAAI,CAC7B,EACF,EACAL,EAAC,QAAK,UAAU,kDAAkD,oBAAQ,EAC1EA,EAACE,EAAA,CACC,KAAM,CACJ,MAAO,QACP,aAAc,GACd,YAAa,CAAC,EACd,SAAU,CAAC,GAAGG,EAAM,GAAGA,EAAM,GAAGA,CAAI,CACtC,EACF,GACF",
+  "names": ["jsx", "jsxs", "Category", "meta", "category_stories_default", "mock", "Default", "Round", "MoreThanFive"]
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/headless-ui",
-  "version": "0.0.32",
+  "version": "0.0.33",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",