npm - @anker-in/headless-ui - Versions diffs - 1.0.26-alpha.1762396031065 → 1.0.26-alpha.1762418060877 - Mend

@anker-in/headless-ui 1.0.26-alpha.1762396031065 → 1.0.26-alpha.1762418060877

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

Files changed (44) hide show

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

@@ -1,2 +1,2 @@
-"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);
+"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 shelf-display-swiper-box`,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 CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useEffect, useRef, useImperativeHandle } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport 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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",
+  "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 shelf-display-swiper-box`}\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/shelfDisplayItem.js CHANGED Viewed

@@ -1,8 +1,8 @@
-"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:`
+"use strict";var K=Object.create;var T=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)T(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&&T(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?T(n,"default",{value:e,enumerable:!0}):n,e)),te=e=>q(T({},"__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"),C=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 B="image",D="product_shelf",G=999999999e-2,se=({data:e,configuration:t})=>{const{isDisplayBackImage:n=!1,itemShape:x,metafields:c}=t||{},{locale:v="us",copyWriting:b}=(0,E.useAiuiContext)(),{discounts:$}=c||{},w=(0,u.useRef)(null),[S,N]=(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:v,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,f=e?.custom_description||e?.description;(0,u.useEffect)(()=>{let i=[];if(m){const a=`${m}${$?.off||""}`;i.push(a)}const l=e?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,m?1:2);N(i.concat(l))},[e?.tags,m]),(0,V.useExposure)(w,{componentType:B,componentName:D,componentTitle:p,componentDescription:f,position:t?.index+1});const y=()=>(0,s.jsxs)(s.Fragment,{children:[O&&S?.length>0?(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:S?.map?.((i,l)=>(0,s.jsx)(U.default,{className:"shelf-items-tag",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,f?(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:f||""}):null,(0,s.jsx)("div",{className:"mb-3 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,s.jsx)(k.default,{variant:"primary",onClick:()=>I(e,t?.index,t),className:`
               ${t.direction==="vertical"?"w-full":""}
-            `,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:`
+            `,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] shelf-display-item"),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)(C.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)(`${v==="us"||!v?"":`/${v}`}/products/${e?.handle}`,`${B}_${D}`),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)(C.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:v}=c||{},{locale:b="us",copyWriting:$}=(0,E.useAiuiContext)(),[w,S]=(0,u.useState)([]),N=(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,f=e?.custom_description||e?.description;(0,V.useExposure)(N,{componentType:B,componentName:D,componentTitle:p,componentDescription:f,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}${v?.off||""}`;l.push(r)}const a=e?.tags?.filter?.(r=>r?.startsWith?.("CLtag"))?.map?.(r=>r?.replace?.("CLtag:",""))?.slice?.(0,m?1:2);S(l.concat(a))},[e?.tags,m]),(0,s.jsx)("div",{ref:N,className:(0,d.cn)(y().wrap,n==="round"?"rounded-2xl":"rounded-none","shelf-display-item","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}`,`${B}_${D}`),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)(C.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,{className:"shelf-items-tag",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,f?(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:f||""}):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:$?.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,s.jsx)(k.default,{variant:"primary",onClick:()=>I(e,t?.index,t),className:`
               ${t.direction==="vertical"?"w-full":""}

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

@@ -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, 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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",
+  "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 && showTags?.length > 0 ? (\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} className=\"shelf-items-tag\">{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-3 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] shelf-display-item'\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        'shelf-display-item',\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) => (\n                <Badge key={index} className=\"shelf-items-tag\">\n                  {item}\n                </Badge>\n              ))}\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/src/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-declare const ProductHighlight: () => import("react/jsx-runtime").JSX.Element | null;
+declare const ProductHighlight: () => import("react/jsx-runtime").JSX.Element;
 export default ProductHighlight;

package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import{Fragment as N,jsx as e,jsxs as s}from"react/jsx-runtime";import{Button as J,Checkbox as Q,Text as p,Picture as H,Heading as X}from"../../../../../components/index.js";import c from"./ProductBenefitsTabs/index.js";import{useBizProductContext as R}from"../../../BizProductProvider.js";import{useBenefits as ee}from"../../../hooks/useBenefits";import{formatPrice as g}from"../../../utils/index.js";import{replaceTemplate as A}from"../../../utils/textFormat";import{useRef as te,useState as oe}from"react";import{useAiuiContext as $}from"../../../../AiuiProvider/index.js";import ne from"../../../../../hooks/useCountDown.js";import se from"../../../hooks/useCopy";import{cn as x}from"../../../../../helpers/index.js";const ie={couponCode:"Code",copyCode:"Copy Code",copied:"Copied",expired:"Expired",offCoupon:"{discount} off coupon",offMemberOnly:"{amount} off Member Only",loginNow:"Login now",selectFreeGift:"You can select the free gift below.",bundleSaveUpTo:"Bundle purchases save extra up to",bundleOffer:"We offer {count} bundle for you",creditsTitle:"Soundcore credits for cash",creditsDesc:"100 Soundcore credits=$1",yourBenefits:"Your Benefits",off:" off",memberBenefits:"Member Benefits",memberBenefitsNotLogin:"You will enjoy a {amount} member discount after logging in.",memberBenefitsNotLoginText:"Sign Up to Get Benefits Below",installment:"Installment",forNewMember:"{amount} for New Member",expressShipping:"Express Shipping Method",creditsAfterActivation:"You will get soundcoreCredits after activation. ",active:"Active",flexibleInstallment:"Flexible installment payment "},re=({item:t,textConfig:i})=>{const{trackingData:m}=$(),{copied:r,copy:b}=se(),l=m?.common?.coupon,{days:C,hours:T,minutes:B,seconds:w}=ne({endTime:t?.ends_at||""}),{openModal:k,isLogin:I}=R();return s(N,{children:[e("style",{jsx:!0,children:`
+import{Fragment as N,jsx as e,jsxs as s}from"react/jsx-runtime";import{Button as J,Checkbox as Q,Text as p,Picture as H,Heading as X}from"../../../../../components/index.js";import c from"./ProductBenefitsTabs/index.js";import{useBizProductContext as R}from"../../../BizProductProvider.js";import{useBenefits as ee}from"../../../hooks/useBenefits";import{formatPrice as g}from"../../../utils/index.js";import{replaceTemplate as A}from"../../../utils/textFormat";import{useRef as te,useState as oe}from"react";import{useAiuiContext as $}from"../../../../AiuiProvider/index.js";import ne from"../../../../../hooks/useCountDown.js";import se from"../../../hooks/useCopy";import{cn as x}from"../../../../../helpers/index.js";const ie={couponCode:"Code",copyCode:"Copy Code",copied:"Copied",expired:"Expired",offCoupon:"{discount} off coupon",offMemberOnly:"{amount} off Member Only",loginNow:"Login now",selectFreeGift:"You can select the free gift below.",bundleSaveUpTo:"Bundle purchases save extra up to",bundleOffer:"We offer {count} bundle for you",creditsTitle:"Soundcore credits for cash",creditsDesc:"100 Soundcore credits=$1",yourBenefits:"Your Benefits",off:" off",memberBenefits:"Member Benefits",memberBenefitsNotLogin:"You will enjoy a {amount} member discount after logging in.",memberBenefitsNotLoginText:"Sign Up to Get Benefits Below",installment:"Installment",forNewMember:"{amount} for New Member",expressShipping:"Express Shipping Method",creditsAfterActivation:"You will get soundcoreCredits after activation. ",active:"Active",flexibleInstallment:"Flexible installment payment "},le=({item:t,textConfig:i})=>{const{trackingData:m}=$(),{copied:l,copy:b}=se(),r=m?.common?.coupon,{days:C,hours:T,minutes:k,seconds:B}=ne({endTime:t?.ends_at||""}),{openModal:w,isLogin:I}=R();return s(N,{children:[e("style",{jsx:!0,children:`
         .coupon-card {
           /* \u4F7F\u7528mask\u521B\u5EFA\u5185\u5207\u5706\u89D2 */
           mask:
@@ -14,7 +14,7 @@ import{Fragment as N,jsx as e,jsxs as s}from"react/jsx-runtime";import{Button as
             bottom left;
           mask-repeat: no-repeat;
         }
-      `}),s("div",{style:{background:t.couponBgColor||"white"},className:x("relative h-[100px] overflow-hidden laptop:h-[112px] lg-desktop:h-[130px]",t.borderStyle==="inset"?"coupon-card ":"rounded-[8px]"),children:[t?.bgImage?.url&&e(H,{source:t.bgImage.url,alt:t.bgImage.alt,className:"absolute bottom-0 right-0 w-auto",imgClassName:"object-contain"}),s("div",{className:"relative z-1 p-3",children:[s("div",{className:"flex items-center justify-start",children:[t.useAble&&e(Q,{size:"lg",className:"mr-2 rounded-full border-[#D1D1D1] border-[1.6px] data-[state=checked]:border-primary",checked:t?.isAutoUse,onCheckedChange:h=>{t?.onUseChange?.(h)}}),e(p,{html:t.title,className:"text-[16px] font-bold laptop:text-[20px] lg-desktop:text-[24px]"})]}),e(p,{...typeof t.description=="string"?{html:t.description}:{},as:"p",className:"mt-2 pr-8 text-[14px] font-bold text-[#3D3D3F] lg-desktop:text-[16px]",children:t.description}),t.code&&s("div",{className:"last:mt-2 flex items-center gap-2",children:[e(p,{html:`${i.couponCode}: ${t.code}`,className:"text-base font-bold text-[#3D3D3F]"}),e("button",{className:"text-base font-bold underline",onClick:()=>b(t.code??""),children:r?l?.copied||i.copied:l?.copy||i.copyCode})]}),t.ends_at&&e("button",{onClick:()=>{l?.modal&&k(l?.modal)},className:"mt-[4px] text-left text-[14px] font-semibold text-[#1F2021] x:text-[12px] md-l:hidden",children:Number(C)<Number(l?.hurry?.daysLeft)?s(N,{children:[e("span",{children:l?.ends}),e("span",{className:"font-bold",children:` ${C} ${l?.days} ${T.toString().padStart(2,"0")}:${B.toString().padStart(2,"0")}:${w.toString().padStart(2,"0")}`})]}):l?.hurry?.label||i.expired})]})]})]})},le=({coupons:t,className:i,textConfig:m})=>e("div",{className:x("flex flex-col gap-3 laptop:grid laptop:grid-cols-2 desktop:grid-cols-1",i),children:t?.map((r,b)=>e(re,{item:r,textConfig:m},b))}),ae=({textConfig:t})=>{const{isLogin:i,profile:m,variant:r,renderAffirm:b,renderKlarna:l,renderPaypal:C,onUseCouponChange:T,onUseMemberDiscountChange:B,discount:w,savingDetail:k,openModal:I,openSignInPopup:h,openAuthCodePopup:V,openSignUpPopup:E}=R(),z=ee({variant:r}),[L,G]=oe("coupon"),{trackingData:_,locale:f="us",copyWriting:O}=$(),M=te(null),o={...ie,...t},{activated:j=!1}=m||{},{memberDiscount:d,commonCoupon:u,creditsRedemption:v,freeGift:U,bundle:S,paidShipping:W,fullGift:D,levelDiscount:F}=z,Y=_?.product?.support??{},{thirdParty:ce={}}=_?.common||{},y=[u?.enable?{...u.config,isAutoUse:k?.coupon>0,useAble:!0,borderStyle:"rounded",code:u?.config?.title??"",description:u?.config?.desc??"",onUseChange:n=>{const a=n?w?.codeSavings??0:0;T?.(a)},title:A(o.offCoupon,{discount:u?.config?.value_type=="percentage"?Math.abs(Number(u?.config?.value||0))+"%":g({amount:Math.abs(Number(u?.config?.fixed_value||0)),currencyCode:r.price.currencyCode,locale:f})})}:null,d.enable?{useAble:!0,isAutoUse:i,title:A(o.offMemberOnly,{amount:g({amount:d?.config?.amount??0,currencyCode:r.price.currencyCode,locale:f})}),description:s(N,{children:[i?d?.config?.description??"":o.memberBenefitsNotLogin.replace("{amount}",g({amount:d?.config?.amount??0,currencyCode:r.price.currencyCode,locale:f}))??""," ",i?"":e("span",{role:"button",tabIndex:0,onClick:()=>h?.(),className:"underline",children:o.loginNow})]}),borderStyle:"rounded",onUseChange:n=>{if(i){const a=n?d?.config?.amount??0:0;B?.(a)}else h?.()}}:null,F.enable?{title:F?.config?.title??"",description:F?.config?.tag??"",borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/levelDiscount.png?v=1760437385"}}:null,U.enable?{title:U?.config?.title??"",description:o.selectFreeGift,borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/gift.png?v=1759113534"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null,S.enable?{title:`${o.bundleSaveUpTo} ${g({amount:Math.max(...S?.config?.bundleList?.map(n=>n.savings??0)??[]),currencyCode:r.price.currencyCode,locale:f})}`,borderStyle:"inset",description:o.bundleOffer.replace("{count}",S?.config?.bundleList?.length?.toString()??""),bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/bundle.png?v=1759113534"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null,D.enable?{title:D?.config?.title??"",description:D?.config?.desc??"",borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/fullGift.png?v=1759141790"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null,v.enable?{title:o.creditsTitle,description:o.creditsDesc,borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/cash.png?v=1759113534"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null].filter(Boolean),q=()=>{V?.()};if(!c)return null;const P=n=>{if(M.current){const a=M.current,Z=n.currentTarget,K=Z.offsetLeft-a.offsetWidth/2+Z.offsetWidth/2;a.scrollTo({left:K,behavior:"smooth"})}};return s(c,{onValueChange:n=>G(n),defaultValue:y?.length?"coupon":"membership",children:[s(c.List,{ref:M,children:[y?.length?e(c.Trigger,{className:x(L==="coupon"&&"text-[#1D1D1F]"),value:"coupon",onClick:P,children:o.yourBenefits}):null,e(c.Trigger,{className:x(L==="membership"&&"text-[#1D1D1F]"),value:"membership",onClick:P,children:o.memberBenefits}),e(c.Trigger,{className:x(L==="installment"&&"text-[#1D1D1F]"),value:"installment",onClick:P,children:o.installment})]}),e("style",{global:!0,jsx:!0,children:`
+      `}),s("div",{style:{background:t.couponBgColor||"white"},className:x("relative h-[100px] p-3 overflow-hidden laptop:h-[112px] lg-desktop:h-[130px]",t.borderStyle==="inset"?"coupon-card ":"rounded-[8px]"),children:[t?.bgImage?.url&&e(H,{source:t.bgImage.url,alt:t.bgImage.alt,className:"absolute bottom-0 right-0 w-auto",imgClassName:"object-contain"}),s("div",{className:"relative z-1 ",children:[s("div",{className:"flex items-center justify-start",children:[t.useAble&&e(Q,{size:"lg",className:"mr-2 rounded-full border-[#D1D1D1] border-[1.6px] data-[state=checked]:border-primary",checked:t?.isAutoUse,onCheckedChange:h=>{t?.onUseChange?.(h)}}),e(p,{html:t.title,className:"text-[16px] leading-[1.2] font-bold laptop:text-[20px] lg-desktop:text-[24px]"})]}),t.description&&e(p,{...typeof t.description=="string"?{html:t.description}:{},as:"p",className:"mt-2 pr-8 text-[14px] font-bold text-[#3D3D3F] lg-desktop:text-[16px]",children:t.description}),t.code&&s("div",{className:"desktop:mt-2 flex items-center gap-2",children:[e(p,{html:`${i.couponCode}: ${t.code}`,className:"text-[14px] lg-desktop:text-[16px] font-bold text-[#3D3D3F]"}),e("button",{className:"text-[14px] lg-desktop:text-[16px] font-bold underline",onClick:()=>b(t.code??""),children:l?r?.copied||i.copied:r?.copy||i.copyCode})]}),t.ends_at&&e("button",{onClick:()=>{r?.modal&&w(r?.modal)},className:"lg-desktop:mt-[24px] desktop:mt-4 mt-[14px] text-left text-[14px] font-semibold lg-desktop:text-[16px] text-[#1F2021] md-l:hidden",children:Number(C)<Number(r?.hurry?.daysLeft)?s(N,{children:[e("span",{children:r?.ends}),e("span",{className:"font-bold",children:` ${C} ${r?.days} ${T.toString().padStart(2,"0")}:${k.toString().padStart(2,"0")}:${B.toString().padStart(2,"0")}`})]}):r?.hurry?.label||i.expired})]})]})]})},re=({coupons:t,className:i,textConfig:m})=>e("div",{className:x("flex flex-col gap-3 laptop:grid laptop:grid-cols-2 desktop:grid-cols-1",i),children:t?.map((l,b)=>e(le,{item:l,textConfig:m},b))}),ae=({textConfig:t})=>{const{isLogin:i,profile:m,variant:l,renderAffirm:b,renderKlarna:r,renderPaypal:C,onUseCouponChange:T,onUseMemberDiscountChange:k,discount:B,savingDetail:w,openModal:I,openSignInPopup:h,openAuthCodePopup:V,openSignUpPopup:E}=R(),z=ee({variant:l}),[L,G]=oe("coupon"),{trackingData:_,locale:f="us",copyWriting:O}=$(),M=te(null),o={...ie,...t},{activated:j=!1}=m||{},{memberDiscount:d,commonCoupon:u,creditsRedemption:v,freeGift:U,bundle:S,paidShipping:W,fullGift:D,levelDiscount:F}=z,Y=_?.product?.support??{},{thirdParty:ce={}}=_?.common||{},y=[u?.enable?{...u.config,isAutoUse:w?.coupon>0,useAble:!0,borderStyle:"rounded",code:u?.config?.title??"",description:u?.config?.desc??"",onUseChange:n=>{const a=n?B?.codeSavings??0:0;T?.(a)},title:A(o.offCoupon,{discount:u?.config?.value_type=="percentage"?Math.abs(Number(u?.config?.value||0))+"%":g({amount:Math.abs(Number(u?.config?.fixed_value||0)),currencyCode:l.price.currencyCode,locale:f})})}:null,d.enable?{useAble:!0,isAutoUse:i,title:A(o.offMemberOnly,{amount:g({amount:d?.config?.amount??0,currencyCode:l.price.currencyCode,locale:f})}),description:s(N,{children:[i?d?.config?.description??"":o.memberBenefitsNotLogin.replace("{amount}",g({amount:d?.config?.amount??0,currencyCode:l.price.currencyCode,locale:f}))??""," ",i?"":e("span",{role:"button",tabIndex:0,onClick:()=>h?.(),className:"underline",children:o.loginNow})]}),borderStyle:"rounded",onUseChange:n=>{if(i){const a=n?d?.config?.amount??0:0;k?.(a)}else h?.()}}:null,F.enable?{title:F?.config?.title??"",description:F?.config?.tag??"",borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/levelDiscount.png?v=1760437385"}}:null,U.enable?{title:U?.config?.title??"",description:o.selectFreeGift,borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/gift.png?v=1759113534"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null,S.enable?{title:`${o.bundleSaveUpTo} ${g({amount:Math.max(...S?.config?.bundleList?.map(n=>n.savings??0)??[]),currencyCode:l.price.currencyCode,locale:f})}`,borderStyle:"inset",description:o.bundleOffer.replace("{count}",S?.config?.bundleList?.length?.toString()??""),bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/bundle.png?v=1759113534"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null,D.enable?{title:D?.config?.title??"",description:D?.config?.desc??"",borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/fullGift.png?v=1759141790"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null,v.enable?{title:o.creditsTitle,description:o.creditsDesc,borderStyle:"inset",bgImage:{url:"https://cdn.shopify.com/s/files/1/0516/3761/6830/files/cash.png?v=1759113534"},couponBgColor:"linear-gradient(94deg, rgba(215, 245, 254, 0.24) 4.2%, rgba(215, 245, 254, 0.80) 99.11%), #FFF"}:null].filter(Boolean),q=()=>{V?.()};if(!c)return null;const P=n=>{if(M.current){const a=M.current,Z=n.currentTarget,K=Z.offsetLeft-a.offsetWidth/2+Z.offsetWidth/2;a.scrollTo({left:K,behavior:"smooth"})}};return s(c,{onValueChange:n=>G(n),defaultValue:y?.length?"coupon":"membership",children:[s(c.List,{ref:M,children:[y?.length?e(c.Trigger,{className:x(L==="coupon"&&"text-[#1D1D1F]"),value:"coupon",onClick:P,children:o.yourBenefits}):null,e(c.Trigger,{className:x(L==="membership"&&"text-[#1D1D1F]"),value:"membership",onClick:P,children:o.memberBenefits}),e(c.Trigger,{className:x(L==="installment"&&"text-[#1D1D1F]"),value:"installment",onClick:P,children:o.installment})]}),e("style",{global:!0,jsx:!0,children:`
           .benefits-tabs-content::-webkit-scrollbar {
             width: 4px; /* \u6EDA\u52A8\u6761\u5BBD\u5EA6 */
             height: 64px; /* \u6A2A\u5411\u6EDA\u52A8\u6761\u9AD8\u5EA6 */
@@ -32,9 +32,9 @@ import{Fragment as N,jsx as e,jsxs as s}from"react/jsx-runtime";import{Button as
           .benefits-tabs-content::-webkit-scrollbar-thumb:hover {
             background-color: rgba(100, 100, 100, 0.6);
           }
-        `}),y?.length?e(c.Content,{value:"coupon",className:"benefits-tabs-content overflow-y-auto lg-desktop:h-[240px] desktop:h-[196px]  h-[180px] laptop:h-[220px]",children:e("div",{className:"p-3 lg-desktop:p-4",children:e(le,{coupons:y,className:"",textConfig:o})})}):null,e(c.Content,{value:"membership",className:"benefits-tabs-content overflow-y-auto lg-desktop:h-[240px] desktop:h-[196px] h-[180px] laptop:h-[220px]",children:s("div",{className:"p-3 lg-desktop:p-4  ",children:[!i&&e("h3",{className:"mx-4 mb-2 text-left text-lg font-bold",children:o.memberBenefitsNotLoginText}),e("div",{className:`overflow-y-auto rounded-[16px] px-4 ${i?"max-h-[240px]":"max-h-[160px]"}`,children:s("ul",{className:`list-none [&_li:first-child]:rounded-t-[16px]
+        `}),y?.length?e(c.Content,{value:"coupon",className:"benefits-tabs-content overflow-y-auto lg-desktop:h-[240px] desktop:h-[196px] h-[180px] laptop:h-[220px]",children:e("div",{className:"p-3 lg-desktop:p-4",children:e(re,{coupons:y,className:"",textConfig:o})})}):null,e(c.Content,{value:"membership",className:"benefits-tabs-content overflow-y-auto lg-desktop:h-[240px] desktop:h-[196px] h-[180px] laptop:h-[220px]",children:s("div",{className:"p-3 lg-desktop:p-4  ",children:[!i&&e("h3",{className:"mb-2 text-left text-lg font-bold",children:o.memberBenefitsNotLoginText}),e("div",{className:`rounded-[16px] ${i?"max-h-[240px]":"max-h-[160px]"}`,children:s("ul",{className:`list-none [&_li:first-child]:rounded-t-[16px]
               [&_li:last-child]:rounded-b-[16px] [&_li:last-child]:last:border-b-0 [&_li]:flex [&_li]:items-center [&_li]:gap-2
               [&_li]:border-b [&_li]:border-b-[#E4E5E6] [&_li]:bg-white [&_li]:px-4
               [&_li]:py-4
-              [&_li]:text-left`,children:[d.enable&&s("li",{children:[e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z",fill:"#1D1D1F"})}),e(p,{as:"p",className:"text-left text-[16px] font-bold x:text-[14px]",children:A(o.forNewMember,{amount:g({amount:d?.config?.amount??0,currencyCode:r.price.currencyCode,locale:f})})})]}),Y.items?.map((n,a)=>n.modalText?e("li",{children:s("button",{onClick:()=>I?.({title:n.text,content:n.modalText}),className:"flex",children:[e(H,{source:n.icon,alt:n.text,className:"mr-[8px] size-[20px] shrink-0"}),e(p,{className:"text-left text-[16px] font-bold x:text-[14px]",children:n.text})]},a)},a):s("li",{className:"flex",children:[e(H,{source:n.icon,alt:n.text,className:"mr-[8px] size-[20px] shrink-0"}),e(p,{as:"p",className:"text-left text-[16px] font-bold x:text-[14px]",children:n.text})]},a)),W.enable?s("li",{children:[e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M19 3C19.5523 3 20 3.44772 20 4C20 4.55228 19.5523 5 19 5H10V16H21C21.5523 16 22 16.4477 22 17C22 17.5523 21.5523 18 21 18H19.9961C19.9961 19.6559 18.6547 21 16.998 21C15.3414 21 14 19.6559 14 18H10C10 19.6568 8.65684 21 7 21C5.34317 21 4 19.6568 4 18H2C1.44772 18 1 17.5523 1 17V10.6738L1.00488 10.5771C1.02632 10.3554 1.12145 10.146 1.27637 9.9834L4.77637 6.31055L4.84961 6.24023C5.02993 6.08586 5.26042 6 5.5 6H8V5C8 3.89544 8.89541 3 10 3H19ZM6.00488 18.1025C6.05622 18.6067 6.48234 19 7 19C7.51766 19 7.94378 18.6067 7.99512 18.1025L8 18H6L6.00488 18.1025ZM16.0049 18.1025C16.0561 18.6074 16.4823 19 16.998 19C17.5138 19 17.94 18.6074 17.9912 18.1025L17.9961 18H16L16.0049 18.1025ZM3 11.0723V16H8V8H5.92773L3 11.0723ZM21.6621 6.8252C22.0348 6.41765 22.6676 6.38902 23.0752 6.76172C23.4827 7.13443 23.5104 7.76725 23.1377 8.1748L18.0518 13.7363C17.6625 14.162 17.003 14.1954 16.5732 13.8105L13.333 10.9092C12.9216 10.5408 12.8865 9.90853 13.2549 9.49707C13.6232 9.08565 14.2555 9.05066 14.667 9.41895L17.208 11.6943L21.6621 6.8252Z",fill:"#1D1D1F"})}),e(p,{as:"p",className:"text-left text-[16px] font-bold x:text-[14px]",children:o.expressShipping})]}):null,v.enable?s("li",{children:[e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z",fill:"#1D1D1F"})}),e(p,{as:"p",className:"text-left text-[16px] font-medium x:text-[14px]",children:j?v?.config?.label?.replace("{{amount}}",g({amount:v?.config?.amount??0,currencyCode:r.price.currencyCode,locale:f})):s(N,{children:[o.creditsAfterActivation,e("span",{role:"button",tabIndex:0,onClick:()=>q(),className:"underline",children:o.active})]})})]}):null]})}),!i&&e("div",{className:"px-4 pt-4",children:e(J,{variant:"primary",className:"w-full",onClick:()=>E?.(),children:O?.signUp})})]})}),s(c.Content,{value:"installment",className:"benefits-tabs-content overflow-y-auto px-4 lg-desktop:h-[240px] desktop:h-[196px] h-[180px] laptop:h-[220px] ",children:[e(X,{size:2,className:"mb-2 text-left text-lg font-bold",children:o.flexibleInstallment}),s("div",{className:"overflow-hidden rounded-[16px] bg-white",children:[b,l,C]})]})]})};var Ne=ae;export{Ne as default};
+              [&_li]:text-left`,children:[d.enable&&s("li",{children:[e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z",fill:"#1D1D1F"})}),e(p,{as:"p",className:"text-left text-[16px] font-bold x:text-[14px]",children:A(o.forNewMember,{amount:g({amount:d?.config?.amount??0,currencyCode:l.price.currencyCode,locale:f})})})]}),Y.items?.map((n,a)=>n.modalText?e("li",{children:s("button",{onClick:()=>I?.({title:n.text,content:n.modalText}),className:"flex",children:[e(H,{source:n.icon,alt:n.text,className:"mr-[8px] size-[20px] shrink-0"}),e(p,{className:"text-left text-[16px] font-bold x:text-[14px]",children:n.text})]},a)},a):s("li",{className:"flex",children:[e(H,{source:n.icon,alt:n.text,className:"mr-[8px] size-[20px] shrink-0"}),e(p,{as:"p",className:"text-left text-[16px] font-bold x:text-[14px]",children:n.text})]},a)),W.enable?s("li",{children:[e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M19 3C19.5523 3 20 3.44772 20 4C20 4.55228 19.5523 5 19 5H10V16H21C21.5523 16 22 16.4477 22 17C22 17.5523 21.5523 18 21 18H19.9961C19.9961 19.6559 18.6547 21 16.998 21C15.3414 21 14 19.6559 14 18H10C10 19.6568 8.65684 21 7 21C5.34317 21 4 19.6568 4 18H2C1.44772 18 1 17.5523 1 17V10.6738L1.00488 10.5771C1.02632 10.3554 1.12145 10.146 1.27637 9.9834L4.77637 6.31055L4.84961 6.24023C5.02993 6.08586 5.26042 6 5.5 6H8V5C8 3.89544 8.89541 3 10 3H19ZM6.00488 18.1025C6.05622 18.6067 6.48234 19 7 19C7.51766 19 7.94378 18.6067 7.99512 18.1025L8 18H6L6.00488 18.1025ZM16.0049 18.1025C16.0561 18.6074 16.4823 19 16.998 19C17.5138 19 17.94 18.6074 17.9912 18.1025L17.9961 18H16L16.0049 18.1025ZM3 11.0723V16H8V8H5.92773L3 11.0723ZM21.6621 6.8252C22.0348 6.41765 22.6676 6.38902 23.0752 6.76172C23.4827 7.13443 23.5104 7.76725 23.1377 8.1748L18.0518 13.7363C17.6625 14.162 17.003 14.1954 16.5732 13.8105L13.333 10.9092C12.9216 10.5408 12.8865 9.90853 13.2549 9.49707C13.6232 9.08565 14.2555 9.05066 14.667 9.41895L17.208 11.6943L21.6621 6.8252Z",fill:"#1D1D1F"})}),e(p,{as:"p",className:"text-left text-[16px] font-bold x:text-[14px]",children:o.expressShipping})]}):null,v.enable?s("li",{children:[e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1ZM12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM17 13C17.5523 13 18 13.4477 18 14C18 14.5523 17.5523 15 17 15H9.41406L9.70703 15.293C10.0976 15.6835 10.0976 16.3165 9.70703 16.707C9.31651 17.0976 8.68349 17.0976 8.29297 16.707L6.29297 14.707C6.00697 14.421 5.92139 13.9909 6.07617 13.6172C6.23098 13.2436 6.59558 13 7 13H17ZM14.293 7.29297C14.6835 6.90244 15.3165 6.90244 15.707 7.29297L17.707 9.29297C17.993 9.57897 18.0786 10.0091 17.9238 10.3828C17.769 10.7564 17.4044 11 17 11H7C6.44772 11 6 10.5523 6 10C6 9.44771 6.44772 9 7 9H14.5859L14.293 8.70703C13.9024 8.31651 13.9024 7.68349 14.293 7.29297Z",fill:"#1D1D1F"})}),e(p,{as:"p",className:"text-left text-[16px] font-medium x:text-[14px]",children:j?v?.config?.label?.replace("{{amount}}",g({amount:v?.config?.amount??0,currencyCode:l.price.currencyCode,locale:f})):s(N,{children:[o.creditsAfterActivation,e("span",{role:"button",tabIndex:0,onClick:()=>q(),className:"underline",children:o.active})]})})]}):null]})}),!i&&e("div",{className:"px-4 pt-4",children:e(J,{variant:"primary",className:"w-full",onClick:()=>E?.(),children:O?.signUp})})]})}),s(c.Content,{value:"installment",className:"benefits-tabs-content overflow-y-auto px-4 lg-desktop:h-[240px] desktop:h-[196px] h-[180px] laptop:h-[220px] ",children:[e(X,{size:2,className:"mb-2 text-left text-lg font-bold",children:o.flexibleInstallment}),s("div",{className:"overflow-hidden rounded-[16px] bg-white",children:[b,r,C]})]})]})};var Ne=ae;export{Ne as default};
 //# sourceMappingURL=BenefitsTab.js.map