@anker-in/headless-ui 1.1.32 → 1.1.34-alpha.1768461697532

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

@@ -46,8 +46,8 @@ export interface ProductCompareProps {
     /** 外层容器类名 */
     className?: string;
 }
-declare const _default: import("react").ForwardRefExoticComponent<Omit<ProductCompareProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: import("react").ForwardRefExoticComponent<ProductCompareProps & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 } & import("react").RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/ProductHero/ProductHero.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { ProductHeroProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ProductHeroProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<ProductHeroProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/ProductNav/ProductNav.d.ts

@@ -1,6 +1,6 @@
 import type { ProductNavProps } from './types.js';
-declare const _default: import("react").ForwardRefExoticComponent<Omit<Omit<ProductNavProps & import("react").RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: import("react").ForwardRefExoticComponent<Omit<ProductNavProps & import("react").RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & import("react").RefAttributes<any>>;
 export default _default;

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

@@ -0,0 +1,49 @@
+import * as React from 'react';
+import type { Media } from '../../types/props.js';
+export interface PromotionalBarSemanticName {
+    root: 'root';
+    content: 'content';
+    title: 'title';
+    description: 'description';
+    button: 'button';
+}
+/**
+ * 响应式背景图片配置
+ */
+export interface ResponsiveBackgroundImage {
+    /** 移动端图片 (<768px) */
+    mobile?: Media;
+    /** 平板图片 (768-1440px) */
+    tablet?: Media;
+    /** 笔记本图片 (1025-1440px) */
+    laptop?: Media;
+    /** 桌面图片 (1441-1920px) */
+    desktop?: Media;
+    /** 超大桌面图片 (≥1921px) */
+    lgDesktop?: Media;
+}
+/**
+ * PromotionalBar 业务组件数据接口
+ */
+export interface PromotionalBarData {
+    /** 组件内容标题 */
+    contentTitle?: string;
+    /** 组件内容描述 */
+    contentDesc?: string;
+    /** 按钮文本 */
+    buttonText?: string;
+    /** 按钮链接 */
+    buttonLink?: string;
+    /** 背景图片 - 响应式图片对象 */
+    backgroundImage?: ResponsiveBackgroundImage;
+}
+export interface PromotionalBarProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** 业务数据 */
+    data: PromotionalBarData;
+    classNames?: Partial<Record<keyof PromotionalBarSemanticName, string>>;
+}
+declare const _default: React.ForwardRefExoticComponent<Omit<PromotionalBarProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
+}, "ref"> & React.RefAttributes<any>>;
+export default _default;

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

@@ -0,0 +1,2 @@
+"use client";import{jsx as a,jsxs as g}from"react/jsx-runtime";import*as f from"react";import{cn as s}from"../../helpers/index.js";import{Heading as v,Button as k,Picture as B}from"../../components/index.js";import{withLayout as M}from"../../shared/Styles.js";const P=o=>{if(!o)return;const{mobile:e,tablet:u,laptop:c,desktop:d,lgDesktop:b}=o,t=[],l=h=>h?.url,i=l(b),n=l(d),r=l(c),p=l(u),m=l(e);return i?t.push(i):n?t.push(n):r?t.push(r):p?t.push(p):m&&t.push(m),n&&i&&t.push(`${n} 1920`),r&&(n||i)&&t.push(`${r} 1440`),p&&(r||n||i)&&t.push(`${p} 1024`),m&&(p||r||n||i)&&t.push(`${m} 768`),t.length>0?t.join(", "):void 0},x=f.forwardRef(({classNames:o,data:e},u)=>{const{backgroundImage:c}=e,d=f.useMemo(()=>P(c),[c]);return a("div",{ref:u,className:s("laptop:h-[192px] lg-desktop:h-[240px] h-[240px]",o?.root),children:g("div",{className:"promotional-bar-content rounded-box relative h-full overflow-hidden",children:[g("div",{className:s("laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4",o?.content),children:[e.contentTitle&&a(v,{className:s("line-clamp-2 text-[#F5F6F7]",o?.title),html:e.contentTitle,size:3}),e.contentDesc&&a("p",{className:s("laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] text-[#F5F6F7]",o?.description),dangerouslySetInnerHTML:{__html:e.contentDesc}}),a("div",{className:"laptop:mt-4 mt-2",children:e.buttonText&&a(k,{as:"a",variant:"link",className:s("!p-0 text-[#F5F6F7]",o?.button),href:e.buttonLink,children:e.buttonText})})]}),a(B,{source:d,className:"absolute inset-0 z-10 ",imgClassName:"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]"})]})})});x.displayName="PromotionalBar";var N=M(x);export{N as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/PromotionalBar/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Heading, Button, Picture } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Media } from '../../types/props.js'\n\nexport interface PromotionalBarSemanticName {\n  root: 'root'\n  content: 'content'\n  title: 'title'\n  description: 'description'\n  button: 'button'\n}\n\n/**\n * \u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u914D\u7F6E\n */\nexport interface ResponsiveBackgroundImage {\n  /** \u79FB\u52A8\u7AEF\u56FE\u7247 (<768px) */\n  mobile?: Media\n  /** \u5E73\u677F\u56FE\u7247 (768-1440px) */\n  tablet?: Media\n  /** \u7B14\u8BB0\u672C\u56FE\u7247 (1025-1440px) */\n  laptop?: Media\n  /** \u684C\u9762\u56FE\u7247 (1441-1920px) */\n  desktop?: Media\n  /** \u8D85\u5927\u684C\u9762\u56FE\u7247 (\u22651921px) */\n  lgDesktop?: Media\n}\n\n/**\n * PromotionalBar \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface PromotionalBarData {\n  /** \u7EC4\u4EF6\u5185\u5BB9\u6807\u9898 */\n  contentTitle?: string\n  /** \u7EC4\u4EF6\u5185\u5BB9\u63CF\u8FF0 */\n  contentDesc?: string\n  /** \u6309\u94AE\u6587\u672C */\n  buttonText?: string\n  /** \u6309\u94AE\u94FE\u63A5 */\n  buttonLink?: string\n  /** \u80CC\u666F\u56FE\u7247 - \u54CD\u5E94\u5F0F\u56FE\u7247\u5BF9\u8C61 */\n  backgroundImage?: ResponsiveBackgroundImage\n}\n\nexport interface PromotionalBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: PromotionalBarData\n  classNames?: Partial<Record<keyof PromotionalBarSemanticName, string>>\n}\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u5BF9\u8C61\u8F6C\u6362\u4E3A Picture \u7EC4\u4EF6\u6240\u9700\u7684\u5B57\u7B26\u4E32\u683C\u5F0F\n */\nconst convertResponsiveImageToString = (backgroundImage: ResponsiveBackgroundImage | undefined): string | undefined => {\n  if (!backgroundImage) return undefined\n\n  const { mobile, tablet, laptop, desktop, lgDesktop } = backgroundImage\n  const parts: string[] = []\n\n  // \u8F85\u52A9\u51FD\u6570\uFF1A\u4ECE Media \u5BF9\u8C61\u4E2D\u63D0\u53D6 URL\n  const getUrl = (media: Media | undefined): string | undefined => {\n    return media?.url\n  }\n\n  // \u9ED8\u8BA4\u56FE\u7247\uFF08\u6700\u5927\u5C3A\u5BF8\uFF09\u653E\u5728\u6700\u524D\u9762\uFF0C\u4E0D\u9700\u8981\u65AD\u70B9\n  const lgDesktopUrl = getUrl(lgDesktop)\n  const desktopUrl = getUrl(desktop)\n  const laptopUrl = getUrl(laptop)\n  const tabletUrl = getUrl(tablet)\n  const mobileUrl = getUrl(mobile)\n\n  if (lgDesktopUrl) parts.push(lgDesktopUrl)\n  else if (desktopUrl) parts.push(desktopUrl)\n  else if (laptopUrl) parts.push(laptopUrl)\n  else if (tabletUrl) parts.push(tabletUrl)\n  else if (mobileUrl) parts.push(mobileUrl)\n\n  // \u6309\u65AD\u70B9\u4ECE\u5927\u5230\u5C0F\u6DFB\u52A0\n  if (desktopUrl && lgDesktopUrl) parts.push(`${desktopUrl} 1920`)\n  if (laptopUrl && (desktopUrl || lgDesktopUrl)) parts.push(`${laptopUrl} 1440`)\n  if (tabletUrl && (laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${tabletUrl} 1024`)\n  if (mobileUrl && (tabletUrl || laptopUrl || desktopUrl || lgDesktopUrl)) parts.push(`${mobileUrl} 768`)\n\n  return parts.length > 0 ? parts.join(', ') : undefined\n}\n\n/**\n * PromotionalBar - \u63A8\u5E7F\u680F\n *\n * @description \u63A8\u5E7F\u680F\n */\nconst PromotionalBar = React.forwardRef<HTMLDivElement, PromotionalBarProps>(({ classNames, data }, ref) => {\n  const { backgroundImage } = data\n  const pictureSource = React.useMemo(() => {\n    return convertResponsiveImageToString(backgroundImage)\n  }, [backgroundImage])\n  return (\n    <div ref={ref} className={cn('laptop:h-[192px] lg-desktop:h-[240px] h-[240px]', classNames?.root)}>\n      {/* \u63A8\u5E7F\u680F\u5185\u5BB9\u533A\u57DF - \u6839\u636E\u5177\u4F53\u4E1A\u52A1\u9700\u6C42\u5B9A\u5236 */}\n      <div className=\"promotional-bar-content rounded-box relative h-full overflow-hidden\">\n        <div\n          className={cn(\n            'laptop:px-8 laptop:justify-center lg-desktop:max-w-[620px] laptop:max-w-[392px] desktop:max-w-[584px] laptop:py-0 tablet:px-8 laptop:pr-0 relative z-20 flex h-full flex-col p-4',\n            classNames?.content\n          )}\n        >\n          {data.contentTitle && (\n            <Heading\n              className={cn('line-clamp-2 text-[#F5F6F7]', classNames?.title)}\n              html={data.contentTitle}\n              size={3}\n            />\n          )}\n          {data.contentDesc && (\n            <p\n              className={cn(\n                'laptop:text-[16px] laptop:mt-2 lg-desktop:text-[18px] mt-1 line-clamp-2 text-[14px] font-bold leading-[1.4] text-[#F5F6F7]',\n                classNames?.description\n              )}\n              dangerouslySetInnerHTML={{ __html: data.contentDesc }}\n            />\n          )}\n          <div className=\"laptop:mt-4 mt-2\">\n            {data.buttonText && (\n              <Button\n                as=\"a\"\n                variant=\"link\"\n                className={cn('!p-0 text-[#F5F6F7]', classNames?.button)}\n                href={data.buttonLink}\n              >\n                {data.buttonText}\n              </Button>\n            )}\n          </div>\n        </div>\n        <Picture\n          source={pictureSource}\n          className=\"absolute inset-0 z-10 \"\n          imgClassName=\"h-full object-cover transition-transform duration-300 ease-in-out hover:scale-[1.05]\"\n        />\n      </div>\n    </div>\n  )\n})\n\nPromotionalBar.displayName = 'PromotionalBar'\nexport default withLayout(PromotionalBar)\n"],
+  "mappings": "aAwGQ,OAOI,OAAAA,EAPJ,QAAAC,MAAA,oBAtGR,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,EAAS,UAAAC,EAAQ,WAAAC,MAAe,4BACzC,OAAS,cAAAC,MAAkB,yBAoD3B,MAAMC,EAAkCC,GAA+E,CACrH,GAAI,CAACA,EAAiB,OAEtB,KAAM,CAAE,OAAAC,EAAQ,OAAAC,EAAQ,OAAAC,EAAQ,QAAAC,EAAS,UAAAC,CAAU,EAAIL,EACjDM,EAAkB,CAAC,EAGnBC,EAAUC,GACPA,GAAO,IAIVC,EAAeF,EAAOF,CAAS,EAC/BK,EAAaH,EAAOH,CAAO,EAC3BO,EAAYJ,EAAOJ,CAAM,EACzBS,EAAYL,EAAOL,CAAM,EACzBW,EAAYN,EAAON,CAAM,EAE/B,OAAIQ,EAAcH,EAAM,KAAKG,CAAY,EAChCC,EAAYJ,EAAM,KAAKI,CAAU,EACjCC,EAAWL,EAAM,KAAKK,CAAS,EAC/BC,EAAWN,EAAM,KAAKM,CAAS,EAC/BC,GAAWP,EAAM,KAAKO,CAAS,EAGpCH,GAAcD,GAAcH,EAAM,KAAK,GAAGI,CAAU,OAAO,EAC3DC,IAAcD,GAAcD,IAAeH,EAAM,KAAK,GAAGK,CAAS,OAAO,EACzEC,IAAcD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGM,CAAS,OAAO,EACtFC,IAAcD,GAAaD,GAAaD,GAAcD,IAAeH,EAAM,KAAK,GAAGO,CAAS,MAAM,EAE/FP,EAAM,OAAS,EAAIA,EAAM,KAAK,IAAI,EAAI,MAC/C,EAOMQ,EAAiBrB,EAAM,WAAgD,CAAC,CAAE,WAAAsB,EAAY,KAAAC,CAAK,EAAGC,IAAQ,CAC1G,KAAM,CAAE,gBAAAjB,CAAgB,EAAIgB,EACtBE,EAAgBzB,EAAM,QAAQ,IAC3BM,EAA+BC,CAAe,EACpD,CAACA,CAAe,CAAC,EACpB,OACET,EAAC,OAAI,IAAK0B,EAAK,UAAWvB,EAAG,kDAAmDqB,GAAY,IAAI,EAE9F,SAAAvB,EAAC,OAAI,UAAU,sEACb,UAAAA,EAAC,OACC,UAAWE,EACT,mLACAqB,GAAY,OACd,EAEC,UAAAC,EAAK,cACJzB,EAACI,EAAA,CACC,UAAWD,EAAG,8BAA+BqB,GAAY,KAAK,EAC9D,KAAMC,EAAK,aACX,KAAM,EACR,EAEDA,EAAK,aACJzB,EAAC,KACC,UAAWG,EACT,6HACAqB,GAAY,WACd,EACA,wBAAyB,CAAE,OAAQC,EAAK,WAAY,EACtD,EAEFzB,EAAC,OAAI,UAAU,mBACZ,SAAAyB,EAAK,YACJzB,EAACK,EAAA,CACC,GAAG,IACH,QAAQ,OACR,UAAWF,EAAG,sBAAuBqB,GAAY,MAAM,EACvD,KAAMC,EAAK,WAEV,SAAAA,EAAK,WACR,EAEJ,GACF,EACAzB,EAACM,EAAA,CACC,OAAQqB,EACR,UAAU,yBACV,aAAa,uFACf,GACF,EACF,CAEJ,CAAC,EAEDJ,EAAe,YAAc,iBAC7B,IAAOK,EAAQrB,EAAWgB,CAAc",
+  "names": ["jsx", "jsxs", "React", "cn", "Heading", "Button", "Picture", "withLayout", "convertResponsiveImageToString", "backgroundImage", "mobile", "tablet", "laptop", "desktop", "lgDesktop", "parts", "getUrl", "media", "lgDesktopUrl", "desktopUrl", "laptopUrl", "tabletUrl", "mobileUrl", "PromotionalBar", "classNames", "data", "ref", "pictureSource", "PromotionalBar_default"]
+}

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

@@ -0,0 +1,69 @@
+import * as React from 'react';
+import type { Media as MediaType, Theme } from '../../types/props.js';
+import type { ButtonProps } from '../../components/button.js';
+export type SecondaryBannerSemanticName = 'root' | 'title' | 'superTitle' | 'subtitle' | 'content' | 'buttonGroup' | 'primaryButton' | 'secondaryButton';
+/**
+ * SecondaryBanner 业务组件数据接口
+ */
+export interface SecondaryBannerData {
+    /** 主标题*/
+    title?: string;
+    /**
+     * 上标题/引导标题
+     * 通常用于分类、引导性文字
+     */
+    superTitle?: string;
+    /**
+     * 副标题/描述文字
+     * 通常用于补充说明、详细描述
+     */
+    subtitle?: string;
+    /**
+     * 尺寸:
+     *  sm: 小尺寸用于筛选页面
+     *  base: 基础尺寸用于
+     *  lg: 大尺寸用于专题页
+     *  xlg: 活动页（通栏）
+     */
+    size?: 'sm' | 'base' | 'lg' | 'xlg';
+    pcImage?: MediaType;
+    padImage?: MediaType;
+    mobileImage?: MediaType;
+    /** 结束时间（ISO 字符串） */
+    endDate?: string;
+    /** 结束时间时区（如: America/Los_Angeles） */
+    endDate_tz?: string;
+    /**
+     * 时间格式化配置（JSON 字符串）
+     * {"day":"日","hour":"时","minute":"分","second":"秒"}
+     */
+    dateFormat?: string;
+    /** 主按钮配置 */
+    primaryButton?: {
+        text: string;
+        link?: string;
+        onClick?: () => void;
+    } & Omit<ButtonProps, 'children'>;
+    /** 次级按钮配置 */
+    secondaryButton?: {
+        text: string;
+        link?: string;
+        onClick?: () => void;
+    } & Omit<ButtonProps, 'children'>;
+    iconArray?: Array<{
+        pcImage: MediaType;
+    }>;
+    theme?: Theme;
+}
+export interface SecondaryBannerProps extends React.HTMLAttributes<HTMLElement> {
+    /** 业务数据 */
+    data: SecondaryBannerData;
+    classNames?: Partial<Record<SecondaryBannerSemanticName, string>>;
+}
+/**
+ * SecondaryBanner - 次级横幅banner
+ *
+ * @description 是指用户进入二级页面后，无需滚动页面就能在第一屏（即"首屏"）看到的、通常横跨整个浏览器窗口宽度的核心视觉区域。
+ */
+declare const SecondaryBanner: React.ForwardRefExoticComponent<SecondaryBannerProps & React.RefAttributes<HTMLElement>>;
+export default SecondaryBanner;

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

@@ -0,0 +1,2 @@
+"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import*as y from"react";import{cva as D}from"class-variance-authority";import{cn as a}from"../../helpers/index.js";import{Text as x,Button as f,Heading as P,Picture as w}from"../../components/index.js";import j from"../HeroBanner/Countdown.js";import A from"../Media/index.js";const H=D("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"}}),k=y.forwardRef(({className:B,classNames:n={},data:e,...v},I)=>{const{pcImage:T,padImage:h,mobileImage:z,endDate:m,endDate_tz:N,dateFormat:M,size:l="base",iconArray:p,theme:S="light",primaryButton:r,secondaryButton:o}=e,c=y.useId(),i=e.title?`${c}-title`:void 0,u=e.subtitle?`${c}-subtitle`:void 0,b=e.superTitle?`${c}-super-title`:void 0,C=[b,u].filter(Boolean).join(" ")||void 0;return s("section",{ref:I,role:"banner","aria-labelledby":i,"aria-describedby":C,className:a({"aiui-dark":S==="dark"},H({size:l}),B,n?.root),...v,children:[t(A,{pcImage:T,padImage:h,mobileImage:z,className:a("absolute inset-0 size-full object-cover",{"h-fit":l==="xlg"}),imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:!0,playsInline:!0,autoPlay:!0}),s("div",{className:a("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?.content),children:[s("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[e.superTitle&&t(x,{as:"p",size:2,id:b,className:a("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",n?.superTitle),html:e.superTitle}),e.title&&t(P,{as:"h1",size:["xlg","lg"].includes(l)?5:4,id:i,className:a("banner-title ",n?.title),html:e.title}),e.subtitle&&t(x,{as:"p",size:3,id:u,className:a("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",n?.subtitle),html:e.subtitle})]}),m&&t("div",{className:"banner-countdown mt-3",role:"timer","aria-label":"event countdown",children:t(j,{endDate:m,endDate_tz:N,dateFormat:M})}),s("div",{className:a("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",n?.buttonGroup),children:[o?.text&&t(f,{variant:"secondary",onClick:o.onClick,className:a("",n?.secondaryButton),"aria-describedby":i,...o.link?{as:"a",href:o.link}:{},children:o.text}),r?.text&&t(f,{onClick:r.onClick,className:a("",n?.primaryButton),"aria-describedby":i,...r.link?{as:"a",href:r.link}:{},children:r.text})]}),Array.isArray(p)&&p.length>0&&t("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:p.map((d,g)=>d.pcImage?t(w,{source:d.pcImage.url,alt:d.pcImage.alt||`icon ${g+1}`,role:"img",className:"h-auto max-w-none"},g):null)})]})]})});k.displayName="SecondaryBanner";var E=k;export{E as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +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 { cn } from '../../helpers/index.js'\nimport type { Media as MediaType, Theme } from '../../types/props.js'\nimport { Text, Button, Heading, Picture } from '../../components/index.js'\nimport Countdown from '../HeroBanner/Countdown.js'\nimport Media from '../Media/index.js'\nimport type { ButtonProps } from '../../components/button.js'\n\nexport type SecondaryBannerSemanticName =\n  | 'root'\n  | 'title'\n  | 'superTitle'\n  | 'subtitle'\n  | 'content'\n  | 'buttonGroup'\n  | 'primaryButton'\n  | 'secondaryButton'\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   * \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\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\nexport interface SecondaryBannerProps extends React.HTMLAttributes<HTMLElement> {\n  /** \u4E1A\u52A1\u6570\u636E */\n  data: SecondaryBannerData\n  classNames?: Partial<Record<SecondaryBannerSemanticName, string>>\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, ...props }, ref) => {\n    const {\n      pcImage,\n      padImage,\n      mobileImage,\n      endDate,\n      endDate_tz,\n      dateFormat,\n      size = 'base',\n      iconArray: icons,\n      theme = 'light',\n      primaryButton,\n      secondaryButton,\n    } = data\n\n    // \u751F\u6210\u552F\u4E00ID\u7528\u4E8E\u53EF\u8BBF\u95EE\u6027\n    const bannerId = React.useId()\n    const titleId = data.title ? `${bannerId}-title` : undefined\n    const subtitleId = data.subtitle ? `${bannerId}-subtitle` : undefined\n    const superTitleId = data.superTitle ? `${bannerId}-super-title` : undefined\n\n    // \u6784\u5EFAaria-describedby\n    const describedBy = [superTitleId, subtitleId].filter(Boolean).join(' ') || undefined\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={true}\n          playsInline={true}\n          autoPlay={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=\"h1\"\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 mt-3\" role=\"timer\" aria-label=\"event countdown\">\n              <Countdown endDate={endDate} endDate_tz={endDate_tz} dateFormat={dateFormat} />\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={secondaryButton.onClick}\n                className={cn('', classNames?.secondaryButton)}\n                aria-describedby={titleId}\n                {...(secondaryButton.link ? { as: 'a', href: secondaryButton.link } : {})}\n              >\n                {secondaryButton.text}\n              </Button>\n            )}\n            {primaryButton?.text && (\n              <Button\n                onClick={primaryButton.onClick}\n                className={cn('', classNames?.primaryButton)}\n                aria-describedby={titleId}\n                {...(primaryButton.link ? { as: 'a', href: primaryButton.link } : {})}\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=\"h-auto max-w-none\"\n                  />\n                ) : null\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    )\n  }\n)\n\nSecondaryBanner.displayName = 'SecondaryBanner'\nexport default SecondaryBanner\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "React", "cva", "cn", "Text", "Button", "Heading", "Picture", "Countdown", "Media", "secondaryBannerVariants", "SecondaryBanner", "className", "classNames", "data", "props", "ref", "pcImage", "padImage", "mobileImage", "endDate", "endDate_tz", "dateFormat", "size", "icons", "theme", "primaryButton", "secondaryButton", "bannerId", "titleId", "subtitleId", "superTitleId", "describedBy", "icon", "index", "SecondaryBanner_default"]
+}

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

@@ -13,8 +13,8 @@ type SelectStoreType = {
     };
     className?: string;
 };
-declare const _default: import("react").ForwardRefExoticComponent<Omit<SelectStoreType, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: import("react").ForwardRefExoticComponent<SelectStoreType & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 } & import("react").RefAttributes<any>>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { ShelfDisplayProps } from './shelfDisplay.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ShelfDisplayProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<ShelfDisplayProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,15 +1,4 @@
 import type { ContainerProps, CurrencyDisplayType } from '../../types/props.js';
-export declare const PRICE_SYMBOL: any;
-export declare const languageTerritory: (locale: string) => string;
-export declare function formatPrice({ amount, currencyCode, currencyDisplay, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
-    amount: number;
-    currencyCode: string;
-    currencyDisplay?: CurrencyDisplayType;
-    locale: string;
-    maximumFractionDigits?: number;
-    minimumFractionDigits?: number;
-    removeTrailingZeros?: boolean;
-}): string | null;
 export declare function formatVariantPrice({ amount, baseAmount, currencyCode, currencyDisplay, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
     baseAmount: number;
     amount: number;

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

@@ -1,2 +1,2 @@
-import D from"decimal.js";const p={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",nl:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},g=e=>({us:"en-US",uk:"en-GB",ca:"en-CA",eu:"en",fr:"fr-FR",au:"en-AU",my:"en-my","eu-es":"de-DE","eu-fr":"de-DE","eu-it":"de-DE","eu-de":"de-DE","eu-en":"en-US","cz-en":"de-DE","ca-fr":"fr-FR",nl:"de-DE",de:"de-DE",vn:"vi-vn",sg:"en-sg","ae-en":"ae-en",plus:"en-us",cl:"es-cl",dk:"en-dk",fi:"en-fi",no:"en-no",is:"en-is",se:"en-se","eu-pl":"pl-PL",es:"es-es",pl:"pl-PL",nz:"en-NZ","sg-en":"en-SG","sa-en":"en-SA","vn-vi":"vi-VN",ie:"en-IE",tw:"zh-TW"})[e]||"";function d({amount:e,currencyCode:r,currencyDisplay:a,locale:i,maximumFractionDigits:n,minimumFractionDigits:u,removeTrailingZeros:c=!1}){const o=i==="nl"?"EUR":r||"USD",s=g(i);if(!s)return null;let t=new Intl.NumberFormat(s,{style:"currency",currency:o,currencyDisplay:a||"symbol",minimumFractionDigits:n===0?0:u,maximumFractionDigits:n})?.format?.(e);return["eu-de","eu-en","de","eu"].includes(i)&&(t=t?.toString()?.replace?.(/[\s]/g,"")),c&&(t=t?.replace?.(/(\.\d*?[1-9])0+\b/,"$1")?.replace?.(/\.0+\b/,"")?.replace?.(/(\,\d*?[1-9])0+\b/,"$1")?.replace?.(/\,0+\b/,"")),t}function S({amount:e,baseAmount:r,currencyCode:a,currencyDisplay:i,locale:n,maximumFractionDigits:u,minimumFractionDigits:c,removeTrailingZeros:o}){if(typeof Intl>"u")return{price:`${p[n]}${e}`,basePrice:`${p[n]}${r}`,discount:`${p[n]}${r-e||0}`};const s=r>e;let l=null;const t=g(n);if(t){const m=new Intl.NumberFormat(t,{style:"percent"});l=s?m.format((r-e)/r):null}let y;if(s){const m=new D(r).sub(e||0).toNumber();y=d({amount:m,currencyDisplay:i,currencyCode:a||"USD",locale:n,maximumFractionDigits:2})}const f=d({amount:e,currencyCode:a,currencyDisplay:i,locale:n,removeTrailingZeros:o}),b=s?d({amount:r,currencyCode:a,currencyDisplay:i,locale:n,maximumFractionDigits:u,minimumFractionDigits:c,removeTrailingZeros:o}):void 0;return{price:f,basePrice:b,discount:l,discountAmount:y}}export{p as PRICE_SYMBOL,d as formatPrice,S as formatVariantPrice,g as languageTerritory};
+import b from"decimal.js";import{PRICE_SYMBOL as o,formatPrice as p,languageTerritory as h}from"../../helpers/index.js";function P({amount:t,baseAmount:e,currencyCode:n,currencyDisplay:i,locale:r,maximumFractionDigits:d,minimumFractionDigits:l,removeTrailingZeros:u}){if(typeof Intl>"u")return{price:`${o[r]}${t}`,basePrice:`${o[r]}${e}`,discount:`${o[r]}${e-t||0}`};const a=e>t;let m=null;const c=h(r);if(c){const s=new Intl.NumberFormat(c,{style:"percent"});m=a?s.format((e-t)/e):null}let y;if(a){const s=new b(e).sub(t||0).toNumber();y=p({amount:s,currencyDisplay:i,currencyCode:n||"USD",locale:r,maximumFractionDigits:2})}const g=p({amount:t,currencyCode:n,currencyDisplay:i,locale:r,removeTrailingZeros:u}),f=a?p({amount:e,currencyCode:n,currencyDisplay:i,locale:r,maximumFractionDigits:d,minimumFractionDigits:l,removeTrailingZeros:u}):void 0;return{price:g,basePrice:f,discount:m,discountAmount:y}}export{P as formatVariantPrice};
 //# sourceMappingURL=shelfDisplay.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/ShelfDisplay/shelfDisplay.ts"],
-  "sourcesContent": ["import Decimal from 'decimal.js'\nimport type { ContainerProps, CurrencyDisplayType } from '../../types/props.js'\n/* eslint-disable no-useless-escape */\nexport const PRICE_SYMBOL = {\n  us: '$',\n  uk: '\u00A3',\n  ca: '$',\n  eu: '\u20AC',\n  fr: '\u20AC',\n  de: '\u20AC',\n  nl: '\u20AC',\n  vn: '\u20AB',\n  cl: '$',\n  sg: '$',\n  ae: 'AED',\n} as any\n\nexport const languageTerritory = (locale: string) =>\n  // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n  ({\n    us: 'en-US',\n    uk: 'en-GB',\n    ca: 'en-CA',\n    eu: 'en',\n    fr: 'fr-FR',\n    au: 'en-AU',\n    my: 'en-my',\n    'eu-es': 'de-DE',\n    'eu-fr': 'de-DE',\n    'eu-it': 'de-DE',\n    'eu-de': 'de-DE',\n    'eu-en': 'en-US',\n    'cz-en': 'de-DE',\n    'ca-fr': 'fr-FR',\n    nl: 'de-DE',\n    de: 'de-DE',\n    vn: 'vi-vn',\n    sg: 'en-sg',\n    'ae-en': 'ae-en',\n    plus: 'en-us',\n    cl: 'es-cl',\n    dk: 'en-dk',\n    fi: 'en-fi',\n    no: 'en-no',\n    is: 'en-is',\n    se: 'en-se',\n    'eu-pl': 'pl-PL',\n    es: 'es-es',\n    pl: 'pl-PL',\n    nz: 'en-NZ',\n    'sg-en': 'en-SG',\n    'sa-en': 'en-SA',\n    'vn-vi': 'vi-VN',\n    ie: 'en-IE',\n    tw: 'zh-TW',\n  })[locale] || ''\n\nexport function formatPrice({\n  amount,\n  currencyCode,\n  currencyDisplay,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros = false,\n}: {\n  amount: number\n  currencyCode: string\n  currencyDisplay?: CurrencyDisplayType\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  const code = locale === 'nl' ? 'EUR' : currencyCode || 'USD'\n  const localeLanguage = languageTerritory(locale)\n  if (!localeLanguage) {\n    return null\n  }\n  const formatCurrency = new Intl.NumberFormat(localeLanguage, {\n    style: 'currency',\n    currency: code,\n    currencyDisplay: currencyDisplay || 'symbol',\n    minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n    maximumFractionDigits,\n  })\n\n  let formattedValue = formatCurrency?.format?.(amount)\n\n  if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n    formattedValue = formattedValue?.toString()?.replace?.(/[\\s]/g, '')\n  }\n\n  if (removeTrailingZeros) {\n    formattedValue = formattedValue\n      ?.replace?.(/(\\.\\d*?[1-9])0+\\b/, '$1')\n      ?.replace?.(/\\.0+\\b/, '')\n      ?.replace?.(/(\\,\\d*?[1-9])0+\\b/, '$1')\n      ?.replace?.(/\\,0+\\b/, '')\n  }\n\n  return formattedValue\n}\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  currencyDisplay,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  currencyDisplay?: CurrencyDisplayType\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  let discount = null\n  const currentLocale = languageTerritory(locale)\n  if (currentLocale) {\n    const formatDiscount = new Intl.NumberFormat(currentLocale, {\n      style: 'percent',\n    })\n    discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n  }\n  // \u6298\u6263\u91D1\u989D\n  let discountAmount\n  if (hasDiscount) {\n    const savePriceAmount = new Decimal(baseAmount).sub(amount || 0).toNumber()\n    discountAmount = formatPrice({\n      amount: savePriceAmount,\n      currencyDisplay,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    })\n  }\n\n  const price = formatPrice({ amount, currencyCode, currencyDisplay, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        currencyDisplay,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount, discountAmount }\n}\n\ntype EventType = {\n  primaryButton?: (v: any, index: number, data: ShelfDisplayType, coupon: any) => void\n  secondaryButton?: (v: any, index: number, data: ShelfDisplayType, coupon: any) => void\n}\n\nexport interface ShelfDisplayItem {\n  custom_primary_link?: string\n  custom_secondary_link?: string\n  id?: string\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img?: {\n    url: string\n  }\n  handle?: string\n  sku?: string\n  /** \u6298\u6263\u540E\u4EF7\u683C*/\n  price?: string\n  title?: string\n  /** \u6298\u6263\u524D\u4EF7\u683C*/\n  basePrice?: string\n  subTitle?: string\n  /** \u6807\u7B7E*/\n  tagItems?: string[]\n  tab?: string\n  data?: ShelfDisplayItem[]\n  custom_name?: string\n  custom_description?: string\n  custom_image?: string\n  custom_theme?: string\n}\n\nexport type ShelfDisplayType = {\n  title?: string\n  isShowTab?: boolean\n  isShowTag?: boolean\n  isShowRecommendedCard?: boolean\n  isShowOriginalPrice?: boolean\n  direction?: 'horizontal' | 'vertical'\n  align?: 'left' | 'center' | 'right'\n  productsTab?: any[]\n  productsCard?: any[]\n  /** \u5361\u7247\u5F62\u72B6 */\n  itemShape?: 'round' | 'square'\n  /** \u6309\u94AE\u5F62\u72B6 */\n  shape?: 'round' | 'square'\n  /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n  tabShape?: 'rounded' | 'square'\n  /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n  primaryButton?: string\n  primaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  /** \u526F\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: string\n  secondaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  theme?: 'light' | 'dark'\n  containerProps?: ContainerProps\n}\n\nexport interface ShelfDisplayProps {\n  data: ShelfDisplayType\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  recommendedData?: any[]\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  className?: string\n  key?: string\n  target?: '_self' | '_blank'\n  breakpoints?: {\n    [key: number]: {\n      spaceBetween: number\n      freeMode: boolean\n      slidesPerView: number\n    }\n  }\n  metafields?: any\n  isDisplayGudgments?: boolean\n  isDisplayBackImage?: boolean\n}\n"],
-  "mappings": "AAAA,OAAOA,MAAa,aAGb,MAAMC,EAAe,CAC1B,GAAI,IACJ,GAAI,OACJ,GAAI,IACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,GAAI,IACJ,GAAI,IACJ,GAAI,KACN,EAEaC,EAAqBC,IAE/B,CACC,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,KACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,QAAS,QACT,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,KAAM,QACN,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,QAAS,QACT,QAAS,QACT,GAAI,QACJ,GAAI,OACN,GAAGA,CAAM,GAAK,GAET,SAASC,EAAY,CAC1B,OAAAC,EACA,aAAAC,EACA,gBAAAC,EACA,OAAAJ,EACA,sBAAAK,EACA,sBAAAC,EACA,oBAAAC,EAAsB,EACxB,EAQG,CACD,MAAMC,EAAOR,IAAW,KAAO,MAAQG,GAAgB,MACjDM,EAAiBV,EAAkBC,CAAM,EAC/C,GAAI,CAACS,EACH,OAAO,KAUT,IAAIC,EARmB,IAAI,KAAK,aAAaD,EAAgB,CAC3D,MAAO,WACP,SAAUD,EACV,gBAAiBJ,GAAmB,SACpC,sBAAuBC,IAA0B,EAAI,EAAIC,EACzD,sBAAAD,CACF,CAAC,GAEoC,SAASH,CAAM,EAEpD,MAAI,CAAC,QAAS,QAAS,KAAM,IAAI,EAAE,SAASF,CAAM,IAChDU,EAAiBA,GAAgB,SAAS,GAAG,UAAU,QAAS,EAAE,GAGhEH,IACFG,EAAiBA,GACb,UAAU,oBAAqB,IAAI,GACnC,UAAU,SAAU,EAAE,GACtB,UAAU,oBAAqB,IAAI,GACnC,UAAU,SAAU,EAAE,GAGrBA,CACT,CAEO,SAASC,EAAmB,CACjC,OAAAT,EACA,WAAAU,EACA,aAAAT,EACA,gBAAAC,EACA,OAAAJ,EACA,sBAAAK,EACA,sBAAAC,EACA,oBAAAC,CACF,EASG,CACD,GAAI,OAAO,KAAS,IAClB,MAAO,CACL,MAAO,GAAGT,EAAaE,CAAM,CAAC,GAAGE,CAAM,GACvC,UAAW,GAAGJ,EAAaE,CAAM,CAAC,GAAGY,CAAU,GAC/C,SAAU,GAAGd,EAAaE,CAAM,CAAC,GAAGY,EAAaV,GAAU,CAAC,EAC9D,EAGF,MAAMW,EAAcD,EAAaV,EACjC,IAAIY,EAAW,KACf,MAAMC,EAAgBhB,EAAkBC,CAAM,EAC9C,GAAIe,EAAe,CACjB,MAAMC,EAAiB,IAAI,KAAK,aAAaD,EAAe,CAC1D,MAAO,SACT,CAAC,EACDD,EAAWD,EAAcG,EAAe,QAAQJ,EAAaV,GAAUU,CAAU,EAAI,IACvF,CAEA,IAAIK,EACJ,GAAIJ,EAAa,CACf,MAAMK,EAAkB,IAAIrB,EAAQe,CAAU,EAAE,IAAIV,GAAU,CAAC,EAAE,SAAS,EAC1Ee,EAAiBhB,EAAY,CAC3B,OAAQiB,EACR,gBAAAd,EACA,aAAcD,GAAgB,MAC9B,OAAAH,EACA,sBAAuB,CACzB,CAAC,CACH,CAEA,MAAMmB,EAAQlB,EAAY,CAAE,OAAAC,EAAQ,aAAAC,EAAc,gBAAAC,EAAiB,OAAAJ,EAAQ,oBAAAO,CAAoB,CAAC,EAC1Fa,EAAYP,EACdZ,EAAY,CACV,OAAQW,EACR,aAAAT,EACA,gBAAAC,EACA,OAAAJ,EACA,sBAAAK,EACA,sBAAAC,EACA,oBAAAC,CACF,CAAC,EACD,OAEJ,MAAO,CAAE,MAAAY,EAAO,UAAAC,EAAW,SAAAN,EAAU,eAAAG,CAAe,CACtD",
-  "names": ["Decimal", "PRICE_SYMBOL", "languageTerritory", "locale", "formatPrice", "amount", "currencyCode", "currencyDisplay", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "code", "localeLanguage", "formattedValue", "formatVariantPrice", "baseAmount", "hasDiscount", "discount", "currentLocale", "formatDiscount", "discountAmount", "savePriceAmount", "price", "basePrice"]
+  "sourcesContent": ["import Decimal from 'decimal.js'\nimport type { ContainerProps, CurrencyDisplayType } from '../../types/props.js'\n/* eslint-disable no-useless-escape */\nimport { PRICE_SYMBOL, formatPrice, languageTerritory } from '../../helpers/index.js'\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  currencyDisplay,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  currencyDisplay?: CurrencyDisplayType\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  let discount = null\n  const currentLocale = languageTerritory(locale)\n  if (currentLocale) {\n    const formatDiscount = new Intl.NumberFormat(currentLocale, {\n      style: 'percent',\n    })\n    discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n  }\n  // \u6298\u6263\u91D1\u989D\n  let discountAmount\n  if (hasDiscount) {\n    const savePriceAmount = new Decimal(baseAmount).sub(amount || 0).toNumber()\n    discountAmount = formatPrice({\n      amount: savePriceAmount,\n      currencyDisplay,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    })\n  }\n\n  const price = formatPrice({ amount, currencyCode, currencyDisplay, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        currencyDisplay,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount, discountAmount }\n}\n\ntype EventType = {\n  primaryButton?: (v: any, index: number, data: ShelfDisplayType, coupon: any) => void\n  secondaryButton?: (v: any, index: number, data: ShelfDisplayType, coupon: any) => void\n}\n\nexport interface ShelfDisplayItem {\n  custom_primary_link?: string\n  custom_secondary_link?: string\n  id?: string\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  img?: {\n    url: string\n  }\n  handle?: string\n  sku?: string\n  /** \u6298\u6263\u540E\u4EF7\u683C*/\n  price?: string\n  title?: string\n  /** \u6298\u6263\u524D\u4EF7\u683C*/\n  basePrice?: string\n  subTitle?: string\n  /** \u6807\u7B7E*/\n  tagItems?: string[]\n  tab?: string\n  data?: ShelfDisplayItem[]\n  custom_name?: string\n  custom_description?: string\n  custom_image?: string\n  custom_theme?: string\n}\n\nexport type ShelfDisplayType = {\n  title?: string\n  isShowTab?: boolean\n  isShowTag?: boolean\n  isShowRecommendedCard?: boolean\n  isShowOriginalPrice?: boolean\n  direction?: 'horizontal' | 'vertical'\n  align?: 'left' | 'center' | 'right'\n  productsTab?: any[]\n  productsCard?: any[]\n  /** \u5361\u7247\u5F62\u72B6 */\n  itemShape?: 'round' | 'square'\n  /** \u6309\u94AE\u5F62\u72B6 */\n  shape?: 'round' | 'square'\n  /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n  tabShape?: 'rounded' | 'square'\n  /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n  primaryButton?: string\n  primaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  /** \u526F\u6309\u94AE\u914D\u7F6E */\n  secondaryButton?: string\n  secondaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore'\n  theme?: 'light' | 'dark'\n  containerProps?: ContainerProps\n}\n\nexport interface ShelfDisplayProps {\n  data: ShelfDisplayType\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  recommendedData?: any[]\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: EventType\n  className?: string\n  key?: string\n  target?: '_self' | '_blank'\n  breakpoints?: {\n    [key: number]: {\n      spaceBetween: number\n      freeMode: boolean\n      slidesPerView: number\n    }\n  }\n  metafields?: any\n  isDisplayGudgments?: boolean\n  isDisplayBackImage?: boolean\n}\n"],
+  "mappings": "AAAA,OAAOA,MAAa,aAGpB,OAAS,gBAAAC,EAAc,eAAAC,EAAa,qBAAAC,MAAyB,yBAEtD,SAASC,EAAmB,CACjC,OAAAC,EACA,WAAAC,EACA,aAAAC,EACA,gBAAAC,EACA,OAAAC,EACA,sBAAAC,EACA,sBAAAC,EACA,oBAAAC,CACF,EASG,CACD,GAAI,OAAO,KAAS,IAClB,MAAO,CACL,MAAO,GAAGX,EAAaQ,CAAM,CAAC,GAAGJ,CAAM,GACvC,UAAW,GAAGJ,EAAaQ,CAAM,CAAC,GAAGH,CAAU,GAC/C,SAAU,GAAGL,EAAaQ,CAAM,CAAC,GAAGH,EAAaD,GAAU,CAAC,EAC9D,EAGF,MAAMQ,EAAcP,EAAaD,EACjC,IAAIS,EAAW,KACf,MAAMC,EAAgBZ,EAAkBM,CAAM,EAC9C,GAAIM,EAAe,CACjB,MAAMC,EAAiB,IAAI,KAAK,aAAaD,EAAe,CAC1D,MAAO,SACT,CAAC,EACDD,EAAWD,EAAcG,EAAe,QAAQV,EAAaD,GAAUC,CAAU,EAAI,IACvF,CAEA,IAAIW,EACJ,GAAIJ,EAAa,CACf,MAAMK,EAAkB,IAAIlB,EAAQM,CAAU,EAAE,IAAID,GAAU,CAAC,EAAE,SAAS,EAC1EY,EAAiBf,EAAY,CAC3B,OAAQgB,EACR,gBAAAV,EACA,aAAcD,GAAgB,MAC9B,OAAAE,EACA,sBAAuB,CACzB,CAAC,CACH,CAEA,MAAMU,EAAQjB,EAAY,CAAE,OAAAG,EAAQ,aAAAE,EAAc,gBAAAC,EAAiB,OAAAC,EAAQ,oBAAAG,CAAoB,CAAC,EAC1FQ,EAAYP,EACdX,EAAY,CACV,OAAQI,EACR,aAAAC,EACA,gBAAAC,EACA,OAAAC,EACA,sBAAAC,EACA,sBAAAC,EACA,oBAAAC,CACF,CAAC,EACD,OAEJ,MAAO,CAAE,MAAAO,EAAO,UAAAC,EAAW,SAAAN,EAAU,eAAAG,CAAe,CACtD",
+  "names": ["Decimal", "PRICE_SYMBOL", "formatPrice", "languageTerritory", "formatVariantPrice", "amount", "baseAmount", "currencyCode", "currencyDisplay", "locale", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "hasDiscount", "discount", "currentLocale", "formatDiscount", "discountAmount", "savePriceAmount", "price", "basePrice"]
 }

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

@@ -2,8 +2,8 @@ import React from 'react';
 import type { SloganProps } from './types.js';
 export declare const componentType = "copy";
 export declare const componentName = "brand_slogan";
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<SloganProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<SloganProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { SpacerProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<SpacerProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<SpacerProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,6 +1,6 @@
 import React from 'react';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<Omit<any, "ref"> & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<Omit<any, "ref"> & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,2 +1,2 @@
-"use client";import{Fragment as Y,jsx as s,jsxs as c}from"react/jsx-runtime";import U from"./dropdown.js";import{useAiuiContext as V}from"../AiuiProvider/index.js";import{useMediaQuery as B}from"react-responsive";import{useMemo as q,useState as m,useEffect as S}from"react";import{withLayout as z}from"../../shared/Styles.js";import{formatVariantPrice as Q}from"../ShelfDisplay/shelfDisplay.js";import{Picture as x,Text as W,Button as G,Heading as E}from"../../components/index.js";import J,{useImperativeHandle as K,useRef as X}from"react";const L=J.forwardRef((j,A)=>{const{data:g,buildData:p,onChange:C,onSecondaryChange:Z}=j||{},v=B({query:"(max-width: 768px)"}),[a,b]=m({}),[T,F]=m([]),[h,k]=m(!1),[f,w]=m({}),y=X(null),{locale:H="us",currencyDisplay:R}=V(),{LeftMenu:N,RightMenu:D,DefaultSelectMenu:u}=q(()=>g?.data||{},[g?.data]),I=e=>{try{const l=new URL(e).pathname.toLowerCase();return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(l)}catch{return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(e)}},O=(e,t)=>{const l=e?.variants?.find?.(d=>d?.sku===e?.sku),n=l?.coupons?.[0],{price:r,basePrice:o}=Q({locale:H||"us",amount:n?n?.variant_price4wscode:l?.price,baseAmount:n?l?.price:0,currencyDisplay:R,currencyCode:e?.price?.currencyCode||"USD"}),i=typeof u?.buttonText=="string"?u?.buttonText:u?.buttonText?.[String(t)]||"";return c("div",{className:"specs-sku-node-wrap box-border",children:[c(W,{className:"md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold",onClick:()=>{if(Object.keys(a||{})?.length<=2)return null;w({...f,[t]:!f?.[t]})},children:[c("div",{className:"flex items-center justify-between overflow-hidden",children:[s("div",{className:"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base",title:a?.[t]?.name||"",children:a?.[t]?.name||""}),Object.keys(a||{})?.length>2?s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"25",viewBox:"0 0 24 25",fill:"none",className:"openDropDown",children:s("path",{d:"M6 9.5L12 15.5L18 9.5",stroke:"#1D1D1F",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}):null]}),s(U,{index:t,list:T,active:a,setActive:b,visible:f,setVisible:w})]}),s("div",{className:"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]",children:s(x,{source:l?.image?.url||"",className:"aspect-h-[280] aspect-w-[280]",imgClassName:"w-full h-full object-cover hover:scale-105 transition-all duration-300"})}),l?.availableForSale?c("div",{className:"lg-desktop:text-2xl mb-2 mt-6 flex items-center text-xl font-bold",children:[s("div",{className:"specs-sku-node-price text-[#080A0F]",children:r||""}),o&&s("div",{className:"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through",children:o})]}):!1,i?s(G,{onClick:()=>{C?.(e,t)},className:"specs-sku-node-button",children:i}):null]})},P=e=>e&&typeof e!="string"?c("div",{className:"size-full",children:[s("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:e?.text||""}}),s(x,{source:e?.imgUrl,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"})]}):s("div",{className:"break-all",children:I(e)?s(x,{source:e,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"}):s("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:e||""}})}),M=e=>e.map((t,l)=>{const n=l===0;return c("div",{className:"l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6]  specs-product-node-wrap",children:[s(E,{as:"h3",html:t||"",className:"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm"}),s("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${h?3:2} specs-product-node-body col-span-2 grid flex-1 py-6`,children:Object.keys(a)?.map?.(r=>{const o=a?.[r],i=D?.menus?.find?.(d=>d?.handle===o?.handle)?.subTitle;return P(i?.[t])})})]},t)}),_=e=>{if(!a)return;const{subTitle:t,isProduct:l}=e;return l?c(Y,{children:[c("div",{className:"l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]",children:[e?.title&&s(E,{as:"h3",html:e?.title||"",className:"l:hidden specs-item-product-title"}),s("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${h?3:2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`,children:Object.keys(a)?.map((n,r)=>{const o=a?.[n],i=p?.products?.find?.(d=>d?.handle===o?.handle);return s("div",{children:O({...i,item:n,sku:o?.sku},r)},n)})})]}),t?.length?M(t):null]}):M(t)};return K(A,()=>y.current),S(()=>{if(!p?.products?.length)return;const e=u?.sku?.split?.(",")||[];let t={};e?.forEach?.((n,r)=>{const o=p?.products?.find?.(i=>{if(i?.variants?.find?.($=>$?.sku===n))return!0});o&&(t={...t,[r]:{sku:n,name:o?.name||o?.title,handle:o?.handle}})});const l=p?.products?.filter(n=>D?.menus?.find(r=>r?.handle===n?.handle));b(t),F(l),k(e?.length>2)},[p]),S(()=>{if(v){const e=Object.keys(a||{});if(e?.length>2){const t=e?.slice?.(0,2);let l={};t?.forEach?.(n=>{l={...l,[n]:a?.[n]}}),k(!1),b(l)}}},[v]),s("div",{className:"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]",ref:y,children:N?.data?s("div",{className:"specs-wrapper-content box-border w-full overflow-hidden",children:N?.data?.map?.((e,t)=>s("div",{className:"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0",children:_(e)},t))}):null})});L.displayName="Specs";var ie=z(L);export{ie as default};
+"use client";import{Fragment as j,jsx as s,jsxs as c}from"react/jsx-runtime";import V from"./dropdown.js";import{useAiuiContext as B}from"../AiuiProvider/index.js";import{useMediaQuery as q}from"react-responsive";import{useMemo as z,useState as m,useEffect as S}from"react";import{withLayout as Q}from"../../shared/Styles.js";import{formatVariantPrice as W}from"../ShelfDisplay/shelfDisplay.js";import{Picture as f,Text as G,Button as J,Heading as E}from"../../components/index.js";import K,{useImperativeHandle as X,useRef as Y}from"react";const L=K.forwardRef((A,C)=>{const{data:g,buildData:p,onChange:T,onSecondaryChange:Z}=A||{},v=q({query:"(max-width: 768px)"}),[a,b]=m({}),[F,H]=m([]),[h,k]=m(!1),[x,w]=m({}),y=Y(null),{locale:R="us",currencyDisplay:I}=B(),{LeftMenu:N,RightMenu:D,DefaultSelectMenu:u}=z(()=>g?.data||{},[g?.data]),O=e=>{try{const l=new URL(e).pathname.toLowerCase();return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(l)}catch{return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(e)}},P=(e,t)=>{const l=e?.variants?.find?.(d=>d?.sku===e?.sku),n=l?.coupons?.[0],{price:r,basePrice:o}=W({locale:R||"us",amount:n?n?.variant_price4wscode:l?.price,baseAmount:n?l?.price:0,currencyDisplay:I,currencyCode:e?.price?.currencyCode||"USD"}),i=typeof u?.buttonText=="string"?u?.buttonText:u?.buttonText?.[String(t)]||"";return c("div",{className:"specs-sku-node-wrap box-border",children:[c(G,{className:"md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold",onClick:()=>{if(Object.keys(a||{})?.length<=2)return null;w({...x,[t]:!x?.[t]})},children:[c("div",{className:"flex items-center justify-between overflow-hidden",children:[s("div",{className:"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base",title:a?.[t]?.name||"",children:a?.[t]?.name||""}),Object.keys(a||{})?.length>2?s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"25",viewBox:"0 0 24 25",fill:"none",className:"openDropDown",children:s("path",{d:"M6 9.5L12 15.5L18 9.5",stroke:"#1D1D1F",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}):null]}),s(V,{index:t,list:F,active:a,setActive:b,visible:x,setVisible:w})]}),s("div",{className:"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]",children:s(f,{source:l?.image?.url||"",className:"aspect-h-[280] aspect-w-[280]",imgClassName:"w-full h-full object-cover hover:scale-105 transition-all duration-300"})}),s("div",{className:"lg-desktop:text-2xl mb-2 mt-6 text-xl font-bold",children:s("div",{className:"lg-desktop:min-h-[32px] flex  min-h-[28px] items-center",children:l?.availableForSale?c(j,{children:[s("div",{className:"specs-sku-node-price text-[#080A0F]",children:r||""}),o&&s("div",{className:"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through",children:o})]}):null})}),i?s(J,{onClick:()=>{T?.(e,t)},className:"specs-sku-node-button",children:i}):null]})},_=e=>e&&typeof e!="string"?c("div",{className:"size-full",children:[s("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:e?.text||""}}),s(f,{source:e?.imgUrl,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"})]}):s("div",{className:"break-all",children:O(e)?s(f,{source:e,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"}):s("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:e||""}})}),M=e=>e.map((t,l)=>{const n=l===0;return c("div",{className:"l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6]  specs-product-node-wrap",children:[s(E,{as:"h3",html:t||"",className:"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm"}),s("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${h?3:2} specs-product-node-body col-span-2 grid flex-1 py-6`,children:Object.keys(a)?.map?.(r=>{const o=a?.[r],i=D?.menus?.find?.(d=>d?.handle===o?.handle)?.subTitle;return _(i?.[t])})})]},t)}),$=e=>{if(!a)return;const{subTitle:t,isProduct:l}=e;return l?c(j,{children:[c("div",{className:"l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]",children:[e?.title&&s(E,{as:"h3",html:e?.title||"",className:"l:hidden specs-item-product-title"}),s("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${h?3:2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`,children:Object.keys(a)?.map((n,r)=>{const o=a?.[n],i=p?.products?.find?.(d=>d?.handle===o?.handle);return s("div",{children:P({...i,item:n,sku:o?.sku},r)},n)})})]}),t?.length?M(t):null]}):M(t)};return X(C,()=>y.current),S(()=>{if(!p?.products?.length)return;const e=u?.sku?.split?.(",")||[];let t={};e?.forEach?.((n,r)=>{const o=p?.products?.find?.(i=>{if(i?.variants?.find?.(U=>U?.sku===n))return!0});o&&(t={...t,[r]:{sku:n,name:o?.name||o?.title,handle:o?.handle}})});const l=p?.products?.filter(n=>D?.menus?.find(r=>r?.handle===n?.handle));b(t),H(l),k(e?.length>2)},[p]),S(()=>{if(v){const e=Object.keys(a||{});if(e?.length>2){const t=e?.slice?.(0,2);let l={};t?.forEach?.(n=>{l={...l,[n]:a?.[n]}}),k(!1),b(l)}}},[v]),s("div",{className:"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]",ref:y,children:N?.data?s("div",{className:"specs-wrapper-content box-border w-full overflow-hidden",children:N?.data?.map?.((e,t)=>s("div",{className:"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0",children:$(e)},t))}):null})});L.displayName="Specs";var ie=Q(L);export{ie as default};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Specs/index.tsx"],
-  "sourcesContent": ["'use client'\n\nimport DropDown from './dropdown.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useMemo, useState, useEffect } from 'react'\nimport { withLayout } from '../../shared/Styles.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport { Picture, Text, Button, Heading } from '../../components/index.js'\nimport React, { useImperativeHandle, useRef } from 'react'\n\nconst Specs = React.forwardRef<HTMLDivElement, any>((page: any, ref) => {\n  const { data, buildData, onChange, onSecondaryChange } = page || {}\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n  const [active, setActive] = useState<any>({})\n  const [menuList, setMenuList] = useState<any[]>([])\n  const [isShowMax, setIsShowMax] = useState<boolean>(false)\n  const [visibleActive, setVisibleActive] = useState<{ [key: number]: boolean }>({})\n\n  const innerRef = useRef<HTMLDivElement>(null)\n\n  const { locale = 'us', currencyDisplay } = useAiuiContext()\n\n  const { LeftMenu, RightMenu, DefaultSelectMenu } = useMemo(() => data?.data || {}, [data?.data])\n\n  const isImageUrl = (urlPath: string) => {\n    try {\n      const url = new URL(urlPath)\n      const path = url.pathname.toLowerCase()\n      return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(path)\n    } catch (e) {\n      // \u5982\u679C\u4F20\u5165\u7684\u4E0D\u662F\u6709\u6548URL\uFF08\u5982\u76F8\u5BF9\u8DEF\u5F84\uFF09\uFF0C\u76F4\u63A5\u68C0\u67E5\u8DEF\u5F84\n      return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(urlPath)\n    }\n  }\n\n  const skuNode = (product: any, index: number) => {\n    const findSku = product?.variants?.find?.((item: any) => item?.sku === product?.sku)\n    const coupon = findSku?.coupons?.[0]\n    const { price, basePrice } = formatVariantPrice({\n      locale: locale || 'us',\n      amount: coupon ? coupon?.variant_price4wscode : findSku?.price,\n      baseAmount: coupon ? findSku?.price : 0,\n      currencyDisplay,\n      currencyCode: product?.price?.currencyCode || 'USD',\n    })\n    const buttonTextValue =\n      typeof DefaultSelectMenu?.buttonText === 'string'\n        ? DefaultSelectMenu?.buttonText\n        : DefaultSelectMenu?.buttonText?.[String(index)] || ''\n    return (\n      <div className=\"specs-sku-node-wrap box-border\">\n        <Text\n          className={`md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold`}\n          onClick={() => {\n            if (Object.keys(active || {})?.length <= 2) return null\n\n            setVisibleActive({\n              ...visibleActive,\n              [index]: !visibleActive?.[index],\n            })\n          }}\n        >\n          <div className=\"flex items-center justify-between overflow-hidden\">\n            <div\n              className=\"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base\"\n              title={active?.[index]?.name || ''}\n            >\n              {active?.[index]?.name || ''}\n            </div>\n            {Object.keys(active || {})?.length > 2 ? (\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                width=\"24\"\n                height=\"25\"\n                viewBox=\"0 0 24 25\"\n                fill=\"none\"\n                className=\"openDropDown\"\n              >\n                <path\n                  d=\"M6 9.5L12 15.5L18 9.5\"\n                  stroke=\"#1D1D1F\"\n                  strokeWidth=\"2\"\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                />\n              </svg>\n            ) : null}\n          </div>\n          <DropDown\n            index={index}\n            list={menuList}\n            active={active}\n            setActive={setActive}\n            visible={visibleActive}\n            setVisible={setVisibleActive}\n          />\n        </Text>\n        <div className=\"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]\">\n          <Picture\n            source={findSku?.image?.url || ''}\n            className=\"aspect-h-[280] aspect-w-[280]\"\n            imgClassName=\"w-full h-full object-cover hover:scale-105 transition-all duration-300\"\n          />\n        </div>\n        {findSku?.availableForSale ? (\n          <div className=\"lg-desktop:text-2xl mb-2 mt-6 flex items-center text-xl font-bold\">\n            <div className=\"specs-sku-node-price text-[#080A0F]\">{price || ''}</div>\n            {basePrice && (\n              <div className=\"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through\">\n                {basePrice}\n              </div>\n            )}\n          </div>\n        ) : (\n          false\n        )}\n        {buttonTextValue ? (\n          <Button\n            onClick={() => {\n              onChange?.(product, index)\n            }}\n            className=\"specs-sku-node-button\"\n          >\n            {buttonTextValue}\n          </Button>\n        ) : null}\n      </div>\n    )\n  }\n\n  const normalNode = (v: any) => {\n    if (v && typeof v !== 'string') {\n      return (\n        <div className=\"size-full\">\n          <p\n            className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm\"\n            dangerouslySetInnerHTML={{\n              __html: v?.text || '',\n            }}\n          />\n          <Picture\n            source={v?.imgUrl}\n            className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n            imgClassName=\"w-full h-full object-cover\"\n          />\n        </div>\n      )\n    }\n    return (\n      <div className=\"break-all\">\n        {isImageUrl(v) ? (\n          <Picture\n            source={v}\n            className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n            imgClassName=\"w-full h-full object-cover\"\n          />\n        ) : (\n          <p\n            className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm\"\n            dangerouslySetInnerHTML={{\n              __html: v || '',\n            }}\n          />\n        )}\n      </div>\n    )\n  }\n\n  const productNode = (data: any) => {\n    return data.map((st: any, idx: number) => {\n      const isFirstParameter = idx === 0\n      return (\n        <div\n          key={st}\n          className={`l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] ${isFirstParameter ? '' : ''} specs-product-node-wrap`}\n        >\n          <Heading\n            as=\"h3\"\n            html={st || ''}\n            className=\"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm\"\n          />\n          <div\n            className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${isShowMax ? 3 : 2} specs-product-node-body col-span-2 grid flex-1 py-6`}\n          >\n            {Object.keys(active)?.map?.((item: string) => {\n              const currentData = active?.[item]\n              const currentMenus = RightMenu?.menus?.find?.(\n                (item: any) => item?.handle === currentData?.handle\n              )?.subTitle\n              return normalNode(currentMenus?.[st])\n            })}\n          </div>\n        </div>\n      )\n    })\n  }\n\n  // \u5DE6\u4FA7\u6807\u9898\u83DC\u5355\n  const childrenNode = (node: any) => {\n    if (!active) return\n    const { subTitle, isProduct } = node\n    // \u5982\u679C\u662F\u4EA7\u54C1\n    if (isProduct) {\n      return (\n        <>\n          <div\n            className={`l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]`}\n          >\n            {node?.title && <Heading as=\"h3\" html={node?.title || ''} className=\"l:hidden specs-item-product-title\" />}\n            <div\n              className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${isShowMax ? 3 : 2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`}\n            >\n              {Object.keys(active)?.map((item: string, index: number) => {\n                const currentData = active?.[item]\n                const currentProduct = buildData?.products?.find?.((item: any) => item?.handle === currentData?.handle)\n                return <div key={item}>{skuNode({ ...currentProduct, item: item, sku: currentData?.sku }, index)}</div>\n              })}\n            </div>\n          </div>\n          {subTitle?.length ? productNode(subTitle) : null}\n        </>\n      )\n    }\n    return productNode(subTitle)\n  }\n\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  useEffect(() => {\n    if (!buildData?.products?.length) return\n    const skus = DefaultSelectMenu?.sku?.split?.(',') || []\n    let currentActive = {}\n    skus?.forEach?.((sku: string, index: number) => {\n      const findData = buildData?.products?.find?.((item: any) => {\n        const findSku = item?.variants?.find?.((v: any) => v?.sku === sku)\n        if (findSku) return true\n      })\n      if (findData) {\n        currentActive = {\n          ...currentActive,\n          [index]: {\n            sku: sku,\n            name: findData?.name || findData?.title,\n            handle: findData?.handle,\n          },\n        }\n      }\n    })\n    const currentMenu = buildData?.products?.filter((item: any) => {\n      return RightMenu?.menus?.find((params: any) => params?.handle === item?.handle)\n    })\n    setActive(currentActive)\n    setMenuList(currentMenu)\n    setIsShowMax(skus?.length > 2)\n  }, [buildData])\n\n  useEffect(() => {\n    if (isMobile) {\n      const currentActive = Object.keys(active || {})\n      if (currentActive?.length > 2) {\n        const newActive = currentActive?.slice?.(0, 2)\n        let newShowActive = {}\n        newActive?.forEach?.((item: string) => {\n          newShowActive = { ...newShowActive, [item]: active?.[item] }\n        })\n        setIsShowMax(false)\n        setActive(newShowActive)\n      }\n    }\n  }, [isMobile])\n\n  return (\n    <div className=\"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]\" ref={innerRef}>\n      {LeftMenu?.data ? (\n        <div className=\"specs-wrapper-content box-border w-full overflow-hidden\">\n          {LeftMenu?.data?.map?.((item: any, index: number) => {\n            return (\n              <div key={index} className=\"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0\">\n                {childrenNode(item)}\n              </div>\n            )\n          })}\n        </div>\n      ) : null}\n    </div>\n  )\n})\n\nSpecs.displayName = 'Specs'\n\nexport default withLayout(Specs)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport DropDown from './dropdown.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useMemo, useState, useEffect } from 'react'\nimport { withLayout } from '../../shared/Styles.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport { Picture, Text, Button, Heading } from '../../components/index.js'\nimport React, { useImperativeHandle, useRef } from 'react'\n\nconst Specs = React.forwardRef<HTMLDivElement, any>((page: any, ref) => {\n  const { data, buildData, onChange, onSecondaryChange } = page || {}\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n  const [active, setActive] = useState<any>({})\n  const [menuList, setMenuList] = useState<any[]>([])\n  const [isShowMax, setIsShowMax] = useState<boolean>(false)\n  const [visibleActive, setVisibleActive] = useState<{ [key: number]: boolean }>({})\n\n  const innerRef = useRef<HTMLDivElement>(null)\n\n  const { locale = 'us', currencyDisplay } = useAiuiContext()\n\n  const { LeftMenu, RightMenu, DefaultSelectMenu } = useMemo(() => data?.data || {}, [data?.data])\n\n  const isImageUrl = (urlPath: string) => {\n    try {\n      const url = new URL(urlPath)\n      const path = url.pathname.toLowerCase()\n      return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(path)\n    } catch (e) {\n      // \u5982\u679C\u4F20\u5165\u7684\u4E0D\u662F\u6709\u6548URL\uFF08\u5982\u76F8\u5BF9\u8DEF\u5F84\uFF09\uFF0C\u76F4\u63A5\u68C0\u67E5\u8DEF\u5F84\n      return /\\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(urlPath)\n    }\n  }\n\n  const skuNode = (product: any, index: number) => {\n    const findSku = product?.variants?.find?.((item: any) => item?.sku === product?.sku)\n    const coupon = findSku?.coupons?.[0]\n    const { price, basePrice } = formatVariantPrice({\n      locale: locale || 'us',\n      amount: coupon ? coupon?.variant_price4wscode : findSku?.price,\n      baseAmount: coupon ? findSku?.price : 0,\n      currencyDisplay,\n      currencyCode: product?.price?.currencyCode || 'USD',\n    })\n    const buttonTextValue =\n      typeof DefaultSelectMenu?.buttonText === 'string'\n        ? DefaultSelectMenu?.buttonText\n        : DefaultSelectMenu?.buttonText?.[String(index)] || ''\n    return (\n      <div className=\"specs-sku-node-wrap box-border\">\n        <Text\n          className={`md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold`}\n          onClick={() => {\n            if (Object.keys(active || {})?.length <= 2) return null\n\n            setVisibleActive({\n              ...visibleActive,\n              [index]: !visibleActive?.[index],\n            })\n          }}\n        >\n          <div className=\"flex items-center justify-between overflow-hidden\">\n            <div\n              className=\"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base\"\n              title={active?.[index]?.name || ''}\n            >\n              {active?.[index]?.name || ''}\n            </div>\n            {Object.keys(active || {})?.length > 2 ? (\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                width=\"24\"\n                height=\"25\"\n                viewBox=\"0 0 24 25\"\n                fill=\"none\"\n                className=\"openDropDown\"\n              >\n                <path\n                  d=\"M6 9.5L12 15.5L18 9.5\"\n                  stroke=\"#1D1D1F\"\n                  strokeWidth=\"2\"\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                />\n              </svg>\n            ) : null}\n          </div>\n          <DropDown\n            index={index}\n            list={menuList}\n            active={active}\n            setActive={setActive}\n            visible={visibleActive}\n            setVisible={setVisibleActive}\n          />\n        </Text>\n        <div className=\"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]\">\n          <Picture\n            source={findSku?.image?.url || ''}\n            className=\"aspect-h-[280] aspect-w-[280]\"\n            imgClassName=\"w-full h-full object-cover hover:scale-105 transition-all duration-300\"\n          />\n        </div>\n        <div className=\"lg-desktop:text-2xl mb-2 mt-6 text-xl font-bold\">\n          <div className=\"lg-desktop:min-h-[32px] flex  min-h-[28px] items-center\">\n            {findSku?.availableForSale ? (\n              <>\n                <div className=\"specs-sku-node-price text-[#080A0F]\">{price || ''}</div>\n                {basePrice && (\n                  <div className=\"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through\">\n                    {basePrice}\n                  </div>\n                )}\n              </>\n            ) : null}\n          </div>\n        </div>\n        {buttonTextValue ? (\n          <Button\n            onClick={() => {\n              onChange?.(product, index)\n            }}\n            className=\"specs-sku-node-button\"\n          >\n            {buttonTextValue}\n          </Button>\n        ) : null}\n      </div>\n    )\n  }\n\n  const normalNode = (v: any) => {\n    if (v && typeof v !== 'string') {\n      return (\n        <div className=\"size-full\">\n          <p\n            className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm\"\n            dangerouslySetInnerHTML={{\n              __html: v?.text || '',\n            }}\n          />\n          <Picture\n            source={v?.imgUrl}\n            className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n            imgClassName=\"w-full h-full object-cover\"\n          />\n        </div>\n      )\n    }\n    return (\n      <div className=\"break-all\">\n        {isImageUrl(v) ? (\n          <Picture\n            source={v}\n            className=\"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]\"\n            imgClassName=\"w-full h-full object-cover\"\n          />\n        ) : (\n          <p\n            className=\"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm\"\n            dangerouslySetInnerHTML={{\n              __html: v || '',\n            }}\n          />\n        )}\n      </div>\n    )\n  }\n\n  const productNode = (data: any) => {\n    return data.map((st: any, idx: number) => {\n      const isFirstParameter = idx === 0\n      return (\n        <div\n          key={st}\n          className={`l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] ${isFirstParameter ? '' : ''} specs-product-node-wrap`}\n        >\n          <Heading\n            as=\"h3\"\n            html={st || ''}\n            className=\"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm\"\n          />\n          <div\n            className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${isShowMax ? 3 : 2} specs-product-node-body col-span-2 grid flex-1 py-6`}\n          >\n            {Object.keys(active)?.map?.((item: string) => {\n              const currentData = active?.[item]\n              const currentMenus = RightMenu?.menus?.find?.(\n                (item: any) => item?.handle === currentData?.handle\n              )?.subTitle\n              return normalNode(currentMenus?.[st])\n            })}\n          </div>\n        </div>\n      )\n    })\n  }\n\n  // \u5DE6\u4FA7\u6807\u9898\u83DC\u5355\n  const childrenNode = (node: any) => {\n    if (!active) return\n    const { subTitle, isProduct } = node\n    // \u5982\u679C\u662F\u4EA7\u54C1\n    if (isProduct) {\n      return (\n        <>\n          <div\n            className={`l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]`}\n          >\n            {node?.title && <Heading as=\"h3\" html={node?.title || ''} className=\"l:hidden specs-item-product-title\" />}\n            <div\n              className={`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${isShowMax ? 3 : 2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`}\n            >\n              {Object.keys(active)?.map((item: string, index: number) => {\n                const currentData = active?.[item]\n                const currentProduct = buildData?.products?.find?.((item: any) => item?.handle === currentData?.handle)\n                return <div key={item}>{skuNode({ ...currentProduct, item: item, sku: currentData?.sku }, index)}</div>\n              })}\n            </div>\n          </div>\n          {subTitle?.length ? productNode(subTitle) : null}\n        </>\n      )\n    }\n    return productNode(subTitle)\n  }\n\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  useEffect(() => {\n    if (!buildData?.products?.length) return\n    const skus = DefaultSelectMenu?.sku?.split?.(',') || []\n    let currentActive = {}\n    skus?.forEach?.((sku: string, index: number) => {\n      const findData = buildData?.products?.find?.((item: any) => {\n        const findSku = item?.variants?.find?.((v: any) => v?.sku === sku)\n        if (findSku) return true\n      })\n      if (findData) {\n        currentActive = {\n          ...currentActive,\n          [index]: {\n            sku: sku,\n            name: findData?.name || findData?.title,\n            handle: findData?.handle,\n          },\n        }\n      }\n    })\n    const currentMenu = buildData?.products?.filter((item: any) => {\n      return RightMenu?.menus?.find((params: any) => params?.handle === item?.handle)\n    })\n    setActive(currentActive)\n    setMenuList(currentMenu)\n    setIsShowMax(skus?.length > 2)\n  }, [buildData])\n\n  useEffect(() => {\n    if (isMobile) {\n      const currentActive = Object.keys(active || {})\n      if (currentActive?.length > 2) {\n        const newActive = currentActive?.slice?.(0, 2)\n        let newShowActive = {}\n        newActive?.forEach?.((item: string) => {\n          newShowActive = { ...newShowActive, [item]: active?.[item] }\n        })\n        setIsShowMax(false)\n        setActive(newShowActive)\n      }\n    }\n  }, [isMobile])\n\n  return (\n    <div className=\"specs-wrapper w-full overflow-hidden bg-[#F5F5F7]\" ref={innerRef}>\n      {LeftMenu?.data ? (\n        <div className=\"specs-wrapper-content box-border w-full overflow-hidden\">\n          {LeftMenu?.data?.map?.((item: any, index: number) => {\n            return (\n              <div key={index} className=\"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0\">\n                {childrenNode(item)}\n              </div>\n            )\n          })}\n        </div>\n      ) : null}\n    </div>\n  )\n})\n\nSpecs.displayName = 'Specs'\n\nexport default withLayout(Specs)\n"],
+  "mappings": "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",
   "names": ["Fragment", "jsx", "jsxs", "DropDown", "useAiuiContext", "useMediaQuery", "useMemo", "useState", "useEffect", "withLayout", "formatVariantPrice", "Picture", "Text", "Button", "Heading", "React", "useImperativeHandle", "useRef", "Specs", "page", "ref", "data", "buildData", "onChange", "onSecondaryChange", "isMobile", "active", "setActive", "menuList", "setMenuList", "isShowMax", "setIsShowMax", "visibleActive", "setVisibleActive", "innerRef", "locale", "currencyDisplay", "LeftMenu", "RightMenu", "DefaultSelectMenu", "isImageUrl", "urlPath", "path", "skuNode", "product", "index", "findSku", "item", "coupon", "price", "basePrice", "buttonTextValue", "normalNode", "v", "productNode", "st", "idx", "isFirstParameter", "currentData", "currentMenus", "childrenNode", "node", "subTitle", "isProduct", "currentProduct", "skus", "currentActive", "sku", "findData", "currentMenu", "params", "newActive", "newShowActive", "Specs_default"]
 }

package/dist/esm/biz-components/SpecsComparison/SpecsComparison.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { SpecsComparisonProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<SpecsComparisonProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<SpecsComparisonProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/TabWithImage/TabWithImage.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { TabWithImageProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<TabWithImageProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<TabWithImageProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/Tabs/Tabs.d.ts

@@ -1,7 +1,7 @@
 import type { TabsProps } from './types.js';
 import React from 'react';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<TabsProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<TabsProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import type { TabsGroupProps } from './types.js';
 import React from 'react';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<TabsGroupProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<TabsGroupProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/dist/esm/biz-components/TabsWithMedia/TabsWithMedia.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { TabsWithMediaProps } from './types.js';
-declare const _default: React.ForwardRefExoticComponent<Omit<Omit<TabsWithMediaProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
-    className?: string;
-    data?: Record<string, any>;
+declare const _default: React.ForwardRefExoticComponent<Omit<TabsWithMediaProps & React.RefAttributes<HTMLDivElement> & {
+    style?: string | React.CSSProperties;
+    container?: import("../../shared/Styles.js").ContainerProps["container"];
 }, "ref"> & React.RefAttributes<any>>;
 export default _default;