@anker-in/headless-ui 1.0.24 → 1.0.26-alpha.1761893017767

package/dist/esm/biz-components/ImageTextFeature/types.d.ts

@@ -0,0 +1,31 @@
+import type { Img, Theme } from '../../types/props.js';
+export interface ImageTextFeatureItem {
+    /** 功能图标 */
+    icon: string;
+    /** 功能标题 */
+    text: string;
+    /** 功能描述 */
+    desc: string;
+}
+export interface ImageTextFeatureProps {
+    data: {
+        /** 主标题 */
+        title: string;
+        /** 副标题 */
+        subtitle?: string;
+        /** PC端图片 */
+        imageUrl: string | Img;
+        /** 移动端图片 */
+        mobImageUrl?: string | Img;
+        /** 平板端图片 */
+        padImageUrl?: string | Img;
+        /** 功能项列表 */
+        items: ImageTextFeatureItem[];
+        /** 图片位置，默认 left */
+        imagePosition?: 'left' | 'right';
+        /** 主题，默认 light */
+        theme?: Theme;
+    };
+    /** 自定义类名 */
+    className?: string;
+}

package/dist/esm/biz-components/ImageTextFeature/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/biz-components/ImageTextFeature/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ImageWithTextProps } from './types.js';
+declare const _default: React.ForwardRefExoticComponent<Omit<Omit<ImageWithTextProps & 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>;
+}, "ref"> & React.RefAttributes<any>>;
+export default _default;

package/dist/esm/biz-components/ImageWithText/ImageWithText.js

@@ -0,0 +1,2 @@
+"use client";import{jsx as e,jsxs as o}from"react/jsx-runtime";import h,{useImperativeHandle as u,useRef as T}from"react";import{Heading as i,Picture as v,Text as N}from"../../components/index.js";import{cn as I}from"../../helpers/utils.js";import{withLayout as w}from"../../shared/Styles.js";import{useExposure as k}from"../../hooks/useExposure.js";const y="image",D="image_with_text",l=h.forwardRef(({data:n,className:r},c)=>{const{title:a,subtitle:t,desc:m,descIcon:x,imageUrl:d,padImageUrl:f,mobImageUrl:g,theme:s="dark"}=n,p=T(null);return k(p,{componentType:y,componentName:D,componentTitle:a,componentDescription:t}),u(c,()=>p.current),o("section",{ref:p,"data-ui-component-id":"ImageWithText",className:I("flex flex-col gap-[24px] laptop:flex-row laptop:gap-[48px] lg-desktop:gap-[64px]",{"text-white":s==="dark","text-[#1f1f1f]":s==="light"},r),children:[o("div",{className:"flex flex-col justify-center",children:[e(i,{as:"h2",size:4,html:a}),t&&e(N,{as:"p",size:3,html:t,className:"mt-[4px] text-[14px] tablet:text-[14px] laptop:mt-[16px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]"}),o("div",{className:"flex flex-row gap-[8px]",children:[x&&e("img",{src:x,alt:"icon",className:"h-[36px] w-[36px] desktop:h-[48px] desktop:w-[48px]"}),m&&e(i,{as:"h4",size:5,html:m,className:"text-[#3AD1FF] md:text-[40px] min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px]"})]})]}),e("div",{className:"",children:e(v,{source:`${d},${f} 1024, ${g} 768`,className:"rounded-[10px] laptop:rounded-[16px]"})})]})});l.displayName="ImageWithText";var R=w(l);export{R as default};
+//# sourceMappingURL=ImageWithText.js.map

package/dist/esm/biz-components/ImageWithText/ImageWithText.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/ImageWithText/ImageWithText.tsx"],
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ImageWithTextProps } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'image_with_text'\n\nconst ImageWithText = React.forwardRef<HTMLDivElement, ImageWithTextProps>(({ data, className }, ref) => {\n  const {\n    title,\n    subtitle,\n    desc,\n    descIcon,\n    imageUrl,\n    padImageUrl,\n    mobImageUrl,\n    theme = 'dark',\n  } = data\n\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  return (\n    <section\n      ref={boxRef}\n      data-ui-component-id=\"ImageWithText\"\n      className={cn(\n        'flex flex-col gap-[24px] laptop:flex-row laptop:gap-[48px] lg-desktop:gap-[64px]',\n        {\n          'text-white': theme === 'dark',\n          'text-[#1f1f1f]': theme === 'light',\n        },\n        className\n      )}\n    >\n      <div className=\"flex flex-col justify-center\">\n        <Heading as={'h2'} size={4} html={title} />\n        {subtitle && (\n          <Text\n            as={'p'}\n            size={3}\n            html={subtitle}\n            className=\"mt-[4px] text-[14px] tablet:text-[14px] laptop:mt-[16px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n          />\n        )}\n        <div className=\"flex flex-row gap-[8px]\">\n          {descIcon && (\n            <img\n              src={descIcon}\n              alt=\"icon\"\n              className=\"h-[36px] w-[36px] desktop:h-[48px] desktop:w-[48px]\"\n            />\n          )}\n          {desc && (\n            <Heading\n              as={'h4'}\n              size={5}\n              html={desc}\n              className=\"text-[#3AD1FF] md:text-[40px] min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px]\"\n            />\n          )}\n        </div>\n      </div>\n      <div className=\"\">\n        <Picture\n          source={`${imageUrl},${padImageUrl} 1024, ${mobImageUrl} 768`}\n          className=\"rounded-[10px] laptop:rounded-[16px]\"\n        />\n      </div>\n    </section>\n  )\n})\n\nImageWithText.displayName = 'ImageWithText'\n\nexport default withLayout(ImageWithText)\n"],
+  "mappings": "aAgDQ,cAAAA,EASA,QAAAC,MATA,oBA/CR,OAAOC,GAAS,uBAAAC,EAAqB,UAAAC,MAAc,QACnD,OAAS,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,4BACvC,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,eAAAC,MAAmB,6BAG5B,MAAMC,EAAgB,QAChBC,EAAgB,kBAEhBC,EAAgBX,EAAM,WAA+C,CAAC,CAAE,KAAAY,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CACvG,KAAM,CACJ,MAAAC,EACA,SAAAC,EACA,KAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EACA,YAAAC,EACA,MAAAC,EAAQ,MACV,EAAIV,EAEEW,EAASrB,EAAuB,IAAI,EAE1C,OAAAM,EAAYe,EAAQ,CAClB,cAAAd,EACA,cAAAC,EACA,eAAgBK,EAChB,qBAAsBC,CACxB,CAAC,EAEDf,EAAoBa,EAAK,IAAMS,EAAO,OAAyB,EAG7DxB,EAAC,WACC,IAAKwB,EACL,uBAAqB,gBACrB,UAAWjB,EACT,mFACA,CACE,aAAcgB,IAAU,OACxB,iBAAkBA,IAAU,OAC9B,EACAT,CACF,EAEA,UAAAd,EAAC,OAAI,UAAU,+BACb,UAAAD,EAACK,EAAA,CAAQ,GAAI,KAAM,KAAM,EAAG,KAAMY,EAAO,EACxCC,GACClB,EAACO,EAAA,CACC,GAAI,IACJ,KAAM,EACN,KAAMW,EACN,UAAU,yHACZ,EAEFjB,EAAC,OAAI,UAAU,0BACZ,UAAAmB,GACCpB,EAAC,OACC,IAAKoB,EACL,IAAI,OACJ,UAAU,sDACZ,EAEDD,GACCnB,EAACK,EAAA,CACC,GAAI,KACJ,KAAM,EACN,KAAMc,EACN,UAAU,4GACZ,GAEJ,GACF,EACAnB,EAAC,OAAI,UAAU,GACb,SAAAA,EAACM,EAAA,CACC,OAAQ,GAAGe,CAAQ,IAAIC,CAAW,UAAUC,CAAW,OACvD,UAAU,uCACZ,EACF,GACF,CAEJ,CAAC,EAEDV,EAAc,YAAc,gBAE5B,IAAOa,EAAQjB,EAAWI,CAAa",
+  "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "Heading", "Picture", "Text", "cn", "withLayout", "useExposure", "componentType", "componentName", "ImageWithText", "data", "className", "ref", "title", "subtitle", "desc", "descIcon", "imageUrl", "padImageUrl", "mobImageUrl", "theme", "boxRef", "ImageWithText_default"]
+}

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

@@ -0,0 +1,2 @@
+export { default } from './ImageWithText.js';
+export type { ImageWithTextProps } from './types.js';

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

@@ -0,0 +1,2 @@
+import{default as o}from"./ImageWithText.js";export{o as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/ImageWithText/index.ts"],
+  "sourcesContent": ["export { default } from './ImageWithText.js'\nexport type { ImageWithTextProps } from './types.js'\n"],
+  "mappings": "AAAA,OAAS,WAAAA,MAAe",
+  "names": ["default"]
+}

package/dist/esm/biz-components/ImageWithText/types.d.ts

@@ -0,0 +1,23 @@
+import type { Theme } from '../../types/props.js';
+export interface ImageWithTextProps {
+    data: {
+        /** 主标题 */
+        title: string;
+        /** 副标题/描述 */
+        subtitle?: string;
+        /** 描述文本（通常是大号高亮文本） */
+        desc?: string;
+        /** 描述文本图标 */
+        descIcon?: string;
+        /** PC端图片 URL */
+        imageUrl: string;
+        /** 平板端图片 URL */
+        padImageUrl?: string;
+        /** 移动端图片 URL */
+        mobImageUrl?: string;
+        /** 主题，默认 dark */
+        theme?: Theme;
+    };
+    /** 自定义类名 */
+    className?: string;
+}

package/dist/esm/biz-components/ImageWithText/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/biz-components/ImageWithText/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

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

@@ -0,0 +1,40 @@
+/**
+ * KSP 卡片项数据结构
+ */
+export interface KspCardItem {
+    /** 标题 */
+    title?: string;
+    /** 描述 */
+    desc?: string;
+    /** 桌面端图片 URL */
+    imageUrl?: string;
+    /** 移动端图片 URL */
+    mobImageUrl?: string;
+    /** 桌面端视频 URL */
+    videoUrl?: string;
+    /** 移动端视频 URL */
+    mobVideoUrl?: string;
+}
+/**
+ * KSP 数据结构
+ */
+export interface KspData {
+    /** 主标题 */
+    title?: string;
+    /** KSP 卡片列表（需要 7 个项） */
+    items: KspCardItem[];
+}
+/**
+ * Ksp 组件 Props
+ */
+export interface KspProps {
+    /** KSP 数据 */
+    data: KspData;
+    /** 自定义类名 */
+    className?: string;
+}
+declare const _default: import("react").ForwardRefExoticComponent<Omit<KspProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
+    className?: string;
+    data?: Record<string, any>;
+} & import("react").RefAttributes<any>>;
+export default _default;

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

@@ -0,0 +1,2 @@
+import{Fragment as w,jsx as e,jsxs as p}from"react/jsx-runtime";import{Heading as i,Picture as c,Text as n}from"../../components/index.js";import{cn as r}from"../../helpers/utils.js";import{withLayout as k}from"../../shared/Styles.js";const s=({title:l,desc:o,imageUrl:a,mobImageUrl:t,videoUrl:m,mobVideoUrl:d,className:x})=>p("div",{className:r("ksp-card relative overflow-hidden rounded-[16px] bg-[#1f1f1f]",x),children:[m&&d?p(w,{children:[e("video",{playsInline:!0,autoPlay:!0,muted:!0,loop:!0,src:m,poster:a,className:"ksp-card-video ksp-card-video-desktop absolute bottom-0 hidden w-full laptop:inline-block"}),e("video",{playsInline:!0,autoPlay:!0,muted:!0,loop:!0,src:d,poster:t,className:"ksp-card-video ksp-card-video-mobile absolute inline-block -translate-y-[80px] object-contain object-center laptop:hidden"})]}):(a||t)&&e(c,{source:`${a}, ${t} 768`,className:"ksp-card-image h-full w-full",imgClassName:"h-full w-full object-cover object-bottom"}),p("div",{className:"ksp-card-content absolute left-[16px] top-[16px] desktop:left-[24px] desktop:top-[24px] lg-desktop:left-[32px] lg-desktop:top-[32px]",children:[e(i,{size:3,html:l,className:"ksp-card-title hidden w-full tablet:block"}),e(i,{size:2,html:l,className:"ksp-card-title block w-full tablet:hidden tablet:w-[340px]"}),e(n,{size:2,html:o,className:"ksp-card-desc mt-[4px] text-[14px] tablet:block tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]"})]})]});function h({data:l,className:o}){const{title:a,items:t}=l;return p("section",{"data-ui-component-id":"ksp",className:r("ksp-container flex scroll-mt-[108px] flex-col justify-center bg-black laptop:scroll-mt-[46px]",o),children:[e(i,{as:"h1",size:4,html:a,className:"ksp-title text-left text-white laptop:text-center"}),p("div",{className:"ksp-desktop-layout mt-[24px] hidden flex-col gap-4 text-white min-md:mt-[24px] min-xxl:mt-[24px] tablet:flex",children:[p("div",{className:"ksp-row ksp-row-1 flex flex-nowrap items-stretch gap-4",children:[e(s,{className:"w-[59.53%] tablet:min-h-[240px] desktop:min-h-[256px] lg-desktop:min-h-[320px]",...t[0]}),e(s,{className:"w-[39.30%] tablet:min-h-[240px] desktop:min-h-[256px] lg-desktop:min-h-[320px]",...t[1]})]}),p("div",{className:"ksp-row ksp-row-2 flex flex-nowrap items-stretch gap-4",children:[e(s,{className:"w-[33%] tablet:min-h-[240px] laptop:w-[29.19%] desktop:min-h-[256px] lg-desktop:min-h-[320px]",...t[4]}),e(s,{className:"w-[33%] tablet:min-h-[240px] laptop:w-[39.30%] desktop:min-h-[256px] lg-desktop:min-h-[320px]",...t[3]}),e(s,{className:"w-[33%] tablet:min-h-[240px] laptop:w-[29.19%] desktop:min-h-[256px] lg-desktop:min-h-[320px]",...t[2]})]}),p("div",{className:"ksp-row ksp-row-3 flex flex-nowrap items-stretch gap-4",children:[e(s,{className:"order-2 w-[59.53%] tablet:min-h-[240px] desktop:order-1 desktop:min-h-[256px] desktop:w-[39.30%] lg-desktop:min-h-[320px]",...t[5]}),e(s,{className:"order-1 w-[39.30%] tablet:min-h-[240px] desktop:order-2 desktop:min-h-[256px] desktop:w-[59.53%] lg-desktop:min-h-[320px]",...t[6]})]})]}),p("div",{className:"ksp-mobile-layout mt-[24px] flex flex-col gap-[12px] text-white tablet:hidden",children:[e(s,{className:"h-[240px] w-[100%]",...t[0]}),p("div",{className:"ksp-row ksp-row-mobile-1 flex max-h-[240px] flex-nowrap items-stretch gap-[12px]",children:[e(s,{className:"w-[50%]",...t[1]}),e(s,{className:"w-[50%]",...t[2]})]}),e(s,{className:"max-h-[240px] w-[100%]",...t[6]}),p("div",{className:"ksp-row ksp-row-mobile-2 flex max-h-[240px] flex-nowrap items-stretch gap-[12px]",children:[e(s,{className:"w-[50%]",...t[3]}),e(s,{className:"w-[50%]",...t[4]})]}),e(s,{className:"max-h-[280px] w-[100%]",...t[5]})]})]})}var g=k(h);export{g as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/Ksp/index.tsx"],
+  "sourcesContent": ["import { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\n/**\n * KSP \u5361\u7247\u9879\u6570\u636E\u7ED3\u6784\n */\nexport interface KspCardItem {\n  /** \u6807\u9898 */\n  title?: string\n  /** \u63CF\u8FF0 */\n  desc?: string\n  /** \u684C\u9762\u7AEF\u56FE\u7247 URL */\n  imageUrl?: string\n  /** \u79FB\u52A8\u7AEF\u56FE\u7247 URL */\n  mobImageUrl?: string\n  /** \u684C\u9762\u7AEF\u89C6\u9891 URL */\n  videoUrl?: string\n  /** \u79FB\u52A8\u7AEF\u89C6\u9891 URL */\n  mobVideoUrl?: string\n}\n\n/**\n * KSP \u6570\u636E\u7ED3\u6784\n */\nexport interface KspData {\n  /** \u4E3B\u6807\u9898 */\n  title?: string\n  /** KSP \u5361\u7247\u5217\u8868\uFF08\u9700\u8981 7 \u4E2A\u9879\uFF09 */\n  items: KspCardItem[]\n}\n\n/**\n * Ksp \u7EC4\u4EF6 Props\n */\nexport interface KspProps {\n  /** KSP \u6570\u636E */\n  data: KspData\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\ninterface ImageCardProps extends KspCardItem {\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\nconst ImageCard = ({\n  title,\n  desc,\n  imageUrl,\n  mobImageUrl,\n  videoUrl,\n  mobVideoUrl,\n  className,\n}: ImageCardProps) => {\n  return (\n    <div className={cn('ksp-card relative overflow-hidden rounded-[16px] bg-[#1f1f1f]', className)}>\n      {videoUrl && mobVideoUrl ? (\n        <>\n          <video\n            playsInline\n            autoPlay\n            muted\n            loop\n            src={videoUrl}\n            poster={imageUrl}\n            className=\"ksp-card-video ksp-card-video-desktop absolute bottom-0 hidden w-full laptop:inline-block\"\n          />\n          <video\n            playsInline\n            autoPlay\n            muted\n            loop\n            src={mobVideoUrl}\n            poster={mobImageUrl}\n            className=\"ksp-card-video ksp-card-video-mobile absolute inline-block -translate-y-[80px] object-contain object-center laptop:hidden\"\n          />\n        </>\n      ) : (\n        (imageUrl || mobImageUrl) && (\n          <Picture\n            source={`${imageUrl}, ${mobImageUrl} 768`}\n            className=\"ksp-card-image h-full w-full\"\n            imgClassName=\"h-full w-full object-cover object-bottom\"\n          />\n        )\n      )}\n      <div className=\"ksp-card-content absolute left-[16px] top-[16px] desktop:left-[24px] desktop:top-[24px] lg-desktop:left-[32px] lg-desktop:top-[32px]\">\n        <Heading size={3} html={title} className=\"ksp-card-title hidden w-full tablet:block\" />\n        <Heading size={2} html={title} className=\"ksp-card-title block w-full tablet:hidden tablet:w-[340px]\" />\n        <Text\n          size={2}\n          html={desc}\n          className=\"ksp-card-desc mt-[4px] text-[14px] tablet:block tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n        />\n      </div>\n\n    </div>\n  )\n}\n\n/**\n * Ksp - Key Selling Point \u5173\u952E\u5356\u70B9\u7EC4\u4EF6\n * \n * \u5C55\u793A\u4EA7\u54C1\u7684\u5173\u952E\u5356\u70B9\uFF0C\u652F\u6301\u56FE\u7247\u548C\u89C6\u9891\uFF0C\u5177\u6709\u590D\u6742\u7684\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002\n * \u5E03\u5C40\u9700\u8981 7 \u4E2A\u5361\u7247\u9879\uFF0C\u5206\u522B\u5BF9\u5E94\u4E0D\u540C\u5C3A\u5BF8\u548C\u4F4D\u7F6E\u3002\n * \n * @example\n * ```tsx\n * <Ksp\n *   data={{\n *     title: '\u4E3A\u4EC0\u4E48\u9009\u62E9\u6211\u4EEC',\n *     items: [\n *       {\n *         title: '\u9AD8\u6027\u80FD',\n *         desc: '\u5F3A\u5927\u7684\u5904\u7406\u80FD\u529B',\n *         imageUrl: '/desktop.jpg',\n *         mobImageUrl: '/mobile.jpg'\n *       },\n *       // ... \u9700\u8981 7 \u4E2A\u9879\n *     ]\n *   }}\n * />\n * ```\n */\nfunction Ksp({ data, className }: KspProps) {\n  const { title, items } = data\n\n  return (\n    <section\n      data-ui-component-id=\"ksp\"\n      className={cn('ksp-container flex scroll-mt-[108px] flex-col justify-center bg-black laptop:scroll-mt-[46px]', className)}\n    >\n      <Heading as=\"h1\" size={4} html={title} className=\"ksp-title text-left text-white laptop:text-center\" />\n      {/* ipad, pc\u7AEF */}\n      <div className=\"ksp-desktop-layout mt-[24px] hidden flex-col gap-4 text-white min-md:mt-[24px] min-xxl:mt-[24px] tablet:flex\">\n        <div className=\"ksp-row ksp-row-1 flex flex-nowrap items-stretch gap-4\">\n          <ImageCard\n            className=\"w-[59.53%] tablet:min-h-[240px] desktop:min-h-[256px] lg-desktop:min-h-[320px]\"\n            {...items[0]}\n          />\n          <ImageCard\n            className=\"w-[39.30%] tablet:min-h-[240px] desktop:min-h-[256px] lg-desktop:min-h-[320px]\"\n            {...items[1]}\n          />\n        </div>\n\n        <div className=\"ksp-row ksp-row-2 flex flex-nowrap items-stretch gap-4\">\n          <ImageCard\n            className=\"w-[33%] tablet:min-h-[240px] laptop:w-[29.19%] desktop:min-h-[256px] lg-desktop:min-h-[320px]\"\n            {...items[4]}\n          />\n          <ImageCard\n            className=\"w-[33%] tablet:min-h-[240px] laptop:w-[39.30%] desktop:min-h-[256px] lg-desktop:min-h-[320px]\"\n            {...items[3]}\n          />\n          <ImageCard\n            className=\"w-[33%] tablet:min-h-[240px] laptop:w-[29.19%] desktop:min-h-[256px] lg-desktop:min-h-[320px]\"\n            {...items[2]}\n          />\n        </div>\n\n        <div className=\"ksp-row ksp-row-3 flex flex-nowrap items-stretch gap-4\">\n          <ImageCard\n            className=\"order-2 w-[59.53%] tablet:min-h-[240px] desktop:order-1 desktop:min-h-[256px] desktop:w-[39.30%] lg-desktop:min-h-[320px]\"\n            {...items[5]}\n          />\n          <ImageCard\n            className=\"order-1 w-[39.30%] tablet:min-h-[240px] desktop:order-2 desktop:min-h-[256px] desktop:w-[59.53%] lg-desktop:min-h-[320px]\"\n            {...items[6]}\n          />\n        </div>\n      </div>\n\n      {/* \u624B\u673A\u7AEF */}\n      <div className=\"ksp-mobile-layout mt-[24px] flex flex-col gap-[12px] text-white tablet:hidden\">\n        <ImageCard className=\"h-[240px] w-[100%]\" {...items[0]} />\n        <div className=\"ksp-row ksp-row-mobile-1 flex max-h-[240px] flex-nowrap items-stretch gap-[12px]\">\n          <ImageCard className=\"w-[50%]\" {...items[1]} />\n          <ImageCard className=\"w-[50%]\" {...items[2]} />\n        </div>\n        <ImageCard className=\"max-h-[240px] w-[100%]\" {...items[6]} />\n        <div className=\"ksp-row ksp-row-mobile-2 flex max-h-[240px] flex-nowrap items-stretch gap-[12px]\">\n          <ImageCard className=\"w-[50%]\" {...items[3]} />\n          <ImageCard className=\"w-[50%]\" {...items[4]} />\n        </div>\n        <ImageCard className=\"max-h-[280px] w-[100%]\" {...items[5]} />\n      </div>\n    </section>\n  )\n}\n\n\nexport default withLayout(Ksp)"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "Heading", "Picture", "Text", "cn", "withLayout", "ImageCard", "title", "desc", "imageUrl", "mobImageUrl", "videoUrl", "mobVideoUrl", "className", "Ksp", "data", "items", "Ksp_default"]
+}

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

@@ -0,0 +1,41 @@
+import type { Theme } from '../../types/props.js';
+/**
+ * 评论项数据结构
+ */
+export interface ReviewItem {
+    /** 评论者名称 */
+    name: string;
+    /** 评论者头像 URL */
+    avatar: string;
+    /** 评论内容 */
+    comment: string;
+    /** 评分(1-5星) */
+    rating?: number;
+}
+/**
+ * 轮播评论数据结构
+ */
+export interface MarqueeReviewData {
+    /** 主标题 */
+    title: string;
+    /** 副标题 */
+    subtitle: string;
+    /** 评论列表 */
+    items: ReviewItem[];
+    /** 主题：light 或 dark */
+    theme?: Theme;
+}
+/**
+ * MarqueeReview 组件 Props
+ */
+export interface MarqueeReviewProps {
+    /** 评论数据 */
+    data: MarqueeReviewData;
+    /** 自定义类名 */
+    className?: string;
+}
+declare const _default: import("react").ForwardRefExoticComponent<Omit<MarqueeReviewProps, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
+    className?: string;
+    data?: Record<string, any>;
+} & import("react").RefAttributes<any>>;
+export default _default;

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

@@ -0,0 +1,25 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Text as o,Heading as c,Avatar as g,AvatarImage as k,AvatarFallback as w}from"../../components/index.js";import{cn as m}from"../../helpers/utils.js";import{withLayout as b}from"../../shared/Styles.js";const x=9,u=3,y=(t,a)=>Array.from({length:Math.ceil(t.length/a)},(i,p)=>t.slice(p*a,(p+1)*a)),N=()=>e("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z",fill:"#F77234"})}),C=({item:t})=>r("div",{className:"flex h-[240px] flex-grow flex-col justify-between rounded-2xl bg-container-primary p-[16px] text-info-primary min-l:p-[24px] laptop:h-[240px] desktop:h-[240px] lg-desktop:h-[240px]",children:[r("div",{className:"flex justify-between",children:[r("div",{className:"flex flex-col",children:[e(o,{size:4,html:t.name,className:"hidden laptop:block"}),e(o,{size:2,html:t.name,className:"block laptop:hidden"}),e("div",{className:"mt-2 flex gap-1",children:new Array(t.rating||5).fill(0).map((a,i)=>e(N,{},i))})]}),r(g,{size:"small",className:" h-[40px]  w-[40px] laptop:h-[48px] laptop:w-[48px]",children:[e(k,{src:t.avatar,alt:"avatar"}),e(w,{children:(t.name??"").slice(0,2).toUpperCase()})]})]}),e("div",{children:e(c,{as:"h6",size:2,html:`"${t.comment}`,className:"line-clamp-5 min-h-[120px] text-wrap"})})]});function L({data:t,className:a}){const{title:i,subtitle:p,items:l=[],theme:f="light"}=t,d=y(l.length<x?[...l,...l.slice(x-l.length)]:l,u).slice(0,3).map(n=>[...n,...n]);return r("section",{className:m("flex flex-col items-center justify-center py-3 text-info-primary",a,{"aiui-dark":f==="dark"}),children:[e("style",{jsx:!0,children:`
+          @keyframes scroll {
+            from {
+              transform: translateX(0%);
+            }
+            to {
+              transform: translateY(-50%);
+            }
+          }
+
+          .fade-edges {
+            -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
+            mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
+            -webkit-mask-repeat: no-repeat;
+            mask-repeat: no-repeat;
+            -webkit-mask-size: 100% 100%;
+            mask-size: 100% 100%;
+          }
+
+          .scroll-track {
+            animation: scroll 20s linear infinite;
+            height: fit-content;
+          }
+        `}),e(c,{as:"h1",size:4,html:i,className:"w-full text-left laptop:text-center"}),e(o,{size:2,html:p,className:"mt-[4px] w-full text-left text-[14px] tablet:mt-[16px] tablet:text-[14px] laptop:text-center laptop:text-[14px] desktop:mt-[8px] desktop:text-[16px] lg-desktop:text-[18px]"}),e("div",{className:m("fade-edges mt-[24px] flex h-[480px] gap-4 overflow-hidden laptop:h-[384px] desktop:h-[512px] lg-desktop:h-[640px]"),children:d.map((n,s)=>e("div",{className:m("scroll-track relative flex flex-col gap-4 flex-1",{"top-10":s===0||s===2,"hidden desktop:flex":s===1,"hidden tablet:flex":s===2}),children:n.map((h,v)=>e(C,{item:h},v))},s))})]})}var R=b(L);export{R as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/MarqueeReview/index.tsx"],
+  "sourcesContent": ["import { Text, Heading, Avatar, AvatarImage, AvatarFallback } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { Theme } from '../../types/props.js'\n\nconst FIX_ITEMS_LENGTH = 9\nconst COUNT = 3\n\n/**\n * \u8BC4\u8BBA\u9879\u6570\u636E\u7ED3\u6784\n */\nexport interface ReviewItem {\n  /** \u8BC4\u8BBA\u8005\u540D\u79F0 */\n  name: string\n  /** \u8BC4\u8BBA\u8005\u5934\u50CF URL */\n  avatar: string\n  /** \u8BC4\u8BBA\u5185\u5BB9 */\n  comment: string\n  /** \u8BC4\u5206(1-5\u661F) */\n  rating?: number\n}\n\n/**\n * \u8F6E\u64AD\u8BC4\u8BBA\u6570\u636E\u7ED3\u6784\n */\nexport interface MarqueeReviewData {\n  /** \u4E3B\u6807\u9898 */\n  title: string\n  /** \u526F\u6807\u9898 */\n  subtitle: string\n  /** \u8BC4\u8BBA\u5217\u8868 */\n  items: ReviewItem[]\n  /** \u4E3B\u9898\uFF1Alight \u6216 dark */\n  theme?: Theme\n}\n\n/**\n * MarqueeReview \u7EC4\u4EF6 Props\n */\nexport interface MarqueeReviewProps {\n  /** \u8BC4\u8BBA\u6570\u636E */\n  data: MarqueeReviewData\n  /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n  className?: string\n}\n\nconst _chunk = <T,>(array: T[], size: number): T[][] => {\n  return Array.from({ length: Math.ceil(array.length / size) }, (_, index) =>\n    array.slice(index * size, (index + 1) * size)\n  )\n}\n\nconst StarIcon = () => (\n  <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M7.32745 1.36274C7.60256 0.805304 8.39744 0.805305 8.67255 1.36274L10.1766 4.41035C10.2859 4.63171 10.4971 4.78514 10.7413 4.82063L14.1046 5.30934C14.7197 5.39873 14.9654 6.15471 14.5202 6.58861L12.0866 8.96084C11.9098 9.13315 11.8292 9.3814 11.8709 9.62469L12.4454 12.9743C12.5505 13.587 11.9074 14.0542 11.3572 13.765L8.349 12.1835C8.13051 12.0686 7.86949 12.0686 7.65099 12.1835L4.64282 13.765C4.0926 14.0542 3.44953 13.587 3.55461 12.9743L4.12912 9.62469C4.17085 9.3814 4.09019 9.13315 3.91342 8.96084L1.47976 6.58861C1.03462 6.15471 1.28025 5.39873 1.89542 5.30934L5.25866 4.82063C5.50294 4.78514 5.71412 4.63171 5.82336 4.41035L7.32745 1.36274Z\"\n      fill=\"#F77234\"\n    />\n  </svg>\n)\n\ninterface CardProps {\n  item: ReviewItem\n}\n\nconst Card = ({ item }: CardProps) => {\n  return (\n    <div className=\"flex h-[240px] flex-grow flex-col justify-between rounded-2xl bg-container-primary p-[16px] text-info-primary min-l:p-[24px] laptop:h-[240px] desktop:h-[240px] lg-desktop:h-[240px]\">\n      <div className=\"flex justify-between\">\n        <div className=\"flex flex-col\">\n          <Text size={4} html={item.name} className=\"hidden laptop:block\" />\n          <Text size={2} html={item.name} className=\"block laptop:hidden\" />\n          <div className=\"mt-2 flex gap-1\">\n            {new Array(item.rating || 5).fill(0).map((_, index) => (\n              <StarIcon key={index} />\n            ))}\n          </div>\n        </div>\n        <Avatar size=\"small\" className=\" h-[40px]  w-[40px] laptop:h-[48px] laptop:w-[48px]\">\n          <AvatarImage src={item.avatar} alt=\"avatar\" />\n          <AvatarFallback>{(item.name ?? '').slice(0, 2).toUpperCase()}</AvatarFallback>\n        </Avatar>\n      </div>\n      <div>\n        <Heading as=\"h6\" size={2} html={`\"${item.comment}`} className=\"line-clamp-5 min-h-[120px] text-wrap\" />\n      </div>\n    </div>\n  )\n}\n\n/**\n * MarqueeReview - \u5782\u76F4\u6EDA\u52A8\u7684\u8BC4\u8BBA\u8F6E\u64AD\u7EC4\u4EF6\n *\n * \u7528\u4E8E\u5C55\u793A\u7528\u6237\u8BC4\u8BBA,\u652F\u6301\u591A\u5217\u5782\u76F4\u65E0\u9650\u6EDA\u52A8\u6548\u679C\u3002\n *\n * @example\n * ```tsx\n * <MarqueeReview\n *   data={{\n *     title: \"\u5BA2\u6237\u8BC4\u4EF7\",\n *     subtitle: \"\u770B\u770B\u7528\u6237\u600E\u4E48\u8BF4\",\n *     items: [\n *       {\n *         name: \"\u5F20\u4E09\",\n *         avatar: \"/avatar1.jpg\",\n *         comment: \"\u975E\u5E38\u597D\u7528\u7684\u4EA7\u54C1!\",\n *         rating: 5\n *       }\n *     ]\n *   }}\n * />\n * ```\n */\nfunction MarqueeReview({ data, className }: MarqueeReviewProps) {\n  const { title, subtitle, items = [], theme = 'light' } = data\n\n  const chunkItems = _chunk(\n    items.length < FIX_ITEMS_LENGTH ? [...items, ...items.slice(FIX_ITEMS_LENGTH - items.length)] : items,\n    COUNT\n  )\n    .slice(0, 3)\n    .map(item => [...item, ...item])\n\n  return (\n    <section className={cn('flex flex-col items-center justify-center py-3 text-info-primary',  className, { 'aiui-dark': theme === 'dark' })}>\n      <style jsx>\n        {`\n          @keyframes scroll {\n            from {\n              transform: translateX(0%);\n            }\n            to {\n              transform: translateY(-50%);\n            }\n          }\n\n          .fade-edges {\n            -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);\n            mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);\n            -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n            -webkit-mask-size: 100% 100%;\n            mask-size: 100% 100%;\n          }\n\n          .scroll-track {\n            animation: scroll 20s linear infinite;\n            height: fit-content;\n          }\n        `}\n      </style>\n      <Heading as=\"h1\" size={4} html={title} className=\"w-full text-left laptop:text-center\" />\n      <Text\n        size={2}\n        html={subtitle}\n        className=\"mt-[4px] w-full text-left text-[14px] tablet:mt-[16px] tablet:text-[14px] laptop:text-center laptop:text-[14px] desktop:mt-[8px] desktop:text-[16px] lg-desktop:text-[18px]\"\n      />\n      <div\n        className={cn(\n          'fade-edges mt-[24px] flex h-[480px] gap-4 overflow-hidden laptop:h-[384px] desktop:h-[512px] lg-desktop:h-[640px]'\n        )}\n      >\n        {chunkItems.map((items, index) => (\n          <div\n            key={index}\n            className={cn('scroll-track relative flex flex-col gap-4 flex-1', {\n              'top-10': index === 0 || index === 2,\n              'hidden desktop:flex': index === 1,\n              'hidden tablet:flex': index === 2,\n            })}\n          >\n            {items.map((item, innerIndex) => (\n              <Card key={innerIndex} item={item} />\n            ))}\n          </div>\n        ))}\n      </div>\n    </section>\n  )\n}\n\nexport default withLayout(MarqueeReview)"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "Text", "Heading", "Avatar", "AvatarImage", "AvatarFallback", "cn", "withLayout", "FIX_ITEMS_LENGTH", "COUNT", "_chunk", "array", "size", "_", "index", "StarIcon", "Card", "item", "MarqueeReview", "data", "className", "title", "subtitle", "items", "theme", "chunkItems", "innerIndex", "MarqueeReview_default"]
+}

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

@@ -0,0 +1,37 @@
+import type { Media, Theme, Shape } from '../../types/props.js';
+export interface ProductItemData {
+    /** 产品标签文本 */
+    text?: string;
+    /** 桌面端媒体（视频或图片） */
+    media?: Media;
+    /** 移动端媒体（视频或图片） */
+    mobMedia?: Media;
+    /** 桌面端封面图（仅用于视频） */
+    poster?: string;
+    /** 移动端封面图（仅用于视频） */
+    mobPoster?: string;
+}
+export interface ProductCompareProps {
+    /** 组件数据 */
+    data: {
+        /** 主标题 */
+        title?: string;
+        /** 副标题 */
+        subtitle?: string;
+        /** 我们的产品数据 */
+        ourProduct?: ProductItemData;
+        /** 竞品数据 */
+        competitor?: ProductItemData;
+        /** 主题：light 或 dark */
+        theme?: Theme;
+        /** 形状：rounded 或 square */
+        shape?: Shape;
+    };
+    /** 外层容器类名 */
+    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>;
+} & import("react").RefAttributes<any>>;
+export default _default;

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

@@ -0,0 +1,2 @@
+import{jsx as t,jsxs as l}from"react/jsx-runtime";import{useEffect as x,useRef as f,useState as b}from"react";import{Heading as c,Text as h}from"../../components/index.js";import{cn as m}from"../../helpers/index.js";import{withLayout as g}from"../../shared/Styles.js";function u({children:e,offset:a=800}){const[r,p]=b(!1),o=f(null);return x(()=>{const i=new IntersectionObserver(([s])=>s.isIntersecting&&p(!0),{rootMargin:`${a}px`});return o.current&&i.observe(o.current),()=>i.disconnect()},[a]),t("div",{ref:o,className:"size-full",children:r&&e})}function d({media:e,poster:a,className:r}){return e?.url?e.mimeType?.startsWith("video/")?t("video",{src:e.url,playsInline:!0,autoPlay:!0,muted:!0,loop:!0,poster:a,preload:"metadata",disablePictureInPicture:!0,disableRemotePlayback:!0,"webkit-playsinline":"true","x5-video-player-type":"h5","x5-video-player-fullscreen":"false","x5-playsinline":"true",className:r,width:e.width,height:e.height}):t("img",{src:e.url,alt:e.alt||"",className:r,width:e.width,height:e.height}):null}function v(e){const{title:a,subtitle:r,ourProduct:p={},competitor:o={},theme:i="light",shape:s="rounded"}=e.data,n={rounded:"rounded-[12px] laptop:rounded-[16px]",square:"rounded-none"}[s];return l("section",{className:m("product-compare text-info-primary bg-container-primary",e.className,{"aiui-dark":i==="dark"}),children:[a&&t(c,{as:"h2",size:3,html:a,className:"section-title text-left"}),r&&t(h,{as:"p",size:2,html:r,className:"section-subtitle mt-[4px] text-left text-[14px] tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]"}),l("div",{className:"product-compare-container mt-[24px] flex w-full flex-col items-stretch gap-[16px] tablet:flex-row tablet:flex-nowrap",children:[l("div",{className:m("product-compare-item product-compare-competitor relative order-2 flex-shrink overflow-hidden tablet:order-1 tablet:w-[50%] laptop:w-[39.30%]",n),children:[t("div",{className:"product-compare-label product-compare-competitor-label absolute left-[16px] top-[16px] rounded-[24px] bg-[#000] bg-opacity-20 px-[20px] pb-[10px] pt-[11px] font-bold laptop:left-[28px] laptop:top-[28px] laptop:px-[28px] laptop:pb-[14px] laptop:pt-[15px] desktop:left-[32px] desktop:top-[32px]",children:t(c,{as:"h6",className:"font-bold",size:1,children:o.text})}),l(u,{offset:1500,children:[t(d,{media:o.media,poster:o.poster,className:"product-compare-media product-compare-competitor-media hidden w-full h-full object-cover laptop:block"}),t(d,{media:o.mobMedia,poster:o.mobPoster,className:"product-compare-media product-compare-competitor-media-mobile block laptop:hidden"})]})]}),l("div",{className:m("product-compare-item product-compare-our-product relative order-1 flex-shrink overflow-hidden tablet:order-2 tablet:w-[50%] laptop:w-[59.53%]",n),children:[t("div",{className:"product-compare-label product-compare-our-product-label absolute left-[16px] top-[16px] rounded-[24px] bg-brand-0 px-[20px] pb-[10px] pt-[11px] font-bold laptop:left-[28px] laptop:top-[28px] laptop:px-[28px] laptop:pb-[14px] laptop:pt-[15px] desktop:left-[32px] desktop:top-[32px]",children:t(c,{as:"h6",className:"font-bold",size:1,children:p.text})}),l(u,{offset:1500,children:[t(d,{media:p.media,poster:p.poster,className:"product-compare-media product-compare-our-product-media hidden w-full laptop:block"}),t(d,{media:p.mobMedia,poster:p.mobPoster,className:"product-compare-media product-compare-our-product-media-mobile block laptop:hidden"})]})]})]})]})}var k=g(v);export{k as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/ProductCompare/index.tsx"],
+  "sourcesContent": ["import { useEffect, useRef, useState } from 'react'\nimport { Heading, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport type { Media, Theme, Shape } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js';\n\nfunction LazyMedia({ children, offset = 800 }: { children: React.ReactNode; offset?: number }) {\n  const [loaded, setLoaded] = useState(false)\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    const observer = new IntersectionObserver(\n      ([entry]) => entry.isIntersecting && setLoaded(true),\n      { rootMargin: `${offset}px` }\n    )\n    ref.current && observer.observe(ref.current)\n    return () => observer.disconnect()\n  }, [offset])\n\n  return <div ref={ref} className=\"size-full\">{loaded && children}</div>\n}\n\nfunction MediaElement({ media, poster, className }: { media?: Media; poster?: string; className?: string }) {\n  if (!media?.url) return null\n  \n  const isVideo = media.mimeType?.startsWith('video/')\n  \n  if (isVideo) {\n    return (\n      <video\n        src={media.url}\n        playsInline\n        autoPlay\n        muted\n        loop\n        poster={poster}\n        preload=\"metadata\"\n        disablePictureInPicture\n        disableRemotePlayback\n        webkit-playsinline=\"true\"\n        x5-video-player-type=\"h5\"\n        x5-video-player-fullscreen=\"false\"\n        x5-playsinline=\"true\"\n        className={className}\n        width={media.width}\n        height={media.height}\n      />\n    )\n  }\n  \n  return (\n    <img\n      src={media.url}\n      alt={media.alt || ''}\n      className={className}\n      width={media.width}\n      height={media.height}\n    />\n  )\n}\n\nexport interface ProductItemData {\n  /** \u4EA7\u54C1\u6807\u7B7E\u6587\u672C */\n  text?: string\n  /** \u684C\u9762\u7AEF\u5A92\u4F53\uFF08\u89C6\u9891\u6216\u56FE\u7247\uFF09 */\n  media?: Media\n  /** \u79FB\u52A8\u7AEF\u5A92\u4F53\uFF08\u89C6\u9891\u6216\u56FE\u7247\uFF09 */\n  mobMedia?: Media\n  /** \u684C\u9762\u7AEF\u5C01\u9762\u56FE\uFF08\u4EC5\u7528\u4E8E\u89C6\u9891\uFF09 */\n  poster?: string\n  /** \u79FB\u52A8\u7AEF\u5C01\u9762\u56FE\uFF08\u4EC5\u7528\u4E8E\u89C6\u9891\uFF09 */\n  mobPoster?: string\n}\n\nexport interface ProductCompareProps {\n  /** \u7EC4\u4EF6\u6570\u636E */\n  data: {\n    /** \u4E3B\u6807\u9898 */\n    title?: string\n    /** \u526F\u6807\u9898 */\n    subtitle?: string\n    /** \u6211\u4EEC\u7684\u4EA7\u54C1\u6570\u636E */\n    ourProduct?: ProductItemData\n    /** \u7ADE\u54C1\u6570\u636E */\n    competitor?: ProductItemData\n    /** \u4E3B\u9898\uFF1Alight \u6216 dark */\n    theme?: Theme\n    /** \u5F62\u72B6\uFF1Arounded \u6216 square */\n    shape?: Shape\n  }\n  /** \u5916\u5C42\u5BB9\u5668\u7C7B\u540D */\n  className?: string\n}\n\nfunction ProductCompare(props: ProductCompareProps) {\n  const { title, subtitle, ourProduct = {}, competitor = {}, theme = 'light', shape = 'rounded' } = props.data\n  \n  // \u6839\u636E\u5F62\u72B6\u8BBE\u7F6E\u5706\u89D2\n  const shapeClass = {\n    rounded: 'rounded-[12px] laptop:rounded-[16px]',\n    square: 'rounded-none',\n  }[shape]\n\n  return (\n    <section className={cn('product-compare text-info-primary bg-container-primary', props.className, { 'aiui-dark': theme === 'dark' })}>\n      {title && <Heading as={'h2'} size={3} html={title} className=\"section-title text-left\" />}\n      {subtitle && <Text\n        as=\"p\"\n        size={2}\n        html={subtitle}\n        className=\"section-subtitle mt-[4px] text-left text-[14px] tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px]\"\n      />}\n      <div className=\"product-compare-container mt-[24px] flex w-full flex-col items-stretch gap-[16px] tablet:flex-row tablet:flex-nowrap\">\n        <div className={cn('product-compare-item product-compare-competitor relative order-2 flex-shrink overflow-hidden tablet:order-1 tablet:w-[50%] laptop:w-[39.30%]', shapeClass)}>\n          <div className=\"product-compare-label product-compare-competitor-label absolute left-[16px] top-[16px] rounded-[24px] bg-[#000] bg-opacity-20 px-[20px] pb-[10px] pt-[11px] font-bold laptop:left-[28px] laptop:top-[28px] laptop:px-[28px] laptop:pb-[14px] laptop:pt-[15px] desktop:left-[32px] desktop:top-[32px]\">\n            <Heading as={'h6'} className=\"font-bold\" size={1}>\n              {competitor.text}\n            </Heading>\n          </div>\n          <LazyMedia offset={1500}>\n            <MediaElement\n              media={competitor.media}\n              poster={competitor.poster}\n              className=\"product-compare-media product-compare-competitor-media hidden w-full h-full object-cover laptop:block\"\n            />\n            <MediaElement\n              media={competitor.mobMedia}\n              poster={competitor.mobPoster}\n              className=\"product-compare-media product-compare-competitor-media-mobile block laptop:hidden\"\n            />\n          </LazyMedia>\n        </div>\n        <div className={cn('product-compare-item product-compare-our-product relative order-1 flex-shrink overflow-hidden tablet:order-2 tablet:w-[50%] laptop:w-[59.53%]', shapeClass)}>\n          <div className=\"product-compare-label product-compare-our-product-label absolute left-[16px] top-[16px] rounded-[24px] bg-brand-0 px-[20px] pb-[10px] pt-[11px] font-bold laptop:left-[28px] laptop:top-[28px] laptop:px-[28px] laptop:pb-[14px] laptop:pt-[15px] desktop:left-[32px] desktop:top-[32px]\">\n            <Heading as={'h6'} className=\"font-bold\" size={1}>\n              {ourProduct.text}\n            </Heading>\n          </div>\n          <LazyMedia offset={1500}>\n            <MediaElement\n              media={ourProduct.media}\n              poster={ourProduct.poster}\n              className=\"product-compare-media product-compare-our-product-media hidden w-full laptop:block\"\n            />\n            <MediaElement\n              media={ourProduct.mobMedia}\n              poster={ourProduct.mobPoster}\n              className=\"product-compare-media product-compare-our-product-media-mobile block laptop:hidden\"\n            />\n          </LazyMedia>\n        </div>\n      </div>\n    </section>\n  )\n}\n\nexport default withLayout(ProductCompare)"],
+  "mappings": "AAmBS,cAAAA,EAoGC,QAAAC,MApGD,oBAnBT,OAAS,aAAAC,EAAW,UAAAC,EAAQ,YAAAC,MAAgB,QAC5C,OAAS,WAAAC,EAAS,QAAAC,MAAY,4BAC9B,OAAS,MAAAC,MAAU,yBAEnB,OAAS,cAAAC,MAAkB,yBAE3B,SAASC,EAAU,CAAE,SAAAC,EAAU,OAAAC,EAAS,GAAI,EAAmD,CAC7F,KAAM,CAACC,EAAQC,CAAS,EAAIT,EAAS,EAAK,EACpCU,EAAMX,EAAuB,IAAI,EAEvC,OAAAD,EAAU,IAAM,CACd,MAAMa,EAAW,IAAI,qBACnB,CAAC,CAACC,CAAK,IAAMA,EAAM,gBAAkBH,EAAU,EAAI,EACnD,CAAE,WAAY,GAAGF,CAAM,IAAK,CAC9B,EACA,OAAAG,EAAI,SAAWC,EAAS,QAAQD,EAAI,OAAO,EACpC,IAAMC,EAAS,WAAW,CACnC,EAAG,CAACJ,CAAM,CAAC,EAEJX,EAAC,OAAI,IAAKc,EAAK,UAAU,YAAa,SAAAF,GAAUF,EAAS,CAClE,CAEA,SAASO,EAAa,CAAE,MAAAC,EAAO,OAAAC,EAAQ,UAAAC,CAAU,EAA2D,CAC1G,OAAKF,GAAO,IAEIA,EAAM,UAAU,WAAW,QAAQ,EAI/ClB,EAAC,SACC,IAAKkB,EAAM,IACX,YAAW,GACX,SAAQ,GACR,MAAK,GACL,KAAI,GACJ,OAAQC,EACR,QAAQ,WACR,wBAAuB,GACvB,sBAAqB,GACrB,qBAAmB,OACnB,uBAAqB,KACrB,6BAA2B,QAC3B,iBAAe,OACf,UAAWC,EACX,MAAOF,EAAM,MACb,OAAQA,EAAM,OAChB,EAKFlB,EAAC,OACC,IAAKkB,EAAM,IACX,IAAKA,EAAM,KAAO,GAClB,UAAWE,EACX,MAAOF,EAAM,MACb,OAAQA,EAAM,OAChB,EAlCsB,IAoC1B,CAmCA,SAASG,EAAeC,EAA4B,CAClD,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,WAAAC,EAAa,CAAC,EAAG,WAAAC,EAAa,CAAC,EAAG,MAAAC,EAAQ,QAAS,MAAAC,EAAQ,SAAU,EAAIN,EAAM,KAGlGO,EAAa,CACjB,QAAS,uCACT,OAAQ,cACV,EAAED,CAAK,EAEP,OACE3B,EAAC,WAAQ,UAAWM,EAAG,yDAA0De,EAAM,UAAW,CAAE,YAAaK,IAAU,MAAO,CAAC,EAChI,UAAAJ,GAASvB,EAACK,EAAA,CAAQ,GAAI,KAAM,KAAM,EAAG,KAAMkB,EAAO,UAAU,0BAA0B,EACtFC,GAAYxB,EAACM,EAAA,CACZ,GAAG,IACH,KAAM,EACN,KAAMkB,EACN,UAAU,mIACZ,EACAvB,EAAC,OAAI,UAAU,uHACb,UAAAA,EAAC,OAAI,UAAWM,EAAG,+IAAgJsB,CAAU,EAC3K,UAAA7B,EAAC,OAAI,UAAU,uSACb,SAAAA,EAACK,EAAA,CAAQ,GAAI,KAAM,UAAU,YAAY,KAAM,EAC5C,SAAAqB,EAAW,KACd,EACF,EACAzB,EAACQ,EAAA,CAAU,OAAQ,KACjB,UAAAT,EAACiB,EAAA,CACC,MAAOS,EAAW,MAClB,OAAQA,EAAW,OACnB,UAAU,wGACZ,EACA1B,EAACiB,EAAA,CACC,MAAOS,EAAW,SAClB,OAAQA,EAAW,UACnB,UAAU,oFACZ,GACF,GACF,EACAzB,EAAC,OAAI,UAAWM,EAAG,gJAAiJsB,CAAU,EAC5K,UAAA7B,EAAC,OAAI,UAAU,2RACb,SAAAA,EAACK,EAAA,CAAQ,GAAI,KAAM,UAAU,YAAY,KAAM,EAC5C,SAAAoB,EAAW,KACd,EACF,EACAxB,EAACQ,EAAA,CAAU,OAAQ,KACjB,UAAAT,EAACiB,EAAA,CACC,MAAOQ,EAAW,MAClB,OAAQA,EAAW,OACnB,UAAU,qFACZ,EACAzB,EAACiB,EAAA,CACC,MAAOQ,EAAW,SAClB,OAAQA,EAAW,UACnB,UAAU,qFACZ,GACF,GACF,GACF,GACF,CAEJ,CAEA,IAAOK,EAAQtB,EAAWa,CAAc",
+  "names": ["jsx", "jsxs", "useEffect", "useRef", "useState", "Heading", "Text", "cn", "withLayout", "LazyMedia", "children", "offset", "loaded", "setLoaded", "ref", "observer", "entry", "MediaElement", "media", "poster", "className", "ProductCompare", "props", "title", "subtitle", "ourProduct", "competitor", "theme", "shape", "shapeClass", "ProductCompare_default"]
+}

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

@@ -0,0 +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>;
+}, "ref"> & React.RefAttributes<any>>;
+export default _default;

package/dist/esm/biz-components/ProductHero/ProductHero.js

@@ -0,0 +1,2 @@
+"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import f,{useRef as x,useImperativeHandle as b}from"react";import{Heading as a,Button as h,Picture as H,Text as P}from"../../components/index.js";import{cn as v}from"../../helpers/utils.js";import{withLayout as N}from"../../shared/Styles.js";import{useExposure as g}from"../../hooks/useExposure.js";const k="image",w="product_hero",l=f.forwardRef(({data:r,className:i},m)=>{const{title:p,subtitle:e,ctaText:c,poster:n,mobPoster:d,ctaLink:u}=r,o=x(null);return g(o,{componentType:k,componentName:w,componentTitle:p,componentDescription:e}),b(m,()=>o.current),s("section",{ref:o,"data-ui-component-id":"ProductHero",className:v("flex w-full flex-col items-center justify-between gap-[32px] tablet:flex-row tablet:gap-[16px] lg-desktop:gap-[64px]",i),children:[s("div",{className:"flex w-full flex-col items-start gap-[24px] tablet:basis-[42%] laptop:basis-[36%]",children:[s("div",{children:[t(a,{as:"h3",size:4,html:p}),t(a,{as:"h4",size:2,html:e,className:"mt-[4px] hidden laptop:mt-[12px] laptop:block desktop:mt-[16px]"}),t(P,{as:"p",size:2,html:e,className:"mt-[4px] block laptop:mt-[12px] laptop:hidden desktop:mt-[16px]"})]}),t("a",{href:u,children:t(h,{className:"w-fit",children:c})})]}),t(H,{className:"aspect-[358/360] flex-shrink tablet:aspect-[824/640] tablet:basis-[58%] laptop:basis-[64%]",source:`${n}, ${d} 768`})]})});l.displayName="ProductHero";var R=N(l);export{R as default};
+//# sourceMappingURL=ProductHero.js.map

package/dist/esm/biz-components/ProductHero/ProductHero.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/ProductHero/ProductHero.tsx"],
+  "sourcesContent": ["'use client'\nimport React, { useRef, useImperativeHandle } from 'react'\nimport { Heading, Button, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ProductHeroProps } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'product_hero'\n\nconst ProductHero = React.forwardRef<HTMLDivElement, ProductHeroProps>(({ data, className }, ref) => {\n  const { title, subtitle, ctaText, poster, mobPoster, ctaLink } = data\n\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  return (\n    <section\n      ref={boxRef}\n      data-ui-component-id=\"ProductHero\"\n      className={cn(\n        'flex w-full flex-col items-center justify-between gap-[32px] tablet:flex-row tablet:gap-[16px] lg-desktop:gap-[64px]',\n        className\n      )}\n    >\n      <div className=\"flex w-full flex-col items-start gap-[24px] tablet:basis-[42%] laptop:basis-[36%]\">\n        <div>\n          <Heading as={'h3'} size={4} html={title} />\n          <Heading\n            as={'h4'}\n            size={2}\n            html={subtitle}\n            className=\"mt-[4px] hidden laptop:mt-[12px] laptop:block desktop:mt-[16px]\"\n          />\n          <Text\n            as={'p'}\n            size={2}\n            html={subtitle}\n            className=\"mt-[4px] block laptop:mt-[12px] laptop:hidden desktop:mt-[16px]\"\n          />\n        </div>\n        <a href={ctaLink}>\n          <Button className=\"w-fit\">{ctaText}</Button>\n        </a>\n      </div>\n      <Picture\n        className=\"aspect-[358/360] flex-shrink tablet:aspect-[824/640] tablet:basis-[58%] laptop:basis-[64%]\"\n        source={`${poster}, ${mobPoster} 768`}\n      />\n    </section>\n  )\n})\n\nProductHero.displayName = 'ProductHero'\n\nexport default withLayout(ProductHero)\n"],
+  "mappings": "aAmCQ,OACE,OAAAA,EADF,QAAAC,MAAA,oBAlCR,OAAOC,GAAS,UAAAC,EAAQ,uBAAAC,MAA2B,QACnD,OAAS,WAAAC,EAAS,UAAAC,EAAQ,WAAAC,EAAS,QAAAC,MAAY,4BAC/C,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,eAAAC,MAAmB,6BAG5B,MAAMC,EAAgB,QAChBC,EAAgB,eAEhBC,EAAcZ,EAAM,WAA6C,CAAC,CAAE,KAAAa,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CACnG,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,QAAAC,EAAS,OAAAC,EAAQ,UAAAC,EAAW,QAAAC,CAAQ,EAAIR,EAE3DS,EAASrB,EAAuB,IAAI,EAE1C,OAAAQ,EAAYa,EAAQ,CAClB,cAAAZ,EACA,cAAAC,EACA,eAAgBK,EAChB,qBAAsBC,CACxB,CAAC,EAEDf,EAAoBa,EAAK,IAAMO,EAAO,OAAyB,EAG7DvB,EAAC,WACC,IAAKuB,EACL,uBAAqB,cACrB,UAAWf,EACT,uHACAO,CACF,EAEA,UAAAf,EAAC,OAAI,UAAU,oFACb,UAAAA,EAAC,OACC,UAAAD,EAACK,EAAA,CAAQ,GAAI,KAAM,KAAM,EAAG,KAAMa,EAAO,EACzClB,EAACK,EAAA,CACC,GAAI,KACJ,KAAM,EACN,KAAMc,EACN,UAAU,kEACZ,EACAnB,EAACQ,EAAA,CACC,GAAI,IACJ,KAAM,EACN,KAAMW,EACN,UAAU,kEACZ,GACF,EACAnB,EAAC,KAAE,KAAMuB,EACP,SAAAvB,EAACM,EAAA,CAAO,UAAU,QAAS,SAAAc,EAAQ,EACrC,GACF,EACApB,EAACO,EAAA,CACC,UAAU,6FACV,OAAQ,GAAGc,CAAM,KAAKC,CAAS,OACjC,GACF,CAEJ,CAAC,EAEDR,EAAY,YAAc,cAE1B,IAAOW,EAAQf,EAAWI,CAAW",
+  "names": ["jsx", "jsxs", "React", "useRef", "useImperativeHandle", "Heading", "Button", "Picture", "Text", "cn", "withLayout", "useExposure", "componentType", "componentName", "ProductHero", "data", "className", "ref", "title", "subtitle", "ctaText", "poster", "mobPoster", "ctaLink", "boxRef", "ProductHero_default"]
+}

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

@@ -0,0 +1,2 @@
+export { default } from './ProductHero.js';
+export type { ProductHeroProps } from './types.js';

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

@@ -0,0 +1,2 @@
+import{default as e}from"./ProductHero.js";export{e as default};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/ProductHero/index.ts"],
+  "sourcesContent": ["export { default } from './ProductHero.js'\nexport type { ProductHeroProps } from './types.js'\n"],
+  "mappings": "AAAA,OAAS,WAAAA,MAAe",
+  "names": ["default"]
+}

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

@@ -0,0 +1,20 @@
+export interface ProductHeroProps {
+    data: {
+        /** 主标题 */
+        title: string;
+        /** 副标题 */
+        subtitle: string;
+        /** CTA 按钮文本 */
+        ctaText: string;
+        /** CTA 按钮链接 */
+        ctaLink: string;
+        /** 桌面端图片 URL */
+        poster: string;
+        /** 移动端图片 URL */
+        mobPoster: string;
+        /** 3D 模型源（可选，暂未使用） */
+        modelSrc?: string;
+    };
+    /** 自定义类名 */
+    className?: string;
+}

package/dist/esm/biz-components/ProductHero/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/esm/biz-components/ProductHero/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

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

@@ -0,0 +1,11 @@
+export type DropDownProps = {
+    index: number;
+    active: any;
+    list: any;
+    setActive: any;
+    setVisible: any;
+    visible: any;
+    filterActive: any;
+};
+declare const DropDown: ({ index, active, list, setActive, setVisible, visible, filterActive }: DropDownProps) => import("react/jsx-runtime").JSX.Element;
+export default DropDown;

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

@@ -0,0 +1,3 @@
+import{jsx as a}from"react/jsx-runtime";import{useEffect as b,useRef as h,useMemo as x}from"react";const m="openDropDown",v=({index:l,active:s,list:d,setActive:p,setVisible:c,visible:t,filterActive:r})=>{const u=h(null);b(()=>{const e=n=>{const o=n?.target?.getAttribute?.("class");!u?.current?.contains(n?.target)&&!o?.includes(m)&&c({...t,[l]:!1})};return document.addEventListener("click",e),()=>document.removeEventListener("click",e)},[]);const f=x(()=>{const e=Object.keys(r||{});return d?.filter(n=>!e?.find(i=>r?.[i]?.handle===n?.handle))},[r,d]);return a("div",{ref:u,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-hidden rounded-lg bg-[#F5F5F7] ${t?.[l]?"block":"hidden"}`,children:a("div",{className:"m-0 box-border h-full flex-1 overflow-y-auto overflow-x-hidden p-0 [&:last-child]:border-r-0",children:f?.map((e,n)=>{const o=e?.sku||e?.variants?.[0]?.sku;return a("div",{onClick:()=>{p({...s,[n]:{sku:o,name:e?.name,handle:e?.handle}}),c({...t,[n]:!1})},title:e?.name,className:`openDropDown box-border cursor-pointer truncate px-6 py-4 text-base font-bold min-xl:text-lg min-xxl:text-lg [&:hover]:bg-[#EAEAEC]
+                ${e?.handle===s?.handle?"bg-[#EAEAEC]":""}`,children:e?.name},n)})})})};var D=v;export{D as default};
+//# sourceMappingURL=dropdown.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/Specs/dropdown.tsx"],
+  "sourcesContent": ["import { useEffect, useRef, useMemo } from 'react'\n\nconst clickContent = 'openDropDown'\n\nexport type DropDownProps = {\n  index: number\n  active: any\n  list: any\n  setActive: any\n  setVisible: any\n  visible: any\n  filterActive: any\n}\n\nconst DropDown = ({ index, active, list, setActive, setVisible, visible, filterActive }: DropDownProps) => {\n  const dropDownRef = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    const handleClickOutside = (event: any) => {\n      const isDel = event?.target?.getAttribute?.('class')\n      const isContainer = !dropDownRef?.current?.contains(event?.target)\n      if (isContainer && !isDel?.includes(clickContent)) {\n        setVisible({ ...visible, [index]: false })\n      }\n    }\n    document.addEventListener('click', handleClickOutside)\n    return () => document.removeEventListener('click', handleClickOutside)\n  }, [])\n\n  const handleList = useMemo(() => {\n    const activeIndex = Object.keys(filterActive || {})\n    return list?.filter((item: { handle: any }) => {\n      const currentIndex = activeIndex?.find((items: string) => filterActive?.[items]?.handle === item?.handle)\n      return !currentIndex\n    })\n  }, [filterActive, list])\n\n  return (\n    <div\n      ref={dropDownRef}\n      className={`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-hidden rounded-lg bg-[#F5F5F7] ${visible?.[index] ? 'block' : 'hidden'}`}\n    >\n      <div className={'m-0 box-border h-full flex-1 overflow-y-auto overflow-x-hidden p-0 [&:last-child]:border-r-0'}>\n        {handleList?.map((item: any, index: number) => {\n          const currentSku = item?.sku || item?.variants?.[0]?.sku\n          return (\n            <div\n              key={index}\n              onClick={() => {\n                setActive({\n                  ...active,\n                  [index]: {\n                    sku: currentSku,\n                    name: item?.name,\n                    handle: item?.handle,\n                  },\n                })\n                setVisible({ ...visible, [index]: false })\n              }}\n              title={item?.name}\n              className={`openDropDown box-border cursor-pointer truncate px-6 py-4 text-base font-bold min-xl:text-lg min-xxl:text-lg [&:hover]:bg-[#EAEAEC]\n                ${item?.handle === active?.handle ? 'bg-[#EAEAEC]' : ''}`}\n            >\n              {item?.name}\n            </div>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\nexport default DropDown\n"],
+  "mappings": "AA8CY,cAAAA,MAAA,oBA9CZ,OAAS,aAAAC,EAAW,UAAAC,EAAQ,WAAAC,MAAe,QAE3C,MAAMC,EAAe,eAYfC,EAAW,CAAC,CAAE,MAAAC,EAAO,OAAAC,EAAQ,KAAAC,EAAM,UAAAC,EAAW,WAAAC,EAAY,QAAAC,EAAS,aAAAC,CAAa,IAAqB,CACzG,MAAMC,EAAcX,EAAuB,IAAI,EAE/CD,EAAU,IAAM,CACd,MAAMa,EAAsBC,GAAe,CACzC,MAAMC,EAAQD,GAAO,QAAQ,eAAe,OAAO,EAC/B,CAACF,GAAa,SAAS,SAASE,GAAO,MAAM,GAC9C,CAACC,GAAO,SAASZ,CAAY,GAC9CM,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAE7C,EACA,gBAAS,iBAAiB,QAASQ,CAAkB,EAC9C,IAAM,SAAS,oBAAoB,QAASA,CAAkB,CACvE,EAAG,CAAC,CAAC,EAEL,MAAMG,EAAad,EAAQ,IAAM,CAC/B,MAAMe,EAAc,OAAO,KAAKN,GAAgB,CAAC,CAAC,EAClD,OAAOJ,GAAM,OAAQW,GAEZ,CADcD,GAAa,KAAME,GAAkBR,IAAeQ,CAAK,GAAG,SAAWD,GAAM,MAAM,CAEzG,CACH,EAAG,CAACP,EAAcJ,CAAI,CAAC,EAEvB,OACER,EAAC,OACC,IAAKa,EACL,UAAW,2GAA2GF,IAAUL,CAAK,EAAI,QAAU,QAAQ,GAE3J,SAAAN,EAAC,OAAI,UAAW,+FACb,SAAAiB,GAAY,IAAI,CAACE,EAAWb,IAAkB,CAC7C,MAAMe,EAAaF,GAAM,KAAOA,GAAM,WAAW,CAAC,GAAG,IACrD,OACEnB,EAAC,OAEC,QAAS,IAAM,CACbS,EAAU,CACR,GAAGF,EACH,CAACD,CAAK,EAAG,CACP,IAAKe,EACL,KAAMF,GAAM,KACZ,OAAQA,GAAM,MAChB,CACF,CAAC,EACDT,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAC3C,EACA,MAAOa,GAAM,KACb,UAAW;AAAA,kBACPA,GAAM,SAAWZ,GAAQ,OAAS,eAAiB,EAAE,GAExD,SAAAY,GAAM,MAhBFb,CAiBP,CAEJ,CAAC,EACH,EACF,CAEJ,EAEA,IAAOgB,EAAQjB",
+  "names": ["jsx", "useEffect", "useRef", "useMemo", "clickContent", "DropDown", "index", "active", "list", "setActive", "setVisible", "visible", "filterActive", "dropDownRef", "handleClickOutside", "event", "isDel", "handleList", "activeIndex", "item", "items", "currentSku", "dropdown_default"]
+}

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

@@ -0,0 +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>;
+}, "ref"> & React.RefAttributes<any>>;
+export default _default;

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

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

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/Specs/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport DropDown from './dropdown'\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, Container, 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 } = page || {}\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n  const [active, setActive] = useState<any>({})\n  const [visibleActive, setVisibleActive] = useState<{ [key: number]: boolean }>({})\n\n  const innerRef = useRef<HTMLDivElement>(null)\n\n  const { locale = 'us' } = 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 findCurrentData = RightMenu?.menus?.find?.((item: any) => item?.handle === product?.handle)\n    const findSku = product?.variants?.find?.((item: any) => item?.sku === product?.sku || findCurrentData?.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      currencyCode: product?.price?.currencyCode || 'USD',\n    })\n    return (\n      <div className=\"box-border overflow-hidden specs-sku-node-wrap\">\n        <Text\n          className={`relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold 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`}\n          onClick={() => setVisibleActive({ ...visibleActive, [index]: !visibleActive?.[index] })}\n        >\n          <div className=\"flex items-center justify-between overflow-hidden\">\n            <div\n              className=\"openDropDown flex-1 truncate text-base md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title\"\n              title={active?.[index]?.name}\n            >\n              {active?.[index]?.name || ''}\n            </div>\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                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </div>\n          <DropDown\n            index={index}\n            list={buildData?.products}\n            active={active}\n            filterActive={active}\n            setActive={setActive}\n            visible={visibleActive}\n            setVisible={setVisibleActive}\n          />\n        </Text>\n        <div className=\"max-h-[138px] max-w-[138px] lg-desktop:max-h-[196px] lg-desktop:max-w-[196px]\">\n          <Picture\n            source={findSku?.image?.url || ''}\n            className=\"aspect-h-[280] aspect-w-[280]\"\n            imgClassName=\"w-full h-full object-cover\"\n          />\n        </div>\n        {findSku?.availableForSale ? (\n          <div className=\"mb-2 mt-6 flex items-center text-xl font-bold lg-desktop:text-2xl\">\n            <div className=\"text-[#1D1D1F] specs-sku-node-price\">{price || ''}</div>\n            {basePrice && (\n              <div className=\"ml-1 text-xl text-[#86868C] line-through lg-desktop:text-2xl specs-sku-node-base-price\">\n                {basePrice}\n              </div>\n            )}\n          </div>\n        ) : (\n          false\n        )}\n        {DefaultSelectMenu?.buttonText ? (\n          <Button onClick={() => onChange?.(product)} className=\"specs-sku-node-button\">\n            {DefaultSelectMenu?.buttonText}\n          </Button>\n        ) : null}\n      </div>\n    )\n  }\n\n  const normalNode = (v: any) => {\n    if (!v) return\n    if (v && typeof v !== 'string') {\n      return (\n        <div className=\"size-full\">\n          <p\n            className=\"text-base font-bold text-[#1D1D1F] md:text-sm min-xxl:text-lg specs-normal-node-text\"\n            dangerouslySetInnerHTML={{\n              __html: v?.text || '',\n            }}\n          />\n          <Picture\n            source={v?.imgUrl}\n            className=\"m-auto max-h-[360px] max-w-[360px] l:max-h-[174px] l:max-w-[174px]\"\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=\"m-auto max-h-[360px] max-w-[360px] l:max-h-[174px] l:max-w-[174px]\"\n            imgClassName=\"w-full h-full object-cover\"\n          />\n        ) : (\n          <p\n            className=\"text-base font-bold text-[#1D1D1F] md:text-sm min-xxl:text-lg specs-normal-node-text\"\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={`box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] l-tablet:flex l-tablet:flex-col ${isFirstParameter ? '' : ''} specs-product-node-wrap`}\n        >\n          <Heading\n            as=\"h3\"\n            html={st || ''}\n            className=\"mr-4 flex-1 pt-4 tablet:py-6 text-base font-bold md:text-sm l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title\"\n          />\n          <div\n            className={`col-span-2 grid flex-1 py-6 l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-2 specs-product-node-body`}\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={`box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t-[#E4E5E6] l-tablet:flex l-tablet:flex-col border-t-0 specs-content-item-product`}\n          >\n            {node?.title && <Heading as=\"h3\" html={node?.title || ''} className=\"l:hidden specs-item-product-title\" />}\n            <div\n              className={`col-span-2 grid flex-1 pb-4 l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-2 pr-0 specs-item-product-body`}\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, sku: currentData?.sku, item: item }, 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,\n            handle: findData?.handle,\n          },\n        }\n      }\n    })\n    setActive(currentActive)\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        setActive(newShowActive)\n      }\n    }\n  }, [isMobile])\n\n  return (\n    <div className=\"w-full overflow-hidden bg-[#F5F5F7] specs-wrapper\" ref={innerRef}>\n      {LeftMenu?.data ? (\n        <div className=\"box-border w-full overflow-hidden specs-wrapper-content\">\n          {LeftMenu?.data?.map?.((item: any, index: number) => {\n            return (\n              <div key={index} className=\"w-full overflow-hidden pt-10 [&:first-child]:pt-0 specs-wrapper-content-item\">\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", "isMobile", "active", "setActive", "visibleActive", "setVisibleActive", "innerRef", "locale", "LeftMenu", "RightMenu", "DefaultSelectMenu", "isImageUrl", "urlPath", "path", "skuNode", "product", "index", "findCurrentData", "item", "findSku", "coupon", "price", "basePrice", "normalNode", "v", "productNode", "st", "idx", "isFirstParameter", "currentData", "currentMenus", "childrenNode", "node", "subTitle", "isProduct", "currentProduct", "skus", "currentActive", "sku", "findData", "newActive", "newShowActive", "Specs_default"]
+}