@anker-in/headless-ui 0.0.27-alpha.110 → 0.0.27-alpha.111

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -19,8 +19,8 @@ export interface ShelfDisplayItem {
19
19
  data?: ShelfDisplayItem[];
20
20
  }
21
21
  type EventType = {
22
- primaryButton?: (v: any) => void;
23
- secondaryButton?: (v: any) => void;
22
+ primaryButton?: (v: any, index: number) => void;
23
+ secondaryButton?: (v: any, index: number) => void;
24
24
  };
25
25
  export interface ShelfDisplayProps {
26
26
  data: {
@@ -1,8 +1,8 @@
1
- "use strict";"use client";var z=Object.create;var y=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var Q=(e,t)=>{for(var a in t)y(e,a,{get:t[a],enumerable:!0})},N=(e,t,a,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of U(t))!H.call(e,i)&&i!==a&&y(e,i,{get:()=>t[i],enumerable:!(l=R(t,i))||l.enumerable});return e};var u=(e,t,a)=>(a=e!=null?z(j(e)):{},N(t||!e||!e.__esModule?y(a,"default",{value:e,enumerable:!0}):a,e)),_=e=>N(y({},"__esModule",{value:!0}),e);var K={};Q(K,{default:()=>J});module.exports=_(K);var r=require("react/jsx-runtime"),o=u(require("react")),f=require("../../helpers/utils.js"),D=u(require("../../components/picture.js")),c=require("../../components/tabs.js"),w=u(require("../../components/button.js")),P=u(require("../Title/index.js")),I=u(require("../SwiperBox/index.js")),C=require("../../shared/Styles.js"),M=require("./shelfDisplay.js"),V=require("react-responsive");const F=({data:e,configuration:t})=>{const a=s=>t?.event?.primaryButton?.(s),l=s=>t?.event?.secondaryButton?.(s),{price:i,basePrice:x}=(0,M.formatVariantPrice)({locale:"us",amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD"}),h=()=>{const s=e?.sku,d=e?.variants;return d?.find(v=>v?.sku===s)?.image?.url||d?.[0]?.image?.url||""};return(0,r.jsxs)("div",{className:(0,f.cn)("laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300",t?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[(0,r.jsx)("div",{className:(0,f.cn)("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden"),children:(0,r.jsx)(D.default,{source:h(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),(0,r.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.slice(0,1)?.map?.((s,d)=>(0,r.jsx)("div",{className:"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold",children:s},d))}),(0,r.jsx)("p",{title:e?.title||"",className:"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold",children:e?.title||""}),(0,r.jsx)("h3",{title:e?.description||"",className:"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold",children:e?.description||""}),(0,r.jsxs)("div",{className:"mb-2 flex items-center",children:[(0,r.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:i||""}),(0,r.jsx)("div",{className:"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold",children:x||""})]}),(0,r.jsxs)("div",{className:(0,f.cn)("flex items-center gap-3",t.direction==="vertical"?"flex-col":""),children:[(0,r.jsx)(w.default,{variant:"primary",onClick:()=>a(e),className:`
1
+ "use strict";"use client";var z=Object.create;var x=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var Q=(e,t)=>{for(var a in t)x(e,a,{get:t[a],enumerable:!0})},N=(e,t,a,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of U(t))!H.call(e,n)&&n!==a&&x(e,n,{get:()=>t[n],enumerable:!(d=R(t,n))||d.enumerable});return e};var u=(e,t,a)=>(a=e!=null?z(j(e)):{},N(t||!e||!e.__esModule?x(a,"default",{value:e,enumerable:!0}):a,e)),_=e=>N(x({},"__esModule",{value:!0}),e);var K={};Q(K,{default:()=>J});module.exports=_(K);var r=require("react/jsx-runtime"),o=u(require("react")),f=require("../../helpers/utils.js"),D=u(require("../../components/picture.js")),m=require("../../components/tabs.js"),w=u(require("../../components/button.js")),P=u(require("../Title/index.js")),I=u(require("../SwiperBox/index.js")),C=require("../../shared/Styles.js"),M=require("./shelfDisplay.js"),V=require("react-responsive");const F=({data:e,configuration:t})=>{const a=(s,i)=>t?.event?.primaryButton?.(s,i+1),d=(s,i)=>t?.event?.secondaryButton?.(s,i+1),{price:n,basePrice:y}=(0,M.formatVariantPrice)({locale:"us",amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD"}),h=()=>{const s=e?.sku,i=e?.variants;return i?.find(v=>v?.sku===s)?.image?.url||i?.[0]?.image?.url||""};return(0,r.jsxs)("div",{className:(0,f.cn)("laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300",t?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[(0,r.jsx)("div",{className:(0,f.cn)("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden"),children:(0,r.jsx)(D.default,{source:h(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),(0,r.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.slice(0,1)?.map?.((s,i)=>(0,r.jsx)("div",{className:"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold",children:s},i))}),(0,r.jsx)("p",{title:e?.title||"",className:"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold",children:e?.title||""}),(0,r.jsx)("h3",{title:e?.description||"",className:"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold",children:e?.description||""}),(0,r.jsxs)("div",{className:"mb-2 flex items-center",children:[(0,r.jsx)("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:n||""}),(0,r.jsx)("div",{className:"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold",children:y||""})]}),(0,r.jsxs)("div",{className:(0,f.cn)("flex items-center gap-3",t.direction==="vertical"?"flex-col":""),children:[(0,r.jsx)(w.default,{variant:"primary",onClick:()=>a(e,t?.index),className:`
2
2
  laptop:text-sm desktop:text-base text-xs
3
3
  ${t.direction==="vertical"?"w-full":""}
4
- `,children:t?.primaryButton||""}),(0,r.jsx)(w.default,{variant:"secondary",onClick:()=>l(e),className:`
4
+ `,children:t?.primaryButton||""}),(0,r.jsx)(w.default,{variant:"secondary",onClick:()=>d(e,t?.index),className:`
5
5
  laptop:text-sm desktop:text-base text-xs
6
6
  ${t.direction==="vertical"?"w-full":""}
7
- `,children:t?.secondaryButton||""})]})]},e?.id||e?.handle)},G=o.default.forwardRef(({data:e,buildData:t,className:a="",key:l,event:i},x)=>{const[h,s]=(0,o.useState)(""),[d,k]=(0,o.useState)([]),v=(0,V.useMediaQuery)({query:"(max-width: 768px)"}),{productsTab:b=[],productsCard:q=[],title:S,align:E="left",isShowTab:B=!0,tabShape:A="square",...L}=e,g=n=>{const m=n?.map(p=>{const T=t?.products?.find($=>$?.handle===p?.handle);if(T)return{sku:p.sku,...T}})?.filter(p=>p);k(m)};return(0,o.useEffect)(()=>{if(B){s(b?.[0]?.tab||""),g(b?.[0]?.data||[]);return}g(q)},[]),(0,r.jsxs)("div",{ref:x,className:(0,f.cn)("w-full",a,{"aiui-dark":e?.theme==="dark"}),children:[S&&(0,r.jsx)(P.default,{data:{title:S}}),B&&(0,r.jsx)("div",{className:`${v?"w-full overflow-hidden":""}`,children:(0,r.jsx)(c.Tabs,{shape:A,align:E,value:h,onValueChange:n=>{s(n);const m=b?.find(p=>p?.tab===n);g(m?.data||[])},className:"mb-8",children:(0,r.jsx)(c.TabsList,{children:b?.map((n,m)=>(0,r.jsx)(c.TabsTrigger,{value:n?.tab||"",children:n?.tab},m))})})}),(0,r.jsx)(I.default,{className:"!overflow-visible",id:"ShelfDisplay"+l,data:{list:d,configuration:{...L,event:i}},Slide:F,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})]})});var J=(0,C.withStyles)(G);
7
+ `,children:t?.secondaryButton||""})]})]},e?.id||e?.handle)},G=o.default.forwardRef(({data:e,buildData:t,className:a="",key:d,event:n},y)=>{const[h,s]=(0,o.useState)(""),[i,k]=(0,o.useState)([]),v=(0,V.useMediaQuery)({query:"(max-width: 768px)"}),{productsTab:b=[],productsCard:q=[],title:S,align:E="left",isShowTab:B=!0,tabShape:A="square",...L}=e,g=l=>{const c=l?.map(p=>{const T=t?.products?.find($=>$?.handle===p?.handle);if(T)return{sku:p.sku,...T}})?.filter(p=>p);k(c)};return(0,o.useEffect)(()=>{if(B){s(b?.[0]?.tab||""),g(b?.[0]?.data||[]);return}g(q)},[]),(0,r.jsxs)("div",{ref:y,className:(0,f.cn)("w-full",a,{"aiui-dark":e?.theme==="dark"}),children:[S&&(0,r.jsx)(P.default,{data:{title:S}}),B&&(0,r.jsx)("div",{className:`${v?"w-full overflow-hidden":""}`,children:(0,r.jsx)(m.Tabs,{shape:A,align:E,value:h,onValueChange:l=>{s(l);const c=b?.find(p=>p?.tab===l);g(c?.data||[])},className:"mb-8",children:(0,r.jsx)(m.TabsList,{children:b?.map((l,c)=>(0,r.jsx)(m.TabsTrigger,{value:l?.tab||"",children:l?.tab},c))})})}),(0,r.jsx)(I.default,{className:"!overflow-visible",id:"ShelfDisplay"+d,data:{list:i,configuration:{...L,event:n}},Slide:F,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})]})});var J=(0,C.withStyles)(G);
8
8
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport { useMediaQuery } from 'react-responsive'\nexport interface ShelfDisplayItem {\n id?: string\n /** \u4EA7\u54C1\u56FE\u7247*/\n img?: {\n url: string\n }\n handle?: string\n sku?: string\n /** \u6298\u6263\u540E\u4EF7\u683C*/\n price?: string\n title?: string\n /** \u6298\u6263\u524D\u4EF7\u683C*/\n basePrice?: string\n subTitle?: string\n /** \u6807\u7B7E*/\n tagItems?: string[]\n tab?: string\n data?: ShelfDisplayItem[]\n}\n\ntype EventType = {\n primaryButton?: (v: any) => void\n secondaryButton?: (v: any) => void\n}\n\nexport interface ShelfDisplayProps {\n data: {\n title?: string\n isShowTab?: boolean\n direction?: 'horizontal' | 'vertical'\n align?: 'left' | 'center' | 'right'\n productsTab?: any\n productsCard?: any\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n tabShape?: 'rounded' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton?: string\n theme?: 'light' | 'dark'\n }\n buildData?: {\n categories: any[]\n products: any[]\n }\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: EventType\n className?: string\n key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const onPrimaryButton = (params: ShelfDisplayItem) => configuration?.event?.primaryButton?.(params)\n\n const onSecondaryButton = (params: ShelfDisplayItem) => configuration?.event?.secondaryButton?.(params)\n\n const { price, basePrice } = formatVariantPrice({\n locale: 'us',\n amount: data?.price.amount || 0,\n baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 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 return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n 'laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden')}>\n <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n </div>\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n return (\n <div\n key={index}\n className=\"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold\"\n >\n {item}\n </div>\n )\n })}\n </div>\n <p\n title={data?.title || ''}\n className=\"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold\"\n >\n {data?.title || ''}\n </p>\n <h3\n title={data?.description || ''}\n className=\"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold\"\n >\n {data?.description || ''}\n </h3>\n <div className=\"mb-2 flex items-center\">\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{price || ''}</div>\n <div className=\"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold\">{basePrice || ''}</div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className={cn('flex items-center gap-3', configuration.direction === 'vertical' ? 'flex-col' : '')}>\n <Button\n variant=\"primary\"\n onClick={() => onPrimaryButton(data)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.primaryButton || ''}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={() => onSecondaryButton(data)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n </div>\n </div>\n )\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n ({ data, buildData, className = '', key, event }, ref) => {\n const [tabId, setTabId] = useState<string>('')\n const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const {\n productsTab = [],\n productsCard = [],\n title,\n align = 'left',\n isShowTab = true,\n tabShape = 'square',\n ...other\n } = data\n\n const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\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 ...findData,\n }\n }\n })\n ?.filter(item => item)\n setCurrentItems(newCurrentData)\n }\n\n useEffect(() => {\n if (isShowTab) {\n setTabId(productsTab?.[0]?.tab || '')\n handleCurrentTab(productsTab?.[0]?.data || [])\n return\n }\n handleCurrentTab(productsCard)\n }, [])\n\n return (\n <div ref={ref} className={cn('w-full', className, { 'aiui-dark': data?.theme === 'dark' })}>\n {title && <Title data={{ title: title }} />}\n {isShowTab && (\n <div className={`${isMobile ? 'w-full overflow-hidden' : ''}`}>\n <Tabs\n shape={tabShape}\n align={align}\n value={tabId}\n onValueChange={v => {\n setTabId(v)\n const findData = productsTab?.find((item: any) => item?.tab === v)\n handleCurrentTab(findData?.data || [])\n }}\n className=\"mb-8\"\n >\n <TabsList>\n {productsTab?.map((item: any, index: number) => {\n return (\n <TabsTrigger key={index} value={item?.tab || ''}>\n {item?.tab}\n </TabsTrigger>\n )\n })}\n </TabsList>\n </Tabs>\n </div>\n )}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'ShelfDisplay' + key}\n data={{ list: currentItems, configuration: { ...other, event: event } }}\n Slide={ShelfDisplayItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.1,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3,\n },\n 1440: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n }\n)\n\nexport default withStyles(ShelfDisplay)\n"],
5
- "mappings": "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",
6
- "names": ["ShelfDisplay_exports", "__export", "ShelfDisplay_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_tabs", "import_button", "import_Title", "import_SwiperBox", "import_Styles", "import_shelfDisplay", "import_react_responsive", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "Picture", "index", "Button", "ShelfDisplay", "React", "buildData", "className", "key", "event", "ref", "tabId", "setTabId", "currentItems", "setCurrentItems", "isMobile", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "Title", "v", "SwiperBox"]
4
+ "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport { useMediaQuery } from 'react-responsive'\nexport interface ShelfDisplayItem {\n id?: string\n /** \u4EA7\u54C1\u56FE\u7247*/\n img?: {\n url: string\n }\n handle?: string\n sku?: string\n /** \u6298\u6263\u540E\u4EF7\u683C*/\n price?: string\n title?: string\n /** \u6298\u6263\u524D\u4EF7\u683C*/\n basePrice?: string\n subTitle?: string\n /** \u6807\u7B7E*/\n tagItems?: string[]\n tab?: string\n data?: ShelfDisplayItem[]\n}\n\ntype EventType = {\n primaryButton?: (v: any, index: number) => void\n secondaryButton?: (v: any, index: number) => void\n}\n\nexport interface ShelfDisplayProps {\n data: {\n title?: string\n isShowTab?: boolean\n direction?: 'horizontal' | 'vertical'\n align?: 'left' | 'center' | 'right'\n productsTab?: any\n productsCard?: any\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n tabShape?: 'rounded' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton?: string\n theme?: 'light' | 'dark'\n }\n buildData?: {\n categories: any[]\n products: any[]\n }\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: EventType\n className?: string\n key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const onPrimaryButton = (params: ShelfDisplayItem, index: number) =>\n configuration?.event?.primaryButton?.(params, index + 1)\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number) =>\n configuration?.event?.secondaryButton?.(params, index + 1)\n\n const { price, basePrice } = formatVariantPrice({\n locale: 'us',\n amount: data?.price.amount || 0,\n baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 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 return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n 'laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden')}>\n <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n </div>\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n return (\n <div\n key={index}\n className=\"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold\"\n >\n {item}\n </div>\n )\n })}\n </div>\n <p\n title={data?.title || ''}\n className=\"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold\"\n >\n {data?.title || ''}\n </p>\n <h3\n title={data?.description || ''}\n className=\"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold\"\n >\n {data?.description || ''}\n </h3>\n <div className=\"mb-2 flex items-center\">\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{price || ''}</div>\n <div className=\"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold\">{basePrice || ''}</div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className={cn('flex items-center gap-3', configuration.direction === 'vertical' ? 'flex-col' : '')}>\n <Button\n variant=\"primary\"\n onClick={() => onPrimaryButton(data, configuration?.index)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.primaryButton || ''}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={() => onSecondaryButton(data, configuration?.index)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n </div>\n </div>\n )\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n ({ data, buildData, className = '', key, event }, ref) => {\n const [tabId, setTabId] = useState<string>('')\n const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const {\n productsTab = [],\n productsCard = [],\n title,\n align = 'left',\n isShowTab = true,\n tabShape = 'square',\n ...other\n } = data\n\n const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\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 ...findData,\n }\n }\n })\n ?.filter(item => item)\n setCurrentItems(newCurrentData)\n }\n\n useEffect(() => {\n if (isShowTab) {\n setTabId(productsTab?.[0]?.tab || '')\n handleCurrentTab(productsTab?.[0]?.data || [])\n return\n }\n handleCurrentTab(productsCard)\n }, [])\n\n return (\n <div ref={ref} className={cn('w-full', className, { 'aiui-dark': data?.theme === 'dark' })}>\n {title && <Title data={{ title: title }} />}\n {isShowTab && (\n <div className={`${isMobile ? 'w-full overflow-hidden' : ''}`}>\n <Tabs\n shape={tabShape}\n align={align}\n value={tabId}\n onValueChange={v => {\n setTabId(v)\n const findData = productsTab?.find((item: any) => item?.tab === v)\n handleCurrentTab(findData?.data || [])\n }}\n className=\"mb-8\"\n >\n <TabsList>\n {productsTab?.map((item: any, index: number) => {\n return (\n <TabsTrigger key={index} value={item?.tab || ''}>\n {item?.tab}\n </TabsTrigger>\n )\n })}\n </TabsList>\n </Tabs>\n </div>\n )}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'ShelfDisplay' + key}\n data={{ list: currentItems, configuration: { ...other, event: event } }}\n Slide={ShelfDisplayItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.1,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3,\n },\n 1440: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n }\n)\n\nexport default withStyles(ShelfDisplay)\n"],
5
+ "mappings": "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",
6
+ "names": ["ShelfDisplay_exports", "__export", "ShelfDisplay_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_tabs", "import_button", "import_Title", "import_SwiperBox", "import_Styles", "import_shelfDisplay", "import_react_responsive", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "index", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "Picture", "Button", "ShelfDisplay", "React", "buildData", "className", "key", "event", "ref", "tabId", "setTabId", "currentItems", "setCurrentItems", "isMobile", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "Title", "v", "SwiperBox"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var x=Object.create;var a=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var P=(e,r)=>{for(var o in r)a(e,o,{get:r[o],enumerable:!0})},w=(e,r,o,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let s of g(r))!E.call(e,s)&&s!==o&&a(e,s,{get:()=>r[s],enumerable:!(n=B(r,s))||n.enumerable});return e};var v=(e,r,o)=>(o=e!=null?x(M(e)):{},w(r||!e||!e.__esModule?a(o,"default",{value:e,enumerable:!0}):o,e)),y=e=>w(a({},"__esModule",{value:!0}),e);var b={};P(b,{default:()=>N});module.exports=y(b);var l=require("react/jsx-runtime"),i=v(require("react")),d=require("../../helpers/utils.js"),f=require("swiper/react"),t=require("swiper/modules");const m=i.default.forwardRef(({data:e,breakpoints:r,Slide:o,className:n,id:s})=>{const[h,u]=(0,i.useState)(!0),[V,c]=(0,i.useState)(!1);return(0,l.jsx)(f.Swiper,{className:(0,d.cn)(n),navigation:{nextEl:`.${s}-custom-swiper-button-next`,prevEl:`.${s}-custom-swiper-button-prev`},onProgress:p=>{u(p.isBeginning),c(p.isEnd)},modules:[t.Navigation,t.FreeMode,t.Mousewheel],freeMode:!0,mousewheel:{forceToAxis:!0},breakpoints:r||{0:{spaceBetween:12,slidesPerView:1,freeMode:!1},374:{spaceBetween:12,slidesPerView:1.1,freeMode:!1},768:{spaceBetween:16,slidesPerView:2,freeMode:!1}},children:e?.list?.map((p,S)=>(0,l.jsx)(f.SwiperSlide,{className:"!flex !h-[unset]",children:(0,l.jsx)(o,{data:p,configuration:e?.configuration})},s+"SwiperSlide"+S))})});m.displayName="SwiperBox";var N=m;
1
+ "use strict";"use client";var g=Object.create;var a=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var P=(e,r)=>{for(var o in r)a(e,o,{get:r[o],enumerable:!0})},m=(e,r,o,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of B(r))!E.call(e,i)&&i!==o&&a(e,i,{get:()=>r[i],enumerable:!(n=x(r,i))||n.enumerable});return e};var v=(e,r,o)=>(o=e!=null?g(M(e)):{},m(r||!e||!e.__esModule?a(o,"default",{value:e,enumerable:!0}):o,e)),y=e=>m(a({},"__esModule",{value:!0}),e);var b={};P(b,{default:()=>N});module.exports=y(b);var l=require("react/jsx-runtime"),t=v(require("react")),c=require("../../helpers/utils.js"),f=require("swiper/react"),s=require("swiper/modules");const u=t.default.forwardRef(({data:e,breakpoints:r,Slide:o,className:n,id:i})=>{const[h,d]=(0,t.useState)(!0),[V,S]=(0,t.useState)(!1);return(0,l.jsx)(f.Swiper,{className:(0,c.cn)(n),navigation:{nextEl:`.${i}-custom-swiper-button-next`,prevEl:`.${i}-custom-swiper-button-prev`},onProgress:p=>{d(p.isBeginning),S(p.isEnd)},modules:[s.Navigation,s.FreeMode,s.Mousewheel],freeMode:!0,mousewheel:{forceToAxis:!0},breakpoints:r||{0:{spaceBetween:12,slidesPerView:1,freeMode:!1},374:{spaceBetween:12,slidesPerView:1.1,freeMode:!1},768:{spaceBetween:16,slidesPerView:2,freeMode:!1}},children:e?.list?.map((p,w)=>(0,l.jsx)(f.SwiperSlide,{className:"!flex !h-[unset]",children:(0,l.jsx)(o,{data:p,configuration:e?.configuration?{...e?.configuration,index:w}:{index:w}})},i+"SwiperSlide"+w))})});u.displayName="SwiperBox";var N=u;
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/SwiperBox/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\n// import 'swiper/css'\n// import 'swiper/css/free-mode'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, FreeMode, Mousewheel } from 'swiper/modules'\nimport type { SwiperBoxProps } from './types.js'\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(({ data, breakpoints, Slide, className, id }) => {\n const [isStart, setStart] = useState(true)\n const [isEnd, setEnd] = useState(false)\n\n return (\n <Swiper\n className={cn(className)}\n navigation={{\n nextEl: `.${id}-custom-swiper-button-next`,\n prevEl: `.${id}-custom-swiper-button-prev`,\n }}\n onProgress={swiper => {\n setStart(swiper.isBeginning)\n setEnd(swiper.isEnd)\n }}\n modules={[Navigation, FreeMode, Mousewheel]}\n freeMode={true}\n mousewheel={{\n forceToAxis: true,\n }}\n breakpoints={\n breakpoints || {\n 0: {\n spaceBetween: 12,\n slidesPerView: 1,\n freeMode: false,\n },\n 374: {\n spaceBetween: 12,\n slidesPerView: 1.1,\n freeMode: false,\n },\n 768: {\n spaceBetween: 16,\n slidesPerView: 2,\n freeMode: false,\n },\n }\n }\n >\n {data?.list?.map((item, jIndex) => (\n <SwiperSlide key={id + 'SwiperSlide' + jIndex} className=\"!flex !h-[unset]\">\n <Slide data={item} configuration={data?.configuration} />\n </SwiperSlide>\n ))}\n </Swiper>\n )\n})\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
5
- "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmDU,IAAAI,EAAA,6BAlDVC,EAAgC,oBAChCC,EAAmB,kCAGnBD,EAAoC,wBACpCE,EAAiD,0BAGjD,MAAMC,EAAY,EAAAC,QAAM,WAA2C,CAAC,CAAE,KAAAC,EAAM,YAAAC,EAAa,MAAAC,EAAO,UAAAC,EAAW,GAAAC,CAAG,IAAM,CAClH,KAAM,CAACC,EAASC,CAAQ,KAAI,YAAS,EAAI,EACnC,CAACC,EAAOC,CAAM,KAAI,YAAS,EAAK,EAEtC,SACE,OAAC,UACC,aAAW,MAAGL,CAAS,EACvB,WAAY,CACV,OAAQ,IAAIC,CAAE,6BACd,OAAQ,IAAIA,CAAE,4BAChB,EACA,WAAYK,GAAU,CACpBH,EAASG,EAAO,WAAW,EAC3BD,EAAOC,EAAO,KAAK,CACrB,EACA,QAAS,CAAC,aAAY,WAAU,YAAU,EAC1C,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,YACER,GAAe,CACb,EAAG,CACD,aAAc,GACd,cAAe,EACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,IACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,EACf,SAAU,EACZ,CACF,EAGD,SAAAD,GAAM,MAAM,IAAI,CAACU,EAAMC,OACtB,OAAC,eAA8C,UAAU,mBACvD,mBAACT,EAAA,CAAM,KAAMQ,EAAM,cAAeV,GAAM,cAAe,GADvCI,EAAK,cAAgBO,CAEvC,CACD,EACH,CAEJ,CAAC,EAEDb,EAAU,YAAc,YAExB,IAAON,EAAQM",
4
+ "sourcesContent": ["'use client'\nimport React, { useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\n// import 'swiper/css'\n// import 'swiper/css/free-mode'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, FreeMode, Mousewheel } from 'swiper/modules'\nimport type { SwiperBoxProps } from './types.js'\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(({ data, breakpoints, Slide, className, id }) => {\n const [isStart, setStart] = useState(true)\n const [isEnd, setEnd] = useState(false)\n\n return (\n <Swiper\n className={cn(className)}\n navigation={{\n nextEl: `.${id}-custom-swiper-button-next`,\n prevEl: `.${id}-custom-swiper-button-prev`,\n }}\n onProgress={swiper => {\n setStart(swiper.isBeginning)\n setEnd(swiper.isEnd)\n }}\n modules={[Navigation, FreeMode, Mousewheel]}\n freeMode={true}\n mousewheel={{\n forceToAxis: true,\n }}\n breakpoints={\n breakpoints || {\n 0: {\n spaceBetween: 12,\n slidesPerView: 1,\n freeMode: false,\n },\n 374: {\n spaceBetween: 12,\n slidesPerView: 1.1,\n freeMode: false,\n },\n 768: {\n spaceBetween: 16,\n slidesPerView: 2,\n freeMode: false,\n },\n }\n }\n >\n {data?.list?.map((item, jIndex) => (\n <SwiperSlide key={id + 'SwiperSlide' + jIndex} className=\"!flex !h-[unset]\">\n <Slide\n data={item}\n configuration={data?.configuration ? { ...data?.configuration, index: jIndex } : { index: jIndex }}\n />\n </SwiperSlide>\n ))}\n </Swiper>\n )\n})\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmDU,IAAAI,EAAA,6BAlDVC,EAAgC,oBAChCC,EAAmB,kCAGnBD,EAAoC,wBACpCE,EAAiD,0BAGjD,MAAMC,EAAY,EAAAC,QAAM,WAA2C,CAAC,CAAE,KAAAC,EAAM,YAAAC,EAAa,MAAAC,EAAO,UAAAC,EAAW,GAAAC,CAAG,IAAM,CAClH,KAAM,CAACC,EAASC,CAAQ,KAAI,YAAS,EAAI,EACnC,CAACC,EAAOC,CAAM,KAAI,YAAS,EAAK,EAEtC,SACE,OAAC,UACC,aAAW,MAAGL,CAAS,EACvB,WAAY,CACV,OAAQ,IAAIC,CAAE,6BACd,OAAQ,IAAIA,CAAE,4BAChB,EACA,WAAYK,GAAU,CACpBH,EAASG,EAAO,WAAW,EAC3BD,EAAOC,EAAO,KAAK,CACrB,EACA,QAAS,CAAC,aAAY,WAAU,YAAU,EAC1C,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,YACER,GAAe,CACb,EAAG,CACD,aAAc,GACd,cAAe,EACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,IACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,EACf,SAAU,EACZ,CACF,EAGD,SAAAD,GAAM,MAAM,IAAI,CAACU,EAAMC,OACtB,OAAC,eAA8C,UAAU,mBACvD,mBAACT,EAAA,CACC,KAAMQ,EACN,cAAeV,GAAM,cAAgB,CAAE,GAAGA,GAAM,cAAe,MAAOW,CAAO,EAAI,CAAE,MAAOA,CAAO,EACnG,GAJgBP,EAAK,cAAgBO,CAKvC,CACD,EACH,CAEJ,CAAC,EAEDb,EAAU,YAAc,YAExB,IAAON,EAAQM",
6
6
  "names": ["SwiperBox_exports", "__export", "SwiperBox_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_modules", "SwiperBox", "React", "data", "breakpoints", "Slide", "className", "id", "isStart", "setStart", "isEnd", "setEnd", "swiper", "item", "jIndex"]
7
7
  }
@@ -19,8 +19,8 @@ export interface ShelfDisplayItem {
19
19
  data?: ShelfDisplayItem[];
20
20
  }
21
21
  type EventType = {
22
- primaryButton?: (v: any) => void;
23
- secondaryButton?: (v: any) => void;
22
+ primaryButton?: (v: any, index: number) => void;
23
+ secondaryButton?: (v: any, index: number) => void;
24
24
  };
25
25
  export interface ShelfDisplayProps {
26
26
  data: {
@@ -1,8 +1,8 @@
1
- "use client";import{jsx as t,jsxs as p}from"react/jsx-runtime";import I,{useState as k,useEffect as C}from"react";import{cn as d}from"../../helpers/utils.js";import M from"../../components/picture.js";import{Tabs as V,TabsList as q,TabsTrigger as E}from"../../components/tabs.js";import S from"../../components/button.js";import A from"../Title/index.js";import L from"../SwiperBox/index.js";import{withStyles as $}from"../../shared/Styles.js";import{formatVariantPrice as z}from"./shelfDisplay.js";import{useMediaQuery as R}from"react-responsive";const U=({data:e,configuration:r})=>{const c=a=>r?.event?.primaryButton?.(a),m=a=>r?.event?.secondaryButton?.(a),{price:u,basePrice:f}=z({locale:"us",amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD"}),b=()=>{const a=e?.sku,i=e?.variants;return i?.find(y=>y?.sku===a)?.image?.url||i?.[0]?.image?.url||""};return p("div",{className:d("laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300",r?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:d("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden"),children:t(M,{source:b(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),t("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.slice(0,1)?.map?.((a,i)=>t("div",{className:"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold",children:a},i))}),t("p",{title:e?.title||"",className:"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold",children:e?.title||""}),t("h3",{title:e?.description||"",className:"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold",children:e?.description||""}),p("div",{className:"mb-2 flex items-center",children:[t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:u||""}),t("div",{className:"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold",children:f||""})]}),p("div",{className:d("flex items-center gap-3",r.direction==="vertical"?"flex-col":""),children:[t(S,{variant:"primary",onClick:()=>c(e),className:`
1
+ "use client";import{jsx as t,jsxs as p}from"react/jsx-runtime";import I,{useState as k,useEffect as C}from"react";import{cn as d}from"../../helpers/utils.js";import M from"../../components/picture.js";import{Tabs as V,TabsList as q,TabsTrigger as E}from"../../components/tabs.js";import S from"../../components/button.js";import A from"../Title/index.js";import L from"../SwiperBox/index.js";import{withStyles as $}from"../../shared/Styles.js";import{formatVariantPrice as z}from"./shelfDisplay.js";import{useMediaQuery as R}from"react-responsive";const U=({data:e,configuration:r})=>{const m=(a,s)=>r?.event?.primaryButton?.(a,s+1),c=(a,s)=>r?.event?.secondaryButton?.(a,s+1),{price:u,basePrice:f}=z({locale:"us",amount:e?.price.amount||0,baseAmount:e?.compareAtPrice?.amount||e?.price.amount||0,currencyCode:e?.price.currencyCode||"USD"}),b=()=>{const a=e?.sku,s=e?.variants;return s?.find(x=>x?.sku===a)?.image?.url||s?.[0]?.image?.url||""};return p("div",{className:d("laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300",r?.itemShape==="round"?"rounded-2xl":"rounded-none"),children:[t("div",{className:d("lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden"),children:t(M,{source:b(),className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),t("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:e?.tags?.slice(0,1)?.map?.((a,s)=>t("div",{className:"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold",children:a},s))}),t("p",{title:e?.title||"",className:"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold",children:e?.title||""}),t("h3",{title:e?.description||"",className:"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold",children:e?.description||""}),p("div",{className:"mb-2 flex items-center",children:[t("div",{className:"tablet:text-2xl text-info-primary text-xl font-bold",children:u||""}),t("div",{className:"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold",children:f||""})]}),p("div",{className:d("flex items-center gap-3",r.direction==="vertical"?"flex-col":""),children:[t(S,{variant:"primary",onClick:()=>m(e,r?.index),className:`
2
2
  laptop:text-sm desktop:text-base text-xs
3
3
  ${r.direction==="vertical"?"w-full":""}
4
- `,children:r?.primaryButton||""}),t(S,{variant:"secondary",onClick:()=>m(e),className:`
4
+ `,children:r?.primaryButton||""}),t(S,{variant:"secondary",onClick:()=>c(e,r?.index),className:`
5
5
  laptop:text-sm desktop:text-base text-xs
6
6
  ${r.direction==="vertical"?"w-full":""}
7
- `,children:r?.secondaryButton||""})]})]},e?.id||e?.handle)},j=I.forwardRef(({data:e,buildData:r,className:c="",key:m,event:u},f)=>{const[b,a]=k(""),[i,h]=k([]),y=R({query:"(max-width: 768px)"}),{productsTab:l=[],productsCard:B=[],title:v,align:T="left",isShowTab:g=!0,tabShape:N="square",...D}=e,x=s=>{const o=s?.map(n=>{const w=r?.products?.find(P=>P?.handle===n?.handle);if(w)return{sku:n.sku,...w}})?.filter(n=>n);h(o)};return C(()=>{if(g){a(l?.[0]?.tab||""),x(l?.[0]?.data||[]);return}x(B)},[]),p("div",{ref:f,className:d("w-full",c,{"aiui-dark":e?.theme==="dark"}),children:[v&&t(A,{data:{title:v}}),g&&t("div",{className:`${y?"w-full overflow-hidden":""}`,children:t(V,{shape:N,align:T,value:b,onValueChange:s=>{a(s);const o=l?.find(n=>n?.tab===s);x(o?.data||[])},className:"mb-8",children:t(q,{children:l?.map((s,o)=>t(E,{value:s?.tab||"",children:s?.tab},o))})})}),t(L,{className:"!overflow-visible",id:"ShelfDisplay"+m,data:{list:i,configuration:{...D,event:u}},Slide:U,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})]})});var Y=$(j);export{Y as default};
7
+ `,children:r?.secondaryButton||""})]})]},e?.id||e?.handle)},j=I.forwardRef(({data:e,buildData:r,className:m="",key:c,event:u},f)=>{const[b,a]=k(""),[s,h]=k([]),x=R({query:"(max-width: 768px)"}),{productsTab:o=[],productsCard:B=[],title:v,align:T="left",isShowTab:g=!0,tabShape:N="square",...D}=e,y=i=>{const l=i?.map(n=>{const w=r?.products?.find(P=>P?.handle===n?.handle);if(w)return{sku:n.sku,...w}})?.filter(n=>n);h(l)};return C(()=>{if(g){a(o?.[0]?.tab||""),y(o?.[0]?.data||[]);return}y(B)},[]),p("div",{ref:f,className:d("w-full",m,{"aiui-dark":e?.theme==="dark"}),children:[v&&t(A,{data:{title:v}}),g&&t("div",{className:`${x?"w-full overflow-hidden":""}`,children:t(V,{shape:N,align:T,value:b,onValueChange:i=>{a(i);const l=o?.find(n=>n?.tab===i);y(l?.data||[])},className:"mb-8",children:t(q,{children:o?.map((i,l)=>t(E,{value:i?.tab||"",children:i?.tab},l))})})}),t(L,{className:"!overflow-visible",id:"ShelfDisplay"+c,data:{list:s,configuration:{...D,event:u}},Slide:U,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.1},768:{spaceBetween:16,freeMode:!1,slidesPerView:2},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}})]})});var Y=$(j);export{Y as default};
8
8
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ShelfDisplay/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport { useMediaQuery } from 'react-responsive'\nexport interface ShelfDisplayItem {\n id?: string\n /** \u4EA7\u54C1\u56FE\u7247*/\n img?: {\n url: string\n }\n handle?: string\n sku?: string\n /** \u6298\u6263\u540E\u4EF7\u683C*/\n price?: string\n title?: string\n /** \u6298\u6263\u524D\u4EF7\u683C*/\n basePrice?: string\n subTitle?: string\n /** \u6807\u7B7E*/\n tagItems?: string[]\n tab?: string\n data?: ShelfDisplayItem[]\n}\n\ntype EventType = {\n primaryButton?: (v: any) => void\n secondaryButton?: (v: any) => void\n}\n\nexport interface ShelfDisplayProps {\n data: {\n title?: string\n isShowTab?: boolean\n direction?: 'horizontal' | 'vertical'\n align?: 'left' | 'center' | 'right'\n productsTab?: any\n productsCard?: any\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n tabShape?: 'rounded' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton?: string\n theme?: 'light' | 'dark'\n }\n buildData?: {\n categories: any[]\n products: any[]\n }\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: EventType\n className?: string\n key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const onPrimaryButton = (params: ShelfDisplayItem) => configuration?.event?.primaryButton?.(params)\n\n const onSecondaryButton = (params: ShelfDisplayItem) => configuration?.event?.secondaryButton?.(params)\n\n const { price, basePrice } = formatVariantPrice({\n locale: 'us',\n amount: data?.price.amount || 0,\n baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 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 return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n 'laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden')}>\n <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n </div>\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n return (\n <div\n key={index}\n className=\"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold\"\n >\n {item}\n </div>\n )\n })}\n </div>\n <p\n title={data?.title || ''}\n className=\"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold\"\n >\n {data?.title || ''}\n </p>\n <h3\n title={data?.description || ''}\n className=\"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold\"\n >\n {data?.description || ''}\n </h3>\n <div className=\"mb-2 flex items-center\">\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{price || ''}</div>\n <div className=\"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold\">{basePrice || ''}</div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className={cn('flex items-center gap-3', configuration.direction === 'vertical' ? 'flex-col' : '')}>\n <Button\n variant=\"primary\"\n onClick={() => onPrimaryButton(data)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.primaryButton || ''}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={() => onSecondaryButton(data)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n </div>\n </div>\n )\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n ({ data, buildData, className = '', key, event }, ref) => {\n const [tabId, setTabId] = useState<string>('')\n const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const {\n productsTab = [],\n productsCard = [],\n title,\n align = 'left',\n isShowTab = true,\n tabShape = 'square',\n ...other\n } = data\n\n const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\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 ...findData,\n }\n }\n })\n ?.filter(item => item)\n setCurrentItems(newCurrentData)\n }\n\n useEffect(() => {\n if (isShowTab) {\n setTabId(productsTab?.[0]?.tab || '')\n handleCurrentTab(productsTab?.[0]?.data || [])\n return\n }\n handleCurrentTab(productsCard)\n }, [])\n\n return (\n <div ref={ref} className={cn('w-full', className, { 'aiui-dark': data?.theme === 'dark' })}>\n {title && <Title data={{ title: title }} />}\n {isShowTab && (\n <div className={`${isMobile ? 'w-full overflow-hidden' : ''}`}>\n <Tabs\n shape={tabShape}\n align={align}\n value={tabId}\n onValueChange={v => {\n setTabId(v)\n const findData = productsTab?.find((item: any) => item?.tab === v)\n handleCurrentTab(findData?.data || [])\n }}\n className=\"mb-8\"\n >\n <TabsList>\n {productsTab?.map((item: any, index: number) => {\n return (\n <TabsTrigger key={index} value={item?.tab || ''}>\n {item?.tab}\n </TabsTrigger>\n )\n })}\n </TabsList>\n </Tabs>\n </div>\n )}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'ShelfDisplay' + key}\n data={{ list: currentItems, configuration: { ...other, event: event } }}\n Slide={ShelfDisplayItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.1,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3,\n },\n 1440: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n }\n)\n\nexport default withStyles(ShelfDisplay)\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "React", "useState", "useEffect", "cn", "Picture", "Tabs", "TabsList", "TabsTrigger", "Button", "Title", "SwiperBox", "withStyles", "formatVariantPrice", "useMediaQuery", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "index", "ShelfDisplay", "buildData", "className", "key", "event", "ref", "tabId", "setTabId", "currentItems", "setCurrentItems", "isMobile", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "v", "ShelfDisplay_default"]
4
+ "sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { Tabs, TabsList, TabsTrigger } from '../../components/tabs.js'\nimport Button from '../../components/button.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withStyles } from '../../shared/Styles.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport { useMediaQuery } from 'react-responsive'\nexport interface ShelfDisplayItem {\n id?: string\n /** \u4EA7\u54C1\u56FE\u7247*/\n img?: {\n url: string\n }\n handle?: string\n sku?: string\n /** \u6298\u6263\u540E\u4EF7\u683C*/\n price?: string\n title?: string\n /** \u6298\u6263\u524D\u4EF7\u683C*/\n basePrice?: string\n subTitle?: string\n /** \u6807\u7B7E*/\n tagItems?: string[]\n tab?: string\n data?: ShelfDisplayItem[]\n}\n\ntype EventType = {\n primaryButton?: (v: any, index: number) => void\n secondaryButton?: (v: any, index: number) => void\n}\n\nexport interface ShelfDisplayProps {\n data: {\n title?: string\n isShowTab?: boolean\n direction?: 'horizontal' | 'vertical'\n align?: 'left' | 'center' | 'right'\n productsTab?: any\n productsCard?: any\n /** \u5361\u7247\u5F62\u72B6 */\n itemShape?: 'round' | 'square'\n /** \u6309\u94AE\u5F62\u72B6 */\n shape?: 'round' | 'square'\n /** \u6807\u7B7E\u9875\u5F62\u72B6*/\n tabShape?: 'rounded' | 'square'\n /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n primaryButton?: string\n /** \u526F\u6309\u94AE\u914D\u7F6E */\n secondaryButton?: string\n theme?: 'light' | 'dark'\n }\n buildData?: {\n categories: any[]\n products: any[]\n }\n /** \u6309\u94AE\u4E8B\u4EF6*/\n event?: EventType\n className?: string\n key?: string\n}\n\nconst ShelfDisplayItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const onPrimaryButton = (params: ShelfDisplayItem, index: number) =>\n configuration?.event?.primaryButton?.(params, index + 1)\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number) =>\n configuration?.event?.secondaryButton?.(params, index + 1)\n\n const { price, basePrice } = formatVariantPrice({\n locale: 'us',\n amount: data?.price.amount || 0,\n baseAmount: data?.compareAtPrice?.amount || data?.price.amount || 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 return (\n <div\n key={data?.id || data?.handle}\n className={cn(\n 'laptop:pt-4 laptop:px-6 laptop:pb-6 bg-container-secondary-1 hover:bg-info-white flex size-full cursor-pointer flex-col overflow-hidden p-4 duration-300',\n configuration?.itemShape === 'round' ? 'rounded-2xl' : 'rounded-none'\n )}\n >\n <div className={cn('lg-desktop:mb-3 lg-desktop:h-[195px] relative mb-2 inline-block h-[140px] overflow-hidden')}>\n <Picture source={handleUrl()} className=\"flex h-full justify-center object-cover [&_img]:w-auto\" />\n </div>\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {data?.tags?.slice(0, 1)?.map?.((item: any, index: number) => {\n return (\n <div\n key={index}\n className=\"tablet:text-base border-info-secondary text-info-primary box-border h-full rounded-2xl border-2 px-2 pt-1 text-sm font-bold\"\n >\n {item}\n </div>\n )\n })}\n </div>\n <p\n title={data?.title || ''}\n className=\"desktop:text-2xl desktop:leading-7 text-info-primary line-clamp-2 max-h-[48px] flex-1 text-xl font-bold\"\n >\n {data?.title || ''}\n </p>\n <h3\n title={data?.description || ''}\n className=\"tablet:mt-2 tablet:mb-3 desktop:text-lg text-info-primary mb-2 mt-1 h-6 truncate text-sm font-semibold\"\n >\n {data?.description || ''}\n </h3>\n <div className=\"mb-2 flex items-center\">\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{price || ''}</div>\n <div className=\"tablet:text-2xl text-info-secondary ml-1 text-xl font-bold\">{basePrice || ''}</div>\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className={cn('flex items-center gap-3', configuration.direction === 'vertical' ? 'flex-col' : '')}>\n <Button\n variant=\"primary\"\n onClick={() => onPrimaryButton(data, configuration?.index)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.primaryButton || ''}\n </Button>\n <Button\n variant=\"secondary\"\n onClick={() => onSecondaryButton(data, configuration?.index)}\n className={`\n laptop:text-sm desktop:text-base text-xs\n ${configuration.direction === 'vertical' ? 'w-full' : ''}\n `}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n </div>\n </div>\n )\n}\n\nconst ShelfDisplay = React.forwardRef<HTMLDivElement, ShelfDisplayProps>(\n ({ data, buildData, className = '', key, event }, ref) => {\n const [tabId, setTabId] = useState<string>('')\n const [currentItems, setCurrentItems] = useState<ShelfDisplayItem[]>([])\n\n const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n\n const {\n productsTab = [],\n productsCard = [],\n title,\n align = 'left',\n isShowTab = true,\n tabShape = 'square',\n ...other\n } = data\n\n const handleCurrentTab = (currentData: ShelfDisplayItem[]) => {\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 ...findData,\n }\n }\n })\n ?.filter(item => item)\n setCurrentItems(newCurrentData)\n }\n\n useEffect(() => {\n if (isShowTab) {\n setTabId(productsTab?.[0]?.tab || '')\n handleCurrentTab(productsTab?.[0]?.data || [])\n return\n }\n handleCurrentTab(productsCard)\n }, [])\n\n return (\n <div ref={ref} className={cn('w-full', className, { 'aiui-dark': data?.theme === 'dark' })}>\n {title && <Title data={{ title: title }} />}\n {isShowTab && (\n <div className={`${isMobile ? 'w-full overflow-hidden' : ''}`}>\n <Tabs\n shape={tabShape}\n align={align}\n value={tabId}\n onValueChange={v => {\n setTabId(v)\n const findData = productsTab?.find((item: any) => item?.tab === v)\n handleCurrentTab(findData?.data || [])\n }}\n className=\"mb-8\"\n >\n <TabsList>\n {productsTab?.map((item: any, index: number) => {\n return (\n <TabsTrigger key={index} value={item?.tab || ''}>\n {item?.tab}\n </TabsTrigger>\n )\n })}\n </TabsList>\n </Tabs>\n </div>\n )}\n <SwiperBox\n className=\"!overflow-visible\"\n id={'ShelfDisplay' + key}\n data={{ list: currentItems, configuration: { ...other, event: event } }}\n Slide={ShelfDisplayItem}\n breakpoints={{\n 0: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1,\n },\n 374: {\n spaceBetween: 12,\n freeMode: false,\n slidesPerView: 1.1,\n },\n 768: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 2,\n },\n 1024: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 3,\n },\n 1440: {\n spaceBetween: 16,\n freeMode: false,\n slidesPerView: 4,\n },\n }}\n />\n </div>\n )\n }\n)\n\nexport default withStyles(ShelfDisplay)\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "useState", "useEffect", "cn", "Picture", "Tabs", "TabsList", "TabsTrigger", "Button", "Title", "SwiperBox", "withStyles", "formatVariantPrice", "useMediaQuery", "ShelfDisplayItem", "data", "configuration", "onPrimaryButton", "params", "index", "onSecondaryButton", "price", "basePrice", "handleUrl", "sku", "skuArray", "item", "ShelfDisplay", "buildData", "className", "key", "event", "ref", "tabId", "setTabId", "currentItems", "setCurrentItems", "isMobile", "productsTab", "productsCard", "title", "align", "isShowTab", "tabShape", "other", "handleCurrentTab", "currentData", "newCurrentData", "findData", "v", "ShelfDisplay_default"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as o}from"react/jsx-runtime";import m,{useState as t}from"react";import{cn as d}from"../../helpers/utils.js";import{Swiper as u,SwiperSlide as c}from"swiper/react";import{Navigation as S,FreeMode as x,Mousewheel as B}from"swiper/modules";const i=m.forwardRef(({data:s,breakpoints:n,Slide:p,className:a,id:r})=>{const[g,l]=t(!0),[M,f]=t(!1);return o(u,{className:d(a),navigation:{nextEl:`.${r}-custom-swiper-button-next`,prevEl:`.${r}-custom-swiper-button-prev`},onProgress:e=>{l(e.isBeginning),f(e.isEnd)},modules:[S,x,B],freeMode:!0,mousewheel:{forceToAxis:!0},breakpoints:n||{0:{spaceBetween:12,slidesPerView:1,freeMode:!1},374:{spaceBetween:12,slidesPerView:1.1,freeMode:!1},768:{spaceBetween:16,slidesPerView:2,freeMode:!1}},children:s?.list?.map((e,w)=>o(c,{className:"!flex !h-[unset]",children:o(p,{data:e,configuration:s?.configuration})},r+"SwiperSlide"+w))})});i.displayName="SwiperBox";var N=i;export{N as default};
1
+ "use client";import{jsx as s}from"react/jsx-runtime";import m,{useState as t}from"react";import{cn as u}from"../../helpers/utils.js";import{Swiper as c,SwiperSlide as d}from"swiper/react";import{Navigation as S,FreeMode as g,Mousewheel as x}from"swiper/modules";const n=m.forwardRef(({data:r,breakpoints:p,Slide:a,className:l,id:o})=>{const[B,f]=t(!0),[M,w]=t(!1);return s(c,{className:u(l),navigation:{nextEl:`.${o}-custom-swiper-button-next`,prevEl:`.${o}-custom-swiper-button-prev`},onProgress:e=>{f(e.isBeginning),w(e.isEnd)},modules:[S,g,x],freeMode:!0,mousewheel:{forceToAxis:!0},breakpoints:p||{0:{spaceBetween:12,slidesPerView:1,freeMode:!1},374:{spaceBetween:12,slidesPerView:1.1,freeMode:!1},768:{spaceBetween:16,slidesPerView:2,freeMode:!1}},children:r?.list?.map((e,i)=>s(d,{className:"!flex !h-[unset]",children:s(a,{data:e,configuration:r?.configuration?{...r?.configuration,index:i}:{index:i}})},o+"SwiperSlide"+i))})});n.displayName="SwiperBox";var N=n;export{N as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/SwiperBox/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\n// import 'swiper/css'\n// import 'swiper/css/free-mode'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, FreeMode, Mousewheel } from 'swiper/modules'\nimport type { SwiperBoxProps } from './types.js'\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(({ data, breakpoints, Slide, className, id }) => {\n const [isStart, setStart] = useState(true)\n const [isEnd, setEnd] = useState(false)\n\n return (\n <Swiper\n className={cn(className)}\n navigation={{\n nextEl: `.${id}-custom-swiper-button-next`,\n prevEl: `.${id}-custom-swiper-button-prev`,\n }}\n onProgress={swiper => {\n setStart(swiper.isBeginning)\n setEnd(swiper.isEnd)\n }}\n modules={[Navigation, FreeMode, Mousewheel]}\n freeMode={true}\n mousewheel={{\n forceToAxis: true,\n }}\n breakpoints={\n breakpoints || {\n 0: {\n spaceBetween: 12,\n slidesPerView: 1,\n freeMode: false,\n },\n 374: {\n spaceBetween: 12,\n slidesPerView: 1.1,\n freeMode: false,\n },\n 768: {\n spaceBetween: 16,\n slidesPerView: 2,\n freeMode: false,\n },\n }\n }\n >\n {data?.list?.map((item, jIndex) => (\n <SwiperSlide key={id + 'SwiperSlide' + jIndex} className=\"!flex !h-[unset]\">\n <Slide data={item} configuration={data?.configuration} />\n </SwiperSlide>\n ))}\n </Swiper>\n )\n})\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
5
- "mappings": "aAmDU,cAAAA,MAAA,oBAlDV,OAAOC,GAAS,YAAAC,MAAgB,QAChC,OAAS,MAAAC,MAAU,yBAGnB,OAAS,UAAAC,EAAQ,eAAAC,MAAmB,eACpC,OAAS,cAAAC,EAAY,YAAAC,EAAU,cAAAC,MAAkB,iBAGjD,MAAMC,EAAYR,EAAM,WAA2C,CAAC,CAAE,KAAAS,EAAM,YAAAC,EAAa,MAAAC,EAAO,UAAAC,EAAW,GAAAC,CAAG,IAAM,CAClH,KAAM,CAACC,EAASC,CAAQ,EAAId,EAAS,EAAI,EACnC,CAACe,EAAOC,CAAM,EAAIhB,EAAS,EAAK,EAEtC,OACEF,EAACI,EAAA,CACC,UAAWD,EAAGU,CAAS,EACvB,WAAY,CACV,OAAQ,IAAIC,CAAE,6BACd,OAAQ,IAAIA,CAAE,4BAChB,EACA,WAAYK,GAAU,CACpBH,EAASG,EAAO,WAAW,EAC3BD,EAAOC,EAAO,KAAK,CACrB,EACA,QAAS,CAACb,EAAYC,EAAUC,CAAU,EAC1C,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,YACEG,GAAe,CACb,EAAG,CACD,aAAc,GACd,cAAe,EACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,IACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,EACf,SAAU,EACZ,CACF,EAGD,SAAAD,GAAM,MAAM,IAAI,CAACU,EAAMC,IACtBrB,EAACK,EAAA,CAA8C,UAAU,mBACvD,SAAAL,EAACY,EAAA,CAAM,KAAMQ,EAAM,cAAeV,GAAM,cAAe,GADvCI,EAAK,cAAgBO,CAEvC,CACD,EACH,CAEJ,CAAC,EAEDZ,EAAU,YAAc,YAExB,IAAOa,EAAQb",
4
+ "sourcesContent": ["'use client'\nimport React, { useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\n// import 'swiper/css'\n// import 'swiper/css/free-mode'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, FreeMode, Mousewheel } from 'swiper/modules'\nimport type { SwiperBoxProps } from './types.js'\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(({ data, breakpoints, Slide, className, id }) => {\n const [isStart, setStart] = useState(true)\n const [isEnd, setEnd] = useState(false)\n\n return (\n <Swiper\n className={cn(className)}\n navigation={{\n nextEl: `.${id}-custom-swiper-button-next`,\n prevEl: `.${id}-custom-swiper-button-prev`,\n }}\n onProgress={swiper => {\n setStart(swiper.isBeginning)\n setEnd(swiper.isEnd)\n }}\n modules={[Navigation, FreeMode, Mousewheel]}\n freeMode={true}\n mousewheel={{\n forceToAxis: true,\n }}\n breakpoints={\n breakpoints || {\n 0: {\n spaceBetween: 12,\n slidesPerView: 1,\n freeMode: false,\n },\n 374: {\n spaceBetween: 12,\n slidesPerView: 1.1,\n freeMode: false,\n },\n 768: {\n spaceBetween: 16,\n slidesPerView: 2,\n freeMode: false,\n },\n }\n }\n >\n {data?.list?.map((item, jIndex) => (\n <SwiperSlide key={id + 'SwiperSlide' + jIndex} className=\"!flex !h-[unset]\">\n <Slide\n data={item}\n configuration={data?.configuration ? { ...data?.configuration, index: jIndex } : { index: jIndex }}\n />\n </SwiperSlide>\n ))}\n </Swiper>\n )\n})\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
5
+ "mappings": "aAmDU,cAAAA,MAAA,oBAlDV,OAAOC,GAAS,YAAAC,MAAgB,QAChC,OAAS,MAAAC,MAAU,yBAGnB,OAAS,UAAAC,EAAQ,eAAAC,MAAmB,eACpC,OAAS,cAAAC,EAAY,YAAAC,EAAU,cAAAC,MAAkB,iBAGjD,MAAMC,EAAYR,EAAM,WAA2C,CAAC,CAAE,KAAAS,EAAM,YAAAC,EAAa,MAAAC,EAAO,UAAAC,EAAW,GAAAC,CAAG,IAAM,CAClH,KAAM,CAACC,EAASC,CAAQ,EAAId,EAAS,EAAI,EACnC,CAACe,EAAOC,CAAM,EAAIhB,EAAS,EAAK,EAEtC,OACEF,EAACI,EAAA,CACC,UAAWD,EAAGU,CAAS,EACvB,WAAY,CACV,OAAQ,IAAIC,CAAE,6BACd,OAAQ,IAAIA,CAAE,4BAChB,EACA,WAAYK,GAAU,CACpBH,EAASG,EAAO,WAAW,EAC3BD,EAAOC,EAAO,KAAK,CACrB,EACA,QAAS,CAACb,EAAYC,EAAUC,CAAU,EAC1C,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,YACEG,GAAe,CACb,EAAG,CACD,aAAc,GACd,cAAe,EACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,IACf,SAAU,EACZ,EACA,IAAK,CACH,aAAc,GACd,cAAe,EACf,SAAU,EACZ,CACF,EAGD,SAAAD,GAAM,MAAM,IAAI,CAACU,EAAMC,IACtBrB,EAACK,EAAA,CAA8C,UAAU,mBACvD,SAAAL,EAACY,EAAA,CACC,KAAMQ,EACN,cAAeV,GAAM,cAAgB,CAAE,GAAGA,GAAM,cAAe,MAAOW,CAAO,EAAI,CAAE,MAAOA,CAAO,EACnG,GAJgBP,EAAK,cAAgBO,CAKvC,CACD,EACH,CAEJ,CAAC,EAEDZ,EAAU,YAAc,YAExB,IAAOa,EAAQb",
6
6
  "names": ["jsx", "React", "useState", "cn", "Swiper", "SwiperSlide", "Navigation", "FreeMode", "Mousewheel", "SwiperBox", "data", "breakpoints", "Slide", "className", "id", "isStart", "setStart", "isEnd", "setEnd", "swiper", "item", "jIndex", "SwiperBox_default"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/headless-ui",
3
- "version": "0.0.27-alpha.110",
3
+ "version": "0.0.27-alpha.111",
4
4
  "type": "commonjs",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "types": "./dist/cjs/index.d.ts",