@anker-in/headless-ui 1.0.26-alpha.1762243303200 → 1.0.26-alpha.1762264700743

package/dist/cjs/biz-components/SelectStore/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/SelectStore/index.tsx"],
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport type SelectStoreDataType = {\n  title: string\n  desc: string\n  img: Img\n  mobileImg: Img\n  padImg: Img\n  miniImg: Img\n  // pay: {\n  //   img: Img\n  // }[]\n  // delivery: {\n  //   img: Img\n  // }[]\n  // service: {\n  //   title: string\n  //   img: Img\n  // }[]\n}\n\ntype SelectStoreType = {\n  data: {\n    list: SelectStoreDataType[]\n  }\n  className?: string\n}\n\nconst SelectStore = (props: SelectStoreType) => {\n  const { data, className } = props\n  const { list } = data\n  // const number = list?.[2]?.service?.length || 0\n  return (\n    <>\n      <div className=''>\n        <div className='grid desktop:grid-cols-3 tablet:grid-cols-2 grid-cols-1 gap-4'>\n          {list.map((item, index) => (\n            <div key={index} className=' relative rounded-2xl lg-desktop:aspect-[543/320] laptop:aspect-[440/280] tablet:aspect-[346/240] aspect-[358/240] overflow-hidden'>\n                    <Picture\n                      className=\"w-full\"\n                      imgClassName=\"\"\n                      source={`${item?.img?.url}, ${item?.padImg?.url} 1439, ${item?.miniImg?.url} 1023, ${item?.mobileImg?.url} 767`}\n                    />\n                <div className='absolute laptop:bottom-[24px] lg-desktop:bottom-[32px] bottom-[16px] left-0 laptop:px-[24px] lg-desktop:px-[32px] px-[16px]'>                  <Text html={item?.title} className='text-[20px] lg-desktop:text-[24px] [&_*_strong]:!font-bold leading-[1.2] text-[#1d1d1f]'/>\n                  <Text html={item?.desc} className='text-[14px] line-clamp-1 lg-desktop:text-[16px] leading-[1.4] text-[#1d1d1f]'/>\n                </div>\n            </div>\n          ))}\n        </div>\n        {/* <div className='grid desktop:grid-cols-3 tablet:grid-cols-2 grid-cols-1 gap-4'>\n          {list.map((item, index) => (\n            <div key={index} className='bg-[#EAEAEC] rounded-2xl min-h-[240px] laptop:min-h-[280px] lg-desktop:min-h-[320px]'>\n              <div className='flex flex-col laptop:p-[24px] lg-desktop:p-[32px] p-[16px] justify-start h-full'>\n                <div className=\"flex flex-col justify-center flex-1\">\n                \n                {item?.pay && (\n                  <div className='flex gap-[16px] flex-wrap items-center justify-center laptop:gap-[24px]'>\n                  {item?.pay?.map((pay, ind)=>{\n                    return (\n                      <div key={ind} className='laptop:w-[60px] w-[48px]'>\n                        <Picture\n                            className=\" w-full\"\n                            imgClassName=\"\"\n                            source={pay?.img?.url}\n                            alt={pay?.img?.alt || ''}\n                        />\n                      </div>\n                    )\n                  })}\n                </div>\n                )}\n                \n                {\n                 item?.delivery && (\n                  <div className='flex gap-[24px] items-center justify-center'>\n                    {item?.delivery?.map((delivery, ind)=>{\n                    return (\n                      <div key={ind} className=''>\n                        <Picture\n                            className={` ${ind === 0 ? 'laptop:w-[174px] w-[116px]' : 'laptop:w-[75px] w-[50px]'}`}\n                            imgClassName=\"\"\n                            source={delivery?.img?.url}\n                            alt={delivery?.img?.alt || ''}\n                        />\n                      </div>\n                    )\n                  })}\n                  </div>\n                 ) \n                }\n                \n                {\n                  item?.service && (\n                    <div className=' desktop:gap-[24px] gap-[8px] tablet:gap-[12px] laptop:gap-[28px] grid l-tablet:grid-cols-2 tablet:flex flex-wrap desktop:grid-cols-4 items-center justify-center'>\n                      {item?.service?.map((service, ind)=>{\n                        // \u5224\u65AD\uFF1A\u53EA\u5BF9\u7B2C\u4E94\u6761\uFF08index === 4\uFF09\u5E94\u7528\u54CD\u5E94\u5F0F\u663E\u793A/\u9690\u85CF\n                        const isFifth = ind === 4;\n                        return (\n                          <div key={ind} className={`\n                            flex flex-col items-center desktop:h-full  w-[157px] justify-start desktop:w-[81px]\n                            ${isFifth ? 'laptop:flex desktop:hidden hidden' : ''} \n                          `}>\n                            <div className='w-[70px] desktop:w-[54px]'>\n                              <Picture\n                              className=\"\"\n                              imgClassName=\"w-full h-auto\"\n                              source={service?.img?.url}\n                              alt={service?.img?.alt || ''}\n                            />\n                            </div>\n                            <div className='text-center'>\n                            <Text html={service?.title} className=' font-bold text-[12px] mt-[8px] leading-[1.4]' />\n                            </div>\n                          </div>\n                        )\n                      })}\n                    </div>\n                  )\n                }\n                </div>\n                <div className='mt-auto'>\n                  <Text html={item?.title} className='text-[20px] lg-desktop:text-[24px] [&_*_strong]:!font-bold leading-[1.2] text-[#1d1d1f]'/>\n                  <Text html={item?.desc} className='text-[14px] line-clamp-1 lg-desktop:text-[16px] leading-[1.4] text-[#1d1d1f]'/>\n                </div>\n                \n              </div>\n            </div>\n          ))}\n        </div> */}\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(SelectStore)\n"],
+  "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsCI,IAAAI,EAAA,6BArCJC,EAAmB,kCACnBC,EAAsB,iCAEtBC,EAA2B,kCAC3BC,EAA8B,qCA4B9B,MAAMC,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,KAAAG,CAAK,EAAIF,EAEjB,SACE,mBACE,mBAAC,OAAI,UAAU,GACb,mBAAC,OAAI,UAAU,gEACZ,SAAAE,EAAK,IAAI,CAACC,EAAMC,OACf,QAAC,OAAgB,UAAU,qIACnB,oBAAC,WACC,UAAU,SACV,aAAa,GACb,OAAQ,GAAGD,GAAM,KAAK,GAAG,KAAKA,GAAM,QAAQ,GAAG,UAAUA,GAAM,SAAS,GAAG,UAAUA,GAAM,WAAW,GAAG,OAC3G,KACJ,QAAC,OAAI,UAAU,8HAA8H,kCAAkB,OAAC,QAAK,KAAMA,GAAM,MAAO,UAAU,0FAAyF,KACzR,OAAC,QAAK,KAAMA,GAAM,KAAM,UAAU,+EAA8E,GAClH,IARMC,CASV,CACD,EACH,EAiFF,EACF,CAEJ,EAEA,IAAOb,KAAQ,cAAWO,CAAW",
+  "names": ["SelectStore_exports", "__export", "SelectStore_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_SwiperBox", "import_Styles", "import_components", "SelectStore", "props", "data", "className", "list", "item", "index"]
+}

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var te=Object.create;var g=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var se=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,ie=Object.prototype.hasOwnProperty;var ae=(e,t)=>{for(var r in t)g(e,r,{get:t[r],enumerable:!0})},L=(e,t,r,f)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of se(t))!ie.call(e,i)&&i!==r&&g(e,i,{get:()=>t[i],enumerable:!(f=ne(t,i))||f.enumerable});return e};var v=(e,t,r)=>(r=e!=null?te(re(e)):{},L(t||!e||!e.__esModule?g(r,"default",{value:e,enumerable:!0}):r,e)),oe=e=>L(g({},"__esModule",{value:!0}),e);var ue={};ae(ue,{default:()=>pe});module.exports=oe(ue);var c=require("react/jsx-runtime"),n=v(require("react")),N=require("../../helpers/utils.js"),O=v(require("./tabSwitch.js")),A=v(require("../Title/index.js")),$=v(require("../SwiperBox/index.js")),q=require("../../shared/Styles.js"),D=require("../../shared/track.js"),z=require("react-responsive"),b=require("./shelfDisplayItem.js");const le="image",ce="product_shelf";function me(e){const t=(0,n.useRef)(null),[r,f]=(0,n.useState)(!1);return(0,n.useEffect)(()=>{if(r)return;const i=t.current;if(!i||typeof IntersectionObserver>"u")return;const p=new IntersectionObserver(([a])=>{a.isIntersecting&&(f(!0),p.disconnect())},e);return p.observe(i),()=>p.disconnect()},[r,e]),[t,r]}const fe=n.default.forwardRef(({key:e,data:t,event:r,buildData:f,breakpoints:i,className:p="",recommendedData:a,target:Q="_self",isDisplayGudgments:R=!1,isDisplayBackImage:W=!1},j)=>{const{productsTab:d=[],productsCard:F=[],title:M,isShowTab:_=!0,tabShape:G="square",isShowTag:J=!1,isShowOriginalPrice:K=!0,isShowRecommendedCard:U=!1,...X}=t,[P,V]=(0,n.useState)(""),[m,y]=(0,n.useState)([]),x=(0,n.useRef)(!1),S=(0,n.useRef)(!1),E=(0,n.useRef)(null),Y=(0,z.useMediaQuery)({query:"(max-width: 768px)"}),[Z,H]=me({threshold:0}),h=m?.length<=1&&R,u=!Y&&m?.length<=2&&R,T=s=>{switch(s){case 1440:return u?m?.length:4;case 1024:return u?m?.length:3;default:return u?m?.length:2.3}},B=()=>{(0,D.gaTrack)({event:"ga4Event",event_name:"view_item_list",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:a?.map((s,k)=>{const o=s?.variants?.find(l=>l?.sku===s?.sku)||s?.variants?.[0];return{item_id:s?.sku||o?.sku,item_name:s?.name,item_variant:o?.name,price:o?.price,index:k+1}})}})},I=(s,k)=>{if(k){const w=a?.map?.(o=>({...o,isShowRecommended:!0}));y(w?.length?w||[]:[])}else if(Array.isArray(s)){const o=s?.map?.(l=>{const C=f?.products?.find(ee=>ee?.handle===l?.handle);if(C)return{sku:l.sku,isShowRecommended:!1,custom_name:l.custom_name,custom_description:l.custom_description,...C}})?.filter(l=>l);y(o?.length?o||[]:[])}else y([])};return(0,n.useImperativeHandle)(j,()=>E.current),(0,n.useEffect)(()=>{H&&a?.length&&!x.current&&(x.current=!0,B())},[H,a]),(0,n.useEffect)(()=>{if(!S.current){if(!S.current&&a?.length&&(S.current=!0),_){V(d?.[0]?.tab||""),I(d?.[0]?.data||[],d?.[0]?.isShowRecommendedTab);return}I(F,U)}},[a]),(0,c.jsxs)("div",{ref:E,className:(0,N.cn)("shelf-display-wrap w-full",p,{"aiui-dark":t?.theme==="dark"}),children:[M&&(0,c.jsx)(A.default,{data:{title:M}}),_&&(0,c.jsx)("div",{className:"md-tablet:w-full md-tablet:overflow-hidden",children:(0,c.jsx)(O.default,{value:P,tabs:d,tabShape:G,onTabClick:s=>{if(V(s?.tab),I(s?.data||[],s?.isShowRecommendedTab),!s?.isShowRecommendedTab){(0,D.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:le,component_name:ce,component_title:t?.title,component_position:1,navigation:s?.tab}});return}B()}})}),(0,c.jsx)("div",{ref:Z,className:"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]",children:(0,c.jsx)($.default,{data:{list:m,configuration:{...X,event:r,isShowTag:J,isShowOriginalPrice:K,target:Q,itemLength:m?.length,isDisplayBackImage:W}},id:`ShelfDisplay${e}${P}`,className:`${_?"mt-6":""} !overflow-visible`,itemClassName:u?"flex-1":"",Slide:u?b.ShelfDisplayHorizontalItem:b.ShelfDisplayWrapItem,breakpoints:i||{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:h?1:1.2},768:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:T()},1024:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:T(1024)},1440:{spaceBetween:h?0:16,freeMode:!1,slidesPerView:T(1440)}}})})]})});var pe=(0,q.withLayout)(fe);
+"use strict";"use client";var ae=Object.create;var w=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,oe=Object.prototype.hasOwnProperty;var le=(e,s)=>{for(var n in s)w(e,n,{get:s[n],enumerable:!0})},V=(e,s,n,f)=>{if(s&&typeof s=="object"||typeof s=="function")for(let l of ie(s))!oe.call(e,l)&&l!==n&&w(e,l,{get:()=>s[l],enumerable:!(f=ne(s,l))||f.enumerable});return e};var g=(e,s,n)=>(n=e!=null?ae(re(e)):{},V(s||!e||!e.__esModule?w(n,"default",{value:e,enumerable:!0}):n,e)),me=e=>V(w({},"__esModule",{value:!0}),e);var de={};le(de,{default:()=>ue});module.exports=me(de);var o=require("react/jsx-runtime"),a=g(require("react")),L=require("../../helpers/utils.js"),N=g(require("./tabSwitch.js")),A=g(require("../Title/index.js")),$=g(require("../SwiperBox/index.js")),q=require("../../shared/Styles.js"),D=require("../../shared/track.js"),O=require("react-responsive"),z=require("../../hooks/useRollout.js"),_=require("./shelfDisplayItem.js");const ce="image",pe="product_shelf",fe=a.default.forwardRef(({key:e,data:s,event:n,buildData:f,breakpoints:l,className:Q="",recommendedData:c,target:W="_self",metafields:j,isDisplayGudgments:R=!1,isDisplayBackImage:F=!1},G)=>{const{productsTab:u=[],productsCard:J=[],title:I,isShowTab:v=!0,tabShape:K="square",isShowTag:U=!1,isShowOriginalPrice:X=!0,isShowRecommendedCard:Y=!1,...Z}=s,[M,P]=(0,a.useState)(""),[m,b]=(0,a.useState)([]),x=(0,a.useRef)(!1),S=(0,a.useRef)(!1),H=(0,a.useRef)(null),ee=(0,O.useMediaQuery)({query:"(max-width: 768px)"}),[te,B]=(0,z.useRollout)({threshold:0}),d=m?.length<=1&&R,p=!ee&&m?.length<=2&&R,y=t=>{switch(t){case 1440:return p?m?.length:4;case 1024:return p?m?.length:3;default:return p?m?.length:2.3}},C=()=>{(0,D.gaTrack)({event:"ga4Event",event_name:"view_item_list",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:c?.map((t,k)=>{const r=t?.variants?.find(i=>i?.sku===t?.sku)||t?.variants?.[0];return{item_id:t?.sku||r?.sku,item_name:t?.name,item_variant:r?.name,price:r?.price,index:k+1}})}})},T=(t,k)=>{if(k){const h=c?.map?.(r=>({...r,isShowRecommended:!0}));b(h?.length?h||[]:[])}else if(Array.isArray(t)){const r=t?.map?.(i=>{const E=f?.products?.find(se=>se?.handle===i?.handle);if(E)return{sku:i.sku,isShowRecommended:!1,custom_name:i.custom_name,custom_description:i.custom_description,custom_image:i.custom_image,custom_theme:i.custom_theme,...E}})?.filter(i=>i);b(r?.length?r||[]:[])}else b([])};return(0,a.useImperativeHandle)(G,()=>H.current),(0,a.useEffect)(()=>{B&&c?.length&&!x.current&&(x.current=!0,C())},[B,c]),(0,a.useEffect)(()=>{if(!S.current){if(!S.current&&c?.length&&(S.current=!0),v){P(u?.[0]?.tab||""),T(u?.[0]?.data||[],u?.[0]?.isShowRecommendedTab);return}T(J,Y)}},[c]),(0,o.jsxs)("div",{ref:H,className:(0,L.cn)("shelf-display-wrap w-full",Q,{"aiui-dark":s?.theme==="dark"}),children:[I&&(0,o.jsx)(A.default,{data:{title:I}}),v&&(0,o.jsx)("div",{className:"md-tablet:w-full md-tablet:overflow-hidden",children:(0,o.jsx)(N.default,{value:M,tabs:u,tabShape:K,onTabClick:t=>{if(P(t?.tab),T(t?.data||[],t?.isShowRecommendedTab),!t?.isShowRecommendedTab){(0,D.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:ce,component_name:pe,component_title:s?.title,component_position:1,navigation:t?.tab}});return}C()}})}),(0,o.jsx)("div",{ref:te,className:"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]",children:(0,o.jsx)($.default,{data:{list:m,configuration:{...Z,event:n,isShowTag:U,isShowOriginalPrice:X,target:W,metafields:j,itemLength:m?.length,isDisplayBackImage:F}},id:`ShelfDisplay${e}${M}`,className:`${v?"mt-6":""} !overflow-visible`,itemClassName:p?"flex-1":"",Slide:p?_.ShelfDisplayHorizontalItem:_.ShelfDisplayWrapItem,breakpoints:l||{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:d?1:1.2},768:{spaceBetween:d?0:16,freeMode:!1,slidesPerView:y()},1024:{spaceBetween:d?0:16,freeMode:!1,slidesPerView:y(1024)},1440:{spaceBetween:d?0:16,freeMode:!1,slidesPerView:y(1440)}}})})]})});var ue=(0,q.withLayout)(fe);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useEffect, useRef, useImperativeHandle } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport TabSwitch from './tabSwitch.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { ShelfDisplayWrapItem, ShelfDisplayHorizontalItem } from './shelfDisplayItem.js'\nimport type { ShelfDisplayProps, ShelfDisplayItem } from './shelfDisplay.js'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nfunction useOnceInView<T extends Element>(options: any) {\n  const ref = useRef<T>(null)\n  const [inView, setInView] = useState(false)\n\n  useEffect(() => {\n    if (inView) return // \u5DF2\u8FDB\u5165\u8FC7\uFF0C\u5219\u4E0D\u518D\u89C2\u5BDF\n    const el = ref.current\n    if (!el || typeof IntersectionObserver === 'undefined') return\n\n    const observer = new IntersectionObserver(([entry]) => {\n      if (entry.isIntersecting) {\n        setInView(true)\n        observer.disconnect() // \u505C\u6B62\u89C2\u5BDF\n      }\n    }, options)\n\n    observer.observe(el)\n    return () => observer.disconnect()\n  }, [inView, options])\n\n  return [ref, inView]\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n  (\n    {\n      key,\n      data,\n      event,\n      buildData,\n      breakpoints,\n      className = '',\n      recommendedData,\n      target = '_self',\n      isDisplayGudgments = false,\n      isDisplayBackImage = false,\n    },\n    ref\n  ) => {\n    const {\n      productsTab = [],\n      productsCard = [],\n      title,\n      isShowTab = true,\n      tabShape = 'square',\n      isShowTag = false,\n      isShowOriginalPrice = true,\n      isShowRecommendedCard = false,\n      ...other\n    } = data\n\n    const [tabId, setTabId] = useState<string>('')\n    const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n    const isView = useRef<boolean>(false)\n    const isRecommend = useRef<boolean>(false)\n    const innerRef = useRef<HTMLDivElement>(null)\n\n    const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n    const [viewRef, inView] = useOnceInView<HTMLDivElement>({ threshold: 0 })\n\n    const isOnce = currentItems?.length <= 1 && isDisplayGudgments\n    const isShowGudgments = !isMobile && currentItems?.length <= 2 && isDisplayGudgments\n\n    const showItemLength = (size?: number) => {\n      switch (size) {\n        case 1440:\n          return isShowGudgments ? currentItems?.length : 4\n        case 1024:\n          return isShowGudgments ? currentItems?.length : 3\n        default:\n          return isShowGudgments ? currentItems?.length : 2.3\n      }\n    }\n\n    const gackViewEvent = () => {\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'view_item_list',\n        event_parameters: {\n          page_group: 'Home Page',\n          item_list_name: 'Home_Page_Bundle',\n          items: recommendedData?.map((item, index) => {\n            const findData = item?.variants?.find((v: any) => v?.sku === item?.sku)\n            const variant = findData || item?.variants?.[0]\n            return {\n              item_id: item?.sku || variant?.sku,\n              item_name: item?.name,\n              item_variant: variant?.name,\n              price: variant?.price,\n              index: index + 1,\n            }\n          }),\n        },\n      })\n    }\n\n    const handleCurrentTab = (currentData: ShelfDisplayItem[], flag: boolean) => {\n      if (flag) {\n        const newCurrentData = recommendedData?.map?.(item => {\n          return {\n            ...item,\n            isShowRecommended: true,\n          }\n        })\n        setCurrentItems(newCurrentData?.length ? newCurrentData || [] : [])\n      } else {\n        const isArray = Array.isArray(currentData)\n        if (isArray) {\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                  isShowRecommended: false,\n                  custom_name: item.custom_name,\n                  custom_description: item.custom_description,\n                  ...findData,\n                }\n              }\n            })\n            ?.filter(item => item)\n          setCurrentItems(newCurrentData?.length ? newCurrentData || [] : [])\n        } else {\n          setCurrentItems([])\n        }\n      }\n    }\n\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n\n    useEffect(() => {\n      if (inView && recommendedData?.length && !isView.current) {\n        isView.current = true\n        gackViewEvent()\n      }\n    }, [inView, recommendedData])\n\n    // \u7B97\u6CD5\u6570\u636E\u4F1A\u7A0D\u5FAE\u5EF6\u8FDF\uFF0C\u6240\u4EE5\u9700\u76D1\u542CrecommendedData\uFF0C\u4E3A\u4E86\u9632\u6B62\u5728\u6709\u7B97\u6CD5\u6570\u636E\u4E14\u5BF9\u9ED8\u8BA4\u6E32\u67D3\u7B2C\u4E00\u4E2A\u540E\u53CD\u590D\u89E6\u53D1\uFF0C\u7528isRecommend\u5173\u95ED\n    useEffect(() => {\n      if (isRecommend.current) return\n      if (!isRecommend.current && recommendedData?.length) {\n        isRecommend.current = true\n      }\n      if (isShowTab) {\n        setTabId(productsTab?.[0]?.tab || '')\n        handleCurrentTab(productsTab?.[0]?.data || [], productsTab?.[0]?.isShowRecommendedTab)\n        return\n      }\n      handleCurrentTab(productsCard, isShowRecommendedCard)\n    }, [recommendedData])\n\n    return (\n      <div\n        ref={innerRef}\n        className={cn('shelf-display-wrap w-full', className, { 'aiui-dark': data?.theme === 'dark' })}\n      >\n        {title && <Title data={{ title: title }} />}\n        {isShowTab && (\n          <div className=\"md-tablet:w-full md-tablet:overflow-hidden\">\n            <TabSwitch\n              value={tabId}\n              tabs={productsTab}\n              tabShape={tabShape}\n              onTabClick={v => {\n                setTabId(v?.tab)\n                handleCurrentTab(v?.data || [], v?.isShowRecommendedTab)\n                if (!v?.isShowRecommendedTab) {\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                  return\n                }\n                gackViewEvent()\n              }}\n            />\n          </div>\n        )}\n        <div\n          ref={viewRef as any}\n          className=\"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]\"\n        >\n          <SwiperBox\n            data={{\n              list: currentItems,\n              configuration: {\n                ...other,\n                event: event,\n                isShowTag,\n                isShowOriginalPrice,\n                target: target,\n                itemLength: currentItems?.length,\n                isDisplayBackImage: isDisplayBackImage,\n              },\n            }}\n            id={`ShelfDisplay${key}${tabId}`}\n            className={`${isShowTab ? 'mt-6' : ''} !overflow-visible`}\n            itemClassName={isShowGudgments ? 'flex-1' : ''}\n            Slide={isShowGudgments ? ShelfDisplayHorizontalItem : ShelfDisplayWrapItem}\n            breakpoints={\n              breakpoints || {\n                0: {\n                  spaceBetween: 12,\n                  freeMode: false,\n                  slidesPerView: 1,\n                },\n                374: {\n                  spaceBetween: 12,\n                  freeMode: false,\n                  slidesPerView: isOnce ? 1 : 1.2,\n                },\n                768: {\n                  spaceBetween: isOnce ? 0 : 16,\n                  freeMode: false,\n                  slidesPerView: showItemLength(),\n                },\n                1024: {\n                  spaceBetween: isOnce ? 0 : 16,\n                  freeMode: false,\n                  slidesPerView: showItemLength(1024),\n                },\n                1440: {\n                  spaceBetween: isOnce ? 0 : 16,\n                  freeMode: false,\n                  slidesPerView: showItemLength(1440),\n                },\n              }\n            }\n          />\n        </div>\n      </div>\n    )\n  }\n)\n\nexport default withLayout(ShelfDisplay)\n"],
-  "mappings": "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",
-  "names": ["ShelfDisplay_exports", "__export", "ShelfDisplay_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_tabSwitch", "import_Title", "import_SwiperBox", "import_Styles", "import_track", "import_react_responsive", "import_shelfDisplayItem", "componentType", "componentName", "useOnceInView", "options", "ref", "inView", "setInView", "el", "observer", "entry", "ShelfDisplay", "React", "key", "data", "event", "buildData", "breakpoints", "className", "recommendedData", "target", "isDisplayGudgments", "isDisplayBackImage", "productsTab", "productsCard", "title", "isShowTab", "tabShape", "isShowTag", "isShowOriginalPrice", "isShowRecommendedCard", "other", "tabId", "setTabId", "currentItems", "setCurrentItems", "isView", "isRecommend", "innerRef", "isMobile", "viewRef", "isOnce", "isShowGudgments", "showItemLength", "size", "gackViewEvent", "item", "index", "variant", "v", "handleCurrentTab", "currentData", "flag", "newCurrentData", "findData", "params", "Title", "TabSwitch", "SwiperBox"]
+  "sourcesContent": ["'use client'\nimport React, { useState, useEffect, useRef, useImperativeHandle } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport TabSwitch from './tabSwitch.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useRollout } from '../../hooks/useRollout.js'\nimport { ShelfDisplayWrapItem, ShelfDisplayHorizontalItem } from './shelfDisplayItem.js'\nimport type { ShelfDisplayProps, ShelfDisplayItem } from './shelfDisplay.js'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n  (\n    {\n      key,\n      data,\n      event,\n      buildData,\n      breakpoints,\n      className = '',\n      recommendedData,\n      target = '_self',\n      metafields,\n      isDisplayGudgments = false,\n      isDisplayBackImage = false,\n    },\n    ref\n  ) => {\n    const {\n      productsTab = [],\n      productsCard = [],\n      title,\n      isShowTab = true,\n      tabShape = 'square',\n      isShowTag = false,\n      isShowOriginalPrice = true,\n      isShowRecommendedCard = false,\n      ...other\n    } = data\n\n    const [tabId, setTabId] = useState<string>('')\n    const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n    const isView = useRef<boolean>(false)\n    const isRecommend = useRef<boolean>(false)\n    const innerRef = useRef<HTMLDivElement>(null)\n\n    const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n    const [viewRef, inView] = useRollout<HTMLDivElement>({ threshold: 0 })\n\n    const isOnce = currentItems?.length <= 1 && isDisplayGudgments\n    const isShowGudgments = !isMobile && currentItems?.length <= 2 && isDisplayGudgments\n\n    const showItemLength = (size?: number) => {\n      switch (size) {\n        case 1440:\n          return isShowGudgments ? currentItems?.length : 4\n        case 1024:\n          return isShowGudgments ? currentItems?.length : 3\n        default:\n          return isShowGudgments ? currentItems?.length : 2.3\n      }\n    }\n\n    const gackViewEvent = () => {\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'view_item_list',\n        event_parameters: {\n          page_group: 'Home Page',\n          item_list_name: 'Home_Page_Bundle',\n          items: recommendedData?.map((item, index) => {\n            const findData = item?.variants?.find((v: any) => v?.sku === item?.sku)\n            const variant = findData || item?.variants?.[0]\n            return {\n              item_id: item?.sku || variant?.sku,\n              item_name: item?.name,\n              item_variant: variant?.name,\n              price: variant?.price,\n              index: index + 1,\n            }\n          }),\n        },\n      })\n    }\n\n    const handleCurrentTab = (currentData: ShelfDisplayItem[], flag: boolean) => {\n      if (flag) {\n        const newCurrentData = recommendedData?.map?.(item => {\n          return {\n            ...item,\n            isShowRecommended: true,\n          }\n        })\n        setCurrentItems(newCurrentData?.length ? newCurrentData || [] : [])\n      } else {\n        const isArray = Array.isArray(currentData)\n        if (isArray) {\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                  isShowRecommended: false,\n                  custom_name: item.custom_name,\n                  custom_description: item.custom_description,\n                  custom_image: item.custom_image,\n                  custom_theme: item.custom_theme,\n                  ...findData,\n                }\n              }\n            })\n            ?.filter(item => item)\n          setCurrentItems(newCurrentData?.length ? newCurrentData || [] : [])\n        } else {\n          setCurrentItems([])\n        }\n      }\n    }\n\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n    useEffect(() => {\n      if (inView && recommendedData?.length && !isView.current) {\n        isView.current = true\n        gackViewEvent()\n      }\n    }, [inView, recommendedData])\n\n    // \u7B97\u6CD5\u6570\u636E\u4F1A\u7A0D\u5FAE\u5EF6\u8FDF\uFF0C\u6240\u4EE5\u9700\u76D1\u542CrecommendedData\uFF0C\u4E3A\u4E86\u9632\u6B62\u5728\u6709\u7B97\u6CD5\u6570\u636E\u4E14\u5BF9\u9ED8\u8BA4\u6E32\u67D3\u7B2C\u4E00\u4E2A\u540E\u53CD\u590D\u89E6\u53D1\uFF0C\u7528isRecommend\u5173\u95ED\n    useEffect(() => {\n      if (isRecommend.current) return\n      if (!isRecommend.current && recommendedData?.length) {\n        isRecommend.current = true\n      }\n      if (isShowTab) {\n        setTabId(productsTab?.[0]?.tab || '')\n        handleCurrentTab(productsTab?.[0]?.data || [], productsTab?.[0]?.isShowRecommendedTab)\n        return\n      }\n      handleCurrentTab(productsCard, isShowRecommendedCard)\n    }, [recommendedData])\n\n    return (\n      <div\n        ref={innerRef}\n        className={cn('shelf-display-wrap w-full', className, { 'aiui-dark': data?.theme === 'dark' })}\n      >\n        {title && <Title data={{ title: title }} />}\n        {isShowTab && (\n          <div className=\"md-tablet:w-full md-tablet:overflow-hidden\">\n            <TabSwitch\n              value={tabId}\n              tabs={productsTab}\n              tabShape={tabShape}\n              onTabClick={v => {\n                setTabId(v?.tab)\n                handleCurrentTab(v?.data || [], v?.isShowRecommendedTab)\n                if (!v?.isShowRecommendedTab) {\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                  return\n                }\n                gackViewEvent()\n              }}\n            />\n          </div>\n        )}\n        <div\n          ref={viewRef as any}\n          className=\"tablet:min-h-[393px] laptop:min-h-[425px] desktop:min-h-[405px] lg-desktop:min-h-[409px]\"\n        >\n          <SwiperBox\n            data={{\n              list: currentItems,\n              configuration: {\n                ...other,\n                event: event,\n                isShowTag,\n                isShowOriginalPrice,\n                target: target,\n                metafields: metafields,\n                itemLength: currentItems?.length,\n                isDisplayBackImage: isDisplayBackImage,\n              },\n            }}\n            id={`ShelfDisplay${key}${tabId}`}\n            className={`${isShowTab ? 'mt-6' : ''} !overflow-visible`}\n            itemClassName={isShowGudgments ? 'flex-1' : ''}\n            Slide={isShowGudgments ? ShelfDisplayHorizontalItem : ShelfDisplayWrapItem}\n            breakpoints={\n              breakpoints || {\n                0: {\n                  spaceBetween: 12,\n                  freeMode: false,\n                  slidesPerView: 1,\n                },\n                374: {\n                  spaceBetween: 12,\n                  freeMode: false,\n                  slidesPerView: isOnce ? 1 : 1.2,\n                },\n                768: {\n                  spaceBetween: isOnce ? 0 : 16,\n                  freeMode: false,\n                  slidesPerView: showItemLength(),\n                },\n                1024: {\n                  spaceBetween: isOnce ? 0 : 16,\n                  freeMode: false,\n                  slidesPerView: showItemLength(1024),\n                },\n                1440: {\n                  spaceBetween: isOnce ? 0 : 16,\n                  freeMode: false,\n                  slidesPerView: showItemLength(1440),\n                },\n              }\n            }\n          />\n        </div>\n      </div>\n    )\n  }\n)\n\nexport default withLayout(ShelfDisplay)\n"],
+  "mappings": "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",
+  "names": ["ShelfDisplay_exports", "__export", "ShelfDisplay_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_tabSwitch", "import_Title", "import_SwiperBox", "import_Styles", "import_track", "import_react_responsive", "import_useRollout", "import_shelfDisplayItem", "componentType", "componentName", "ShelfDisplay", "React", "key", "data", "event", "buildData", "breakpoints", "className", "recommendedData", "target", "metafields", "isDisplayGudgments", "isDisplayBackImage", "ref", "productsTab", "productsCard", "title", "isShowTab", "tabShape", "isShowTag", "isShowOriginalPrice", "isShowRecommendedCard", "other", "tabId", "setTabId", "currentItems", "setCurrentItems", "isView", "isRecommend", "innerRef", "isMobile", "viewRef", "inView", "isOnce", "isShowGudgments", "showItemLength", "size", "gackViewEvent", "item", "index", "variant", "v", "handleCurrentTab", "currentData", "flag", "newCurrentData", "findData", "params", "Title", "TabSwitch", "SwiperBox"]
 }

package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.d.ts

@@ -8,7 +8,7 @@ export declare function formatPrice({ amount, currencyCode, locale, maximumFract
     maximumFractionDigits?: number;
     minimumFractionDigits?: number;
     removeTrailingZeros?: boolean;
-}): string;
+}): string | null;
 export declare function formatVariantPrice({ amount, baseAmount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
     baseAmount: number;
     amount: number;
@@ -19,8 +19,14 @@ export declare function formatVariantPrice({ amount, baseAmount, currencyCode, l
     removeTrailingZeros?: boolean;
 }): {
     price: string;
-    basePrice: string | undefined;
+    basePrice: string;
+    discount: string;
+    discountAmount?: undefined;
+} | {
+    price: string | null;
+    basePrice: string | null | undefined;
     discount: string | null;
+    discountAmount: string | null | undefined;
 };
 type EventType = {
     primaryButton?: (v: any, index: number, data: ShelfDisplayType) => void;
@@ -46,6 +52,8 @@ export interface ShelfDisplayItem {
     data?: ShelfDisplayItem[];
     custom_name?: string;
     custom_description?: string;
+    custom_image?: string;
+    custom_theme?: string;
 }
 export type ShelfDisplayType = {
     title?: string;
@@ -91,6 +99,7 @@ export interface ShelfDisplayProps {
             slidesPerView: number;
         };
     };
+    metafields?: any;
     isDisplayGudgments?: boolean;
     isDisplayBackImage?: boolean;
 }

package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js

@@ -1,2 +1,2 @@
-"use strict";var c=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var D=Object.prototype.hasOwnProperty;var h=(n,e)=>{for(var t in e)c(n,t,{get:e[t],enumerable:!0})},S=(n,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of f(e))!D.call(n,i)&&i!==t&&c(n,i,{get:()=>e[i],enumerable:!(r=b(e,i))||r.enumerable});return n};var v=n=>S(c({},"__esModule",{value:!0}),n);var P={};h(P,{PRICE_SYMBOL:()=>s,formatPrice:()=>l,formatVariantPrice:()=>E,languageTerritory:()=>d});module.exports=v(P);const s={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},d=n=>({us:"en-us",uk:"en-gb",ca:"en-ca",au:"en-au",eu:"en",fr:"de-DE","eu-es":"de-DE","eu-fr":"de-DE","eu-it":"de-DE","eu-de":"de-DE","eu-en":"en-US","cz-en":"de-DE",nl:"de-DE",de:"de-DE",vn:"vi-vn",sg:"en-sg","ae-en":"ae-en",plus:"en-us",cl:"es-cl",dk:"en-dk",fi:"en-fi",no:"en-no",is:"en-is",se:"en-se"})[n]||"";function l({amount:n,currencyCode:e,locale:t,maximumFractionDigits:r,minimumFractionDigits:i,removeTrailingZeros:o=!1}){let a=new Intl.NumberFormat(d(t),{style:"currency",currency:e||"USD",minimumFractionDigits:r===0?0:i,maximumFractionDigits:r}).format(n);return["eu-de","eu-en","de","eu"].includes(t)&&(a=a?.toString()?.replace(/[\s]/g,"")),o&&(a=a.replace(/(\.\d*?[1-9])0+\b/,"$1").replace(/\.0+\b/,"").replace(/(\,\d*?[1-9])0+\b/,"$1").replace(/\,0+\b/,"")),a}function E({amount:n,baseAmount:e,currencyCode:t,locale:r,maximumFractionDigits:i,minimumFractionDigits:o,removeTrailingZeros:u}){if(typeof Intl>"u")return{price:`${s[r]}${n}`,basePrice:`${s[r]}${e}`,discount:`${s[r]}${e-n||0}`};const a=e>n,p=new Intl.NumberFormat(d(r),{style:"percent"}),m=a?p.format((e-n)/e):null,g=l({amount:n,currencyCode:t,locale:r,removeTrailingZeros:u}),y=a?l({amount:e,currencyCode:t,locale:r,maximumFractionDigits:i,minimumFractionDigits:o,removeTrailingZeros:u}):void 0;return{price:g,basePrice:y,discount:m}}
+"use strict";var S=Object.create;var u=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,T=Object.prototype.hasOwnProperty;var $=(e,n)=>{for(var r in n)u(e,r,{get:n[r],enumerable:!0})},f=(e,n,r,t)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of P(n))!T.call(e,i)&&i!==r&&u(e,i,{get:()=>n[i],enumerable:!(t=v(n,i))||t.enumerable});return e};var k=(e,n,r)=>(r=e!=null?S(E(e)):{},f(n||!e||!e.__esModule?u(r,"default",{value:e,enumerable:!0}):r,e)),w=e=>f(u({},"__esModule",{value:!0}),e);var C={};$(C,{PRICE_SYMBOL:()=>c,formatPrice:()=>m,formatVariantPrice:()=>x,languageTerritory:()=>g});module.exports=w(C);var b=k(require("decimal.js"));const c={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",nl:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},g=e=>({us:"en-US",uk:"en-GB",ca:"en-CA",eu:"en",fr:"fr-FR",au:"en-AU",my:"en-my","eu-es":"de-DE","eu-fr":"de-DE","eu-it":"de-DE","eu-de":"de-DE","eu-en":"en-US","cz-en":"de-DE","ca-fr":"fr-FR",nl:"de-DE",de:"de-DE",vn:"vi-vn",sg:"en-sg","ae-en":"ae-en",plus:"en-us",cl:"es-cl",dk:"en-dk",fi:"en-fi",no:"en-no",is:"en-is",se:"en-se","eu-pl":"pl-PL"})[e]||"";function m({amount:e,currencyCode:n,locale:r,maximumFractionDigits:t,minimumFractionDigits:i,removeTrailingZeros:l=!1}){const o=r==="nl"?"EUR":n||"USD",s=g(r);if(!s)return null;let a=new Intl.NumberFormat(s,{style:"currency",currency:o,minimumFractionDigits:t===0?0:i,maximumFractionDigits:t})?.format?.(e);return["eu-de","eu-en","de","eu"].includes(r)&&(a=a?.toString()?.replace?.(/[\s]/g,"")),l&&(a=a?.replace?.(/(\.\d*?[1-9])0+\b/,"$1")?.replace?.(/\.0+\b/,"")?.replace?.(/(\,\d*?[1-9])0+\b/,"$1")?.replace?.(/\,0+\b/,"")),a}function x({amount:e,baseAmount:n,currencyCode:r,locale:t,maximumFractionDigits:i,minimumFractionDigits:l,removeTrailingZeros:o}){if(typeof Intl>"u")return{price:`${c[t]}${e}`,basePrice:`${c[t]}${n}`,discount:`${c[t]}${n-e||0}`};const s=n>e;let d=null;const a=g(t);if(a){const p=new Intl.NumberFormat(a,{style:"percent"});d=s?p.format((n-e)/n):null}let y;if(s){const p=new b.default(n).sub(e||0).toNumber();y=m({amount:p,currencyCode:r||"USD",locale:t,maximumFractionDigits:2})}const D=m({amount:e,currencyCode:r,locale:t,removeTrailingZeros:o}),h=s?m({amount:n,currencyCode:r,locale:t,maximumFractionDigits:i,minimumFractionDigits:l,removeTrailingZeros:o}):void 0;return{price:D,basePrice:h,discount:d,discountAmount:y}}
 //# sourceMappingURL=shelfDisplay.js.map

package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/shelfDisplay.ts"],
-  "sourcesContent": ["import type { ContainerProps } from '../../types/props.js'\n/* eslint-disable no-useless-escape */\nexport const PRICE_SYMBOL = {\n  us: '$',\n  uk: '\u00A3',\n  ca: '$',\n  eu: '\u20AC',\n  fr: '\u20AC',\n  de: '\u20AC',\n  vn: '\u20AB',\n  cl: '$',\n  sg: '$',\n  ae: 'AED',\n} as any\n\nexport const languageTerritory = (locale: string) =>\n  // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n  ({\n    us: 'en-us',\n    uk: 'en-gb',\n    ca: 'en-ca',\n    au: 'en-au',\n    eu: 'en',\n    fr: 'de-DE',\n    'eu-es': 'de-DE',\n    'eu-fr': 'de-DE',\n    'eu-it': 'de-DE',\n    'eu-de': 'de-DE',\n    'eu-en': 'en-US',\n    'cz-en': 'de-DE',\n    nl: 'de-DE',\n    de: 'de-DE',\n    vn: 'vi-vn',\n    sg: 'en-sg',\n    'ae-en': 'ae-en',\n    plus: 'en-us',\n    cl: 'es-cl',\n    dk: 'en-dk',\n    fi: 'en-fi',\n    no: 'en-no',\n    is: 'en-is',\n    se: 'en-se',\n  })[locale] || ''\n\nexport function formatPrice({\n  amount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros = false,\n}: {\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  const formatCurrency = new Intl.NumberFormat(languageTerritory(locale), {\n    style: 'currency',\n    currency: currencyCode || 'USD',\n    minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n    maximumFractionDigits,\n  })\n\n  let formattedValue = formatCurrency.format(amount)\n\n  if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n    formattedValue = formattedValue?.toString()?.replace(/[\\s]/g, '')\n  }\n\n  if (removeTrailingZeros) {\n    // Adjust the regex to match comma as decimal separator\n    formattedValue = formattedValue\n      .replace(/(\\.\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\.0+\\b/, '')\n      .replace(/(\\,\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\,0+\\b/, '')\n  }\n\n  return formattedValue\n}\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  const formatDiscount = new Intl.NumberFormat(languageTerritory(locale), {\n    style: 'percent',\n  })\n  const discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n\n  const price = formatPrice({ amount, currencyCode, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount }\n}\n\ntype EventType = {\n  primaryButton?: (v: any, index: number, data: ShelfDisplayType) => void\n  secondaryButton?: (v: any, index: number, data: ShelfDisplayType) => void\n}\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  custom_name?: string\n  custom_description?: string\n}\n\nexport type ShelfDisplayType = {\n  title?: string\n  isShowTab?: boolean\n  isShowTag?: boolean\n  isShowRecommendedCard?: boolean\n  isShowOriginalPrice?: 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  primaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  /** \u526F\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: string\n  secondaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  theme?: 'light' | 'dark'\n  containerProps?: ContainerProps\n}\n\nexport interface ShelfDisplayProps {\n  data: ShelfDisplayType\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  recommendedData?: any[]\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  className?: string\n  key?: string\n  target?: '_self' | '_blank'\n  breakpoints?: {\n    [key: number]: {\n      spaceBetween: number\n      freeMode: boolean\n      slidesPerView: number\n    }\n  }\n  isDisplayGudgments?: boolean\n  isDisplayBackImage?: boolean\n}"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,kBAAAE,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,sBAAAC,IAAA,eAAAC,EAAAN,GAEO,MAAME,EAAe,CAC1B,GAAI,IACJ,GAAI,OACJ,GAAI,IACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,IACJ,GAAI,IACJ,GAAI,KACN,EAEaG,EAAqBE,IAE/B,CACC,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,KACJ,GAAI,QACJ,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,KAAM,QACN,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,OACN,GAAGA,CAAM,GAAK,GAET,SAASJ,EAAY,CAC1B,OAAAK,EACA,aAAAC,EACA,OAAAF,EACA,sBAAAG,EACA,sBAAAC,EACA,oBAAAC,EAAsB,EACxB,EAOG,CAQD,IAAIC,EAPmB,IAAI,KAAK,aAAaR,EAAkBE,CAAM,EAAG,CACtE,MAAO,WACP,SAAUE,GAAgB,MAC1B,sBAAuBC,IAA0B,EAAI,EAAIC,EACzD,sBAAAD,CACF,CAAC,EAEmC,OAAOF,CAAM,EAEjD,MAAI,CAAC,QAAS,QAAS,KAAM,IAAI,EAAE,SAASD,CAAM,IAChDM,EAAiBA,GAAgB,SAAS,GAAG,QAAQ,QAAS,EAAE,GAG9DD,IAEFC,EAAiBA,EACd,QAAQ,oBAAqB,IAAI,EACjC,QAAQ,SAAU,EAAE,EACpB,QAAQ,oBAAqB,IAAI,EACjC,QAAQ,SAAU,EAAE,GAGlBA,CACT,CAEO,SAAST,EAAmB,CACjC,OAAAI,EACA,WAAAM,EACA,aAAAL,EACA,OAAAF,EACA,sBAAAG,EACA,sBAAAC,EACA,oBAAAC,CACF,EAQG,CACD,GAAI,OAAO,KAAS,IAClB,MAAO,CACL,MAAO,GAAGV,EAAaK,CAAM,CAAC,GAAGC,CAAM,GACvC,UAAW,GAAGN,EAAaK,CAAM,CAAC,GAAGO,CAAU,GAC/C,SAAU,GAAGZ,EAAaK,CAAM,CAAC,GAAGO,EAAaN,GAAU,CAAC,EAC9D,EAGF,MAAMO,EAAcD,EAAaN,EAC3BQ,EAAiB,IAAI,KAAK,aAAaX,EAAkBE,CAAM,EAAG,CACtE,MAAO,SACT,CAAC,EACKU,EAAWF,EAAcC,EAAe,QAAQF,EAAaN,GAAUM,CAAU,EAAI,KAErFI,EAAQf,EAAY,CAAE,OAAAK,EAAQ,aAAAC,EAAc,OAAAF,EAAQ,oBAAAK,CAAoB,CAAC,EACzEO,EAAYJ,EACdZ,EAAY,CACV,OAAQW,EACR,aAAAL,EACA,OAAAF,EACA,sBAAAG,EACA,sBAAAC,EACA,oBAAAC,CACF,CAAC,EACD,OAEJ,MAAO,CAAE,MAAAM,EAAO,UAAAC,EAAW,SAAAF,CAAS,CACtC",
-  "names": ["shelfDisplay_exports", "__export", "PRICE_SYMBOL", "formatPrice", "formatVariantPrice", "languageTerritory", "__toCommonJS", "locale", "amount", "currencyCode", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "formattedValue", "baseAmount", "hasDiscount", "formatDiscount", "discount", "price", "basePrice"]
+  "sourcesContent": ["import Decimal from 'decimal.js'\nimport type { ContainerProps } from '../../types/props.js'\n/* eslint-disable no-useless-escape */\nexport const PRICE_SYMBOL = {\n  us: '$',\n  uk: '\u00A3',\n  ca: '$',\n  eu: '\u20AC',\n  fr: '\u20AC',\n  de: '\u20AC',\n  nl: '\u20AC',\n  vn: '\u20AB',\n  cl: '$',\n  sg: '$',\n  ae: 'AED',\n} as any\n\nexport const languageTerritory = (locale: string) =>\n  // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n  ({\n    us: 'en-US',\n    uk: 'en-GB',\n    ca: 'en-CA',\n    eu: 'en',\n    fr: 'fr-FR',\n    au: 'en-AU',\n    my: 'en-my',\n    'eu-es': 'de-DE',\n    'eu-fr': 'de-DE',\n    'eu-it': 'de-DE',\n    'eu-de': 'de-DE',\n    'eu-en': 'en-US',\n    'cz-en': 'de-DE',\n    'ca-fr': 'fr-FR',\n    nl: 'de-DE',\n    de: 'de-DE',\n    vn: 'vi-vn',\n    sg: 'en-sg',\n    'ae-en': 'ae-en',\n    plus: 'en-us',\n    cl: 'es-cl',\n    dk: 'en-dk',\n    fi: 'en-fi',\n    no: 'en-no',\n    is: 'en-is',\n    se: 'en-se',\n    'eu-pl': 'pl-PL',\n  })[locale] || ''\n\nexport function formatPrice({\n  amount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros = false,\n}: {\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  const code = locale === 'nl' ? 'EUR' : currencyCode || 'USD'\n  const localeLanguage = languageTerritory(locale)\n  if (!localeLanguage) {\n    return null\n  }\n  const formatCurrency = new Intl.NumberFormat(localeLanguage, {\n    style: 'currency',\n    currency: code,\n    minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n    maximumFractionDigits,\n  })\n\n  let formattedValue = formatCurrency?.format?.(amount)\n\n  if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n    formattedValue = formattedValue?.toString()?.replace?.(/[\\s]/g, '')\n  }\n\n  if (removeTrailingZeros) {\n    formattedValue = formattedValue\n      ?.replace?.(/(\\.\\d*?[1-9])0+\\b/, '$1')\n      ?.replace?.(/\\.0+\\b/, '')\n      ?.replace?.(/(\\,\\d*?[1-9])0+\\b/, '$1')\n      ?.replace?.(/\\,0+\\b/, '')\n  }\n\n  return formattedValue\n}\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  let discount = null\n  const currentLocale = languageTerritory(locale)\n  if (currentLocale) {\n    const formatDiscount = new Intl.NumberFormat(currentLocale, {\n      style: 'percent',\n    })\n    discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n  }\n  // \u6298\u6263\u91D1\u989D\n  let discountAmount;\n  if (hasDiscount) { \n    const savePriceAmount = new Decimal(baseAmount).sub(amount || 0).toNumber()\n    discountAmount = formatPrice({\n      amount: savePriceAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    })\n  }\n\n  const price = formatPrice({ amount, currencyCode, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount, discountAmount }\n}\n\ntype EventType = {\n  primaryButton?: (v: any, index: number, data: ShelfDisplayType) => void\n  secondaryButton?: (v: any, index: number, data: ShelfDisplayType) => void\n}\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  custom_name?: string\n  custom_description?: string\n  custom_image?: string\n  custom_theme?: string\n}\n\nexport type ShelfDisplayType = {\n  title?: string\n  isShowTab?: boolean\n  isShowTag?: boolean\n  isShowRecommendedCard?: boolean\n  isShowOriginalPrice?: 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  primaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  /** \u526F\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: string\n  secondaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  theme?: 'light' | 'dark'\n  containerProps?: ContainerProps\n}\n\nexport interface ShelfDisplayProps {\n  data: ShelfDisplayType\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  recommendedData?: any[]\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  className?: string\n  key?: string\n  target?: '_self' | '_blank'\n  breakpoints?: {\n    [key: number]: {\n      spaceBetween: number\n      freeMode: boolean\n      slidesPerView: number\n    }\n  }\n  metafields?: any\n  isDisplayGudgments?: boolean\n  isDisplayBackImage?: boolean\n}"],
+  "mappings": "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",
+  "names": ["shelfDisplay_exports", "__export", "PRICE_SYMBOL", "formatPrice", "formatVariantPrice", "languageTerritory", "__toCommonJS", "import_decimal", "locale", "amount", "currencyCode", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "code", "localeLanguage", "formattedValue", "baseAmount", "hasDiscount", "discount", "currentLocale", "formatDiscount", "discountAmount", "savePriceAmount", "Decimal", "price", "basePrice"]
 }

package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js

@@ -1,10 +1,10 @@
-"use strict";var M=Object.create;var k=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,J=Object.prototype.hasOwnProperty;var K=(e,t)=>{for(var n in t)k(e,n,{get:t[n],enumerable:!0})},W=(e,t,n,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of q(t))!J.call(e,o)&&o!==n&&k(e,o,{get:()=>t[o],enumerable:!(c=V(t,o))||c.enumerable});return e};var P=(e,t,n)=>(n=e!=null?M(G(e)):{},W(t||!e||!e.__esModule?k(n,"default",{value:e,enumerable:!0}):n,e)),Q=e=>W(k({},"__esModule",{value:!0}),e);var Z={};K(Z,{ShelfDisplayHorizontalItem:()=>Y,ShelfDisplayWrapItem:()=>X});module.exports=Q(Z);var l=require("react/jsx-runtime"),$=require("../AiuiProvider/index.js"),j=require("./shelfDisplay.js"),S=P(require("../../components/picture.js")),O=P(require("../../components/badge.js")),m=require("../../helpers/utils.js"),H=require("../../components/text.js"),b=P(require("../../components/button.js")),L=require("../../shared/track.js"),z=require("../../shared/trackUrlRef.js"),E=require("../../components/heading.js"),F=require("../../hooks/useExposure.js"),U=require("react");const w="image",g="product_shelf",A=999999999e-2,X=({data:e,configuration:t})=>{const{isDisplayBackImage:n=!1,itemShape:c}=t||{},{locale:o="us",copyWriting:_}=(0,$.useAiuiContext)(),h=(0,U.useRef)(null),N=(i,s,r)=>t?.event?.primaryButton?.(i,s+1,r),B=(i,s,r)=>t?.event?.secondaryButton?.(i,s+1,r),a=e?.variants?.find(i=>i?.sku===e?.sku)||e?.variants?.[0]||{},D=!a?.availableForSale&&a?.price?.amount===A,T=t?.isShowTag,f=t?.isShowOriginalPrice,d=a?.coupons?.[0],{price:C,basePrice:I}=(0,j.formatVariantPrice)({locale:o,amount:f&&d?d.variant_price4wscode:a.price,baseAmount:f&&d?a.price:0,currencyCode:e?.price?.currencyCode||"USD"}),y=()=>{const i=e?.sku,s=e?.variants;return s?.find(v=>v?.sku===i)?.image?.url||s?.[0]?.image?.url||""},p=e?.custom_name||e?.title,x=e?.custom_description||e?.description;(0,F.useExposure)(h,{componentType:w,componentName:g,componentTitle:p,componentDescription:x,position:t?.index+1});const u=()=>(0,l.jsxs)(l.Fragment,{children:[T?(0,l.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.filter?.(i=>i?.startsWith?.("CLtag"))?.map?.(i=>i?.replace?.("CLtag:",""))?.slice?.(0,2)?.map?.((i,s)=>(0,l.jsx)(O.default,{children:i},s))}):null,p?(0,l.jsx)(E.Heading,{as:"h3",title:p||"",size:2,className:"shelf-display-product-title mb-1 line-clamp-2",html:p||""}):null,x?(0,l.jsx)(H.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm",html:x||""}):null,(0,l.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:D?(0,l.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:_?.soldOutText}):(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)("div",{className:"final-price tablet:text-2xl text-info-primary text-xl font-bold",children:a?.availableForSale&&C||""}),(0,l.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:a?.availableForSale&&I||""})]})}),(0,l.jsxs)("div",{className:(0,m.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton?(0,l.jsx)(b.default,{variant:"secondary",onClick:()=>B(e,t?.index,t),className:`
+"use strict";var K=Object.create;var N=Object.defineProperty;var Q=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Y=Object.getPrototypeOf,Z=Object.prototype.hasOwnProperty;var ee=(e,t)=>{for(var n in t)N(e,n,{get:t[n],enumerable:!0})},q=(e,t,n,x)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of X(t))!Z.call(e,c)&&c!==n&&N(e,c,{get:()=>t[c],enumerable:!(x=Q(t,c))||x.enumerable});return e};var z=(e,t,n)=>(n=e!=null?K(Y(e)):{},q(t||!e||!e.__esModule?N(n,"default",{value:e,enumerable:!0}):n,e)),te=e=>q(N({},"__esModule",{value:!0}),e);var oe={};ee(oe,{ShelfDisplayHorizontalItem:()=>le,ShelfDisplayWrapItem:()=>se});module.exports=te(oe);var s=require("react/jsx-runtime"),E=require("../AiuiProvider/index.js"),F=require("./shelfDisplay.js"),D=z(require("../../components/picture.js")),U=z(require("../../components/badge.js")),d=require("../../helpers/utils.js"),W=require("../../components/text.js"),k=z(require("../../components/button.js")),A=require("../../shared/track.js"),R=require("../../shared/trackUrlRef.js"),M=require("../../components/heading.js"),V=require("../../hooks/useExposure.js"),u=require("react");const T="image",B="product_shelf",G=999999999e-2,se=({data:e,configuration:t})=>{const{isDisplayBackImage:n=!1,itemShape:x,metafields:c}=t||{},{locale:f="us",copyWriting:b}=(0,E.useAiuiContext)(),{discounts:C}=c||{},w=(0,u.useRef)(null),[$,S]=(0,u.useState)([]),I=(i,l,a)=>t?.event?.primaryButton?.(i,l+1,a),P=(i,l,a)=>t?.event?.secondaryButton?.(i,l+1,a),o=e?.variants?.find(i=>i?.sku===e?.sku)||e?.variants?.[0]||{},j=!o?.availableForSale&&o?.price?.amount===G,O=t?.isShowTag,g=t?.isShowOriginalPrice,h=o?.coupons?.[0],{price:H,basePrice:L,discount:m}=(0,F.formatVariantPrice)({locale:f,amount:g&&h?h.variant_price4wscode:o.price,baseAmount:g&&h?o.price:0,currencyCode:e?.price?.currencyCode||"USD"}),_=()=>{const i=e?.sku,l=e?.variants;return l?.find(r=>r?.sku===i)?.image?.url||l?.[0]?.image?.url||""},p=e?.custom_name||e?.title,v=e?.custom_description||e?.description;(0,u.useEffect)(()=>{let i=[];if(m){const a=`${m}${C?.off||""}`;i.push(a)}const l=e?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,m?1:2);S(i.concat(l))},[e?.tags,m]),(0,V.useExposure)(w,{componentType:T,componentName:B,componentTitle:p,componentDescription:v,position:t?.index+1});const y=()=>(0,s.jsxs)(s.Fragment,{children:[O?(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:$?.map?.((i,l)=>(0,s.jsx)(U.default,{children:i},l))}):null,p?(0,s.jsx)(M.Heading,{as:"h3",title:p||"",size:2,className:"shelf-display-product-title mb-1 line-clamp-2",html:p||""}):null,v?(0,s.jsx)(W.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm",html:v||""}):null,(0,s.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:j?(0,s.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:b?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-2xl text-info-primary text-xl font-bold",children:o?.availableForSale&&H||""}),(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:o?.availableForSale&&L||""})]})}),(0,s.jsxs)("div",{className:(0,d.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton?(0,s.jsx)(k.default,{variant:"secondary",onClick:()=>P(e,t?.index,t),className:`
                 ${t.direction==="vertical"?"w-full":""}
-              `,children:t?.secondaryButton||""}):null,t?.primaryButton?(0,l.jsx)(b.default,{variant:"primary",onClick:()=>N(e,t?.index,t),className:`
+              `,children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(k.default,{variant:"primary",onClick:()=>I(e,t?.index,t),className:`
               ${t.direction==="vertical"?"w-full":""}
-            `,children:t?.primaryButton||""}):null]})]});return(0,l.jsx)("div",{ref:h,className:(0,m.cn)("bg-container-secondary-1 tablet:hover:bg-info-white box-border w-full cursor-pointer overflow-hidden duration-300",c==="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","md-tablet:h-[360px]"),children:n?(0,l.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,l.jsxs)("div",{className:"relative inset-0 size-full",children:[(0,l.jsx)(S.default,{source:y(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"}),(0,l.jsx)("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:u()})]})}):(0,l.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4",children:[(0,l.jsx)("div",{className:(0,m.cn)("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden"),children:(0,l.jsx)("a",{"aria-label":p,target:t?.target,href:(0,z.trackUrlRef)(`${o==="us"||!o?"":`/${o}`}/products/${e?.handle}`,`${w}_${g}`),onClick:()=>{(0,L.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||a?.sku,item_name:e?.name,item_variant:a?.name,price:a?.price,index:t?.index+1}]}})},children:(0,l.jsx)(S.default,{source:y(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),u()]})},e?.id||e?.handle)},Y=({data:e,configuration:t})=>{const{itemShape:n,itemLength:c}=t||{},{locale:o="us",copyWriting:_}=(0,$.useAiuiContext)(),h=(0,U.useRef)(null),N=(s,r,v)=>t?.event?.primaryButton?.(s,r+1,v),B=(s,r,v)=>t?.event?.secondaryButton?.(s,r+1,v),a=e?.variants?.find(s=>s?.sku===e?.sku)||e?.variants?.[0]||{},D=!a?.availableForSale&&a?.price?.amount===A,T=t?.isShowTag,f=t?.isShowOriginalPrice,d=a?.coupons?.[0],{price:C,basePrice:I}=(0,j.formatVariantPrice)({locale:o,amount:f&&d?d.variant_price4wscode:a.price,baseAmount:f&&d?a.price:0,currencyCode:e?.price?.currencyCode||"USD"}),y=()=>{const s=e?.sku,r=e?.variants;return r?.find(R=>R?.sku===s)?.image?.url||r?.[0]?.image?.url||""},p=e?.custom_name||e?.title,x=e?.custom_description||e?.description;(0,F.useExposure)(h,{componentType:w,componentName:g,componentTitle:p,componentDescription:x,position:t?.index+1});const u=()=>c>=2?{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full",imgItem:"m-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]",wrap:"lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full"}:{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]",imgItem:"md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]",wrap:"lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full"},i=()=>c>=2?"flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center":"flex justify-center items-center gap-6 md-tablet:flex-col";return(0,l.jsx)("div",{ref:h,className:(0,m.cn)(u().wrap,n==="round"?"rounded-2xl":"rounded-none","bg-container-secondary-1 tablet:hover:bg-info-white duration-300 gap-6","box-border w-full cursor-pointer overflow-hidden relative md-tablet:h-[360px]"),children:(0,l.jsxs)("div",{className:(0,m.cn)(i(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[(0,l.jsx)("div",{className:(0,m.cn)(u().imgItem,"relative overflow-hidden desktop:mb-0 mb-1"),children:(0,l.jsx)("a",{"aria-label":p,target:t?.target,href:(0,z.trackUrlRef)(`${o==="us"||!o?"":`/${o}`}/products/${e?.handle}`,`${w}_${g}`),onClick:()=>{(0,L.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||a?.sku,item_name:e?.name,item_variant:a?.name,price:a?.price,index:t?.index+1}]}})},children:(0,l.jsx)(S.default,{source:y(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),(0,l.jsxs)("div",{className:(0,m.cn)("flex flex-col justify-center items-start",u().boxItem),children:[T?(0,l.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.filter?.(s=>s?.startsWith?.("CLtag"))?.map?.(s=>s?.replace?.("CLtag:",""))?.slice?.(0,2)?.map?.((s,r)=>(0,l.jsx)(O.default,{children:s},r))}):null,p?(0,l.jsx)(E.Heading,{as:"h3",title:p||"",size:2,className:"shelf-display-product-title mb-1 line-clamp-2",html:p||""}):null,x?(0,l.jsx)(H.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm",html:x||""}):null,(0,l.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:D?(0,l.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:_?.soldOutText}):(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)("div",{className:"final-price tablet:text-2xl text-info-primary text-xl font-bold",children:a?.availableForSale&&C||""}),(0,l.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:a?.availableForSale&&I||""})]})}),(0,l.jsxs)("div",{className:(0,m.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton?(0,l.jsx)(b.default,{variant:"secondary",onClick:()=>B(e,t?.index,t),className:`
+            `,children:t?.primaryButton||""}):null]})]});return(0,s.jsx)("div",{ref:w,className:(0,d.cn)("bg-container-secondary-1 tablet:hover:bg-info-white box-border w-full cursor-pointer overflow-hidden duration-300",x==="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","md-tablet:h-[360px]"),children:n?(0,s.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,s.jsxs)("div",{className:"relative inset-0 size-full",children:[(0,s.jsx)(D.default,{source:_(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"}),(0,s.jsx)("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:y()})]})}):(0,s.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4",children:[(0,s.jsx)("div",{className:(0,d.cn)("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden"),children:(0,s.jsx)("a",{"aria-label":p,target:t?.target,href:(0,R.trackUrlRef)(`${f==="us"||!f?"":`/${f}`}/products/${e?.handle}`,`${T}_${B}`),onClick:()=>{(0,A.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||o?.sku,item_name:e?.name,item_variant:o?.name,price:o?.price,index:t?.index+1}]}})},children:(0,s.jsx)(D.default,{source:_(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),y()]})},e?.id||e?.handle)},le=({data:e,configuration:t})=>{const{itemShape:n,itemLength:x,metafields:c}=t||{},{discounts:f}=c||{},{locale:b="us",copyWriting:C}=(0,E.useAiuiContext)(),[w,$]=(0,u.useState)([]),S=(0,u.useRef)(null),I=(l,a,r)=>t?.event?.primaryButton?.(l,a+1,r),P=(l,a,r)=>t?.event?.secondaryButton?.(l,a+1,r),o=e?.variants?.find(l=>l?.sku===e?.sku)||e?.variants?.[0]||{},j=!o?.availableForSale&&o?.price?.amount===G,O=t?.isShowTag,g=t?.isShowOriginalPrice,h=o?.coupons?.[0],{price:H,basePrice:L,discount:m}=(0,F.formatVariantPrice)({locale:b,amount:g&&h?h.variant_price4wscode:o.price,baseAmount:g&&h?o.price:0,currencyCode:e?.price?.currencyCode||"USD"}),_=()=>{const l=e?.sku,a=e?.variants;return a?.find(J=>J?.sku===l)?.image?.url||a?.[0]?.image?.url||""},p=e?.custom_name||e?.title,v=e?.custom_description||e?.description;(0,V.useExposure)(S,{componentType:T,componentName:B,componentTitle:p,componentDescription:v,position:t?.index+1});const y=()=>x>=2?{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full",imgItem:"m-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]",wrap:"lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full"}:{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]",imgItem:"md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]",wrap:"lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full"},i=()=>x>=2?"flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center":"flex justify-center items-center gap-6 md-tablet:flex-col";return(0,u.useEffect)(()=>{let l=[];if(m){const r=`${m}${f?.off||""}`;l.push(r)}const a=e?.tags?.filter?.(r=>r?.startsWith?.("CLtag"))?.map?.(r=>r?.replace?.("CLtag:",""))?.slice?.(0,m?1:2);$(l.concat(a))},[e?.tags,m]),(0,s.jsx)("div",{ref:S,className:(0,d.cn)(y().wrap,n==="round"?"rounded-2xl":"rounded-none","bg-container-secondary-1 tablet:hover:bg-info-white duration-300 gap-6","box-border w-full cursor-pointer overflow-hidden relative md-tablet:h-[360px]"),children:(0,s.jsxs)("div",{className:(0,d.cn)(i(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[(0,s.jsx)("div",{className:(0,d.cn)(y().imgItem,"relative overflow-hidden desktop:mb-0 mb-1"),children:(0,s.jsx)("a",{"aria-label":p,target:t?.target,href:(0,R.trackUrlRef)(`${b==="us"||!b?"":`/${b}`}/products/${e?.handle}`,`${T}_${B}`),onClick:()=>{(0,A.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||o?.sku,item_name:e?.name,item_variant:o?.name,price:o?.price,index:t?.index+1}]}})},children:(0,s.jsx)(D.default,{source:_(),alt:"",className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),(0,s.jsxs)("div",{className:(0,d.cn)("flex flex-col justify-center items-start",y().boxItem),children:[O?(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:w?.map?.((l,a)=>(0,s.jsx)(U.default,{children:l},a))}):null,p?(0,s.jsx)(M.Heading,{as:"h3",title:p||"",size:2,className:"shelf-display-product-title mb-1 line-clamp-2",html:p||""}):null,v?(0,s.jsx)(W.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm",html:v||""}):null,(0,s.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:j?(0,s.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:C?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-2xl text-info-primary text-xl font-bold",children:o?.availableForSale&&H||""}),(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:o?.availableForSale&&L||""})]})}),(0,s.jsxs)("div",{className:(0,d.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton?(0,s.jsx)(k.default,{variant:"secondary",onClick:()=>P(e,t?.index,t),className:`
                 ${t.direction==="vertical"?"w-full":""}
-              `,children:t?.secondaryButton||""}):null,t?.primaryButton?(0,l.jsx)(b.default,{variant:"primary",onClick:()=>N(e,t?.index,t),className:`
+              `,children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(k.default,{variant:"primary",onClick:()=>I(e,t?.index,t),className:`
               ${t.direction==="vertical"?"w-full":""}
             `,children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};
 //# sourceMappingURL=shelfDisplayItem.js.map

package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/shelfDisplayItem.tsx"],
-  "sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport Picture from '../../components/picture.js'\nimport Badge from '../../components/badge.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ShelfDisplayItem, ShelfDisplayType } from './shelfDisplay.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nexport const ShelfDisplayWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const { isDisplayBackImage = false, itemShape } = configuration || {}\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const ref = useRef<HTMLDivElement>(null)\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.primaryButton?.(params, index + 1, data)\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.secondaryButton?.(params, index + 1, data)\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  const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n  // active \u7684 \u901A\u7528\u6298\u6263\n  const coupon = variant?.coupons?.[0]\n\n  const { price, basePrice } = formatVariantPrice({\n    locale: locale,\n    amount: isShowOriginalPrice && coupon ? coupon.variant_price4wscode : variant.price,\n    baseAmount: isShowOriginalPrice && coupon ? variant.price : 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  const displayTitle = data?.custom_name || data?.title\n  const displayDescription = data?.custom_description || data?.description\n\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: displayTitle,\n    componentDescription: displayDescription,\n    position: configuration?.index + 1,\n  })\n\n  const bottomContent = () => {\n    return (\n      <>\n        {isShowTag ? (\n          <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n            {data?.tags\n              ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n              ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n              ?.slice?.(0, 2)\n              ?.map?.((item: any, index: number) => <Badge key={index}>{item}</Badge>)}\n          </div>\n        ) : null}\n        {displayTitle ? (\n          <Heading\n            as=\"h3\"\n            title={displayTitle || ''}\n            size={2}\n            className=\"shelf-display-product-title mb-1 line-clamp-2\"\n            html={displayTitle || ''}\n          />\n        ) : null}\n        {displayDescription ? (\n          <Text\n            size={2}\n            className=\"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm\"\n            html={displayDescription || ''}\n          />\n        ) : null}\n        <div className=\"mb-2 mt-5 flex items-center\">\n          {isSoldOut ? (\n            <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n          ) : (\n            <>\n              <div className=\"final-price tablet:text-2xl text-info-primary text-xl font-bold\">\n                {variant?.availableForSale ? price || '' : ''}\n              </div>\n              <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n                {variant?.availableForSale ? basePrice || '' : ''}\n              </div>\n            </>\n          )}\n        </div>\n        {/* \u6309\u94AE\u7EC4 */}\n        <div\n          className={cn(\n            'shelf-flex-button-group',\n            'lg-desktop:gap-3 flex items-center gap-2',\n            configuration.direction === 'vertical' ? 'flex-col' : ''\n          )}\n        >\n          {configuration?.secondaryButton ? (\n            <Button\n              variant=\"secondary\"\n              onClick={() => onSecondaryButton(data, configuration?.index, configuration)}\n              className={`\n                ${configuration.direction === 'vertical' ? 'w-full' : ''}\n              `}\n            >\n              {configuration?.secondaryButton || ''}\n            </Button>\n          ) : null}\n          {configuration?.primaryButton ? (\n            <Button\n              variant=\"primary\"\n              onClick={() => onPrimaryButton(data, configuration?.index, configuration)}\n              className={`\n              ${configuration.direction === 'vertical' ? 'w-full' : ''}\n            `}\n            >\n              {configuration?.primaryButton || ''}\n            </Button>\n          ) : null}\n        </div>\n      </>\n    )\n  }\n\n  return (\n    <div\n      ref={ref}\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        itemShape === '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        'md-tablet:h-[360px]'\n      )}\n    >\n      {isDisplayBackImage ? (\n        <div className=\"absolute inset-0 box-border overflow-hidden\">\n          <div className=\"relative inset-0 size-full\">\n            <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n            <div className=\"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4\">\n              {bottomContent()}\n            </div>\n          </div>\n        </div>\n      ) : (\n        <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4\">\n          <div\n            className={cn(\n              'lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden'\n            )}\n          >\n            <a\n              aria-label={displayTitle}\n              target={configuration?.target}\n              href={trackUrlRef(\n                `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n                `${componentType}_${componentName}`\n              )}\n              onClick={() => {\n                gaTrack({\n                  event: 'ga4Event',\n                  event_name: 'select_item',\n                  event_parameters: {\n                    page_group: 'Home Page',\n                    item_list_name: 'Home_Page_Bundle',\n                    items: [\n                      {\n                        item_id: data?.sku || variant?.sku,\n                        item_name: data?.name,\n                        item_variant: variant?.name,\n                        price: variant?.price,\n                        index: configuration?.index + 1,\n                      },\n                    ],\n                  },\n                })\n              }}\n            >\n              <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n            </a>\n          </div>\n          {bottomContent()}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport const ShelfDisplayHorizontalItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const { itemShape, itemLength } = configuration || {}\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const ref = useRef<HTMLDivElement>(null)\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.primaryButton?.(params, index + 1, data)\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.secondaryButton?.(params, index + 1, data)\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  const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n  // active \u7684 \u901A\u7528\u6298\u6263\n  const coupon = variant?.coupons?.[0]\n\n  const { price, basePrice } = formatVariantPrice({\n    locale: locale,\n    amount: isShowOriginalPrice && coupon ? coupon.variant_price4wscode : variant.price,\n    baseAmount: isShowOriginalPrice && coupon ? variant.price : 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  const displayTitle = data?.custom_name || data?.title\n  const displayDescription = data?.custom_description || data?.description\n\n   useExposure(ref, {\n     componentType,\n     componentName,\n     componentTitle: displayTitle,\n     componentDescription: displayDescription,\n     position: configuration?.index + 1,\n   })\n\n  const showSizeClass = (): {\n    boxItem: string     \n    imgItem: string\n    wrap: string\n  } => {\n    if (itemLength >= 2) {\n      return {\n        boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full',\n        imgItem:\n          'm-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]',\n        wrap: 'lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full',\n      }\n    }\n    return {\n      boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]',\n      imgItem:\n        'md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]',\n      wrap: 'lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full',\n    }\n  }\n    \n    const handleWrapClass = () => {\n        if (itemLength >= 2) {\n            return 'flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center'\n        }\n        return 'flex justify-center items-center gap-6 md-tablet:flex-col'\n    }\n\n  return (\n    <div\n      ref={ref}\n      key={data?.id || data?.handle}\n      className={cn(\n        showSizeClass().wrap,\n        itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n        'bg-container-secondary-1 tablet:hover:bg-info-white duration-300 gap-6',\n        'box-border w-full cursor-pointer overflow-hidden relative md-tablet:h-[360px]'\n      )}\n    >\n      <div className={cn(handleWrapClass(), 'desktop:p-6 absolute inset-0 box-border overflow-hidden p-4')}>\n        <div className={cn(showSizeClass().imgItem, 'relative overflow-hidden desktop:mb-0 mb-1')}>\n          <a\n            aria-label={displayTitle}\n            target={configuration?.target}\n            href={trackUrlRef(\n              `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n              `${componentType}_${componentName}`\n            )}\n            onClick={() => {\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'select_item',\n                event_parameters: {\n                  page_group: 'Home Page',\n                  item_list_name: 'Home_Page_Bundle',\n                  items: [\n                    {\n                      item_id: data?.sku || variant?.sku,\n                      item_name: data?.name,\n                      item_variant: variant?.name,\n                      price: variant?.price,\n                      index: configuration?.index + 1,\n                    },\n                  ],\n                },\n              })\n            }}\n          >\n            <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n          </a>\n        </div>\n        <div className={cn('flex flex-col justify-center items-start', showSizeClass().boxItem)}>\n          {isShowTag ? (\n            <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n              {data?.tags\n                ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n                ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n                ?.slice?.(0, 2)\n                ?.map?.((item: any, index: number) => <Badge key={index}>{item}</Badge>)}\n            </div>\n          ) : null}\n          {displayTitle ? (\n            <Heading\n              as=\"h3\"\n              title={displayTitle || ''}\n              size={2}\n              className=\"shelf-display-product-title mb-1 line-clamp-2\"\n              html={displayTitle || ''}\n            />\n          ) : null}\n          {displayDescription ? (\n            <Text\n              size={2}\n              className=\"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm\"\n              html={displayDescription || ''}\n            />\n          ) : null}\n          <div className=\"mb-2 mt-5 flex items-center\">\n            {isSoldOut ? (\n              <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n            ) : (\n              <>\n                <div className=\"final-price tablet:text-2xl text-info-primary text-xl font-bold\">\n                  {variant?.availableForSale ? price || '' : ''}\n                </div>\n                <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n                  {variant?.availableForSale ? basePrice || '' : ''}\n                </div>\n              </>\n            )}\n          </div>\n          {/* \u6309\u94AE\u7EC4 */}\n          <div\n            className={cn(\n              'shelf-flex-button-group',\n              'lg-desktop:gap-3 flex items-center gap-2',\n              configuration.direction === 'vertical' ? 'flex-col' : ''\n            )}\n          >\n            {configuration?.secondaryButton ? (\n              <Button\n                variant=\"secondary\"\n                onClick={() => onSecondaryButton(data, configuration?.index, configuration)}\n                className={`\n                ${configuration.direction === 'vertical' ? 'w-full' : ''}\n              `}\n              >\n                {configuration?.secondaryButton || ''}\n              </Button>\n            ) : null}\n            {configuration?.primaryButton ? (\n              <Button\n                variant=\"primary\"\n                onClick={() => onPrimaryButton(data, configuration?.index, configuration)}\n                className={`\n              ${configuration.direction === 'vertical' ? 'w-full' : ''}\n            `}\n              >\n                {configuration?.primaryButton || ''}\n              </Button>\n            ) : null}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],
-  "mappings": "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",
-  "names": ["shelfDisplayItem_exports", "__export", "ShelfDisplayHorizontalItem", "ShelfDisplayWrapItem", "__toCommonJS", "import_jsx_runtime", "import_AiuiProvider", "import_shelfDisplay", "import_picture", "import_badge", "import_utils", "import_text", "import_button", "import_track", "import_trackUrlRef", "import_heading", "import_useExposure", "import_react", "componentType", "componentName", "SOLD_OUT_PRICE", "data", "configuration", "isDisplayBackImage", "itemShape", "locale", "copyWriting", "ref", "onPrimaryButton", "params", "index", "onSecondaryButton", "variant", "item", "isSoldOut", "isShowTag", "isShowOriginalPrice", "coupon", "price", "basePrice", "handleUrl", "sku", "skuArray", "displayTitle", "displayDescription", "bottomContent", "Badge", "Button", "Picture", "itemLength", "showSizeClass", "handleWrapClass"]
+  "sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport Picture from '../../components/picture.js'\nimport Badge from '../../components/badge.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ShelfDisplayItem, ShelfDisplayType } from './shelfDisplay.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef, useEffect, useState } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\nexport const ShelfDisplayWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const { isDisplayBackImage = false, itemShape, metafields } = configuration || {}\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const { discounts } = metafields || {}\n  const ref = useRef<HTMLDivElement>(null)\n  const [showTags, setShowTags] = useState<string[]>([])\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.primaryButton?.(params, index + 1, data)\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.secondaryButton?.(params, index + 1, data)\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  const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n  // active \u7684 \u901A\u7528\u6298\u6263\n  const coupon = variant?.coupons?.[0]\n\n  const { price, basePrice, discount } = formatVariantPrice({\n    locale: locale,\n    amount: isShowOriginalPrice && coupon ? coupon.variant_price4wscode : variant.price,\n    baseAmount: isShowOriginalPrice && coupon ? variant.price : 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  const displayTitle = data?.custom_name || data?.title\n  const displayDescription = data?.custom_description || data?.description\n\n  // \u5904\u7406\u6807\u7B7E\n  useEffect(() => {\n    let handleTags: string[] = []\n    if (discount) {\n      const discountTag = `${discount}${discounts?.off || ''}`\n      handleTags.push(discountTag)\n    }\n    const newTags = data?.tags\n      ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n      ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n      ?.slice?.(0, discount ? 1 : 2)\n    setShowTags(handleTags.concat(newTags))\n  }, [data?.tags, discount])\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: displayTitle,\n    componentDescription: displayDescription,\n    position: configuration?.index + 1,\n  })\n\n  const bottomContent = () => {\n    return (\n      <>\n        {isShowTag ? (\n          <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n            {showTags?.map?.((item: any, index: number) => <Badge key={index}>{item}</Badge>)}\n          </div>\n        ) : null}\n        {displayTitle ? (\n          <Heading\n            as=\"h3\"\n            title={displayTitle || ''}\n            size={2}\n            className=\"shelf-display-product-title mb-1 line-clamp-2\"\n            html={displayTitle || ''}\n          />\n        ) : null}\n        {displayDescription ? (\n          <Text\n            size={2}\n            className=\"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm\"\n            html={displayDescription || ''}\n          />\n        ) : null}\n        <div className=\"mb-2 mt-5 flex items-center\">\n          {isSoldOut ? (\n            <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n          ) : (\n            <>\n              <div className=\"final-price tablet:text-2xl text-info-primary text-xl font-bold\">\n                {variant?.availableForSale ? price || '' : ''}\n              </div>\n              <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n                {variant?.availableForSale ? basePrice || '' : ''}\n              </div>\n            </>\n          )}\n        </div>\n        {/* \u6309\u94AE\u7EC4 */}\n        <div\n          className={cn(\n            'shelf-flex-button-group',\n            'lg-desktop:gap-3 flex items-center gap-2',\n            configuration.direction === 'vertical' ? 'flex-col' : ''\n          )}\n        >\n          {configuration?.secondaryButton ? (\n            <Button\n              variant=\"secondary\"\n              onClick={() => onSecondaryButton(data, configuration?.index, configuration)}\n              className={`\n                ${configuration.direction === 'vertical' ? 'w-full' : ''}\n              `}\n            >\n              {configuration?.secondaryButton || ''}\n            </Button>\n          ) : null}\n          {configuration?.primaryButton ? (\n            <Button\n              variant=\"primary\"\n              onClick={() => onPrimaryButton(data, configuration?.index, configuration)}\n              className={`\n              ${configuration.direction === 'vertical' ? 'w-full' : ''}\n            `}\n            >\n              {configuration?.primaryButton || ''}\n            </Button>\n          ) : null}\n        </div>\n      </>\n    )\n  }\n\n  return (\n    <div\n      ref={ref}\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        itemShape === '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        'md-tablet:h-[360px]'\n      )}\n    >\n      {isDisplayBackImage ? (\n        <div className=\"absolute inset-0 box-border overflow-hidden\">\n          <div className=\"relative inset-0 size-full\">\n            <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n            <div className=\"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4\">\n              {bottomContent()}\n            </div>\n          </div>\n        </div>\n      ) : (\n        <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4\">\n          <div\n            className={cn(\n              'lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden'\n            )}\n          >\n            <a\n              aria-label={displayTitle}\n              target={configuration?.target}\n              href={trackUrlRef(\n                `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n                `${componentType}_${componentName}`\n              )}\n              onClick={() => {\n                gaTrack({\n                  event: 'ga4Event',\n                  event_name: 'select_item',\n                  event_parameters: {\n                    page_group: 'Home Page',\n                    item_list_name: 'Home_Page_Bundle',\n                    items: [\n                      {\n                        item_id: data?.sku || variant?.sku,\n                        item_name: data?.name,\n                        item_variant: variant?.name,\n                        price: variant?.price,\n                        index: configuration?.index + 1,\n                      },\n                    ],\n                  },\n                })\n              }}\n            >\n              <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n            </a>\n          </div>\n          {bottomContent()}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport const ShelfDisplayHorizontalItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const { itemShape, itemLength, metafields } = configuration || {}\n  const { discounts } = metafields || {}\n  const { locale = 'us', copyWriting } = useAiuiContext()\n  const [showTags, setShowTags] = useState<string[]>([])\n  const ref = useRef<HTMLDivElement>(null)\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.primaryButton?.(params, index + 1, data)\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType) =>\n    configuration?.event?.secondaryButton?.(params, index + 1, data)\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  const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n  // active \u7684 \u901A\u7528\u6298\u6263\n  const coupon = variant?.coupons?.[0]\n\n  const { price, basePrice, discount } = formatVariantPrice({\n    locale: locale,\n    amount: isShowOriginalPrice && coupon ? coupon.variant_price4wscode : variant.price,\n    baseAmount: isShowOriginalPrice && coupon ? variant.price : 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  const displayTitle = data?.custom_name || data?.title\n  const displayDescription = data?.custom_description || data?.description\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: displayTitle,\n    componentDescription: displayDescription,\n    position: configuration?.index + 1,\n  })\n\n  const showSizeClass = (): {\n    boxItem: string\n    imgItem: string\n    wrap: string\n  } => {\n    if (itemLength >= 2) {\n      return {\n        boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full',\n        imgItem:\n          'm-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]',\n        wrap: 'lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full',\n      }\n    }\n    return {\n      boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]',\n      imgItem:\n        'md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]',\n      wrap: 'lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full',\n    }\n  }\n\n  const handleWrapClass = () => {\n    if (itemLength >= 2) {\n      return 'flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center'\n    }\n    return 'flex justify-center items-center gap-6 md-tablet:flex-col'\n  }\n\n  // \u5904\u7406\u6807\u7B7E\n  useEffect(() => {\n    let handleTags: string[] = []\n    if (discount) {\n      const discountTag = `${discount}${discounts?.off || ''}`\n      handleTags.push(discountTag)\n    }\n    const newTags = data?.tags\n      ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n      ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n      ?.slice?.(0, discount ? 1 : 2)\n    setShowTags(handleTags.concat(newTags))\n  }, [data?.tags, discount])\n\n  return (\n    <div\n      ref={ref}\n      key={data?.id || data?.handle}\n      className={cn(\n        showSizeClass().wrap,\n        itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n        'bg-container-secondary-1 tablet:hover:bg-info-white duration-300 gap-6',\n        'box-border w-full cursor-pointer overflow-hidden relative md-tablet:h-[360px]'\n      )}\n    >\n      <div className={cn(handleWrapClass(), 'desktop:p-6 absolute inset-0 box-border overflow-hidden p-4')}>\n        <div className={cn(showSizeClass().imgItem, 'relative overflow-hidden desktop:mb-0 mb-1')}>\n          <a\n            aria-label={displayTitle}\n            target={configuration?.target}\n            href={trackUrlRef(\n              `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}`,\n              `${componentType}_${componentName}`\n            )}\n            onClick={() => {\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'select_item',\n                event_parameters: {\n                  page_group: 'Home Page',\n                  item_list_name: 'Home_Page_Bundle',\n                  items: [\n                    {\n                      item_id: data?.sku || variant?.sku,\n                      item_name: data?.name,\n                      item_variant: variant?.name,\n                      price: variant?.price,\n                      index: configuration?.index + 1,\n                    },\n                  ],\n                },\n              })\n            }}\n          >\n            <Picture source={handleUrl()} alt=\"\" className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n          </a>\n        </div>\n        <div className={cn('flex flex-col justify-center items-start', showSizeClass().boxItem)}>\n          {isShowTag ? (\n            <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n              {showTags?.map?.((item: any, index: number) => <Badge key={index}>{item}</Badge>)}\n            </div>\n          ) : null}\n          {displayTitle ? (\n            <Heading\n              as=\"h3\"\n              title={displayTitle || ''}\n              size={2}\n              className=\"shelf-display-product-title mb-1 line-clamp-2\"\n              html={displayTitle || ''}\n            />\n          ) : null}\n          {displayDescription ? (\n            <Text\n              size={2}\n              className=\"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description line-clamp-1 h-5 text-sm\"\n              html={displayDescription || ''}\n            />\n          ) : null}\n          <div className=\"mb-2 mt-5 flex items-center\">\n            {isSoldOut ? (\n              <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n            ) : (\n              <>\n                <div className=\"final-price tablet:text-2xl text-info-primary text-xl font-bold\">\n                  {variant?.availableForSale ? price || '' : ''}\n                </div>\n                <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n                  {variant?.availableForSale ? basePrice || '' : ''}\n                </div>\n              </>\n            )}\n          </div>\n          {/* \u6309\u94AE\u7EC4 */}\n          <div\n            className={cn(\n              'shelf-flex-button-group',\n              'lg-desktop:gap-3 flex items-center gap-2',\n              configuration.direction === 'vertical' ? 'flex-col' : ''\n            )}\n          >\n            {configuration?.secondaryButton ? (\n              <Button\n                variant=\"secondary\"\n                onClick={() => onSecondaryButton(data, configuration?.index, configuration)}\n                className={`\n                ${configuration.direction === 'vertical' ? 'w-full' : ''}\n              `}\n              >\n                {configuration?.secondaryButton || ''}\n              </Button>\n            ) : null}\n            {configuration?.primaryButton ? (\n              <Button\n                variant=\"primary\"\n                onClick={() => onPrimaryButton(data, configuration?.index, configuration)}\n                className={`\n              ${configuration.direction === 'vertical' ? 'w-full' : ''}\n            `}\n              >\n                {configuration?.primaryButton || ''}\n              </Button>\n            ) : null}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["shelfDisplayItem_exports", "__export", "ShelfDisplayHorizontalItem", "ShelfDisplayWrapItem", "__toCommonJS", "import_jsx_runtime", "import_AiuiProvider", "import_shelfDisplay", "import_picture", "import_badge", "import_utils", "import_text", "import_button", "import_track", "import_trackUrlRef", "import_heading", "import_useExposure", "import_react", "componentType", "componentName", "SOLD_OUT_PRICE", "data", "configuration", "isDisplayBackImage", "itemShape", "metafields", "locale", "copyWriting", "discounts", "ref", "showTags", "setShowTags", "onPrimaryButton", "params", "index", "onSecondaryButton", "variant", "item", "isSoldOut", "isShowTag", "isShowOriginalPrice", "coupon", "price", "basePrice", "discount", "handleUrl", "sku", "skuArray", "displayTitle", "displayDescription", "handleTags", "discountTag", "newTags", "bottomContent", "Badge", "Button", "Picture", "itemLength", "showSizeClass", "handleWrapClass"]
 }

package/dist/cjs/biz-components/TextMarquee/index.d.ts

@@ -0,0 +1,9 @@
+import 'swiper/css';
+import 'swiper/css/pagination';
+declare const _default: import("react").ForwardRefExoticComponent<Omit<{
+    data: any;
+}, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
+    className?: string;
+    data?: Record<string, any>;
+} & import("react").RefAttributes<any>>;
+export default _default;

package/dist/cjs/biz-components/TextMarquee/index.js

@@ -0,0 +1,2 @@
+"use strict";var w=Object.create;var r=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var x=(s,e)=>{for(var t in e)r(s,t,{get:e[t],enumerable:!0})},d=(s,e,t,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of u(e))!v.call(s,i)&&i!==t&&r(s,i,{get:()=>e[i],enumerable:!(l=c(e,i))||l.enumerable});return s};var b=(s,e,t)=>(t=s!=null?w(f(s)):{},d(e||!s||!s.__esModule?r(t,"default",{value:s,enumerable:!0}):t,s)),h=s=>d(r({},"__esModule",{value:!0}),s);var P={};x(P,{default:()=>N});module.exports=h(P);var a=require("react/jsx-runtime"),o=require("swiper/react"),p=b(require("../../components/picture.js")),m=require("../../shared/Styles.js"),n=require("swiper/modules"),V=require("swiper/css"),g=require("swiper/css/pagination");const y=({data:s})=>{const{items:e}=s;return(0,a.jsxs)("div",{className:"overflow-hidden relative w-full",children:[(0,a.jsx)("div",{className:"absolute inset-0 size-full bg-transparent z-10"}),(0,a.jsx)(o.Swiper,{className:"overflow-hidden",slidesPerView:"auto",speed:7e3,loop:!0,autoplay:{delay:0,disableOnInteraction:!0},wrapperClass:"!ease-linear",modules:[n.FreeMode,n.Autoplay],breakpoints:{0:{spaceBetween:24,slidesPerView:1.6},768:{spaceBetween:24,slidesPerView:3.1},1024:{spaceBetween:128,slidesPerView:3},1440:{spaceBetween:128,slidesPerView:4},1920:{spaceBetween:128,slidesPerView:e?.length>=5?5:4}},children:(e?.length>3?[...e||[],...e||[]]:e)?.map?.((t,l)=>(0,a.jsx)(o.SwiperSlide,{className:"!h-[unset]",children:(0,a.jsxs)("div",{className:"flex w-full flex-1 items-center gap-1 overflow-hidden min-md:gap-2",children:[(0,a.jsx)(p.default,{source:t.icon?.url||t.icon,className:"size-6"}),(0,a.jsx)("span",{title:t.text||"",className:"flex-1 truncate text-base md-tablet:text-sm font-semibold text-[#1D1D1F]",children:t.text})]})},l))})]})};var N=(0,m.withLayout)(y);
+//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/TextMarquee/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/TextMarquee/index.tsx"],
+  "sourcesContent": ["import { Swiper, SwiperSlide } from 'swiper/react'\nimport Picture from '../../components/picture.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { FreeMode, Autoplay } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/pagination'\n\nconst TextMarquee = ({ data }: { data: any }) => {\n  const { items } = data\n\n  return (\n    <div className=\"overflow-hidden relative w-full\">\n      <div className=\"absolute inset-0 size-full bg-transparent z-10\" />\n      <Swiper\n        className=\"overflow-hidden\"\n        slidesPerView=\"auto\"\n        speed={7000}\n        loop={true}\n        autoplay={{\n          delay: 0,\n          disableOnInteraction: true,\n        }}\n        wrapperClass=\"!ease-linear\"\n        modules={[FreeMode, Autoplay]}\n        breakpoints={{\n          0: {\n            spaceBetween: 24,\n            slidesPerView: 1.6,\n          },\n          768: {\n            spaceBetween: 24,\n            slidesPerView: 3.1,\n          },\n          1024: {\n            spaceBetween: 128,\n            slidesPerView: 3,\n          },\n          1440: {\n            spaceBetween: 128,\n            slidesPerView: 4,\n          },\n          1920: {\n            spaceBetween: 128,\n            slidesPerView: items?.length >= 5 ? 5 : 4,\n          },\n        }}\n      >\n        {(items?.length > 3 ? [...(items || []), ...(items || [])] : items)?.map?.((item: any, index: number) => (\n          <SwiperSlide key={index} className=\"!h-[unset]\">\n            <div className=\"flex w-full flex-1 items-center gap-1 overflow-hidden min-md:gap-2\">\n              <Picture source={item.icon?.url || item.icon} className=\"size-6\" />\n              <span title={item.text || ''} className=\"flex-1 truncate text-base md-tablet:text-sm font-semibold text-[#1D1D1F]\">\n                {item.text}\n              </span>\n            </div>\n          </SwiperSlide>\n        ))}\n      </Swiper>\n    </div>\n  )\n}\n\nexport default withLayout(TextMarquee)\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAYM,IAAAI,EAAA,6BAZNC,EAAoC,wBACpCC,EAAoB,0CACpBC,EAA2B,kCAC3BC,EAAmC,0BACnCC,EAAO,sBACPC,EAAO,iCAEP,MAAMC,EAAc,CAAC,CAAE,KAAAC,CAAK,IAAqB,CAC/C,KAAM,CAAE,MAAAC,CAAM,EAAID,EAElB,SACE,QAAC,OAAI,UAAU,kCACb,oBAAC,OAAI,UAAU,iDAAiD,KAChE,OAAC,UACC,UAAU,kBACV,cAAc,OACd,MAAO,IACP,KAAM,GACN,SAAU,CACR,MAAO,EACP,qBAAsB,EACxB,EACA,aAAa,eACb,QAAS,CAAC,WAAU,UAAQ,EAC5B,YAAa,CACX,EAAG,CACD,aAAc,GACd,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,IACd,cAAe,CACjB,EACA,KAAM,CACJ,aAAc,IACd,cAAe,CACjB,EACA,KAAM,CACJ,aAAc,IACd,cAAeC,GAAO,QAAU,EAAI,EAAI,CAC1C,CACF,EAEE,UAAAA,GAAO,OAAS,EAAI,CAAC,GAAIA,GAAS,CAAC,EAAI,GAAIA,GAAS,CAAC,CAAE,EAAIA,IAAQ,MAAM,CAACC,EAAWC,OACrF,OAAC,eAAwB,UAAU,aACjC,oBAAC,OAAI,UAAU,qEACb,oBAAC,EAAAC,QAAA,CAAQ,OAAQF,EAAK,MAAM,KAAOA,EAAK,KAAM,UAAU,SAAS,KACjE,OAAC,QAAK,MAAOA,EAAK,MAAQ,GAAI,UAAU,2EACrC,SAAAA,EAAK,KACR,GACF,GANgBC,CAOlB,CACD,EACH,GACF,CAEJ,EAEA,IAAOb,KAAQ,cAAWS,CAAW",
+  "names": ["TextMarquee_exports", "__export", "TextMarquee_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_picture", "import_Styles", "import_modules", "import_css", "import_pagination", "TextMarquee", "data", "items", "item", "index", "Picture"]
+}

package/dist/cjs/biz-components/Title/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var A=Object.create;var m=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,Q=Object.prototype.hasOwnProperty;var W=(t,e)=>{for(var n in e)m(t,n,{get:e[n],enumerable:!0})},E=(t,e,n,c)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of J(e))!Q.call(t,o)&&o!==n&&m(t,o,{get:()=>e[o],enumerable:!(c=G(e,o))||c.enumerable});return t};var X=(t,e,n)=>(n=t!=null?A(K(t)):{},E(e||!t||!t.__esModule?m(n,"default",{value:t,enumerable:!0}):n,t)),Y=t=>E(m({},"__esModule",{value:!0}),t);var tt={};W(tt,{default:()=>Z});module.exports=Y(tt);var i=require("react/jsx-runtime"),r=X(require("react")),u=require("gsap"),w=require("gsap/dist/SplitText"),v=require("gsap/dist/ScrollTrigger"),x=require("../../helpers/utils.js"),$=require("../../components/index.js"),D=require("../../shared/Styles.js"),rt=require("../../hooks/useExposure.js"),P=require("../../shared/trackUrlRef.js"),S=require("react-intersection-observer");const H="link",M="title",N=r.default.forwardRef(({data:t,className:e,as:n="h2"},c)=>{const{title:o,caption:p,theme:T,extensions:f}=t,k=(0,r.useRef)(null),l=(0,r.useRef)(null),s=(0,r.useRef)(null),a=(0,r.useRef)(null),{ref:z,inView:y}=(0,S.useInView)();return(0,r.useImperativeHandle)(c,()=>k.current),(0,r.useEffect)(()=>{u.gsap.registerPlugin(w.SplitText,v.ScrollTrigger);function I(){if(!l.current)return;const V=l.current?.clientHeight||80;s.current&&s.current.revert(),a.current&&a.current.kill(),s.current=new w.SplitText(l.current,{type:"words",wordsClass:"word"});const d=s.current.words;u.gsap.set(d,{opacity:0}),a.current=v.ScrollTrigger.create({trigger:l.current,start:"bottom bottom-=4%",end:`bottom+=${V*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:U=>{const j=U.progress,b=d.length||1,B=.5,g=1/b,R=g*(1-B),L=(b-1)*R+g,C=Math.min(1,L>0?j/L:0);d.forEach((F,O)=>{const _=O*R,q=g;let h=(C-_)/q;h=Math.max(0,Math.min(1,h)),u.gsap.set(F,{opacity:h})})}})}return y&&I(),()=>{s.current&&s.current.revert(),a.current&&a.current.kill()}},[y]),(o||p)&&(0,i.jsxs)("div",{className:"mb-6 flex items-end justify-between overflow-hidden title-box",ref:k,children:[(0,i.jsx)("div",{ref:z,className:(0,x.cn)("space-y-4 flex-1",e,{"aiui-dark":T==="dark"}),children:(0,i.jsx)($.Heading,{ref:l,as:n,size:4,html:p||o})}),f?.textLink&&(0,i.jsxs)("a",{className:(0,x.cn)({"aiui-dark":T==="dark"},"flex items-center text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]"),href:(0,P.trackUrlRef)(f?.link,`${H}_${M}`),"data-headless-type-name":`${H}#${M}`,"data-headless-title-desc-button":`${o}#${p}`,children:[f?.textLink,(0,i.jsx)("svg",{width:"24",height:"24",className:"mb-[3px]",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",children:(0,i.jsx)("path",{className:"transition-all duration-[0.4s]",d:"M10.5 8L14.5 12L10.5 16",stroke:"#777","stroke-width":"1.5","stroke-linecap":"round"})})]})]})});N.displayName="Title";var Z=(0,D.withLayout)(N);
+"use strict";"use client";var G=Object.create;var m=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var X=(t,e)=>{for(var n in e)m(t,n,{get:e[n],enumerable:!0})},H=(t,e,n,c)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of K(e))!W.call(t,i)&&i!==n&&m(t,i,{get:()=>e[i],enumerable:!(c=J(e,i))||c.enumerable});return t};var Y=(t,e,n)=>(n=t!=null?G(Q(t)):{},H(e||!t||!t.__esModule?m(n,"default",{value:t,enumerable:!0}):n,t)),Z=t=>H(m({},"__esModule",{value:!0}),t);var et={};X(et,{default:()=>tt});module.exports=Z(et);var o=require("react/jsx-runtime"),r=Y(require("react")),u=require("gsap"),v=require("gsap/dist/SplitText"),x=require("gsap/dist/ScrollTrigger"),T=require("../../helpers/utils.js"),D=require("../../components/index.js"),P=require("../../shared/Styles.js"),nt=require("../../hooks/useExposure.js"),S=require("../../shared/trackUrlRef.js"),z=require("react-intersection-observer");const M="link",N="title",$=r.default.forwardRef(({data:t,className:e,as:n="h2",weight:c="bold"},i)=>{const{title:p,caption:d,theme:k,extensions:f}=t,b=(0,r.useRef)(null),l=(0,r.useRef)(null),s=(0,r.useRef)(null),a=(0,r.useRef)(null),{ref:I,inView:y}=(0,z.useInView)();return(0,r.useImperativeHandle)(i,()=>b.current),(0,r.useEffect)(()=>{u.gsap.registerPlugin(v.SplitText,x.ScrollTrigger);function V(){if(!l.current)return;const U=l.current?.clientHeight||80;s.current&&s.current.revert(),a.current&&a.current.kill(),s.current=new v.SplitText(l.current,{type:"words",wordsClass:"word"});const g=s.current.words;u.gsap.set(g,{opacity:0}),a.current=x.ScrollTrigger.create({trigger:l.current,start:"bottom bottom-=4%",end:`bottom+=${U*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:j=>{const B=j.progress,R=g.length||1,C=.5,h=1/R,L=h*(1-C),E=(R-1)*L+h,F=Math.min(1,E>0?B/E:0);g.forEach((O,_)=>{const q=_*L,A=h;let w=(F-q)/A;w=Math.max(0,Math.min(1,w)),u.gsap.set(O,{opacity:w})})}})}return y&&V(),()=>{s.current&&s.current.revert(),a.current&&a.current.kill()}},[y]),(p||d)&&(0,o.jsxs)("div",{className:"mb-6 flex items-end justify-between overflow-hidden title-box",ref:b,children:[(0,o.jsx)("div",{ref:I,className:(0,T.cn)("space-y-4 flex-1",e,{"aiui-dark":k==="dark"}),children:(0,o.jsx)(D.Heading,{ref:l,as:n,size:4,html:d||p,weight:c})}),f?.textLink&&(0,o.jsxs)("a",{className:(0,T.cn)({"aiui-dark":k==="dark"},"flex items-center text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]"),href:(0,S.trackUrlRef)(f?.link,`${M}_${N}`),"data-headless-type-name":`${M}#${N}`,"data-headless-title-desc-button":`${p}#${d}`,children:[f?.textLink,(0,o.jsx)("svg",{width:"24",height:"24",className:"mb-[3px]",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",children:(0,o.jsx)("path",{className:"transition-all duration-[0.4s]",d:"M10.5 8L14.5 12L10.5 16",stroke:"#777","stroke-width":"1.5","stroke-linecap":"round"})})]})]})});$.displayName="Title";var tt=(0,P.withLayout)($);
 //# sourceMappingURL=index.js.map