npm - @anker-in/headless-ui - Versions diffs - 1.2.3-alpha.1778583232121 → 1.2.4 - Mend

@anker-in/headless-ui 1.2.3-alpha.1778583232121 → 1.2.4

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 (265) hide show

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var Q=Object.create;var g=Object.defineProperty;var U=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Y=Object.getPrototypeOf,Z=Object.prototype.hasOwnProperty;var ee=(n,t)=>{for(var e in t)g(n,e,{get:t[e],enumerable:!0})},_=(n,t,e,m)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of X(t))!Z.call(n,p)&&p!==e&&g(n,p,{get:()=>t[p],enumerable:!(m=U(t,p))||m.enumerable});return n};var b=(n,t,e)=>(e=n!=null?Q(Y(n)):{},_(t||!n||!n.__esModule?g(e,"default",{value:n,enumerable:!0}):e,n)),te=n=>_(g({},"__esModule",{value:!0}),n);var ne={};ee(ne,{default:()=>ae,secondaryBannerVariants:()=>O});module.exports=te(ne);var a=require("react/jsx-runtime"),z=b(require("react")),M=require("class-variance-authority"),x=b(require("jump.js")),o=require("../../helpers/index.js"),i=require("../../components/index.js"),D=require("../../shared/Styles.js"),N=b(require("../Media/index.js")),L=require("../AiuiProvider/index.js"),A=b(require("./SecondaryBannerCarousel.js"));const O=(0,M.cva)("text-info-primary relative w-full",{variants:{size:{sm:"tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]",base:"tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]",lg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]",xlg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible"}},defaultVariants:{size:"base"}}),C=z.forwardRef(({className:n,classNames:t={},data:e,jumpOptions:m={},isActive:p,...d},h)=>{const{pcImage:P,padImage:w,mobileImage:j,isVideoLoop:H,endDate:B,endDate_tz:V,dateFormat:E,size:J,iconArray:y,theme:$,primaryButton:r,secondaryButton:s,title:R,titleTag:F}=e,W=H??!0,f=J??"base",q=$??"light",G=F??"h1",{locale:T="us"}=(0,L.useAiuiContext)(),v={...{duration:500,offset:0},...m},k=z.useId(),u=R?`${k}-title`:void 0,I=e.subtitle?`${k}-subtitle`:void 0,S=e.superTitle?`${k}-super-title`:void 0,K=[S,I].filter(Boolean).join(" ")||void 0;return e.mode==="carousel"&&e.items&&e.items.length>0?(0,a.jsx)(A.default,{data:e,className:n,classNames:t,jumpOptions:m,theme:e.theme??e.items?.[0]?.theme,ref:h,...d}):(0,a.jsxs)("section",{ref:h,role:"banner","aria-labelledby":u,"aria-describedby":K,className:(0,o.cn)({"aiui-dark":q==="dark"},O({size:f}),n,t?.root),...d,children:[(0,a.jsx)("div",{className:(0,o.cn)("absolute inset-0",{"h-fit":f==="xlg"}),children:(0,a.jsx)(N.default,{pcImage:P,padImage:w,mobileImage:j,className:"size-full",imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:W,playsInline:!0,autoPlay:p??!0})}),(0,a.jsxs)("div",{className:(0,o.cn)("banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left",t?.content),children:[(0,a.jsxs)("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[e.superTitle&&(0,a.jsx)(i.Text,{as:"p",size:2,id:S,className:(0,o.cn)("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",t?.superTitle),html:e.superTitle}),e.title&&(0,a.jsx)(i.Heading,{as:G,size:["xlg","lg"].includes(f)?5:4,id:u,className:(0,o.cn)("banner-title ",t?.title),html:e.title}),e.subtitle&&(0,a.jsx)(i.Text,{as:"p",size:3,id:I,className:(0,o.cn)("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",t?.subtitle),html:e.subtitle})]}),B&&(0,a.jsx)("div",{className:"banner-countdown",children:(0,a.jsx)(i.Countdown,{endDate:B,endDate_tz:V,dateFormat:E,variant:"spacious",className:"lg-desktop:mt-8 mt-6"})}),(0,a.jsxs)("div",{className:(0,o.cn)("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",t?.buttonGroup),children:[s?.text&&(0,a.jsx)(i.Button,{variant:"secondary","data-track":d.id?`${d.id}_secondary_button_click`:"SecondaryBanner_secondary_button_click",onClick:c=>{if(s.link?.startsWith("#")){c.preventDefault();const l=document.querySelector(s.link);l&&(0,x.default)(l,v)}s.onClick?.()},className:(0,o.cn)("",t?.secondaryButton),"aria-describedby":u,...s.link&&!s.link.startsWith("#")?{as:"a",href:(0,o.getLocalizedPath)(s.link,T)}:{},children:s.text}),r?.text&&(0,a.jsx)(i.Button,{"data-track":d.id?`${d.id}_primary_button_click`:"SecondaryBanner_primary_button_click",onClick:c=>{if(r.link?.startsWith("#")){c.preventDefault();const l=document.querySelector(r.link);l&&(0,x.default)(l,v)}r.onClick?.()},className:(0,o.cn)("",t?.primaryButton),"aria-describedby":u,...r.link&&!r.link.startsWith("#")?{as:"a",href:(0,o.getLocalizedPath)(r.link,T)}:{},children:r.text})]}),Array.isArray(y)&&y.length>0&&(0,a.jsx)("div",{className:"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2",role:"group","aria-label":"brand icons",children:y.map((c,l)=>c.pcImage?(0,a.jsx)(i.Picture,{source:c.pcImage.url,alt:c.pcImage.alt||`icon ${l+1}`,role:"img",className:"laptop:h-auto h-[48px] max-w-none",imgClassName:"h-full"},l):null)})]})]})});C.displayName="SecondaryBanner";var ae=(0,D.withLayout)(C);
+"use strict";"use client";var _=Object.create;var u=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,K=Object.prototype.hasOwnProperty;var Q=(a,e)=>{for(var t in e)u(a,t,{get:e[t],enumerable:!0})},C=(a,e,t,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let p of q(e))!K.call(a,p)&&p!==t&&u(a,p,{get:()=>e[p],enumerable:!(m=$(e,p))||m.enumerable});return a};var g=(a,e,t)=>(t=a!=null?_(G(a)):{},C(e||!a||!a.__esModule?u(t,"default",{value:a,enumerable:!0}):t,a)),U=a=>C(u({},"__esModule",{value:!0}),a);var Z={};Q(Z,{default:()=>Y});module.exports=U(Z);var n=require("react/jsx-runtime"),M=g(require("react")),D=require("class-variance-authority"),x=g(require("jump.js")),o=require("../../helpers/index.js"),i=require("../../components/index.js"),N=require("../../shared/Styles.js"),A=g(require("../Media/index.js")),L=require("../AiuiProvider/index.js"),O=g(require("./SecondaryBannerCarousel.js"));const X=(0,D.cva)("text-info-primary relative w-full",{variants:{size:{sm:"tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]",base:"tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]",lg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]",xlg:"tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible"}},defaultVariants:{size:"base"}}),z=M.forwardRef(({className:a,classNames:e={},data:t,jumpOptions:m={},isActive:p,...k},h)=>{const{pcImage:P,padImage:w,mobileImage:j,isVideoLoop:H=!0,endDate:B,endDate_tz:E,dateFormat:J,size:b="base",iconArray:y,theme:R="light",primaryButton:r,secondaryButton:s,title:V,titleTag:F="h1"}=t,{locale:v="us"}=(0,L.useAiuiContext)(),T={...{duration:500,offset:0},...m},f=M.useId(),d=V?`${f}-title`:void 0,I=t.subtitle?`${f}-subtitle`:void 0,S=t.superTitle?`${f}-super-title`:void 0,W=[S,I].filter(Boolean).join(" ")||void 0;return t.items&&t.items.length>0?(0,n.jsx)(O.default,{data:t,className:a,classNames:e,jumpOptions:m,ref:h,...k}):(0,n.jsxs)("section",{ref:h,role:"banner","aria-labelledby":d,"aria-describedby":W,className:(0,o.cn)({"aiui-dark":R==="dark"},X({size:b}),a,e?.root),...k,children:[(0,n.jsx)(A.default,{pcImage:P,padImage:w,mobileImage:j,className:(0,o.cn)("absolute inset-0 size-full object-cover",{"h-fit":b==="xlg"}),imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:H,playsInline:!0,autoPlay:p??!0}),(0,n.jsxs)("div",{className:(0,o.cn)("banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left",e?.content),children:[(0,n.jsxs)("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[t.superTitle&&(0,n.jsx)(i.Text,{as:"p",size:2,id:S,className:(0,o.cn)("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",e?.superTitle),html:t.superTitle}),t.title&&(0,n.jsx)(i.Heading,{as:F,size:["xlg","lg"].includes(b)?5:4,id:d,className:(0,o.cn)("banner-title ",e?.title),html:t.title}),t.subtitle&&(0,n.jsx)(i.Text,{as:"p",size:3,id:I,className:(0,o.cn)("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",e?.subtitle),html:t.subtitle})]}),B&&(0,n.jsx)("div",{className:"banner-countdown",children:(0,n.jsx)(i.Countdown,{endDate:B,endDate_tz:E,dateFormat:J,variant:"spacious",className:"lg-desktop:mt-8 mt-6"})}),(0,n.jsxs)("div",{className:(0,o.cn)("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",e?.buttonGroup),children:[s?.text&&(0,n.jsx)(i.Button,{variant:"secondary",onClick:c=>{if(s.link?.startsWith("#")){c.preventDefault();const l=document.querySelector(s.link);l&&(0,x.default)(l,T)}s.onClick?.()},className:(0,o.cn)("",e?.secondaryButton),"aria-describedby":d,...s.link&&!s.link.startsWith("#")?{as:"a",href:(0,o.getLocalizedPath)(s.link,v)}:{},children:s.text}),r?.text&&(0,n.jsx)(i.Button,{onClick:c=>{if(r.link?.startsWith("#")){c.preventDefault();const l=document.querySelector(r.link);l&&(0,x.default)(l,T)}r.onClick?.()},className:(0,o.cn)("",e?.primaryButton),"aria-describedby":d,...r.link&&!r.link.startsWith("#")?{as:"a",href:(0,o.getLocalizedPath)(r.link,v)}:{},children:r.text})]}),Array.isArray(y)&&y.length>0&&(0,n.jsx)("div",{className:"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2",role:"group","aria-label":"brand icons",children:y.map((c,l)=>c.pcImage?(0,n.jsx)(i.Picture,{source:c.pcImage.url,alt:c.pcImage.alt||`icon ${l+1}`,role:"img",className:"laptop:h-auto h-[48px] max-w-none",imgClassName:"h-full"},l):null)})]})]})});z.displayName="SecondaryBanner";var Y=(0,N.withLayout)(z);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/SecondaryBanner/index.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cva } from 'class-variance-authority'\nimport jump from 'jump.js'\nimport { cn, getLocalizedPath } from '../../helpers/index.js'\nimport type { Media as MediaType, Theme } from '../../types/props.js'\nimport { Text, Button, Heading, Picture, Countdown } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Media from '../Media/index.js'\nimport type { ButtonProps } from '../../components/button.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport SecondaryBannerCarouselImpl from './SecondaryBannerCarousel.js'\n\nexport type SecondaryBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'superTitle'\n  | 'subtitle'\n  | 'content'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\n\n/**\n * Carousel navigation configuration for SecondaryBanner. v1: arrows only.\n * autoplay, dots, and progress are intentionally EXCLUDED from v1.\n */\nexport interface SecondaryBannerCarouselConfig {\n  /**\n   * Show prev/next arrow navigation controls.\n   * Only used when data.items has 2+ slides.\n   * @default true\n   */\n  showArrows?: boolean\n  showDots?: boolean\n  loop?: boolean\n  autoplaySeconds?: number\n}\n\n/**\n * Per-slide data for SecondaryBanner carousel mode.\n * All fields optional (mirrors SecondaryBannerData permissiveness).\n */\nexport interface SecondaryBannerSlideData {\n  title?: string\n  titleTag?: 'h1' | 'h2'\n  superTitle?: string\n  subtitle?: string\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  isVideoLoop?: boolean\n  endDate?: string\n  endDate_tz?: string\n  dateFormat?: string\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n}\n/**\n * jump.js \u914D\u7F6E\u9009\u9879\n */\nexport interface JumpOptions {\n  /** \u52A8\u753B\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09 @default 500 */\n  duration?: number\n  /** \u504F\u79FB\u91CF\uFF08\u50CF\u7D20\uFF09 @default 0 */\n  offset?: number\n  /** \u52A8\u753B\u5B8C\u6210\u56DE\u8C03 */\n  callback?: () => void\n  /** \u7F13\u52A8\u51FD\u6570 */\n  easing?: (t: number, b: number, c: number, d: number) => number\n  /** \u662F\u5426\u8003\u8651 a11y @default false */\n  a11y?: boolean\n}\n\nexport const secondaryBannerVariants = cva(\n  // \u57FA\u7840\u6837\u5F0F\n  'text-info-primary relative w-full',\n  {\n    variants: {\n      size: {\n        sm: 'tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]',\n        base: 'tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]',\n        lg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]',\n        xlg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible',\n      },\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\n/**\n * SecondaryBanner \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface SecondaryBannerData {\n  /** \u4E3B\u6807\u9898*/\n  title?: string\n  /**\n   * \u4E3B\u6807\u9898\u6807\u7B7E\n   * @default 'h1'\n   */\n  titleTag?: 'h1' | 'h2'\n  /**\n   * \u4E0A\u6807\u9898/\u5F15\u5BFC\u6807\u9898\n   * \u901A\u5E38\u7528\u4E8E\u5206\u7C7B\u3001\u5F15\u5BFC\u6027\u6587\u5B57\n   */\n  superTitle?: string\n  /**\n   * \u526F\u6807\u9898/\u63CF\u8FF0\u6587\u5B57\n   * \u901A\u5E38\u7528\u4E8E\u8865\u5145\u8BF4\u660E\u3001\u8BE6\u7EC6\u63CF\u8FF0\n   */\n  subtitle?: string\n  /**\n   * \u5C3A\u5BF8:\n   *  sm: \u5C0F\u5C3A\u5BF8\u7528\u4E8E\u7B5B\u9009\u9875\u9762\n   *  base: \u57FA\u7840\u5C3A\u5BF8\u7528\u4E8E\n   *  lg: \u5927\u5C3A\u5BF8\u7528\u4E8E\u4E13\u9898\u9875\n   *  xlg: \u6D3B\u52A8\u9875\uFF08\u901A\u680F\uFF09\n   */\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  /** \u89C6\u9891\u662F\u5426\u5FAA\u73AF\u64AD\u653E */\n  isVideoLoop?: boolean\n  /** \u7ED3\u675F\u65F6\u95F4\uFF08ISO \u5B57\u7B26\u4E32\uFF09 */\n  endDate?: string\n  /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF08\u5982: America/Los_Angeles\uFF09 */\n  endDate_tz?: string\n  /**\n   * \u65F6\u95F4\u683C\u5F0F\u5316\u914D\u7F6E\uFF08JSON \u5B57\u7B26\u4E32\uFF09\n   * {\"day\":\"\u65E5\",\"hour\":\"\u65F6\",\"minute\":\"\u5206\",\"second\":\"\u79D2\"}\n   */\n  dateFormat?: string\n\n  /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  /** \u6B21\u7EA7\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n  /**\n   * Carousel slide items. When present and non-empty, activates carousel mode.\n   * Single-banner mode is used when absent or empty (DECISION-002).\n   */\n  items?: SecondaryBannerSlideData[]\n  /**\n   * Display mode: 'single' renders the first frame only; 'carousel' activates Swiper.\n   * Mirrors the CMS `mode` field (single | carousel). Defaults to single-banner path\n   * when absent (backward-compatible with legacy data that has no mode field).\n   */\n  mode?: 'single' | 'carousel'\n  /**\n   * Carousel navigation configuration.\n   * Only meaningful when data.items is present and has 2+ items.\n   */\n  carousel?: SecondaryBannerCarouselConfig\n}\n\nexport interface SecondaryBannerProps extends React.HTMLAttributes<HTMLElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\n  /**\n   * \u951A\u70B9\u8DF3\u8F6C\u914D\u7F6E\uFF08\u7528\u4E8E # \u5F00\u5934\u7684\u94FE\u63A5\uFF09\n   * @default { duration: 500, offset: 0 }\n   */\n  jumpOptions?: JumpOptions\n  /**\n   * Whether this banner is the active slide in a carousel.\n   * Controls video autoPlay: autoPlay={isActive ?? true}.\n   * When absent (legacy single-banner), defaults to true (DECISION-008).\n   * @default true\n   */\n  isActive?: boolean\n}\n\n/**\n * SecondaryBanner - \u6B21\u7EA7\u6A2A\u5E45banner\n *\n * @description \u662F\u6307\u7528\u6237\u8FDB\u5165\u4E8C\u7EA7\u9875\u9762\u540E\uFF0C\u65E0\u9700\u6EDA\u52A8\u9875\u9762\u5C31\u80FD\u5728\u7B2C\u4E00\u5C4F\uFF08\u5373\"\u9996\u5C4F\"\uFF09\u770B\u5230\u7684\u3001\u901A\u5E38\u6A2A\u8DE8\u6574\u4E2A\u6D4F\u89C8\u5668\u7A97\u53E3\u5BBD\u5EA6\u7684\u6838\u5FC3\u89C6\u89C9\u533A\u57DF\u3002\n */\nconst SecondaryBanner = React.forwardRef<HTMLElement, SecondaryBannerProps>(\n  ({ className, classNames = {}, data, jumpOptions = {}, isActive, ...props }, ref) => {\n    const {\n      pcImage,\n      padImage,\n      mobileImage,\n      isVideoLoop: _isVideoLoop,\n      endDate,\n      endDate_tz,\n      dateFormat,\n      size: _size,\n      iconArray: icons,\n      theme: _theme,\n      primaryButton,\n      secondaryButton,\n      title,\n      titleTag: _titleTag,\n    } = data\n\n    const isVideoLoop = _isVideoLoop ?? true\n    const size = _size ?? 'base'\n    const theme = _theme ?? 'light'\n    const titleTag = _titleTag ?? 'h1'\n\n    // Hooks must be called unconditionally before any early return (React rules)\n    const { locale = 'us' } = useAiuiContext()\n\n    const defaultJumpOptions: JumpOptions = { duration: 500, offset: 0 }\n    const mergedJumpOptions = { ...defaultJumpOptions, ...jumpOptions }\n\n    const bannerId = React.useId()\n    const titleId = title ? `${bannerId}-title` : undefined\n    const subtitleId = data.subtitle ? `${bannerId}-subtitle` : undefined\n    const superTitleId = data.superTitle ? `${bannerId}-super-title` : undefined\n    const describedBy = [superTitleId, subtitleId].filter(Boolean).join(' ') || undefined\n\n    // Task 15: Carousel mode early return AFTER all hooks (DECISION-002 / DECISION-A008)\n    if (data.mode === 'carousel' && data.items && data.items.length > 0) {\n      return (\n        <SecondaryBannerCarouselImpl\n          data={data}\n          className={className}\n          classNames={classNames}\n          jumpOptions={jumpOptions}\n          theme={data.theme ?? data.items?.[0]?.theme}\n          ref={ref}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <section\n        ref={ref}\n        role=\"banner\"\n        aria-labelledby={titleId}\n        aria-describedby={describedBy}\n        className={cn(\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          secondaryBannerVariants({ size: size }),\n          className,\n          classNames?.root\n        )}\n        {...props}\n      >\n        <div className={cn('absolute inset-0', { 'h-fit': size === 'xlg' })}>\n          <Media\n            pcImage={pcImage}\n            padImage={padImage}\n            mobileImage={mobileImage}\n            className=\"size-full\"\n            imgClassName=\"object-cover\"\n            videoClassName=\"object-cover\"\n            muted={true}\n            loop={isVideoLoop}\n            playsInline={true}\n            autoPlay={isActive ?? true}\n          />\n        </div>\n        <div\n          className={cn(\n            'banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left',\n            classNames?.content\n          )}\n        >\n          <div className=\"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1\">\n            {data.superTitle && (\n              <Text\n                as=\"p\"\n                size={2}\n                id={superTitleId}\n                className={cn('banner-super-title desktop:text-[16px] lg-desktop:text-[18px]', classNames?.superTitle)}\n                html={data.superTitle}\n              />\n            )}\n\n            {data.title && (\n              <Heading\n                as={titleTag}\n                size={['xlg', 'lg'].includes(size) ? 5 : 4}\n                id={titleId}\n                className={cn('banner-title ', classNames?.title)}\n                html={data.title}\n              />\n            )}\n\n            {data.subtitle && (\n              <Text\n                as=\"p\"\n                size={3}\n                id={subtitleId}\n                className={cn('banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]', classNames?.subtitle)}\n                html={data.subtitle}\n              />\n            )}\n          </div>\n\n          {endDate && (\n            <div className=\"banner-countdown\">\n              <Countdown\n                endDate={endDate}\n                endDate_tz={endDate_tz}\n                dateFormat={dateFormat}\n                variant=\"spacious\"\n                className=\"lg-desktop:mt-8 mt-6\"\n              />\n            </div>\n          )}\n\n          <div\n            className={cn(\n              'banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2',\n              classNames?.buttonGroup\n            )}\n          >\n            {secondaryButton?.text && (\n              <Button\n                variant=\"secondary\"\n                data-track={props.id ? `${props.id}_secondary_button_click` : 'SecondaryBanner_secondary_button_click'}\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  if (secondaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(secondaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  secondaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.secondaryButton)}\n                aria-describedby={titleId}\n                {...(secondaryButton.link && !secondaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(secondaryButton.link, locale) }\n                  : {})}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton?.text && (\n              <Button\n                data-track={props.id ? `${props.id}_primary_button_click` : 'SecondaryBanner_primary_button_click'}\n                onClick={e => {\n                  if (primaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(primaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  primaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.primaryButton)}\n                aria-describedby={titleId}\n                {...(primaryButton.link && !primaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(primaryButton.link, locale) }\n                  : {})}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n\n          {Array.isArray(icons) && icons.length > 0 && (\n            <div\n              className=\"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2\"\n              role=\"group\"\n              aria-label=\"brand icons\"\n            >\n              {icons.map((icon, index) =>\n                icon.pcImage ? (\n                  <Picture\n                    key={index}\n                    source={icon.pcImage.url}\n                    alt={icon.pcImage.alt || `icon ${index + 1}`}\n                    role=\"img\"\n                    className=\"laptop:h-auto h-[48px] max-w-none\"\n                    imgClassName=\"h-full\"\n                  />\n                ) : null\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    )\n  }\n)\n\nSecondaryBanner.displayName = 'SecondaryBanner'\nexport default withLayout(SecondaryBanner)\n"],
-  "mappings": "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",
-  "names": ["SecondaryBanner_exports", "__export", "SecondaryBanner_default", "secondaryBannerVariants", "__toCommonJS", "import_jsx_runtime", "React", "import_class_variance_authority", "import_jump", "import_helpers", "import_components", "import_Styles", "import_Media", "import_AiuiProvider", "import_SecondaryBannerCarousel", "SecondaryBanner", "className", "classNames", "data", "jumpOptions", "isActive", "props", "ref", "pcImage", "padImage", "mobileImage", "_isVideoLoop", "endDate", "endDate_tz", "dateFormat", "_size", "icons", "_theme", "primaryButton", "secondaryButton", "title", "_titleTag", "isVideoLoop", "size", "theme", "titleTag", "locale", "mergedJumpOptions", "bannerId", "titleId", "subtitleId", "superTitleId", "describedBy", "SecondaryBannerCarouselImpl", "Media", "e", "element", "jump", "icon", "index"]
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cva } from 'class-variance-authority'\nimport jump from 'jump.js'\nimport { cn, getLocalizedPath } from '../../helpers/index.js'\nimport type { Media as MediaType, Theme } from '../../types/props.js'\nimport { Text, Button, Heading, Picture, Countdown } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Media from '../Media/index.js'\nimport type { ButtonProps } from '../../components/button.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\n// Task 15: static import (no require()) for carousel delegation (DECISION-002)\nimport SecondaryBannerCarouselImpl from './SecondaryBannerCarousel.js'\n\nexport type SecondaryBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'superTitle'\n  | 'subtitle'\n  | 'content'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\n\n/**\n * Carousel navigation configuration for SecondaryBanner. v1: arrows only.\n * autoplay, dots, and progress are intentionally EXCLUDED from v1.\n */\nexport interface SecondaryBannerCarouselConfig {\n  /**\n   * Show prev/next arrow navigation controls.\n   * Only used when data.items has 2+ slides.\n   * @default true\n   */\n  showArrows?: boolean\n  showDots?: boolean\n  loop?: boolean\n  autoplaySeconds?: number\n}\n\n/**\n * Per-slide data for SecondaryBanner carousel mode.\n * All fields optional (mirrors SecondaryBannerData permissiveness).\n */\nexport interface SecondaryBannerSlideData {\n  title?: string\n  titleTag?: 'h1' | 'h2'\n  superTitle?: string\n  subtitle?: string\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  isVideoLoop?: boolean\n  endDate?: string\n  endDate_tz?: string\n  dateFormat?: string\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n}\n/**\n * jump.js \u914D\u7F6E\u9009\u9879\n */\nexport interface JumpOptions {\n  /** \u52A8\u753B\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09 @default 500 */\n  duration?: number\n  /** \u504F\u79FB\u91CF\uFF08\u50CF\u7D20\uFF09 @default 0 */\n  offset?: number\n  /** \u52A8\u753B\u5B8C\u6210\u56DE\u8C03 */\n  callback?: () => void\n  /** \u7F13\u52A8\u51FD\u6570 */\n  easing?: (t: number, b: number, c: number, d: number) => number\n  /** \u662F\u5426\u8003\u8651 a11y @default false */\n  a11y?: boolean\n}\n\nconst secondaryBannerVariants = cva(\n  // \u57FA\u7840\u6837\u5F0F\n  'text-info-primary relative w-full',\n  {\n    variants: {\n      size: {\n        sm: 'tablet:aspect-[768/480] laptop:aspect-[1024/400] desktop:aspect-[1440/384] lg-desktop:aspect-[1920/480] aspect-[390/480]',\n        base: 'tablet:aspect-[768/660] laptop:aspect-[1024/432] desktop:aspect-[1440/576] lg-desktop:aspect-[1920/720] aspect-[390/660]',\n        lg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660]',\n        xlg: 'tablet:aspect-[768/660] laptop:aspect-[1024/520] desktop:aspect-[1440/700] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible',\n      },\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\n/**\n * SecondaryBanner \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface SecondaryBannerData {\n  /** \u4E3B\u6807\u9898*/\n  title?: string\n  /**\n   * \u4E3B\u6807\u9898\u6807\u7B7E\n   * @default 'h1'\n   */\n  titleTag?: 'h1' | 'h2'\n  /**\n   * \u4E0A\u6807\u9898/\u5F15\u5BFC\u6807\u9898\n   * \u901A\u5E38\u7528\u4E8E\u5206\u7C7B\u3001\u5F15\u5BFC\u6027\u6587\u5B57\n   */\n  superTitle?: string\n  /**\n   * \u526F\u6807\u9898/\u63CF\u8FF0\u6587\u5B57\n   * \u901A\u5E38\u7528\u4E8E\u8865\u5145\u8BF4\u660E\u3001\u8BE6\u7EC6\u63CF\u8FF0\n   */\n  subtitle?: string\n  /**\n   * \u5C3A\u5BF8:\n   *  sm: \u5C0F\u5C3A\u5BF8\u7528\u4E8E\u7B5B\u9009\u9875\u9762\n   *  base: \u57FA\u7840\u5C3A\u5BF8\u7528\u4E8E\n   *  lg: \u5927\u5C3A\u5BF8\u7528\u4E8E\u4E13\u9898\u9875\n   *  xlg: \u6D3B\u52A8\u9875\uFF08\u901A\u680F\uFF09\n   */\n  size?: 'sm' | 'base' | 'lg' | 'xlg'\n  pcImage?: MediaType\n  padImage?: MediaType\n  mobileImage?: MediaType\n  /** \u89C6\u9891\u662F\u5426\u5FAA\u73AF\u64AD\u653E */\n  isVideoLoop?: boolean\n  /** \u7ED3\u675F\u65F6\u95F4\uFF08ISO \u5B57\u7B26\u4E32\uFF09 */\n  endDate?: string\n  /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF08\u5982: America/Los_Angeles\uFF09 */\n  endDate_tz?: string\n  /**\n   * \u65F6\u95F4\u683C\u5F0F\u5316\u914D\u7F6E\uFF08JSON \u5B57\u7B26\u4E32\uFF09\n   * {\"day\":\"\u65E5\",\"hour\":\"\u65F6\",\"minute\":\"\u5206\",\"second\":\"\u79D2\"}\n   */\n  dateFormat?: string\n\n  /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n  primaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n  /** \u6B21\u7EA7\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: {\n    text: string\n    link?: string\n    onClick?: () => void\n  } & Omit<ButtonProps, 'children'>\n\n  iconArray?: Array<{ pcImage: MediaType }>\n  theme?: Theme\n  /**\n   * Carousel slide items. When present and non-empty, activates carousel mode.\n   * Single-banner mode is used when absent or empty (DECISION-002).\n   */\n  items?: SecondaryBannerSlideData[]\n  /**\n   * Carousel navigation configuration.\n   * Only meaningful when data.items is present and has 2+ items.\n   */\n  carousel?: SecondaryBannerCarouselConfig\n}\n\nexport interface SecondaryBannerProps extends React.HTMLAttributes<HTMLElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\n  /**\n   * \u951A\u70B9\u8DF3\u8F6C\u914D\u7F6E\uFF08\u7528\u4E8E # \u5F00\u5934\u7684\u94FE\u63A5\uFF09\n   * @default { duration: 500, offset: 0 }\n   */\n  jumpOptions?: JumpOptions\n  /**\n   * Whether this banner is the active slide in a carousel.\n   * Controls video autoPlay: autoPlay={isActive ?? true}.\n   * When absent (legacy single-banner), defaults to true (DECISION-008).\n   * @default true\n   */\n  isActive?: boolean\n}\n\n/**\n * SecondaryBanner - \u6B21\u7EA7\u6A2A\u5E45banner\n *\n * @description \u662F\u6307\u7528\u6237\u8FDB\u5165\u4E8C\u7EA7\u9875\u9762\u540E\uFF0C\u65E0\u9700\u6EDA\u52A8\u9875\u9762\u5C31\u80FD\u5728\u7B2C\u4E00\u5C4F\uFF08\u5373\"\u9996\u5C4F\"\uFF09\u770B\u5230\u7684\u3001\u901A\u5E38\u6A2A\u8DE8\u6574\u4E2A\u6D4F\u89C8\u5668\u7A97\u53E3\u5BBD\u5EA6\u7684\u6838\u5FC3\u89C6\u89C9\u533A\u57DF\u3002\n */\nconst SecondaryBanner = React.forwardRef<HTMLElement, SecondaryBannerProps>(\n  ({ className, classNames = {}, data, jumpOptions = {}, isActive, ...props }, ref) => {\n    const {\n      pcImage,\n      padImage,\n      mobileImage,\n      isVideoLoop = true,\n      endDate,\n      endDate_tz,\n      dateFormat,\n      size = 'base',\n      iconArray: icons,\n      theme = 'light',\n      primaryButton,\n      secondaryButton,\n      title,\n      titleTag = 'h1',\n    } = data\n\n    // Hooks must be called unconditionally before any early return (React rules)\n    const { locale = 'us' } = useAiuiContext()\n\n    const defaultJumpOptions: JumpOptions = { duration: 500, offset: 0 }\n    const mergedJumpOptions = { ...defaultJumpOptions, ...jumpOptions }\n\n    const bannerId = React.useId()\n    const titleId = title ? `${bannerId}-title` : undefined\n    const subtitleId = data.subtitle ? `${bannerId}-subtitle` : undefined\n    const superTitleId = data.superTitle ? `${bannerId}-super-title` : undefined\n    const describedBy = [superTitleId, subtitleId].filter(Boolean).join(' ') || undefined\n\n    // Task 15: Carousel mode early return AFTER all hooks (DECISION-002 / DECISION-A008)\n    if (data.items && data.items.length > 0) {\n      return (\n        <SecondaryBannerCarouselImpl\n          data={data}\n          className={className}\n          classNames={classNames}\n          jumpOptions={jumpOptions}\n          ref={ref}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <section\n        ref={ref}\n        role=\"banner\"\n        aria-labelledby={titleId}\n        aria-describedby={describedBy}\n        className={cn(\n          {\n            'aiui-dark': theme === 'dark',\n          },\n          secondaryBannerVariants({ size: size }),\n          className,\n          classNames?.root\n        )}\n        {...props}\n      >\n        <Media\n          pcImage={pcImage}\n          padImage={padImage}\n          mobileImage={mobileImage}\n          className={cn('absolute inset-0 size-full object-cover', {\n            'h-fit': size === 'xlg',\n          })}\n          imgClassName=\"object-cover\"\n          videoClassName=\"object-cover\"\n          muted={true}\n          loop={isVideoLoop}\n          playsInline={true}\n          autoPlay={isActive ?? true}\n        />\n        <div\n          className={cn(\n            'banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center  px-[16px] text-left',\n            classNames?.content\n          )}\n        >\n          <div className=\"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1\">\n            {data.superTitle && (\n              <Text\n                as=\"p\"\n                size={2}\n                id={superTitleId}\n                className={cn('banner-super-title desktop:text-[16px] lg-desktop:text-[18px]', classNames?.superTitle)}\n                html={data.superTitle}\n              />\n            )}\n\n            {data.title && (\n              <Heading\n                as={titleTag}\n                size={['xlg', 'lg'].includes(size) ? 5 : 4}\n                id={titleId}\n                className={cn('banner-title ', classNames?.title)}\n                html={data.title}\n              />\n            )}\n\n            {data.subtitle && (\n              <Text\n                as=\"p\"\n                size={3}\n                id={subtitleId}\n                className={cn('banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]', classNames?.subtitle)}\n                html={data.subtitle}\n              />\n            )}\n          </div>\n\n          {endDate && (\n            <div className=\"banner-countdown\">\n              <Countdown\n                endDate={endDate}\n                endDate_tz={endDate_tz}\n                dateFormat={dateFormat}\n                variant=\"spacious\"\n                className=\"lg-desktop:mt-8 mt-6\"\n              />\n            </div>\n          )}\n\n          <div\n            className={cn(\n              'banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2',\n              classNames?.buttonGroup\n            )}\n          >\n            {secondaryButton?.text && (\n              <Button\n                variant=\"secondary\"\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  if (secondaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(secondaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  secondaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.secondaryButton)}\n                aria-describedby={titleId}\n                {...(secondaryButton.link && !secondaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(secondaryButton.link, locale) }\n                  : {})}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton?.text && (\n              <Button\n                onClick={e => {\n                  if (primaryButton.link?.startsWith('#')) {\n                    e.preventDefault()\n                    const element = document.querySelector(primaryButton.link)\n                    if (element) {\n                      jump(element as HTMLElement, mergedJumpOptions)\n                    }\n                  }\n                  primaryButton.onClick?.()\n                }}\n                className={cn('', classNames?.primaryButton)}\n                aria-describedby={titleId}\n                {...(primaryButton.link && !primaryButton.link.startsWith('#')\n                  ? { as: 'a', href: getLocalizedPath(primaryButton.link, locale) }\n                  : {})}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n\n          {Array.isArray(icons) && icons.length > 0 && (\n            <div\n              className=\"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2\"\n              role=\"group\"\n              aria-label=\"brand icons\"\n            >\n              {icons.map((icon, index) =>\n                icon.pcImage ? (\n                  <Picture\n                    key={index}\n                    source={icon.pcImage.url}\n                    alt={icon.pcImage.alt || `icon ${index + 1}`}\n                    role=\"img\"\n                    className=\"laptop:h-auto h-[48px] max-w-none\"\n                    imgClassName=\"h-full\"\n                  />\n                ) : null\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    )\n  }\n)\n\nSecondaryBanner.displayName = 'SecondaryBanner'\nexport default withLayout(SecondaryBanner)\n"],
+  "mappings": "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",
+  "names": ["SecondaryBanner_exports", "__export", "SecondaryBanner_default", "__toCommonJS", "import_jsx_runtime", "React", "import_class_variance_authority", "import_jump", "import_helpers", "import_components", "import_Styles", "import_Media", "import_AiuiProvider", "import_SecondaryBannerCarousel", "secondaryBannerVariants", "SecondaryBanner", "className", "classNames", "data", "jumpOptions", "isActive", "props", "ref", "pcImage", "padImage", "mobileImage", "isVideoLoop", "endDate", "endDate_tz", "dateFormat", "size", "icons", "theme", "primaryButton", "secondaryButton", "title", "titleTag", "locale", "mergedJumpOptions", "bannerId", "titleId", "subtitleId", "superTitleId", "describedBy", "SecondaryBannerCarouselImpl", "Media", "e", "element", "jump", "icon", "index"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";var ge=Object.create;var ee=Object.defineProperty;var ve=Object.getOwnPropertyDescriptor;var be=Object.getOwnPropertyNames;var ke=Object.getPrototypeOf,_e=Object.prototype.hasOwnProperty;var we=(e,t)=>{for(var p in t)ee(e,p,{get:t[p],enumerable:!0})},ye=(e,t,p,h)=>{if(t&&typeof t=="object"||typeof t=="function")for(let x of be(t))!_e.call(e,x)&&x!==p&&ee(e,x,{get:()=>t[x],enumerable:!(h=ve(t,x))||h.enumerable});return e};var ce=(e,t,p)=>(p=e!=null?ge(ke(e)):{},ye(t||!e||!e.__esModule?ee(p,"default",{value:e,enumerable:!0}):p,e)),Ne=e=>ye(ee({},"__esModule",{value:!0}),e);var Te={};we(Te,{ShelfDisplayHorizontalItem:()=>$e,ShelfDisplayWrapItem:()=>Se,getProductImage:()=>he});module.exports=Ne(Te);var s=require("react/jsx-runtime"),pe=require("../AiuiProvider/index.js"),me=require("./shelfDisplay.js"),se=ce(require("../../components/picture.js")),oe=ce(require("../../components/badge.js")),y=require("../../helpers/utils.js"),de=require("../../components/text.js"),V=ce(require("../../components/button.js")),ue=require("../../shared/track.js"),T=require("../../shared/trackUrlRef.js"),fe=require("../../components/heading.js"),xe=require("../../hooks/useExposure.js"),f=require("react");const w="image",N="product_shelf",te=999999999e-2,he=e=>{const t=e?.sku,p=e?.variants,h=p?.find(B=>B?.sku===t),x=h?.image?.url||p?.[0]?.image?.url||"",M=h?.image?.altText||p?.[0]?.image?.altText||e?.custom_name||e?.title||"";return{imageUrl:x,altText:M}},Se=({data:e,configuration:t})=>{const{isDisplayBackImage:p=!1,itemShape:h,metafields:x,isTopTag:M=!1,isShowTag:B,isShowOriginalPrice:q,isShowShortTitle:S=!1}=t||{},{locale:$="es",copyWriting:re,currencyDisplay:F,trackingData:C}=(0,pe.useAiuiContext)(),{discounts:G,discountsCopy:j}=x||{},J=(0,f.useRef)(null),[K,m]=(0,f.useState)([]),[W,ie]=(0,f.useState)(""),Q=(o,r,i,l)=>{const{primaryFun:c,onAddCart:u,onBuyNow:v,onLearnMore:R,event:ae}=t||{};if(c){if(c==="AddCart"&&u)return u(o,r+1,i,l);if(c==="BuyNow"&&v)return v(o,r+1,i,l);if(c==="LearnMore"&&R)return R(o,r+1,i,l)}ae?.primaryButton?.(o,r+1,i,l)},ne=(o,r,i,l)=>{const{secondaryFun:c,onAddCart:u,onBuyNow:v,onLearnMore:R,event:ae}=t||{};if(c){if(c==="AddCart"&&u)return u(o,r+1,i,l);if(c==="BuyNow"&&v)return v(o,r+1,i,l);if(c==="LearnMore"&&R)return R(o,r+1,i,l)}ae?.secondaryButton?.(o,r+1,i,l)},d=(0,f.useMemo)(()=>{const o=e?.variants||[];if(o.length)return e?.sku?o?.find?.(r=>r?.sku===e?.sku)||o[0]:o?.[0]},[e?.sku,e?.variants]),g=d?.id?.split?.("/")||[],O=g?.[g?.length-1],D=!d?.availableForSale||d?.price?.amount===te||d?.price===te,b=d?.coupons?.[0],U=!!(q&&b),X=e?.price?.currencyCode||"USD",I=(0,f.useMemo)(()=>(0,me.formatVariantPrice)({locale:$,amount:U?b?.variant_price4wscode:d?.price,baseAmount:U?d?.price:0,currencyCode:X,currencyDisplay:F}),[X,$,U,b?.variant_price4wscode,d]),{price:z,basePrice:le,discount:P,discountAmount:k}=I,{imageUrl:L,altText:A}=he(e),_=e?.custom_name||e?.title,E=S&&d?.metafields?.infos?.page_short_title||_,Y=e?.custom_description||e?.description,H=()=>{if(b?.value_type==="fixed_amount"){const o=k||"",r=o.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(r){const[,i,l,c]=r;let u=l;return l.endsWith(".00")?u=l.replace(/\.00$/,""):l.endsWith(",00")&&(u=l.replace(/,00$/,"")),`${i}${u}${c}`}return o}return P||""};(0,f.useEffect)(()=>{let o=[];if(P||k){const i=`${H()} ${G?.off||j?.off||""}`;ie(i),o.push(i)}const r=e?.tags?.filter?.(i=>i?.startsWith?.("CLtag"))?.map?.(i=>i?.replace?.("CLtag:",""))?.slice?.(0,P?1:2);m(o.concat(r))},[e?.tags,P,k,G?.off,j?.off]),(0,xe.useExposure)(J,{componentType:w,componentName:N,componentTitle:_,componentDescription:Y,position:t?.index+1});const Z=()=>(0,s.jsxs)(s.Fragment,{children:[B&&K?.length>0?(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:K?.map?.((o,r)=>(0,s.jsx)(oe.default,{className:"shelf-items-tag",children:o},r))}):null,E?(0,s.jsx)(fe.Heading,{as:"h3",title:E||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary line-clamp-2 h-12",html:E||""}):null,(0,s.jsx)(de.Text,{size:2,className:"lg-desktop:text-lg desktop:h-[24px] lg-desktop:h-[28px] desktop:text-base shelf-display-product-description text-info-primary line-clamp-1 h-[20px] text-sm",html:Y||""}),(0,s.jsx)("div",{className:"mb-2 mt-4 flex items-center",children:D?(0,s.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:re?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:d?.availableForSale&&z||""}),(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:d?.availableForSale&&le||""})]})}),(0,s.jsxs)("div",{className:(0,y.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)(V.default,{disabled:D&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link?(0,T.trackUrlRef)(e?.custom_secondary_link,`${C?.contextHandle||""}_${w}_${N}`):void 0,as:e?.custom_secondary_link?"a":"button",onClick:()=>!e?.custom_secondary_link&&ne(e,t?.index,t,b),className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(V.default,{disabled:D&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link?(0,T.trackUrlRef)(e?.custom_primary_link,`${C?.contextHandle||""}_${w}_${N}`):void 0,as:e?.custom_primary_link?"a":"button",onClick:()=>!e?.custom_primary_link&&Q(e,t?.index,t,b),className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]}),n=e?.custom_bg_image,a=e?.custom_theme;return(0,s.jsx)("div",{ref:J,className:(0,y.cn)("box-border w-full cursor-pointer overflow-hidden duration-300",h==="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",n?"bg-cover bg-center bg-no-repeat":"bg-background tablet:hover:bg-info-white",{"aiui-dark":a==="dark"}),style:n?{backgroundImage:`url(${n})`}:void 0,children:p?(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)(se.default,{source:L,alt:A,className:(0,y.cn)("flex h-full justify-center object-cover [&_img]:w-auto",{"opacity-0":n})}),(0,s.jsx)("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:Z()})]})}):(0,s.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4",children:[W&&M&&(0,s.jsx)(oe.default,{className:"shelf-prices-tag absolute left-4 top-4 z-10",children:W||""}),(0,s.jsx)("div",{className:(0,y.cn)("lg-desktop:h-[195px] shelf-display-item-image relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden",{"opacity-0":n}),children:(0,s.jsx)("a",{"aria-label":_,target:t?.target,href:(0,T.trackUrlRef)(`${$==="us"||!$?"":`/${$}`}/products/${e?.handle}?variant=${O}`,`${C?.contextHandle||""}_${w}_${N}`),onClick:()=>{(0,ue.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||d?.sku,item_name:e?.name,item_variant:d?.name,price:d?.price,index:t?.index+1}]}})},children:(0,s.jsx)(se.default,{source:L,alt:A,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),Z()]})},e?.id||e?.handle)},$e=({data:e,configuration:t})=>{const{itemShape:p,itemLength:h,metafields:x,isShowShortTitle:M}=t||{},{discounts:B,discountsCopy:q}=x||{},{locale:S="us",copyWriting:$,currencyDisplay:re,trackingData:F}=(0,pe.useAiuiContext)(),[C,G]=(0,f.useState)([]),j=(0,f.useRef)(null),J=(n,a,o,r)=>{const{primaryFun:i,onAddCart:l,onBuyNow:c,onLearnMore:u,event:v}=t||{};if(i){if(i==="AddCart"&&l)return l(n,a+1,o,r);if(i==="BuyNow"&&c)return c(n,a+1,o,r);if(i==="LearnMore"&&u)return u(n,a+1,o,r)}v?.primaryButton?.(n,a+1,o,r)},K=(n,a,o,r)=>{const{secondaryFun:i,onAddCart:l,onBuyNow:c,onLearnMore:u,event:v}=t||{};if(i){if(i==="AddCart"&&l)return l(n,a+1,o,r);if(i==="BuyNow"&&c)return c(n,a+1,o,r);if(i==="LearnMore"&&u)return u(n,a+1,o,r)}v?.secondaryButton?.(n,a+1,o,r)},m=(0,f.useMemo)(()=>{const n=e?.variants||[];if(n.length)return e?.sku&&n.find(a=>a?.sku===e?.sku)||n[0]},[e?.sku,e?.variants]),W=m?.id?.split?.("/")||[],ie=W?.[W?.length-1],Q=!m?.availableForSale||m?.price?.amount===te||m?.price===te,ne=t?.isShowTag,d=t?.isShowOriginalPrice,g=m?.coupons?.[0],O=!!(d&&g),D=e?.price?.currencyCode||"USD",b=(0,f.useMemo)(()=>(0,me.formatVariantPrice)({locale:S,amount:O?g?.variant_price4wscode:m?.price,baseAmount:O?m?.price:0,currencyCode:D,currencyDisplay:re}),[D,S,O,g?.variant_price4wscode,m]),{price:U,basePrice:X,discount:I,discountAmount:z}=b,{imageUrl:le,altText:P}=he(e),k=e?.custom_name||e?.title,L=M&&m?.metafields?.infos?.page_short_title||k,A=e?.custom_description||e?.description;(0,xe.useExposure)(j,{componentType:w,componentName:N,componentTitle:k,componentDescription:A,position:t?.index+1});const _=()=>h>=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"},E=()=>h>=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",Y=()=>{if(g?.value_type==="fixed_amount"){const n=z||"",a=n.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(a){const[,o,r,i]=a;let l=r;return r.endsWith(".00")?l=r.replace(/\.00$/,""):r.endsWith(",00")&&(l=r.replace(/,00$/,"")),`${o}${l}${i}`}return n}return I||""};(0,f.useEffect)(()=>{let n=[];if(I||z){const o=`${Y()} ${B?.off||q?.off||""}`;n.push(o)}const a=e?.tags?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,I?1:2);G(n.concat(a))},[e?.tags,I,z,B?.off,q?.off]);const H=e?.custom_bg_image,Z=e?.custom_theme;return(0,s.jsx)("div",{ref:j,className:(0,y.cn)(_().wrap,p==="round"?"rounded-2xl":"rounded-none","shelf-display-item","duration-300","md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden",H?"bg-cover bg-center bg-no-repeat":"bg-container-secondary-1 tablet:hover:bg-info-white",{"aiui-dark":Z==="dark"}),style:H?{backgroundImage:`url(${H})`}:void 0,children:(0,s.jsxs)("div",{className:(0,y.cn)(E(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[(0,s.jsx)("div",{className:(0,y.cn)(_().imgItem,"desktop:mb-0 relative mb-1 overflow-hidden",{"opacity-0":H}),children:(0,s.jsx)("a",{"aria-label":k,target:t?.target,href:(0,T.trackUrlRef)(`${S==="us"||!S?"":`/${S}`}/products/${e?.handle}?variant=${ie}`,`${F?.contextHandle||""}_${w}_${N}`),onClick:()=>{(0,ue.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||m?.sku,item_name:e?.name,item_variant:m?.name,price:m?.price,index:t?.index+1}]}})},children:(0,s.jsx)(se.default,{source:le,alt:P,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),(0,s.jsxs)("div",{className:(0,y.cn)("flex flex-col items-start justify-center",_().boxItem),children:[ne&&(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:C?.length>0&&C?.map?.((n,a)=>(0,s.jsx)(oe.default,{className:"shelf-items-tag",children:n},a))}),L?(0,s.jsx)(fe.Heading,{as:"h3",title:L||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]",html:L||""}):null,A?(0,s.jsx)(de.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm",html:A||""}):null,(0,s.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:Q?(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-xl text-info-primary text-xl font-bold",children:m?.availableForSale&&U||""}),(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:m?.availableForSale&&X||""})]})}),(0,s.jsxs)("div",{className:(0,y.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)(V.default,{variant:"secondary",href:e?.custom_secondary_link?(0,T.trackUrlRef)(e?.custom_secondary_link,`${F?.contextHandle||""}_${w}_${N}`):void 0,as:e?.custom_secondary_link?"a":"button",onClick:()=>!e?.custom_secondary_link&&K(e,t?.index,t,g),className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(V.default,{disabled:Q,variant:"primary",href:e?.custom_primary_link?(0,T.trackUrlRef)(e?.custom_primary_link,`${F?.contextHandle||""}_${w}_${N}`):void 0,as:e?.custom_primary_link?"a":"button",onClick:()=>!e?.custom_primary_link&&J(e,t?.index,t,g),className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};
+"use strict";var ye=Object.create;var Q=Object.defineProperty;var ge=Object.getOwnPropertyDescriptor;var ve=Object.getOwnPropertyNames;var be=Object.getPrototypeOf,ke=Object.prototype.hasOwnProperty;var we=(e,t)=>{for(var p in t)Q(e,p,{get:t[p],enumerable:!0})},xe=(e,t,p,x)=>{if(t&&typeof t=="object"||typeof t=="function")for(let h of ve(t))!ke.call(e,h)&&h!==p&&Q(e,h,{get:()=>t[h],enumerable:!(x=ge(t,h))||x.enumerable});return e};var ne=(e,t,p)=>(p=e!=null?ye(be(e)):{},xe(t||!e||!e.__esModule?Q(p,"default",{value:e,enumerable:!0}):p,e)),_e=e=>xe(Q({},"__esModule",{value:!0}),e);var Te={};we(Te,{ShelfDisplayHorizontalItem:()=>Se,ShelfDisplayWrapItem:()=>Ne,getProductImage:()=>he});module.exports=_e(Te);var s=require("react/jsx-runtime"),ae=require("../AiuiProvider/index.js"),ce=require("./shelfDisplay.js"),ee=ne(require("../../components/picture.js")),te=ne(require("../../components/badge.js")),y=require("../../helpers/utils.js"),pe=require("../../components/text.js"),U=ne(require("../../components/button.js")),me=require("../../shared/track.js"),de=require("../../shared/trackUrlRef.js"),ue=require("../../components/heading.js"),fe=require("../../hooks/useExposure.js"),f=require("react");const X="image",Y="product_shelf",Z=999999999e-2,he=e=>{const t=e?.sku,p=e?.variants,x=p?.find(S=>S?.sku===t),h=x?.image?.url||p?.[0]?.image?.url||"",P=x?.image?.altText||p?.[0]?.image?.altText||e?.custom_name||e?.title||"";return{imageUrl:h,altText:P}},Ne=({data:e,configuration:t})=>{const{isDisplayBackImage:p=!1,itemShape:x,metafields:h,isTopTag:P=!1,isShowTag:S,isShowOriginalPrice:z,isShowShortTitle:_=!1}=t||{},{locale:N="es",copyWriting:se,currencyDisplay:H}=(0,ae.useAiuiContext)(),{discounts:E,discountsCopy:L}=h||{},R=(0,f.useRef)(null),[V,m]=(0,f.useState)([]),[A,oe]=(0,f.useState)(""),q=(o,r,i,n)=>{const{primaryFun:c,onAddCart:u,onBuyNow:v,onLearnMore:O,event:le}=t||{};if(c){if(c==="AddCart"&&u)return u(o,r+1,i,n);if(c==="BuyNow"&&v)return v(o,r+1,i,n);if(c==="LearnMore"&&O)return O(o,r+1,i,n)}le?.primaryButton?.(o,r+1,i,n)},re=(o,r,i,n)=>{const{secondaryFun:c,onAddCart:u,onBuyNow:v,onLearnMore:O,event:le}=t||{};if(c){if(c==="AddCart"&&u)return u(o,r+1,i,n);if(c==="BuyNow"&&v)return v(o,r+1,i,n);if(c==="LearnMore"&&O)return O(o,r+1,i,n)}le?.secondaryButton?.(o,r+1,i,n)},d=(0,f.useMemo)(()=>{const o=e?.variants||[];if(o.length)return e?.sku?o?.find?.(r=>r?.sku===e?.sku)||o[0]:o?.[0]},[e?.sku,e?.variants]),g=d?.id?.split?.("/")||[],M=g?.[g?.length-1],T=!d?.availableForSale||d?.price?.amount===Z||d?.price===Z,b=d?.coupons?.[0],F=!!(z&&b),G=e?.price?.currencyCode||"USD",B=(0,f.useMemo)(()=>(0,ce.formatVariantPrice)({locale:N,amount:F?b?.variant_price4wscode:d?.price,baseAmount:F?d?.price:0,currencyCode:G,currencyDisplay:H}),[G,N,F,b?.variant_price4wscode,d]),{price:j,basePrice:ie,discount:C,discountAmount:k}=B,{imageUrl:$,altText:D}=he(e),w=e?.custom_name||e?.title,W=_&&d?.metafields?.infos?.page_short_title||w,J=e?.custom_description||e?.description,I=()=>{if(b?.value_type==="fixed_amount"){const o=k||"",r=o.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(r){const[,i,n,c]=r;let u=n;return n.endsWith(".00")?u=n.replace(/\.00$/,""):n.endsWith(",00")&&(u=n.replace(/,00$/,"")),`${i}${u}${c}`}return o}return C||""};(0,f.useEffect)(()=>{let o=[];if(C||k){const i=`${I()} ${E?.off||L?.off||""}`;oe(i),o.push(i)}const r=e?.tags?.filter?.(i=>i?.startsWith?.("CLtag"))?.map?.(i=>i?.replace?.("CLtag:",""))?.slice?.(0,C?1:2);m(o.concat(r))},[e?.tags,C,k,E?.off,L?.off]),(0,fe.useExposure)(R,{componentType:X,componentName:Y,componentTitle:w,componentDescription:J,position:t?.index+1});const K=()=>(0,s.jsxs)(s.Fragment,{children:[S&&V?.length>0?(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:V?.map?.((o,r)=>(0,s.jsx)(te.default,{className:"shelf-items-tag",children:o},r))}):null,W?(0,s.jsx)(ue.Heading,{as:"h3",title:W||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary line-clamp-2 h-12",html:W||""}):null,(0,s.jsx)(pe.Text,{size:2,className:"lg-desktop:text-lg desktop:h-[24px] lg-desktop:h-[28px] desktop:text-base shelf-display-product-description text-info-primary line-clamp-1 h-[20px] text-sm",html:J||""}),(0,s.jsx)("div",{className:"mb-2 mt-4 flex items-center",children:T?(0,s.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:se?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:d?.availableForSale&&j||""}),(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:d?.availableForSale&&ie||""})]})}),(0,s.jsxs)("div",{className:(0,y.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)(U.default,{disabled:T&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:()=>!e?.custom_secondary_link&&re(e,t?.index,t,b),className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(U.default,{disabled:T&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:()=>!e?.custom_primary_link&&q(e,t?.index,t,b),className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]}),l=e?.custom_bg_image,a=e?.custom_theme;return(0,s.jsx)("div",{ref:R,className:(0,y.cn)("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",l?"bg-cover bg-center bg-no-repeat":"bg-background tablet:hover:bg-info-white",{"aiui-dark":a==="dark"}),style:l?{backgroundImage:`url(${l})`}:void 0,children:p?(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)(ee.default,{source:$,alt:D,className:(0,y.cn)("flex h-full justify-center object-cover [&_img]:w-auto",{"opacity-0":l})}),(0,s.jsx)("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:K()})]})}):(0,s.jsxs)("div",{className:"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4",children:[A&&P&&(0,s.jsx)(te.default,{className:"shelf-prices-tag absolute left-4 top-4 z-10",children:A||""}),(0,s.jsx)("div",{className:(0,y.cn)("lg-desktop:h-[195px] shelf-display-item-image relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden",{"opacity-0":l}),children:(0,s.jsx)("a",{"aria-label":w,target:t?.target,href:(0,de.trackUrlRef)(`${N==="us"||!N?"":`/${N}`}/products/${e?.handle}?variant=${M}`,`${X}_${Y}`),onClick:()=>{(0,me.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||d?.sku,item_name:e?.name,item_variant:d?.name,price:d?.price,index:t?.index+1}]}})},children:(0,s.jsx)(ee.default,{source:$,alt:D,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),K()]})},e?.id||e?.handle)},Se=({data:e,configuration:t})=>{const{itemShape:p,itemLength:x,metafields:h,isShowShortTitle:P}=t||{},{discounts:S,discountsCopy:z}=h||{},{locale:_="us",copyWriting:N,currencyDisplay:se}=(0,ae.useAiuiContext)(),[H,E]=(0,f.useState)([]),L=(0,f.useRef)(null),R=(l,a,o,r)=>{const{primaryFun:i,onAddCart:n,onBuyNow:c,onLearnMore:u,event:v}=t||{};if(i){if(i==="AddCart"&&n)return n(l,a+1,o,r);if(i==="BuyNow"&&c)return c(l,a+1,o,r);if(i==="LearnMore"&&u)return u(l,a+1,o,r)}v?.primaryButton?.(l,a+1,o,r)},V=(l,a,o,r)=>{const{secondaryFun:i,onAddCart:n,onBuyNow:c,onLearnMore:u,event:v}=t||{};if(i){if(i==="AddCart"&&n)return n(l,a+1,o,r);if(i==="BuyNow"&&c)return c(l,a+1,o,r);if(i==="LearnMore"&&u)return u(l,a+1,o,r)}v?.secondaryButton?.(l,a+1,o,r)},m=(0,f.useMemo)(()=>{const l=e?.variants||[];if(l.length)return e?.sku&&l.find(a=>a?.sku===e?.sku)||l[0]},[e?.sku,e?.variants]),A=m?.id?.split?.("/")||[],oe=A?.[A?.length-1],q=!m?.availableForSale||m?.price?.amount===Z||m?.price===Z,re=t?.isShowTag,d=t?.isShowOriginalPrice,g=m?.coupons?.[0],M=!!(d&&g),T=e?.price?.currencyCode||"USD",b=(0,f.useMemo)(()=>(0,ce.formatVariantPrice)({locale:_,amount:M?g?.variant_price4wscode:m?.price,baseAmount:M?m?.price:0,currencyCode:T,currencyDisplay:se}),[T,_,M,g?.variant_price4wscode,m]),{price:F,basePrice:G,discount:B,discountAmount:j}=b,{imageUrl:ie,altText:C}=he(e),k=e?.custom_name||e?.title,$=P&&m?.metafields?.infos?.page_short_title||k,D=e?.custom_description||e?.description;(0,fe.useExposure)(L,{componentType:X,componentName:Y,componentTitle:k,componentDescription:D,position:t?.index+1});const w=()=>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"},W=()=>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",J=()=>{if(g?.value_type==="fixed_amount"){const l=j||"",a=l.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(a){const[,o,r,i]=a;let n=r;return r.endsWith(".00")?n=r.replace(/\.00$/,""):r.endsWith(",00")&&(n=r.replace(/,00$/,"")),`${o}${n}${i}`}return l}return B||""};(0,f.useEffect)(()=>{let l=[];if(B||j){const o=`${J()} ${S?.off||z?.off||""}`;l.push(o)}const a=e?.tags?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,B?1:2);E(l.concat(a))},[e?.tags,B,j,S?.off,z?.off]);const I=e?.custom_bg_image,K=e?.custom_theme;return(0,s.jsx)("div",{ref:L,className:(0,y.cn)(w().wrap,p==="round"?"rounded-2xl":"rounded-none","shelf-display-item","duration-300","md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden",I?"bg-cover bg-center bg-no-repeat":"bg-container-secondary-1 tablet:hover:bg-info-white",{"aiui-dark":K==="dark"}),style:I?{backgroundImage:`url(${I})`}:void 0,children:(0,s.jsxs)("div",{className:(0,y.cn)(W(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[(0,s.jsx)("div",{className:(0,y.cn)(w().imgItem,"desktop:mb-0 relative mb-1 overflow-hidden",{"opacity-0":I}),children:(0,s.jsx)("a",{"aria-label":k,target:t?.target,href:(0,de.trackUrlRef)(`${_==="us"||!_?"":`/${_}`}/products/${e?.handle}?variant=${oe}`,`${X}_${Y}`),onClick:()=>{(0,me.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||m?.sku,item_name:e?.name,item_variant:m?.name,price:m?.price,index:t?.index+1}]}})},children:(0,s.jsx)(ee.default,{source:ie,alt:C,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),(0,s.jsxs)("div",{className:(0,y.cn)("flex flex-col items-start justify-center",w().boxItem),children:[re&&(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:H?.length>0&&H?.map?.((l,a)=>(0,s.jsx)(te.default,{className:"shelf-items-tag",children:l},a))}),$?(0,s.jsx)(ue.Heading,{as:"h3",title:$||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]",html:$||""}):null,D?(0,s.jsx)(pe.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm",html:D||""}):null,(0,s.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:q?(0,s.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:N?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:m?.availableForSale&&F||""}),(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",children:m?.availableForSale&&G||""})]})}),(0,s.jsxs)("div",{className:(0,y.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)(U.default,{variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:()=>!e?.custom_secondary_link&&V(e,t?.index,t,g),className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(U.default,{disabled:q,variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:()=>!e?.custom_primary_link&&R(e,t?.index,t,g),className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};
 //# sourceMappingURL=shelfDisplayItem.js.map

package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js.map 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, useMemo, useState } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\n// \u516C\u5171\u51FD\u6570\uFF1A\u83B7\u53D6\u4EA7\u54C1\u56FE\u7247URL\u548CaltText\nexport const getProductImage = (data: any) => {\n  const sku = data?.sku\n  const skuArray = data?.variants\n  const findSku = skuArray?.find((item: any) => item?.sku === sku)\n  const imageUrl = findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n  const altText = findSku?.image?.altText || skuArray?.[0]?.image?.altText || data?.custom_name || data?.title || ''\n\n  return {\n    imageUrl,\n    altText,\n  }\n}\n\nexport const ShelfDisplayWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const {\n    isDisplayBackImage = false,\n    itemShape,\n    metafields,\n    isTopTag = false,\n    isShowTag,\n    isShowOriginalPrice,\n    isShowShortTitle = false,\n  } = configuration || {}\n  const { locale = 'es', copyWriting, currencyDisplay, trackingData } = useAiuiContext()\n  const { discounts, discountsCopy } = metafields || {}\n  const ref = useRef<HTMLDivElement>(null)\n  const [showTags, setShowTags] = useState<string[]>([])\n  const [currentPriceTag, setCurrentPriceTag] = useState<string>('')\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n    if (primaryFun) {\n      if (primaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.primaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n    if (secondaryFun) {\n      if (secondaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.secondaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const variant = useMemo(() => {\n    const variants = data?.variants || []\n    if (!variants.length) {\n      return undefined\n    }\n    if (!data?.sku) {\n      return variants?.[0]\n    }\n    return variants?.find?.((item: any) => item?.sku === data?.sku) || variants[0]\n  }, [data?.sku, data?.variants])\n\n  const variantArr = variant?.id?.split?.('/') || []\n  const variantId = variantArr?.[variantArr?.length - 1]\n\n  const isSoldOut =\n    !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === SOLD_OUT_PRICE\n\n  // active \u7684 \u901A\u7528\u6298\u6263\n  const coupon = variant?.coupons?.[0]\n\n  const shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n  const currencyCode = data?.price?.currencyCode || 'USD'\n\n  const priceInfo = useMemo(\n    () =>\n      formatVariantPrice({\n        locale,\n        amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n        baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n        currencyCode,\n        currencyDisplay,\n      }),\n    [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant]\n  )\n\n  const { price, basePrice, discount, discountAmount } = priceInfo\n\n  const { imageUrl, altText } = getProductImage(data)\n\n  const displayTitle = data?.custom_name || data?.title\n  const currentDisplayTitle = isShowShortTitle\n    ? variant?.metafields?.infos?.page_short_title || displayTitle\n    : displayTitle\n  const displayDescription = data?.custom_description || data?.description\n\n  const showPrice = () => {\n    if (coupon?.value_type === 'fixed_amount') {\n      const amountStr = discountAmount || ''\n      const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n      if (match) {\n        const [, prefix, numeric, suffix] = match\n        let updatedNumeric = numeric\n        if (numeric.endsWith('.00')) {\n          updatedNumeric = numeric.replace(/\\.00$/, '')\n        } else if (numeric.endsWith(',00')) {\n          updatedNumeric = numeric.replace(/,00$/, '')\n        }\n        return `${prefix}${updatedNumeric}${suffix}`\n      }\n      return amountStr\n    }\n    return discount || ''\n  }\n\n  // \u5904\u7406\u6807\u7B7E\n  useEffect(() => {\n    let handleTags: string[] = []\n    if (discount || discountAmount) {\n      const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.off || ''}`\n      setCurrentPriceTag(discountTag)\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, discountAmount, discounts?.off, discountsCopy?.off])\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) => (\n              <Badge key={index} className=\"shelf-items-tag\">\n                {item}\n              </Badge>\n            ))}\n          </div>\n        ) : null}\n        {currentDisplayTitle ? (\n          <Heading\n            as=\"h3\"\n            title={currentDisplayTitle || ''}\n            size={2}\n            className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary line-clamp-2 h-12\"\n            html={currentDisplayTitle || ''}\n          />\n        ) : null}\n        <Text\n          size={2}\n          className=\"lg-desktop:text-lg desktop:h-[24px] lg-desktop:h-[28px] desktop:text-base shelf-display-product-description text-info-primary line-clamp-1 h-[20px] text-sm\"\n          html={displayDescription || ''}\n        />\n        <div className=\"mb-2 mt-4 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-xl 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              disabled={isSoldOut && configuration?.secondaryFun !== 'LearnMore'}\n              variant=\"secondary\"\n              href={\n                data?.custom_secondary_link\n                  ? trackUrlRef(\n                      data?.custom_secondary_link,\n                      `${trackingData?.contextHandle || ''}_${componentType}_${componentName}`\n                    )\n                  : undefined\n              }\n              as={data?.custom_secondary_link ? 'a' : 'button'}\n              onClick={() =>\n                !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n              }\n              className={configuration.direction === 'vertical' ? 'w-full' : ''}\n            >\n              {configuration?.secondaryButton || ''}\n            </Button>\n          ) : null}\n          {configuration?.primaryButton ? (\n            <Button\n              disabled={isSoldOut && configuration?.primaryFun !== 'LearnMore'}\n              variant=\"primary\"\n              href={\n                data?.custom_primary_link\n                  ? trackUrlRef(\n                      data?.custom_primary_link,\n                      `${trackingData?.contextHandle || ''}_${componentType}_${componentName}`\n                    )\n                  : undefined\n              }\n              as={data?.custom_primary_link ? 'a' : 'button'}\n              onClick={() =>\n                !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n              }\n              className={configuration.direction === 'vertical' ? 'w-full' : ''}\n            >\n              {configuration?.primaryButton || ''}\n            </Button>\n          ) : null}\n        </div>\n      </>\n    )\n  }\n\n  const custom_bg_image = data?.custom_bg_image\n  const custom_theme = data?.custom_theme\n\n  return (\n    <div\n      ref={ref}\n      key={data?.id || data?.handle}\n      className={cn(\n        '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        custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-background tablet:hover:bg-info-white',\n        { 'aiui-dark': custom_theme === 'dark' }\n      )}\n      style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n    >\n      {isDisplayBackImage ? (\n        <div className=\"absolute inset-0 box-border overflow-hidden\">\n          <div className=\"relative inset-0 size-full\">\n            <Picture\n              source={imageUrl}\n              alt={altText}\n              className={cn('flex h-full justify-center object-cover [&_img]:w-auto', {\n                'opacity-0': custom_bg_image,\n              })}\n            />\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          {currentPriceTag && isTopTag && (\n            <Badge className=\"shelf-prices-tag absolute left-4 top-4 z-10\">{currentPriceTag || ''}</Badge>\n          )}\n          <div\n            className={cn(\n              'lg-desktop:h-[195px] shelf-display-item-image relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden',\n              { 'opacity-0': custom_bg_image }\n            )}\n          >\n            <a\n              aria-label={displayTitle}\n              target={configuration?.target}\n              href={trackUrlRef(\n                `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\n                `${trackingData?.contextHandle || ''}_${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\n                source={imageUrl}\n                alt={altText}\n                className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n              />\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, isShowShortTitle } = configuration || {}\n  const { discounts, discountsCopy } = metafields || {}\n  const { locale = 'us', copyWriting, currencyDisplay, trackingData } = useAiuiContext()\n  const [showTags, setShowTags] = useState<string[]>([])\n  const ref = useRef<HTMLDivElement>(null)\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n    if (primaryFun) {\n      if (primaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.primaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n    if (secondaryFun) {\n      if (secondaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.secondaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const variant = useMemo(() => {\n    const variants = data?.variants || []\n    if (!variants.length) {\n      return undefined\n    }\n    if (!data?.sku) {\n      return variants[0]\n    }\n    return variants.find((item: any) => item?.sku === data?.sku) || variants[0]\n  }, [data?.sku, data?.variants])\n\n  const variantArr = variant?.id?.split?.('/') || []\n  const variantId = variantArr?.[variantArr?.length - 1]\n\n  const isSoldOut =\n    !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === 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 shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n  const currencyCode = data?.price?.currencyCode || 'USD'\n\n  const priceInfo = useMemo(\n    () =>\n      formatVariantPrice({\n        locale,\n        amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n        baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n        currencyCode,\n        currencyDisplay,\n      }),\n    [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant]\n  )\n\n  const { price, basePrice, discount, discountAmount } = priceInfo\n\n  const { imageUrl, altText } = getProductImage(data)\n\n  const displayTitle = data?.custom_name || data?.title\n  const currentDisplayTitle = isShowShortTitle\n    ? variant?.metafields?.infos?.page_short_title || displayTitle\n    : displayTitle\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  const showPrice = () => {\n    if (coupon?.value_type === 'fixed_amount') {\n      const amountStr = discountAmount || ''\n      const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n      if (match) {\n        const [, prefix, numeric, suffix] = match\n        let updatedNumeric = numeric\n        if (numeric.endsWith('.00')) {\n          updatedNumeric = numeric.replace(/\\.00$/, '')\n        } else if (numeric.endsWith(',00')) {\n          updatedNumeric = numeric.replace(/,00$/, '')\n        }\n        return `${prefix}${updatedNumeric}${suffix}`\n      }\n      return amountStr\n    }\n    return discount || ''\n  }\n\n  // \u5904\u7406\u6807\u7B7E\n  useEffect(() => {\n    let handleTags: string[] = []\n    if (discount || discountAmount) {\n      const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.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, discountAmount, discounts?.off, discountsCopy?.off])\n\n  const custom_bg_image = data?.custom_bg_image\n  const custom_theme = data?.custom_theme\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        'duration-300',\n        'md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden',\n        custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-container-secondary-1 tablet:hover:bg-info-white',\n        { 'aiui-dark': custom_theme === 'dark' }\n      )}\n      style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n    >\n      <div className={cn(handleWrapClass(), 'desktop:p-6 absolute inset-0 box-border overflow-hidden p-4')}>\n        <div\n          className={cn(showSizeClass().imgItem, 'desktop:mb-0 relative mb-1 overflow-hidden', {\n            'opacity-0': custom_bg_image,\n          })}\n        >\n          <a\n            aria-label={displayTitle}\n            target={configuration?.target}\n            href={trackUrlRef(\n              `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\n              `${trackingData?.contextHandle || ''}_${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\n              source={imageUrl}\n              alt={altText}\n              className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n            />\n          </a>\n        </div>\n        <div className={cn('flex flex-col items-start justify-center', showSizeClass().boxItem)}>\n          {isShowTag && (\n            <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n              {showTags?.length > 0 &&\n                showTags?.map?.((item: any, index: number) => (\n                  <Badge key={index} className=\"shelf-items-tag\">\n                    {item}\n                  </Badge>\n                ))}\n            </div>\n          )}\n          {currentDisplayTitle ? (\n            <Heading\n              as=\"h3\"\n              title={currentDisplayTitle || ''}\n              size={2}\n              className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]\"\n              html={currentDisplayTitle || ''}\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 text-info-primary 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-xl 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                href={\n                  data?.custom_secondary_link\n                    ? trackUrlRef(\n                        data?.custom_secondary_link,\n                        `${trackingData?.contextHandle || ''}_${componentType}_${componentName}`\n                      )\n                    : undefined\n                }\n                as={data?.custom_secondary_link ? 'a' : 'button'}\n                onClick={() =>\n                  !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n                }\n                className={configuration.direction === 'vertical' ? 'w-full' : ''}\n              >\n                {configuration?.secondaryButton || ''}\n              </Button>\n            ) : null}\n            {configuration?.primaryButton ? (\n              <Button\n                disabled={isSoldOut}\n                variant=\"primary\"\n                href={\n                  data?.custom_primary_link\n                    ? trackUrlRef(\n                        data?.custom_primary_link,\n                        `${trackingData?.contextHandle || ''}_${componentType}_${componentName}`\n                      )\n                    : undefined\n                }\n                as={data?.custom_primary_link ? 'a' : 'button'}\n                onClick={() =>\n                  !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n                }\n                className={configuration.direction === 'vertical' ? 'w-full' : ''}\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", "getProductImage", "__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", "sku", "skuArray", "findSku", "item", "imageUrl", "altText", "configuration", "isDisplayBackImage", "itemShape", "metafields", "isTopTag", "isShowTag", "isShowOriginalPrice", "isShowShortTitle", "locale", "copyWriting", "currencyDisplay", "trackingData", "discounts", "discountsCopy", "ref", "showTags", "setShowTags", "currentPriceTag", "setCurrentPriceTag", "onPrimaryButton", "params", "index", "coupon", "primaryFun", "onAddCart", "onBuyNow", "onLearnMore", "event", "onSecondaryButton", "secondaryFun", "variant", "variants", "variantArr", "variantId", "isSoldOut", "shouldUseCouponPrice", "currencyCode", "priceInfo", "price", "basePrice", "discount", "discountAmount", "displayTitle", "currentDisplayTitle", "displayDescription", "showPrice", "amountStr", "match", "prefix", "numeric", "suffix", "updatedNumeric", "handleTags", "discountTag", "newTags", "bottomContent", "Badge", "Button", "custom_bg_image", "custom_theme", "Picture", "itemLength", "showSizeClass", "handleWrapClass"]
+  "sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport Picture from '../../components/picture.js'\nimport Badge from '../../components/badge.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ShelfDisplayItem, ShelfDisplayType } from './shelfDisplay.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef, useEffect, useMemo, useState } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\n// \u516C\u5171\u51FD\u6570\uFF1A\u83B7\u53D6\u4EA7\u54C1\u56FE\u7247URL\u548CaltText\nexport const getProductImage = (data: any) => {\n  const sku = data?.sku\n  const skuArray = data?.variants\n  const findSku = skuArray?.find((item: any) => item?.sku === sku)\n  const imageUrl = findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n  const altText = findSku?.image?.altText || skuArray?.[0]?.image?.altText || data?.custom_name || data?.title || ''\n\n  return {\n    imageUrl,\n    altText,\n  }\n}\n\nexport const ShelfDisplayWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n  const {\n    isDisplayBackImage = false,\n    itemShape,\n    metafields,\n    isTopTag = false,\n    isShowTag,\n    isShowOriginalPrice,\n    isShowShortTitle = false,\n  } = configuration || {}\n  const { locale = 'es', copyWriting, currencyDisplay } = useAiuiContext()\n  const { discounts, discountsCopy } = metafields || {}\n  const ref = useRef<HTMLDivElement>(null)\n  const [showTags, setShowTags] = useState<string[]>([])\n  const [currentPriceTag, setCurrentPriceTag] = useState<string>('')\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n    if (primaryFun) {\n      if (primaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.primaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n    if (secondaryFun) {\n      if (secondaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.secondaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const variant = useMemo(() => {\n    const variants = data?.variants || []\n    if (!variants.length) {\n      return undefined\n    }\n    if (!data?.sku) {\n      return variants?.[0]\n    }\n    return variants?.find?.((item: any) => item?.sku === data?.sku) || variants[0]\n  }, [data?.sku, data?.variants])\n\n  const variantArr = variant?.id?.split?.('/') || []\n  const variantId = variantArr?.[variantArr?.length - 1]\n\n  const isSoldOut =\n    !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === SOLD_OUT_PRICE\n\n  // active \u7684 \u901A\u7528\u6298\u6263\n  const coupon = variant?.coupons?.[0]\n\n  const shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n  const currencyCode = data?.price?.currencyCode || 'USD'\n\n  const priceInfo = useMemo(\n    () =>\n      formatVariantPrice({\n        locale,\n        amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n        baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n        currencyCode,\n        currencyDisplay,\n      }),\n    [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant]\n  )\n\n  const { price, basePrice, discount, discountAmount } = priceInfo\n\n  const { imageUrl, altText } = getProductImage(data)\n\n  const displayTitle = data?.custom_name || data?.title\n  const currentDisplayTitle = isShowShortTitle\n    ? variant?.metafields?.infos?.page_short_title || displayTitle\n    : displayTitle\n  const displayDescription = data?.custom_description || data?.description\n\n  const showPrice = () => {\n    if (coupon?.value_type === 'fixed_amount') {\n      const amountStr = discountAmount || ''\n      const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n      if (match) {\n        const [, prefix, numeric, suffix] = match\n        let updatedNumeric = numeric\n        if (numeric.endsWith('.00')) {\n          updatedNumeric = numeric.replace(/\\.00$/, '')\n        } else if (numeric.endsWith(',00')) {\n          updatedNumeric = numeric.replace(/,00$/, '')\n        }\n        return `${prefix}${updatedNumeric}${suffix}`\n      }\n      return amountStr\n    }\n    return discount || ''\n  }\n\n  // \u5904\u7406\u6807\u7B7E\n  useEffect(() => {\n    let handleTags: string[] = []\n    if (discount || discountAmount) {\n      const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.off || ''}`\n      setCurrentPriceTag(discountTag)\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, discountAmount, discounts?.off, discountsCopy?.off])\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) => (\n              <Badge key={index} className=\"shelf-items-tag\">\n                {item}\n              </Badge>\n            ))}\n          </div>\n        ) : null}\n        {currentDisplayTitle ? (\n          <Heading\n            as=\"h3\"\n            title={currentDisplayTitle || ''}\n            size={2}\n            className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary line-clamp-2 h-12\"\n            html={currentDisplayTitle || ''}\n          />\n        ) : null}\n        <Text\n          size={2}\n          className=\"lg-desktop:text-lg desktop:h-[24px] lg-desktop:h-[28px] desktop:text-base shelf-display-product-description text-info-primary line-clamp-1 h-[20px] text-sm\"\n          html={displayDescription || ''}\n        />\n        <div className=\"mb-2 mt-4 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-xl 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              disabled={isSoldOut && configuration?.secondaryFun !== 'LearnMore'}\n              variant=\"secondary\"\n              href={data?.custom_secondary_link}\n              as={data?.custom_secondary_link ? 'a' : 'button'}\n              onClick={() =>\n                !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n              }\n              className={configuration.direction === 'vertical' ? 'w-full' : ''}\n            >\n              {configuration?.secondaryButton || ''}\n            </Button>\n          ) : null}\n          {configuration?.primaryButton ? (\n            <Button\n              disabled={isSoldOut && configuration?.primaryFun !== 'LearnMore'}\n              variant=\"primary\"\n              href={data?.custom_primary_link}\n              as={data?.custom_primary_link ? 'a' : 'button'}\n              onClick={() =>\n                !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n              }\n              className={configuration.direction === 'vertical' ? 'w-full' : ''}\n            >\n              {configuration?.primaryButton || ''}\n            </Button>\n          ) : null}\n        </div>\n      </>\n    )\n  }\n\n  const custom_bg_image = data?.custom_bg_image\n  const custom_theme = data?.custom_theme\n\n  return (\n    <div\n      ref={ref}\n      key={data?.id || data?.handle}\n      className={cn(\n        '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        custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-background tablet:hover:bg-info-white',\n        { 'aiui-dark': custom_theme === 'dark' }\n      )}\n      style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n    >\n      {isDisplayBackImage ? (\n        <div className=\"absolute inset-0 box-border overflow-hidden\">\n          <div className=\"relative inset-0 size-full\">\n            <Picture\n              source={imageUrl}\n              alt={altText}\n              className={cn('flex h-full justify-center object-cover [&_img]:w-auto', {\n                'opacity-0': custom_bg_image,\n              })}\n            />\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          {currentPriceTag && isTopTag && (\n            <Badge className=\"shelf-prices-tag absolute left-4 top-4 z-10\">{currentPriceTag || ''}</Badge>\n          )}\n          <div\n            className={cn(\n              'lg-desktop:h-[195px] shelf-display-item-image relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden',\n              { 'opacity-0': custom_bg_image }\n            )}\n          >\n            <a\n              aria-label={displayTitle}\n              target={configuration?.target}\n              href={trackUrlRef(\n                `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\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\n                source={imageUrl}\n                alt={altText}\n                className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n              />\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, isShowShortTitle } = configuration || {}\n  const { discounts, discountsCopy } = metafields || {}\n  const { locale = 'us', copyWriting, currencyDisplay } = useAiuiContext()\n  const [showTags, setShowTags] = useState<string[]>([])\n  const ref = useRef<HTMLDivElement>(null)\n\n  const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n    if (primaryFun) {\n      if (primaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (primaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.primaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n    const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n    // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n    if (secondaryFun) {\n      if (secondaryFun === 'AddCart' && onAddCart) {\n        return onAddCart(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'BuyNow' && onBuyNow) {\n        return onBuyNow(params, index + 1, data, coupon)\n      }\n      if (secondaryFun === 'LearnMore' && onLearnMore) {\n        return onLearnMore(params, index + 1, data, coupon)\n      }\n    }\n\n    // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n    event?.secondaryButton?.(params, index + 1, data, coupon)\n  }\n\n  const variant = useMemo(() => {\n    const variants = data?.variants || []\n    if (!variants.length) {\n      return undefined\n    }\n    if (!data?.sku) {\n      return variants[0]\n    }\n    return variants.find((item: any) => item?.sku === data?.sku) || variants[0]\n  }, [data?.sku, data?.variants])\n\n  const variantArr = variant?.id?.split?.('/') || []\n  const variantId = variantArr?.[variantArr?.length - 1]\n\n  const isSoldOut =\n    !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === 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 shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n  const currencyCode = data?.price?.currencyCode || 'USD'\n\n  const priceInfo = useMemo(\n    () =>\n      formatVariantPrice({\n        locale,\n        amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n        baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n        currencyCode,\n        currencyDisplay,\n      }),\n    [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant]\n  )\n\n  const { price, basePrice, discount, discountAmount } = priceInfo\n\n  const { imageUrl, altText } = getProductImage(data)\n\n  const displayTitle = data?.custom_name || data?.title\n  const currentDisplayTitle = isShowShortTitle\n    ? variant?.metafields?.infos?.page_short_title || displayTitle\n    : displayTitle\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  const showPrice = () => {\n    if (coupon?.value_type === 'fixed_amount') {\n      const amountStr = discountAmount || ''\n      const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n      if (match) {\n        const [, prefix, numeric, suffix] = match\n        let updatedNumeric = numeric\n        if (numeric.endsWith('.00')) {\n          updatedNumeric = numeric.replace(/\\.00$/, '')\n        } else if (numeric.endsWith(',00')) {\n          updatedNumeric = numeric.replace(/,00$/, '')\n        }\n        return `${prefix}${updatedNumeric}${suffix}`\n      }\n      return amountStr\n    }\n    return discount || ''\n  }\n\n  // \u5904\u7406\u6807\u7B7E\n  useEffect(() => {\n    let handleTags: string[] = []\n    if (discount || discountAmount) {\n      const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.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, discountAmount, discounts?.off, discountsCopy?.off])\n\n  const custom_bg_image = data?.custom_bg_image\n  const custom_theme = data?.custom_theme\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        'duration-300',\n        'md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden',\n        custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-container-secondary-1 tablet:hover:bg-info-white',\n        { 'aiui-dark': custom_theme === 'dark' }\n      )}\n      style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n    >\n      <div className={cn(handleWrapClass(), 'desktop:p-6 absolute inset-0 box-border overflow-hidden p-4')}>\n        <div\n          className={cn(showSizeClass().imgItem, 'desktop:mb-0 relative mb-1 overflow-hidden', {\n            'opacity-0': custom_bg_image,\n          })}\n        >\n          <a\n            aria-label={displayTitle}\n            target={configuration?.target}\n            href={trackUrlRef(\n              `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\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\n              source={imageUrl}\n              alt={altText}\n              className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n            />\n          </a>\n        </div>\n        <div className={cn('flex flex-col items-start justify-center', showSizeClass().boxItem)}>\n          {isShowTag && (\n            <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n              {showTags?.length > 0 &&\n                showTags?.map?.((item: any, index: number) => (\n                  <Badge key={index} className=\"shelf-items-tag\">\n                    {item}\n                  </Badge>\n                ))}\n            </div>\n          )}\n          {currentDisplayTitle ? (\n            <Heading\n              as=\"h3\"\n              title={currentDisplayTitle || ''}\n              size={2}\n              className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]\"\n              html={currentDisplayTitle || ''}\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 text-info-primary 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-xl 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                href={data?.custom_secondary_link}\n                as={data?.custom_secondary_link ? 'a' : 'button'}\n                onClick={() =>\n                  !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n                }\n                className={configuration.direction === 'vertical' ? 'w-full' : ''}\n              >\n                {configuration?.secondaryButton || ''}\n              </Button>\n            ) : null}\n            {configuration?.primaryButton ? (\n              <Button\n                disabled={isSoldOut}\n                variant=\"primary\"\n                href={data?.custom_primary_link}\n                as={data?.custom_primary_link ? 'a' : 'button'}\n                onClick={() =>\n                  !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n                }\n                className={configuration.direction === 'vertical' ? 'w-full' : ''}\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", "getProductImage", "__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", "sku", "skuArray", "findSku", "item", "imageUrl", "altText", "configuration", "isDisplayBackImage", "itemShape", "metafields", "isTopTag", "isShowTag", "isShowOriginalPrice", "isShowShortTitle", "locale", "copyWriting", "currencyDisplay", "discounts", "discountsCopy", "ref", "showTags", "setShowTags", "currentPriceTag", "setCurrentPriceTag", "onPrimaryButton", "params", "index", "coupon", "primaryFun", "onAddCart", "onBuyNow", "onLearnMore", "event", "onSecondaryButton", "secondaryFun", "variant", "variants", "variantArr", "variantId", "isSoldOut", "shouldUseCouponPrice", "currencyCode", "priceInfo", "price", "basePrice", "discount", "discountAmount", "displayTitle", "currentDisplayTitle", "displayDescription", "showPrice", "amountStr", "match", "prefix", "numeric", "suffix", "updatedNumeric", "handleTags", "discountTag", "newTags", "bottomContent", "Badge", "Button", "custom_bg_image", "custom_theme", "Picture", "itemLength", "showSizeClass", "handleWrapClass"]
 }

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

@@ -1,4 +1,4 @@
-"use strict";var p=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var L=(t,o)=>{for(var r in o)p(t,r,{get:o[r],enumerable:!0})},H=(t,o,r,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of D(o))!z.call(t,a)&&a!==r&&p(t,a,{get:()=>o[a],enumerable:!(m=E(o,a))||m.enumerable});return t};var R=t=>H(p({},"__esModule",{value:!0}),t);var O={};L(O,{default:()=>P});module.exports=R(O);var e=require("react/jsx-runtime"),n=require("react"),s=require("../../components/index.js"),x=require("../../helpers/utils.js"),v=require("../../components/index.js");const Z=({subscribeMetadata:t,onSubmit:o,className:r,loading:m,...a})=>{const[b,i]=(0,n.useState)(null),[N,B]=(0,n.useState)(t?.termsChecked),[y,C]=(0,n.useState)(t?.newsChecked),[f,u]=(0,n.useState)(null),[F,g]=(0,n.useState)(!1),[h,k]=(0,n.useState)(""),T=l=>{l.preventDefault();const c=new FormData(l.target),d=c.get("email"),w=c.get("terms"),S=c.get("news");if(!d){i(t?.emptyError);return}if(!/^[a-zA-Z0-9.,%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(d)){i(t?.formatError);return}if(!w){u(t?.termsError);return}o?.({email:d,terms:w,news:S,dealsType:t?.dealsType,onSuccess:()=>{g(!0);let A=setTimeout(()=>{g(!1),clearTimeout(A)},3e3)}})};return(0,e.jsxs)("div",{...a,className:(0,x.cn)("subscribe-component laptop:flex-row laptop:gap-4 desktop:flex-col desktop:gap-8 flex flex-col gap-4",r),children:[(0,e.jsx)("style",{children:`
+"use strict";var p=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var L=(t,o)=>{for(var r in o)p(t,r,{get:o[r],enumerable:!0})},H=(t,o,r,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of D(o))!z.call(t,a)&&a!==r&&p(t,a,{get:()=>o[a],enumerable:!(m=E(o,a))||m.enumerable});return t};var R=t=>H(p({},"__esModule",{value:!0}),t);var O={};L(O,{default:()=>P});module.exports=R(O);var e=require("react/jsx-runtime"),n=require("react"),s=require("../../components/index.js"),x=require("../../helpers/utils.js"),v=require("../../components/index.js");const Z=({subscribeMetadata:t,onSubmit:o,className:r,loading:m,...a})=>{const[b,i]=(0,n.useState)(null),[N,B]=(0,n.useState)(t?.termsChecked),[y,C]=(0,n.useState)(t?.newsChecked),[f,u]=(0,n.useState)(null),[F,g]=(0,n.useState)(!1),[h,k]=(0,n.useState)(""),T=l=>{l.preventDefault();const c=new FormData(l.target),d=c.get("email"),w=c.get("terms"),S=c.get("news");if(!d){i(t?.emptyError);return}if(!/^[a-zA-Z0-9.,%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(d)){i(t?.formatError);return}if(!w){u(t?.termsError);return}o?.({email:d,terms:w,news:S,dealsType:t?.dealsType,onSuccess:()=>{g(!0);let A=setTimeout(()=>{g(!1),clearTimeout(A)},3e3)}})};return(0,e.jsxs)("div",{...a,className:(0,x.cn)("subscribe-component laptop:flex-row laptop:gap-4 desktop:flex-col desktop:gap-8 flex flex-col gap-4",r),children:[(0,e.jsx)("style",{jsx:!0,global:!0,children:`
           .subscribe-component input:-webkit-autofill,
           .subscribe-component input:-webkit-autofill:hover,
           .subscribe-component input:-webkit-autofill:focus {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Subscribe/index.tsx"],
-  "sourcesContent": ["/* eslint-disable react/no-unknown-property */\nimport React, { useState } from 'react'\nimport { Text, Checkbox, Button } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { LoadingDots } from '../../components/index.js'\n\nexport interface SubscribeProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSubmit'> {\n  subscribeMetadata: any\n  onSubmit?: ({\n    email,\n    terms,\n    news,\n    dealsType,\n    onSuccess,\n  }: {\n    email: string\n    terms: string\n    news: string\n    dealsType?: string\n    onSuccess?: () => void\n  }) => void\n  loading?: boolean\n}\n\n/**\n * Subscribe \u8BA2\u9605\u6A21\u5757\n * @param subscribeMetadata \u8BA2\u9605\u6A21\u5757\u6570\u636E\n * @param onSubmit \u63D0\u4EA4\u4E8B\u4EF6\n * @param className \u7C7B\u540D\n * @returns\n */\nconst Subscribe = ({ subscribeMetadata, onSubmit, className, loading, ...rest }: SubscribeProps) => {\n  const [error, setError] = useState<string | null>(null)\n  const [termsChecked, setTermsChecked] = useState<boolean>(subscribeMetadata?.termsChecked)\n  const [newsChecked, setNewsChecked] = useState<boolean>(subscribeMetadata?.newsChecked)\n  const [termsError, setTermsError] = useState<string | null>(null)\n  const [success, setSuccess] = useState<boolean>(false)\n  const [email, setEmail] = useState<string>('')\n\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    const formData = new FormData(e.target as HTMLFormElement)\n    const email = formData.get('email')\n    const terms = formData.get('terms')\n    const news = formData.get('news')\n    if (!email) {\n      setError(subscribeMetadata?.emptyError)\n      return\n    }\n    if (!/^[a-zA-Z0-9.,%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/.test(email as string)) {\n      setError(subscribeMetadata?.formatError)\n      return\n    }\n    if (!terms) {\n      setTermsError(subscribeMetadata?.termsError)\n      return\n    }\n    onSubmit?.({\n      email: email as string,\n      terms: terms as string,\n      news: news as string,\n      dealsType: subscribeMetadata?.dealsType,\n      onSuccess: () => {\n        setSuccess(true)\n        let timer = setTimeout(() => {\n          setSuccess(false)\n          clearTimeout(timer)\n        }, 3000)\n      },\n    })\n  }\n\n  return (\n    <div\n      {...rest}\n      className={cn(\n        'subscribe-component laptop:flex-row laptop:gap-4 desktop:flex-col desktop:gap-8 flex flex-col gap-4',\n        className\n      )}\n    >\n      <style>\n        {`\n          .subscribe-component input:-webkit-autofill,\n          .subscribe-component input:-webkit-autofill:hover,\n          .subscribe-component input:-webkit-autofill:focus {\n            -webkit-box-shadow: 0 0 0 1000px transparent inset !important; /* \u80CC\u666F\u900F\u660E */\n            -webkit-text-fill-color: #fff !important;\n            transition: background-color 9999s ease-in-out 0s !important;\n            caret-color: #fff;\n          }\n        `}\n      </style>\n      <div className=\"laptop:flex-1\">\n        <Text\n          as=\"p\"\n          html={subscribeMetadata?.title}\n          className=\"desktop:text-base text-sm font-bold leading-[1.4] text-white\"\n        />\n        <Text\n          as=\"p\"\n          html={subscribeMetadata?.subtitle}\n          className=\"desktop:mt-2 desktop:text-[32px] mt-1 text-2xl font-bold leading-[1.2] text-white\"\n        />\n      </div>\n      <form className=\"laptop:flex-1\" onSubmit={handleSubmit}>\n        <div className=\"desktop:h-[48px] flex h-[38px] items-center\">\n          <div className=\"tablet:max-w-[320px] laptop:max-w-[404px] relative h-full flex-1\">\n            <input\n              name=\"email\"\n              onFocus={() => setError(null)}\n              value={email}\n              onChange={e => setEmail(e.target.value)}\n              placeholder={subscribeMetadata?.placeholder}\n              className=\"desktop:text-base rounded-l-btn size-full rounded-r-none border border-[#B6B6BA] bg-transparent px-4 text-sm font-bold leading-[1.2] text-white\"\n            />\n            <button\n              type=\"button\"\n              onClick={() => setEmail('')}\n              className={cn('absolute right-4 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600', {\n                hidden: !email,\n              })}\n            >\n              \u2715\n            </button>\n          </div>\n          <Button\n            type=\"submit\"\n            className=\"desktop:px-7 rounded-r-btn desktop:text-base h-full !rounded-l-none bg-white px-5 text-sm font-bold leading-[1.2] text-black\"\n          >\n            {loading ? (\n              <LoadingDots />\n            ) : (\n              <Text html={subscribeMetadata?.button} className=\"desktop:text-base text-sm font-bold leading-[1.2]\" />\n            )}\n          </Button>\n        </div>\n        {error && (\n          <Text as=\"p\" html={error} className=\"laptop:text-base mt-2 text-sm font-bold leading-[1.2] text-[#F84D4F]\" />\n        )}\n        <div className=\"mt-4 flex flex-col gap-2\">\n          <div className=\"laptop:items-center flex items-start gap-2\">\n            <Checkbox\n              name=\"terms\"\n              id=\"terms\"\n              size=\"base\"\n              checked={termsChecked}\n              onCheckedChange={(checked: boolean) => {\n                setTermsChecked(checked)\n                checked && setTermsError(null)\n              }}\n              className=\"border-[#B6B6BA] data-[state=checked]:bg-white data-[state=checked]:text-[#080A0F]\"\n            />\n            <label htmlFor=\"terms\">\n              <Text\n                as=\"p\"\n                html={subscribeMetadata?.terms}\n                className=\"desktop:text-base text-sm font-bold leading-[1.4] text-[#B6B6BA]\"\n              />\n            </label>\n          </div>\n          {termsError && (\n            <Text\n              as=\"p\"\n              html={termsError}\n              className=\"laptop:text-base text-sm font-bold leading-[1.2] text-[#F84D4F]\"\n            />\n          )}\n          <div className=\"flex items-start gap-2\">\n            <Checkbox\n              name=\"news\"\n              id=\"news\"\n              size=\"base\"\n              checked={newsChecked}\n              onCheckedChange={(checked: boolean) => {\n                setNewsChecked(checked)\n              }}\n              className=\"border-[#B6B6BA] data-[state=checked]:bg-white data-[state=checked]:text-[#080A0F]\"\n            />\n            <label htmlFor=\"news\">\n              <Text\n                as=\"p\"\n                html={subscribeMetadata?.news}\n                className=\"desktop:text-base text-sm font-bold leading-[1.4] text-[#B6B6BA]\"\n              />\n            </label>\n          </div>\n          {success && (\n            <Text\n              as=\"p\"\n              html={subscribeMetadata?.successMessage}\n              className=\"text-brand-0 text-base font-bold leading-[1.2]\"\n            />\n          )}\n        </div>\n      </form>\n    </div>\n  )\n}\n\nexport default Subscribe\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable react/no-unknown-property */\nimport React, { useState } from 'react'\nimport { Text, Checkbox, Button } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { LoadingDots } from '../../components/index.js'\n\nexport interface SubscribeProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSubmit'> {\n  subscribeMetadata: any\n  onSubmit?: ({\n    email,\n    terms,\n    news,\n    dealsType,\n    onSuccess,\n  }: {\n    email: string\n    terms: string\n    news: string\n    dealsType?: string\n    onSuccess?: () => void\n  }) => void\n  loading?: boolean\n}\n\n/**\n * Subscribe \u8BA2\u9605\u6A21\u5757\n * @param subscribeMetadata \u8BA2\u9605\u6A21\u5757\u6570\u636E\n * @param onSubmit \u63D0\u4EA4\u4E8B\u4EF6\n * @param className \u7C7B\u540D\n * @returns\n */\nconst Subscribe = ({ subscribeMetadata, onSubmit, className, loading, ...rest }: SubscribeProps) => {\n  const [error, setError] = useState<string | null>(null)\n  const [termsChecked, setTermsChecked] = useState<boolean>(subscribeMetadata?.termsChecked)\n  const [newsChecked, setNewsChecked] = useState<boolean>(subscribeMetadata?.newsChecked)\n  const [termsError, setTermsError] = useState<string | null>(null)\n  const [success, setSuccess] = useState<boolean>(false)\n  const [email, setEmail] = useState<string>('')\n\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    const formData = new FormData(e.target as HTMLFormElement)\n    const email = formData.get('email')\n    const terms = formData.get('terms')\n    const news = formData.get('news')\n    if (!email) {\n      setError(subscribeMetadata?.emptyError)\n      return\n    }\n    if (!/^[a-zA-Z0-9.,%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/.test(email as string)) {\n      setError(subscribeMetadata?.formatError)\n      return\n    }\n    if (!terms) {\n      setTermsError(subscribeMetadata?.termsError)\n      return\n    }\n    onSubmit?.({\n      email: email as string,\n      terms: terms as string,\n      news: news as string,\n      dealsType: subscribeMetadata?.dealsType,\n      onSuccess: () => {\n        setSuccess(true)\n        let timer = setTimeout(() => {\n          setSuccess(false)\n          clearTimeout(timer)\n        }, 3000)\n      },\n    })\n  }\n\n  return (\n    <div\n      {...rest}\n      className={cn(\n        'subscribe-component laptop:flex-row laptop:gap-4 desktop:flex-col desktop:gap-8 flex flex-col gap-4',\n        className\n      )}\n    >\n      {/* TODO: @seasail \u7528tailwind \u539F\u5B50\u7C7B\u6216\u8005\u884C\u5185\u6837\u5F0F(Inline Style)\u4EE3\u66FF jsx global */}\n      <style jsx global>\n        {`\n          .subscribe-component input:-webkit-autofill,\n          .subscribe-component input:-webkit-autofill:hover,\n          .subscribe-component input:-webkit-autofill:focus {\n            -webkit-box-shadow: 0 0 0 1000px transparent inset !important; /* \u80CC\u666F\u900F\u660E */\n            -webkit-text-fill-color: #fff !important;\n            transition: background-color 9999s ease-in-out 0s !important;\n            caret-color: #fff;\n          }\n        `}\n      </style>\n      <div className=\"laptop:flex-1\">\n        <Text\n          as=\"p\"\n          html={subscribeMetadata?.title}\n          className=\"desktop:text-base text-sm font-bold leading-[1.4] text-white\"\n        />\n        <Text\n          as=\"p\"\n          html={subscribeMetadata?.subtitle}\n          className=\"desktop:mt-2 desktop:text-[32px] mt-1 text-2xl font-bold leading-[1.2] text-white\"\n        />\n      </div>\n      <form className=\"laptop:flex-1\" onSubmit={handleSubmit}>\n        <div className=\"desktop:h-[48px] flex h-[38px] items-center\">\n          <div className=\"tablet:max-w-[320px] laptop:max-w-[404px] relative h-full flex-1\">\n            <input\n              name=\"email\"\n              onFocus={() => setError(null)}\n              value={email}\n              onChange={e => setEmail(e.target.value)}\n              placeholder={subscribeMetadata?.placeholder}\n              className=\"desktop:text-base rounded-l-btn size-full rounded-r-none border border-[#B6B6BA] bg-transparent px-4 text-sm font-bold leading-[1.2] text-white\"\n            />\n            <button\n              type=\"button\"\n              onClick={() => setEmail('')}\n              className={cn('absolute right-4 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600', {\n                hidden: !email,\n              })}\n            >\n              \u2715\n            </button>\n          </div>\n          <Button\n            type=\"submit\"\n            className=\"desktop:px-7 rounded-r-btn desktop:text-base h-full !rounded-l-none bg-white px-5 text-sm font-bold leading-[1.2] text-black\"\n          >\n            {loading ? (\n              <LoadingDots />\n            ) : (\n              <Text html={subscribeMetadata?.button} className=\"desktop:text-base text-sm font-bold leading-[1.2]\" />\n            )}\n          </Button>\n        </div>\n        {error && (\n          <Text as=\"p\" html={error} className=\"laptop:text-base mt-2 text-sm font-bold leading-[1.2] text-[#F84D4F]\" />\n        )}\n        <div className=\"mt-4 flex flex-col gap-2\">\n          <div className=\"laptop:items-center flex items-start gap-2\">\n            <Checkbox\n              name=\"terms\"\n              id=\"terms\"\n              size=\"base\"\n              checked={termsChecked}\n              onCheckedChange={(checked: boolean) => {\n                setTermsChecked(checked)\n                checked && setTermsError(null)\n              }}\n              className=\"border-[#B6B6BA] data-[state=checked]:bg-white data-[state=checked]:text-[#080A0F]\"\n            />\n            <label htmlFor=\"terms\">\n              <Text\n                as=\"p\"\n                html={subscribeMetadata?.terms}\n                className=\"desktop:text-base text-sm font-bold leading-[1.4] text-[#B6B6BA]\"\n              />\n            </label>\n          </div>\n          {termsError && (\n            <Text\n              as=\"p\"\n              html={termsError}\n              className=\"laptop:text-base text-sm font-bold leading-[1.2] text-[#F84D4F]\"\n            />\n          )}\n          <div className=\"flex items-start gap-2\">\n            <Checkbox\n              name=\"news\"\n              id=\"news\"\n              size=\"base\"\n              checked={newsChecked}\n              onCheckedChange={(checked: boolean) => {\n                setNewsChecked(checked)\n              }}\n              className=\"border-[#B6B6BA] data-[state=checked]:bg-white data-[state=checked]:text-[#080A0F]\"\n            />\n            <label htmlFor=\"news\">\n              <Text\n                as=\"p\"\n                html={subscribeMetadata?.news}\n                className=\"desktop:text-base text-sm font-bold leading-[1.4] text-[#B6B6BA]\"\n              />\n            </label>\n          </div>\n          {success && (\n            <Text\n              as=\"p\"\n              html={subscribeMetadata?.successMessage}\n              className=\"text-brand-0 text-base font-bold leading-[1.2]\"\n            />\n          )}\n        </div>\n      </form>\n    </div>\n  )\n}\n\nexport default Subscribe\n"],
+  "mappings": "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",
   "names": ["Subscribe_exports", "__export", "Subscribe_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "Subscribe", "subscribeMetadata", "onSubmit", "className", "loading", "rest", "error", "setError", "termsChecked", "setTermsChecked", "newsChecked", "setNewsChecked", "termsError", "setTermsError", "success", "setSuccess", "email", "setEmail", "handleSubmit", "e", "formData", "terms", "news", "timer", "checked"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var E=Object.create;var l=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var h=(e,i)=>{for(var r in i)l(e,r,{get:i[r],enumerable:!0})},m=(e,i,r,p)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of y(i))!b.call(e,o)&&o!==r&&l(e,o,{get:()=>i[o],enumerable:!(p=P(i,o))||p.enumerable});return e};var V=(e,i,r)=>(r=e!=null?E(N(e)):{},m(i||!e||!e.__esModule?l(r,"default",{value:e,enumerable:!0}):r,e)),k=e=>m(l({},"__esModule",{value:!0}),e);var T={};h(T,{default:()=>R});module.exports=k(T);var t=require("react/jsx-runtime"),s=V(require("react")),d=require("../../helpers/utils.js"),u=require("swiper/react"),n=require("swiper/modules");const S=s.default.forwardRef(({data:e,breakpoints:i,Slide:r,className:p,id:o,itemClassName:M,...w},c)=>{const[$,g]=(0,s.useState)(!0),[A,v]=(0,s.useState)(!1),[x,B]=(0,s.useState)(!1);return(0,s.useEffect)(()=>{B(!0)},[]),x?(0,t.jsx)("div",{...w,ref:c,children:(0,t.jsx)(u.Swiper,{className:(0,d.cn)(p),navigation:{nextEl:`.${o}-custom-swiper-button-next`,prevEl:`.${o}-custom-swiper-button-prev`},onProgress:a=>{g(a.isBeginning),v(a.isEnd)},modules:[n.Navigation,n.FreeMode,n.Mousewheel],freeMode:!0,mousewheel:{forceToAxis:!0},breakpoints:i||{0:{spaceBetween:12,slidesPerView:1,freeMode:!1},374:{spaceBetween:12,slidesPerView:1.2,freeMode:!1},768:{spaceBetween:16,slidesPerView:2,freeMode:!1}},children:e?.list?.map((a,f)=>(0,t.jsx)(u.SwiperSlide,{className:(0,d.cn)("!flex !h-[unset]",M),children:(0,t.jsx)(r,{data:a,configuration:e?.configuration?{...e?.configuration,index:f}:{index:f},jIndex:f})},o+"SwiperSlide"+f))})}):(0,t.jsx)("div",{...w,ref:c})});S.displayName="SwiperBox";var R=S;
+"use strict";"use client";var v=Object.create;var f=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var P=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var N=(e,r)=>{for(var i in r)f(e,i,{get:r[i],enumerable:!0})},d=(e,r,i,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of E(r))!y.call(e,o)&&o!==i&&f(e,o,{get:()=>r[o],enumerable:!(p=M(r,o))||p.enumerable});return e};var b=(e,r,i)=>(i=e!=null?v(P(e)):{},d(r||!e||!e.__esModule?f(i,"default",{value:e,enumerable:!0}):i,e)),h=e=>d(f({},"__esModule",{value:!0}),e);var k={};N(k,{default:()=>V});module.exports=h(k);var t=require("react/jsx-runtime"),n=b(require("react")),m=require("../../helpers/utils.js"),w=require("swiper/react"),s=require("swiper/modules");const u=n.default.forwardRef(({data:e,breakpoints:r,Slide:i,className:p,id:o,itemClassName:c,...S},g)=>{const[R,x]=(0,n.useState)(!0),[T,B]=(0,n.useState)(!1);return(0,t.jsx)("div",{...S,ref:g,children:(0,t.jsx)(w.Swiper,{className:(0,m.cn)(p),navigation:{nextEl:`.${o}-custom-swiper-button-next`,prevEl:`.${o}-custom-swiper-button-prev`},onProgress:a=>{x(a.isBeginning),B(a.isEnd)},modules:[s.Navigation,s.FreeMode,s.Mousewheel],freeMode:!0,mousewheel:{forceToAxis:!0},breakpoints:r||{0:{spaceBetween:12,slidesPerView:1,freeMode:!1},374:{spaceBetween:12,slidesPerView:1.2,freeMode:!1},768:{spaceBetween:16,slidesPerView:2,freeMode:!1}},children:e?.list?.map((a,l)=>(0,t.jsx)(w.SwiperSlide,{className:(0,m.cn)("!flex !h-[unset]",c),children:(0,t.jsx)(i,{data:a,configuration:e?.configuration?{...e?.configuration,index:l}:{index:l},jIndex:l})},o+"SwiperSlide"+l))})})});u.displayName="SwiperBox";var V=u;
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/SwiperBox/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\n// import 'swiper/css'\n// import 'swiper/css/free-mode'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, FreeMode, Mousewheel } from 'swiper/modules'\nimport type { SwiperBoxProps } from './types.js'\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(\n  ({ data, breakpoints, Slide, className, id, itemClassName, ...rest }, ref) => {\n    const [isStart, setStart] = useState(true)\n    const [isEnd, setEnd] = useState(false)\n    const [isMounted, setIsMounted] = useState(false)\n\n    useEffect(() => {\n      setIsMounted(true)\n    }, [])\n\n    if (!isMounted) {\n      return <div {...rest} ref={ref} />\n    }\n    return (\n      <div {...rest} ref={ref}>\n        <Swiper\n          className={cn(className)}\n          navigation={{\n            nextEl: `.${id}-custom-swiper-button-next`,\n            prevEl: `.${id}-custom-swiper-button-prev`,\n          }}\n          onProgress={swiper => {\n            setStart(swiper.isBeginning)\n            setEnd(swiper.isEnd)\n          }}\n          modules={[Navigation, FreeMode, Mousewheel]}\n          freeMode={true}\n          mousewheel={{\n            forceToAxis: true,\n          }}\n          breakpoints={\n            breakpoints || {\n              0: {\n                spaceBetween: 12,\n                slidesPerView: 1,\n                freeMode: false,\n              },\n              374: {\n                spaceBetween: 12,\n                slidesPerView: 1.2,\n                freeMode: false,\n              },\n              768: {\n                spaceBetween: 16,\n                slidesPerView: 2,\n                freeMode: false,\n              },\n            }\n          }\n        >\n          {data?.list?.map((item, jIndex) => (\n            <SwiperSlide key={id + 'SwiperSlide' + jIndex} className={cn('!flex !h-[unset]', itemClassName)}>\n              <Slide\n                data={item}\n                configuration={data?.configuration ? { ...data?.configuration, index: jIndex } : { index: jIndex }}\n                jIndex={jIndex}\n              />\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n    )\n  }\n)\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAoBa,IAAAI,EAAA,6BAnBbC,EAA2C,oBAC3CC,EAAmB,kCAGnBD,EAAoC,wBACpCE,EAAiD,0BAGjD,MAAMC,EAAY,EAAAC,QAAM,WACtB,CAAC,CAAE,KAAAC,EAAM,YAAAC,EAAa,MAAAC,EAAO,UAAAC,EAAW,GAAAC,EAAI,cAAAC,EAAe,GAAGC,CAAK,EAAGC,IAAQ,CAC5E,KAAM,CAACC,EAASC,CAAQ,KAAI,YAAS,EAAI,EACnC,CAACC,EAAOC,CAAM,KAAI,YAAS,EAAK,EAChC,CAACC,EAAWC,CAAY,KAAI,YAAS,EAAK,EAMhD,SAJA,aAAU,IAAM,CACdA,EAAa,EAAI,CACnB,EAAG,CAAC,CAAC,EAEAD,KAIH,OAAC,OAAK,GAAGN,EAAM,IAAKC,EAClB,mBAAC,UACC,aAAW,MAAGJ,CAAS,EACvB,WAAY,CACV,OAAQ,IAAIC,CAAE,6BACd,OAAQ,IAAIA,CAAE,4BAChB,EACA,WAAYU,GAAU,CACpBL,EAASK,EAAO,WAAW,EAC3BH,EAAOG,EAAO,KAAK,CACrB,EACA,QAAS,CAAC,aAAY,WAAU,YAAU,EAC1C,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,YACEb,GAAe,CACb,EAAG,CACD,aAAc,GACd,cAAe,EACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,IACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,EACf,SAAU,EACZ,CACF,EAGD,SAAAD,GAAM,MAAM,IAAI,CAACe,EAAMC,OACtB,OAAC,eAA8C,aAAW,MAAG,mBAAoBX,CAAa,EAC5F,mBAACH,EAAA,CACC,KAAMa,EACN,cAAef,GAAM,cAAgB,CAAE,GAAGA,GAAM,cAAe,MAAOgB,CAAO,EAAI,CAAE,MAAOA,CAAO,EACjG,OAAQA,EACV,GALgBZ,EAAK,cAAgBY,CAMvC,CACD,EACH,EACF,KAjDO,OAAC,OAAK,GAAGV,EAAM,IAAKC,EAAK,CAmDpC,CACF,EAEAT,EAAU,YAAc,YAExB,IAAON,EAAQM",
-  "names": ["SwiperBox_exports", "__export", "SwiperBox_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_modules", "SwiperBox", "React", "data", "breakpoints", "Slide", "className", "id", "itemClassName", "rest", "ref", "isStart", "setStart", "isEnd", "setEnd", "isMounted", "setIsMounted", "swiper", "item", "jIndex"]
+  "sourcesContent": ["'use client'\nimport React, { useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\n// import 'swiper/css'\n// import 'swiper/css/free-mode'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, FreeMode, Mousewheel } from 'swiper/modules'\nimport type { SwiperBoxProps } from './types.js'\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(\n  ({ data, breakpoints, Slide, className, id, itemClassName, ...rest }, ref) => {\n    const [isStart, setStart] = useState(true)\n    const [isEnd, setEnd] = useState(false)\n\n    return (\n      <div {...rest} ref={ref}>\n        <Swiper\n          className={cn(className)}\n          navigation={{\n            nextEl: `.${id}-custom-swiper-button-next`,\n            prevEl: `.${id}-custom-swiper-button-prev`,\n          }}\n          onProgress={swiper => {\n            setStart(swiper.isBeginning)\n            setEnd(swiper.isEnd)\n          }}\n          modules={[Navigation, FreeMode, Mousewheel]}\n          freeMode={true}\n          mousewheel={{\n            forceToAxis: true,\n          }}\n          breakpoints={\n            breakpoints || {\n              0: {\n                spaceBetween: 12,\n                slidesPerView: 1,\n                freeMode: false,\n              },\n              374: {\n                spaceBetween: 12,\n                slidesPerView: 1.2,\n                freeMode: false,\n              },\n              768: {\n                spaceBetween: 16,\n                slidesPerView: 2,\n                freeMode: false,\n              },\n            }\n          }\n        >\n          {data?.list?.map((item, jIndex) => (\n            <SwiperSlide key={id + 'SwiperSlide' + jIndex} className={cn('!flex !h-[unset]', itemClassName)}>\n              <Slide\n                data={item}\n                configuration={data?.configuration ? { ...data?.configuration, index: jIndex } : { index: jIndex }}\n                jIndex={jIndex}\n              />\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n    )\n  }\n)\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqDc,IAAAI,EAAA,6BApDdC,EAAgC,oBAChCC,EAAmB,kCAGnBD,EAAoC,wBACpCE,EAAiD,0BAGjD,MAAMC,EAAY,EAAAC,QAAM,WACtB,CAAC,CAAE,KAAAC,EAAM,YAAAC,EAAa,MAAAC,EAAO,UAAAC,EAAW,GAAAC,EAAI,cAAAC,EAAe,GAAGC,CAAK,EAAGC,IAAQ,CAC5E,KAAM,CAACC,EAASC,CAAQ,KAAI,YAAS,EAAI,EACnC,CAACC,EAAOC,CAAM,KAAI,YAAS,EAAK,EAEtC,SACE,OAAC,OAAK,GAAGL,EAAM,IAAKC,EAClB,mBAAC,UACC,aAAW,MAAGJ,CAAS,EACvB,WAAY,CACV,OAAQ,IAAIC,CAAE,6BACd,OAAQ,IAAIA,CAAE,4BAChB,EACA,WAAYQ,GAAU,CACpBH,EAASG,EAAO,WAAW,EAC3BD,EAAOC,EAAO,KAAK,CACrB,EACA,QAAS,CAAC,aAAY,WAAU,YAAU,EAC1C,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,YACEX,GAAe,CACb,EAAG,CACD,aAAc,GACd,cAAe,EACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,IACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,EACf,SAAU,EACZ,CACF,EAGD,SAAAD,GAAM,MAAM,IAAI,CAACa,EAAMC,OACtB,OAAC,eAA8C,aAAW,MAAG,mBAAoBT,CAAa,EAC5F,mBAACH,EAAA,CACC,KAAMW,EACN,cAAeb,GAAM,cAAgB,CAAE,GAAGA,GAAM,cAAe,MAAOc,CAAO,EAAI,CAAE,MAAOA,CAAO,EACjG,OAAQA,EACV,GALgBV,EAAK,cAAgBU,CAMvC,CACD,EACH,EACF,CAEJ,CACF,EAEAhB,EAAU,YAAc,YAExB,IAAON,EAAQM",
+  "names": ["SwiperBox_exports", "__export", "SwiperBox_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_modules", "SwiperBox", "React", "data", "breakpoints", "Slide", "className", "id", "itemClassName", "rest", "ref", "isStart", "setStart", "isEnd", "setEnd", "swiper", "item", "jIndex"]
 }