@anker-in/headless-ui 1.0.26-alpha.1762425661848 → 1.0.26-alpha.1762426225057

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

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+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 | undefined;
+    data?: Record<string, any> | undefined;
+} & import("react").RefAttributes<any>>;
+export default _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 | undefined;
+    data?: Record<string, any> | undefined;
+}, "ref"> & React.RefAttributes<any>>;
+export default _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/types.d.ts

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

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

@@ -0,0 +1,6 @@
+import type { SearchPageProps } from './types';
+/**
+ * 搜索页面
+ */
+declare const SearchPage: ({ searchResult, searchValue, data, onSecondaryButton, onPrimaryButton, onChangeSort, loading, searchResultCount, onChangeTab, buildProps, }: SearchPageProps) => import("react/jsx-runtime").JSX.Element;
+export default SearchPage;

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

@@ -0,0 +1,58 @@
+import type { Product } from '../../cpn-components/CpnProductCard/types';
+export type SearchPageType = 'products' | 'blogs' | 'pages';
+export type SortKey = {
+    id: string;
+    value: string;
+    label: string;
+};
+export interface SearchPageProps {
+    searchResult: {
+        [key in SearchPageTabType]: any;
+    };
+    searchResultCount: {
+        [key in SearchPageTabType]: number;
+    };
+    loading?: boolean;
+    searchValue: string;
+    data: any;
+    buildProps?: {
+        products: any[];
+    };
+    onChangeTab?: (tabType: SearchPageTabType) => void;
+    onSecondaryButton?: (product: Product) => void;
+    onPrimaryButton?: (product: Product) => void;
+    onChangeSort?: (tabType: SearchPageType, sortKey: {
+        value: string;
+        label: string;
+    }) => void;
+}
+export interface SearchProductItemProps {
+    searchValue?: string;
+    product: any;
+    variantData?: any;
+    onSecondaryButton?: () => void;
+    onPrimaryButton?: () => void;
+}
+export interface SearchBlogItemProps {
+    searchValue: string;
+    blog: any;
+}
+export interface SearchPageItemProps {
+    searchValue: string;
+    page: any;
+}
+export declare enum SearchPageTabType {
+    PRODUCTS = "products",
+    BLOGS = "blogs",
+    PAGES = "pages"
+}
+export interface SearchRecommendProductsProps {
+    products: any[];
+    title: string;
+    buildProps?: {
+        products: any[];
+    };
+    onSecondaryButton?: () => void;
+    onPrimaryButton?: () => void;
+}
+export declare const IPC_SEARCH_PAGE = "ipc-search-page";

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

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import type { Img } from '../../types/props.js';
+export type SelectStoreDataType = {
+    title: string;
+    desc: string;
+    img: Img;
+    mobileImg: Img;
+    padImg: Img;
+    miniImg: Img;
+};
+type SelectStoreType = {
+    data: {
+        list: SelectStoreDataType[];
+    };
+    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 | undefined;
+    data?: Record<string, any> | undefined;
+} & import("react").RefAttributes<any>>;
+export default _default;

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

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

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

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

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

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

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

@@ -0,0 +1,106 @@
+import type { ContainerProps } from '../../types/props.js';
+export declare const PRICE_SYMBOL: any;
+export declare const languageTerritory: (locale: string) => string;
+export declare function formatPrice({ amount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
+    amount: number;
+    currencyCode: string;
+    locale: string;
+    maximumFractionDigits?: number;
+    minimumFractionDigits?: number;
+    removeTrailingZeros?: boolean;
+}): string | null;
+export declare function formatVariantPrice({ amount, baseAmount, currencyCode, locale, maximumFractionDigits, minimumFractionDigits, removeTrailingZeros, }: {
+    baseAmount: number;
+    amount: number;
+    currencyCode: string;
+    locale: string;
+    maximumFractionDigits?: number;
+    minimumFractionDigits?: number;
+    removeTrailingZeros?: boolean;
+}): {
+    price: string;
+    basePrice: string;
+    discount: string;
+    discountAmount?: undefined;
+} | {
+    price: string | null;
+    basePrice: string | null | undefined;
+    discount: string | null;
+    discountAmount: string | null | undefined;
+};
+type EventType = {
+    primaryButton?: (v: any, index: number, data: ShelfDisplayType) => void;
+    secondaryButton?: (v: any, index: number, data: ShelfDisplayType) => void;
+};
+export interface ShelfDisplayItem {
+    id?: string;
+    /** 产品图片*/
+    img?: {
+        url: string;
+    };
+    handle?: string;
+    sku?: string;
+    /** 折扣后价格*/
+    price?: string;
+    title?: string;
+    /** 折扣前价格*/
+    basePrice?: string;
+    subTitle?: string;
+    /** 标签*/
+    tagItems?: string[];
+    tab?: string;
+    data?: ShelfDisplayItem[];
+    custom_name?: string;
+    custom_description?: string;
+    custom_image?: string;
+    custom_theme?: string;
+}
+export type ShelfDisplayType = {
+    title?: string;
+    isShowTab?: boolean;
+    isShowTag?: boolean;
+    isShowRecommendedCard?: boolean;
+    isShowOriginalPrice?: boolean;
+    direction?: 'horizontal' | 'vertical';
+    align?: 'left' | 'center' | 'right';
+    productsTab?: any[];
+    productsCard?: any[];
+    /** 卡片形状 */
+    itemShape?: 'round' | 'square';
+    /** 按钮形状 */
+    shape?: 'round' | 'square';
+    /** 标签页形状*/
+    tabShape?: 'rounded' | 'square';
+    /** 主按钮配置 */
+    primaryButton?: string;
+    primaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore';
+    /** 副按钮配置 */
+    secondaryButton?: string;
+    secondaryFun?: 'AddCart' | 'BuyNow' | 'LearnMore';
+    theme?: 'light' | 'dark';
+    containerProps?: ContainerProps;
+};
+export interface ShelfDisplayProps {
+    data: ShelfDisplayType;
+    buildData?: {
+        categories: any[];
+        products: any[];
+    };
+    recommendedData?: any[];
+    /** 按钮事件*/
+    event?: EventType;
+    className?: string;
+    key?: string;
+    target?: '_self' | '_blank';
+    breakpoints?: {
+        [key: number]: {
+            spaceBetween: number;
+            freeMode: boolean;
+            slidesPerView: number;
+        };
+    };
+    metafields?: any;
+    isDisplayGudgments?: boolean;
+    isDisplayBackImage?: boolean;
+}
+export {};

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

@@ -0,0 +1,8 @@
+export declare const ShelfDisplayWrapItem: ({ data, configuration }: {
+    data: any;
+    configuration?: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const ShelfDisplayHorizontalItem: ({ data, configuration }: {
+    data: any;
+    configuration?: any;
+}) => import("react/jsx-runtime").JSX.Element;

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

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

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

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

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

@@ -0,0 +1,9 @@
+import React from 'react';
+interface TabsProps {
+    tabs: any[];
+    value: string;
+    tabShape?: 'rounded' | 'square';
+    onTabClick?: (value: any) => void;
+}
+declare const TabSwitch: React.FC<TabsProps>;
+export default TabSwitch;

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

@@ -0,0 +1,9 @@
+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 | undefined;
+    data?: Record<string, any> | undefined;
+}, "ref"> & React.RefAttributes<any>>;
+export default _default;