@anker-in/headless-ui 1.3.61 → 1.3.62

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/dist/cjs/biz-components/ActiveShelf/ProductCard.d.ts +9 -0
  2. package/dist/cjs/biz-components/ActiveShelf/ProductCard.js +1 -1
  3. package/dist/cjs/biz-components/ActiveShelf/ProductCard.js.map +3 -3
  4. package/dist/cjs/biz-components/ActiveShelf/index.d.ts +9 -0
  5. package/dist/cjs/biz-components/ActiveShelf/index.js +1 -1
  6. package/dist/cjs/biz-components/ActiveShelf/index.js.map +3 -3
  7. package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.d.ts +6 -0
  8. package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.js +1 -1
  9. package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.js.map +3 -3
  10. package/dist/cjs/biz-components/BuyOneGetOneShelf/ProductCard.d.ts +6 -0
  11. package/dist/cjs/biz-components/BuyOneGetOneShelf/ProductCard.js +1 -1
  12. package/dist/cjs/biz-components/BuyOneGetOneShelf/ProductCard.js.map +3 -3
  13. package/dist/cjs/biz-components/BuyOneGetOneShelf/types.d.ts +6 -0
  14. package/dist/cjs/biz-components/BuyOneGetOneShelf/types.js +1 -1
  15. package/dist/cjs/biz-components/BuyOneGetOneShelf/types.js.map +1 -1
  16. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.d.ts +9 -0
  17. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.js +1 -1
  18. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.js.map +3 -3
  19. package/dist/cjs/biz-components/SceneShelfV3/index.d.ts +9 -0
  20. package/dist/cjs/biz-components/SceneShelfV3/index.js +1 -1
  21. package/dist/cjs/biz-components/SceneShelfV3/index.js.map +3 -3
  22. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.d.ts +32 -18
  23. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js +1 -1
  24. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js.map +1 -1
  25. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js +1 -1
  26. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js.map +2 -2
  27. package/dist/cjs/biz-components/ShelfDisplayHorizontal/shelfDisplayHorizontalItem.js +1 -1
  28. package/dist/cjs/biz-components/ShelfDisplayHorizontal/shelfDisplayHorizontalItem.js.map +2 -2
  29. package/dist/esm/biz-components/ActiveShelf/ProductCard.d.ts +9 -0
  30. package/dist/esm/biz-components/ActiveShelf/ProductCard.js +1 -1
  31. package/dist/esm/biz-components/ActiveShelf/ProductCard.js.map +3 -3
  32. package/dist/esm/biz-components/ActiveShelf/index.d.ts +9 -0
  33. package/dist/esm/biz-components/ActiveShelf/index.js +1 -1
  34. package/dist/esm/biz-components/ActiveShelf/index.js.map +3 -3
  35. package/dist/esm/biz-components/BuyOneGetOneShelf/PriceAndActions.d.ts +6 -0
  36. package/dist/esm/biz-components/BuyOneGetOneShelf/PriceAndActions.js +1 -1
  37. package/dist/esm/biz-components/BuyOneGetOneShelf/PriceAndActions.js.map +3 -3
  38. package/dist/esm/biz-components/BuyOneGetOneShelf/ProductCard.d.ts +6 -0
  39. package/dist/esm/biz-components/BuyOneGetOneShelf/ProductCard.js +1 -1
  40. package/dist/esm/biz-components/BuyOneGetOneShelf/ProductCard.js.map +3 -3
  41. package/dist/esm/biz-components/BuyOneGetOneShelf/types.d.ts +6 -0
  42. package/dist/esm/biz-components/BuyOneGetOneShelf/types.js.map +1 -1
  43. package/dist/esm/biz-components/SceneShelfV3/ProductCard.d.ts +9 -0
  44. package/dist/esm/biz-components/SceneShelfV3/ProductCard.js +1 -1
  45. package/dist/esm/biz-components/SceneShelfV3/ProductCard.js.map +3 -3
  46. package/dist/esm/biz-components/SceneShelfV3/index.d.ts +9 -0
  47. package/dist/esm/biz-components/SceneShelfV3/index.js +1 -1
  48. package/dist/esm/biz-components/SceneShelfV3/index.js.map +3 -3
  49. package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.d.ts +32 -18
  50. package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.js +1 -1
  51. package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.js.map +1 -1
  52. package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js +1 -1
  53. package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js.map +2 -2
  54. package/dist/esm/biz-components/ShelfDisplayHorizontal/shelfDisplayHorizontalItem.js +1 -1
  55. package/dist/esm/biz-components/ShelfDisplayHorizontal/shelfDisplayHorizontalItem.js.map +2 -2
  56. package/package.json +1 -1
@@ -112,6 +112,15 @@ export interface ProductCardProps {
112
112
  primaryButtonFun?: ButtonFunctionType;
113
113
  /** 是否展示原价(删除线价格) */
114
114
  showOriginalPrice?: boolean;
115
+ /**
116
+ * 原价区域渲染函数,用于在原价位置展示自定义内容(如 Save 金额文案)。
117
+ * 不传时使用默认的原价渲染(划线价)。
118
+ * @param product - 当前产品数据
119
+ * @param context - 渲染上下文(含 showOriginalPrice)
120
+ */
121
+ renderOriginalPrice?: (product: ProductCardData, context: {
122
+ showOriginalPrice?: boolean;
123
+ }) => React.ReactNode;
115
124
  /** 文案配置 */
116
125
  copy?: CopyConfig;
117
126
  onProductImageClick?: (product: ProductCardData) => void;
@@ -1,2 +1,2 @@
1
- "use client";import{Fragment as H,jsx as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{cn as t}from"../../helpers/index.js";import{Button as w,Badge as M,Card as _,CardContent as R,Picture as $,Text as f,Heading as d,Progress as E}from"../../components/index.js";const I=5;function j(e,o,s,m){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return o===void 0?!0:s<=o;case"below-percentage":return o===void 0?!0:s/m*100<=o;default:return!0}}const g=l.forwardRef(({product:e,className:o,showTags:s=!0,stockDisplayMode:m,stockThresholdValue:P,onLearnMore:C,onShopNow:S,onAddToCart:N,classNames:i,secondaryButtonText:p,secondaryButtonFun:y,primaryButtonText:u,primaryButtonFun:v,showOriginalPrice:B,copy:b,onProductImageClick:x},D)=>{const[L,T]=l.useState(!1),[F,z]=l.useState(!1),A=l.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?I:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),k=async(r,c)=>{if(!r)return;const h=c==="primary"?T:z;h(!0);try{switch(r){case"buyNow":await S?.(e);break;case"addCart":await N?.(e);break;case"learnMore":await C?.(e);break;default:break}}finally{h(!1)}},q=e.availableForSale&&e.quantityAvailable<=0;return a(_,{ref:D,className:t("bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none",o,i?.productCard),children:n(R,{className:"desktop:p-6 relative flex flex-1 flex-col justify-between p-4",children:[a("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:s&&e.tags?.map((r,c)=>r.label?a(M,{size:"sm",variant:r.variant||"outline",className:t(r.variant==="promotional"?"ml-2":""),promotionalType:r.promotionalType,children:r.label},c):a(l.Fragment,{children:r},c))}),a("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:a("a",{onClick:()=>x?.(e),...!x&&{href:e?.listingLink},rel:"noreferrer",children:a($,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),n("div",{className:"flex h-full flex-1 grow flex-col justify-between",children:[n("div",{className:"mb-4",children:[a(d,{as:"h3",size:2,className:t("text-info-primary mb-2 line-clamp-2 min-h-[2.4em]",i?.productTitle),html:e.custom_name||e.name}),e?.description&&a(f,{size:2,className:t("text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]",i?.productDescription),html:e.custom_description||e.description})]}),n("div",{children:[a("div",{className:t("mb-2",i?.productPrice),children:a("div",{className:"flex items-baseline gap-2",children:e.availableForSale?n(H,{children:[a(d,{size:2,className:"text-info-primary",as:"h6",children:e.price}),B&&e.originalPrice&&a(d,{size:2,className:t("text-info-tertiary line-through",i?.originalPrice),as:"h6",children:e.originalPrice})]}):a(d,{size:2,className:"text-info-tertiary",children:b?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&a(f,{size:4,className:t("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",i?.productPriceLabel),children:e.priceLabel}),n("div",{className:t("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",i?.buttonGroup),children:[p&&a(w,{variant:"secondary",size:"base",className:t("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",i?.secondaryButton),onClick:()=>k(y,"secondary"),disabled:!e.availableForSale&&y!=="learnMore",loading:F,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${p}`,"data-headless-sku":e.sku,children:p}),u&&a(w,{variant:"primary",size:"base",className:t("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",i?.primaryButton),onClick:()=>k(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:L,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${u}`,"data-headless-sku":e.sku,children:u})]}),j(m,P,e?.quantityAvailable??0,e?.totalInventory??0)&&n("div",{className:"mt-4 space-y-2",children:[a(E,{value:A,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:t("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",i?.stockTrack),progressBar:t("bg-brand-0 transition-all duration-300 ease-in-out",i?.stockBar)}}),a(f,{size:3,className:"text-info-tertiary text-[14px]",children:q?b?.limitedStock:b?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]})})});g.displayName="ActiveShelf.ProductCard";var K=g;export{g as ProductCard,K as default};
1
+ "use client";import{Fragment as O,jsx as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{cn as t}from"../../helpers/index.js";import{Button as C,Badge as M,Card as _,CardContent as $,Picture as E,Text as f,Heading as d,Progress as I}from"../../components/index.js";const j=5;function H(e,o,s,m){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return o===void 0?!0:s<=o;case"below-percentage":return o===void 0?!0:s/m*100<=o;default:return!0}}const g=l.forwardRef(({product:e,className:o,showTags:s=!0,stockDisplayMode:m,stockThresholdValue:S,onLearnMore:N,onShopNow:B,onAddToCart:D,classNames:i,secondaryButtonText:p,secondaryButtonFun:y,primaryButtonText:u,primaryButtonFun:v,showOriginalPrice:x,renderOriginalPrice:k,copy:b,onProductImageClick:h},L)=>{const[T,F]=l.useState(!1),[z,A]=l.useState(!1),R=l.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?j:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),w=async(r,c)=>{if(!r)return;const P=c==="primary"?F:A;P(!0);try{switch(r){case"buyNow":await B?.(e);break;case"addCart":await D?.(e);break;case"learnMore":await N?.(e);break;default:break}}finally{P(!1)}},q=e.availableForSale&&e.quantityAvailable<=0;return a(_,{ref:L,className:t("bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none",o,i?.productCard),children:n($,{className:"desktop:p-6 relative flex flex-1 flex-col justify-between p-4",children:[a("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:s&&e.tags?.map((r,c)=>r.label?a(M,{size:"sm",variant:r.variant||"outline",className:t(r.variant==="promotional"?"ml-2":""),promotionalType:r.promotionalType,children:r.label},c):a(l.Fragment,{children:r},c))}),a("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:a("a",{onClick:()=>h?.(e),...!h&&{href:e?.listingLink},rel:"noreferrer",children:a(E,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),n("div",{className:"flex h-full flex-1 grow flex-col justify-between",children:[n("div",{className:"mb-4",children:[a(d,{as:"h3",size:2,className:t("text-info-primary mb-2 line-clamp-2 min-h-[2.4em]",i?.productTitle),html:e.custom_name||e.name}),e?.description&&a(f,{size:2,className:t("text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]",i?.productDescription),html:e.custom_description||e.description})]}),n("div",{children:[a("div",{className:t("mb-2",i?.productPrice),children:a("div",{className:"flex items-baseline gap-2",children:e.availableForSale?n(O,{children:[a(d,{size:2,className:"text-info-primary",as:"h6",children:e.price}),k?k(e,{showOriginalPrice:x}):x&&e.originalPrice&&a(d,{size:2,className:t("text-info-tertiary line-through",i?.originalPrice),as:"h6",children:e.originalPrice})]}):a(d,{size:2,className:"text-info-tertiary",children:b?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&a(f,{size:4,className:t("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",i?.productPriceLabel),children:e.priceLabel}),n("div",{className:t("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",i?.buttonGroup),children:[p&&a(C,{variant:"secondary",size:"base",className:t("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",i?.secondaryButton),onClick:()=>w(y,"secondary"),disabled:!e.availableForSale&&y!=="learnMore",loading:z,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${p}`,"data-headless-sku":e.sku,children:p}),u&&a(C,{variant:"primary",size:"base",className:t("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",i?.primaryButton),onClick:()=>w(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:T,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${u}`,"data-headless-sku":e.sku,children:u})]}),H(m,S,e?.quantityAvailable??0,e?.totalInventory??0)&&n("div",{className:"mt-4 space-y-2",children:[a(I,{value:R,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:t("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",i?.stockTrack),progressBar:t("bg-brand-0 transition-all duration-300 ease-in-out",i?.stockBar)}}),a(f,{size:3,className:"text-info-tertiary text-[14px]",children:q?b?.limitedStock:b?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]})})});g.displayName="ActiveShelf.ProductCard";var V=g;export{g as ProductCard,V as default};
2
2
  //# sourceMappingURL=ProductCard.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ActiveShelf/ProductCard.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading, Progress } from '../../components/index.js'\n\nimport type { ButtonFunctionType, CopyConfig } from './types.js'\nimport type { BadgeProps } from '../../components/badge.js'\n\n/**\n * \u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u7684\u6700\u5C0F\u767E\u5206\u6BD4\n * \u9632\u6B62\u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u4E3A\u6EE1\u683C\uFF08100%\uFF09\u6216\u5B8C\u5168\u7A7A\uFF080%\uFF09\n */\nconst OVERSELLING_STOCK_PERCENTAGE = 5\n\n/**\n * \u8BED\u4E49\u5316\u7C7B\u540D\n */\nexport type ActiveShelfSemanticName =\n | 'root'\n | 'title'\n | 'description'\n | 'productCard'\n | 'productTitle'\n | 'productDescription'\n | 'productPriceLabel'\n | 'productPrice'\n | 'originalPrice'\n | 'buttonGroup'\n | 'secondaryButton'\n | 'primaryButton'\n | 'stockTrack'\n | 'stockBar'\n\n/**\n * \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n */\nexport type StockDisplayMode = 'always' | 'never' | 'below-quantity' | 'below-percentage'\n\n/**\n * \u57FA\u7840\u4EA7\u54C1\u6570\u636E\u63A5\u53E3\uFF08\u6765\u81EA\u5916\u90E8\u6570\u636E\u6E90\uFF09\n */\nexport interface BaseProductData {\n sku: string\n name: string\n image: string\n value: string\n handle: string\n shopify_id: string\n custom_name?: string\n custom_description?: string\n}\n\n/**\n * Shopify \u53D8\u4F53\u6570\u636E\u63A5\u53E3\n */\nexport interface VariantData {\n /**\n * \u4EA7\u54C1\u63CF\u8FF0\n */\n description?: string\n /**\n * \u53D8\u4F53id\n */\n variantId: string\n\n /**\n * \u4EA7\u54C1\u94FE\u63A5, \u70B9\u51FB\u56FE\u7247\u7684\u65F6\u5019\u8DF3\u8F6C\u5230\u8BE5\u94FE\u63A5\n */\n listingLink: string\n /**\n * \u539F\u4EF7\n */\n originalPrice: string\n /**\n * \u73B0\u4EF7\n */\n price: string\n /**\n * \u4EF7\u683C\u4E0A\u9762\u5C55\u793A\u7684\u6807\u7B7E\u6587\u672C\n */\n priceLabel?: string\n /**\n * \u603B\u5E93\u5B58\n */\n totalInventory: number\n /**\n * \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n */\n quantityAvailable: number\n /**\n * \u662F\u5426\u53EF\u552E\n */\n availableForSale: boolean\n\n /**\n * tags \u5217\u8868(\u4F1A\u5458\u4EF7\uFF0C\u6298\u6263\uFF0Cnew, hot\u7B49\u6807\u7B7E\u4FE1\u606F)\n */\n tags: Array<\n | {\n label: string\n variant: BadgeProps['variant']\n promotionalType?: BadgeProps['promotionalType']\n }\n | React.ReactNode\n >\n /**\n * \u901A\u7528\u6298\u6263\u6570\u636E\uFF0C\u5305\u62EC\u6298\u6263title, \u7C7B\u578B\u548C\u503C\n */\n coupon: any\n}\n\n/**\n * \u5B8C\u6574\u7684\u4EA7\u54C1\u5361\u7247\u6570\u636E\u63A5\u53E3\n */\nexport interface ProductCardData extends BaseProductData, VariantData {}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6 Props\n */\nexport interface ProductCardProps {\n /** \u4EA7\u54C1\u6570\u636E */\n product: ProductCardData\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n stockDisplayMode?: StockDisplayMode\n /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n stockThresholdValue?: number\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n secondaryButtonFun?: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n primaryButtonFun?: ButtonFunctionType\n /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n showOriginalPrice?: boolean\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n onProductImageClick?: (product: ProductCardData) => void\n}\n\n/**\n * \u5224\u65AD\u662F\u5426\u5E94\u8BE5\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n * @param stockDisplayMode \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n * @param stockThresholdValue \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09\n * @param quantityAvailable \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n * @param totalInventory \u603B\u5E93\u5B58\n * @returns \u662F\u5426\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n */\nfunction shouldShowStock(\n stockDisplayMode: StockDisplayMode | undefined,\n stockThresholdValue: number | undefined,\n quantityAvailable: number,\n totalInventory: number\n): boolean {\n // \u672A\u914D\u7F6E\u65F6\u9ED8\u8BA4\u663E\u793A\n if (stockDisplayMode === undefined) {\n return true\n }\n\n // \u6839\u636E\u5C55\u793A\u6A21\u5F0F\u5224\u65AD\n switch (stockDisplayMode) {\n case 'always':\n // \u603B\u662F\u663E\u793A\n return true\n\n case 'never':\n // \u6C38\u4E0D\u663E\u793A\n return false\n\n case 'below-quantity':\n // \u5F53\u5E93\u5B58\u6570\u91CF\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n\n return quantityAvailable <= stockThresholdValue\n\n case 'below-percentage':\n // \u5F53\u5E93\u5B58\u767E\u5206\u6BD4\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n return (quantityAvailable / totalInventory) * 100 <= stockThresholdValue\n\n default:\n // \u672A\u77E5\u6A21\u5F0F\u65F6\u9ED8\u8BA4\u663E\u793A\n return true\n }\n}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n product,\n className,\n showTags = true,\n stockDisplayMode,\n stockThresholdValue,\n onLearnMore,\n onShopNow,\n onAddToCart,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n showOriginalPrice,\n copy,\n onProductImageClick,\n },\n ref\n ) => {\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n const stockPercentage = React.useMemo(() => {\n if (product?.availableForSale && product?.quantityAvailable <= 0) {\n return OVERSELLING_STOCK_PERCENTAGE\n }\n // \u4E0D\u53EF\u552E\u65F6\u663E\u793A0%\n if (!product?.availableForSale) {\n return 0\n }\n return ((product?.quantityAvailable ?? 0) / (product?.totalInventory ?? 1)) * 100\n }, [product?.availableForSale, product?.quantityAvailable, product?.totalInventory])\n\n // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n if (!buttonFun) return\n\n const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n setLoading(true)\n\n try {\n switch (buttonFun) {\n case 'buyNow':\n await onShopNow?.(product)\n break\n case 'addCart':\n await onAddToCart?.(product)\n break\n case 'learnMore':\n await onLearnMore?.(product)\n break\n default:\n break\n }\n } finally {\n setLoading(false)\n }\n }\n\n const overselling = product.availableForSale && product.quantityAvailable <= 0\n\n return (\n <Card\n ref={ref}\n className={cn(\n 'bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none',\n className,\n classNames?.productCard\n )}\n >\n <CardContent className=\"desktop:p-6 relative flex flex-1 flex-col justify-between p-4\">\n {/* \u6807\u7B7E */}\n <div className=\"lg-desktop:h-[28px] flex h-[24px] gap-1\">\n {showTags &&\n product.tags?.map((tag: any, index) =>\n (tag as any).label ? (\n <Badge\n key={index}\n size=\"sm\"\n variant={(tag.variant as any) || 'outline'}\n className={cn(tag.variant === 'promotional' ? 'ml-2' : '')}\n promotionalType={tag.promotionalType}\n >\n {tag.label}\n </Badge>\n ) : (\n <React.Fragment key={index}>{tag}</React.Fragment>\n )\n )}\n </div>\n\n {/* \u4EA7\u54C1\u56FE\u533A\u57DF */}\n <div className=\"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden\">\n <a\n onClick={() => onProductImageClick?.(product)}\n {...(!onProductImageClick && {\n href: product?.listingLink,\n })}\n rel=\"noreferrer\"\n >\n <Picture\n source={product.image}\n alt={product.name}\n className=\"aspect-square size-full object-contain\"\n imgClassName=\"w-full h-full object-contain\"\n />\n </a>\n </div>\n\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"flex h-full flex-1 grow flex-col justify-between\">\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className=\"mb-4\">\n <Heading\n as=\"h3\"\n size={2}\n className={cn('text-info-primary mb-2 line-clamp-2 min-h-[2.4em]', classNames?.productTitle)}\n html={product.custom_name || product.name}\n />\n {product?.description && (\n <Text\n size={2}\n className={cn(\n 'text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]',\n classNames?.productDescription\n )}\n html={product.custom_description || product.description}\n />\n )}\n </div>\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div>\n <div className={cn('mb-2', classNames?.productPrice)}>\n <div className=\"flex items-baseline gap-2\">\n {product.availableForSale ? (\n <>\n <Heading size={2} className=\"text-info-primary\" as=\"h6\">\n {product.price}\n </Heading>\n {showOriginalPrice && product.originalPrice && (\n <Heading\n size={2}\n className={cn('text-info-tertiary line-through', classNames?.originalPrice)}\n as=\"h6\"\n >\n {product.originalPrice}\n </Heading>\n )}\n </>\n ) : (\n <Heading size={2} className=\"text-info-tertiary\">\n {copy?.outOfStockLabel ?? 'Sold Out'}\n </Heading>\n )}\n </div>\n </div>\n\n {product?.priceLabel && product?.availableForSale && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]',\n classNames?.productPriceLabel\n )}\n >\n {product.priceLabel}\n </Text>\n )}\n\n {/* \u6309\u94AE\u533A\u57DF */}\n <div className={cn('lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2', classNames?.buttonGroup)}>\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n size=\"base\"\n className={cn(\n 'tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap',\n classNames?.secondaryButton\n )}\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n data-headless-type-name=\"ActiveShelf#ProductCard\"\n data-headless-title-desc-button={`${product.custom_name || product.name}#${product.description || ''}#${secondaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {secondaryButtonText}\n </Button>\n )}\n {primaryButtonText && (\n <Button\n variant=\"primary\"\n size=\"base\"\n className={cn(\n 'tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap',\n classNames?.primaryButton\n )}\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n data-headless-type-name=\"ActiveShelf#ProductCard\"\n data-headless-title-desc-button={`${product.custom_name || product.name}#${product.description || ''}#${primaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {primaryButtonText}\n </Button>\n )}\n </div>\n\n {/* \u5E93\u5B58\u4FE1\u606F */}\n {shouldShowStock(\n stockDisplayMode,\n stockThresholdValue,\n product?.quantityAvailable ?? 0,\n product?.totalInventory ?? 0\n ) && (\n <div className=\"mt-4 space-y-2\">\n <Progress\n value={stockPercentage}\n max={100}\n min={0}\n size=\"base\"\n variant=\"default\"\n aria-label=\"stock progress\"\n classNames={{\n root: cn('bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]', classNames?.stockTrack),\n progressBar: cn('bg-brand-0 transition-all duration-300 ease-in-out', classNames?.stockBar),\n }}\n />\n <Text size={3} className=\"text-info-tertiary text-[14px]\">\n {overselling\n ? copy?.limitedStock\n : copy?.stockDisplayText?.replace(\n '{count}',\n `${product.availableForSale ? product.quantityAvailable : 0}`\n )}\n </Text>\n </div>\n )}\n </div>\n </div>\n </CardContent>\n </Card>\n )\n }\n)\n\nProductCard.displayName = 'ActiveShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
5
- "mappings": "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",
6
- "names": ["Fragment", "jsx", "jsxs", "React", "cn", "Button", "Badge", "Card", "CardContent", "Picture", "Text", "Heading", "Progress", "OVERSELLING_STOCK_PERCENTAGE", "shouldShowStock", "stockDisplayMode", "stockThresholdValue", "quantityAvailable", "totalInventory", "ProductCard", "product", "className", "showTags", "onLearnMore", "onShopNow", "onAddToCart", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "showOriginalPrice", "copy", "onProductImageClick", "ref", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "stockPercentage", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "overselling", "tag", "index", "ProductCard_default"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading, Progress } from '../../components/index.js'\n\nimport type { ButtonFunctionType, CopyConfig } from './types.js'\nimport type { BadgeProps } from '../../components/badge.js'\n\n/**\n * \u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u7684\u6700\u5C0F\u767E\u5206\u6BD4\n * \u9632\u6B62\u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u4E3A\u6EE1\u683C\uFF08100%\uFF09\u6216\u5B8C\u5168\u7A7A\uFF080%\uFF09\n */\nconst OVERSELLING_STOCK_PERCENTAGE = 5\n\n/**\n * \u8BED\u4E49\u5316\u7C7B\u540D\n */\nexport type ActiveShelfSemanticName =\n | 'root'\n | 'title'\n | 'description'\n | 'productCard'\n | 'productTitle'\n | 'productDescription'\n | 'productPriceLabel'\n | 'productPrice'\n | 'originalPrice'\n | 'buttonGroup'\n | 'secondaryButton'\n | 'primaryButton'\n | 'stockTrack'\n | 'stockBar'\n\n/**\n * \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n */\nexport type StockDisplayMode = 'always' | 'never' | 'below-quantity' | 'below-percentage'\n\n/**\n * \u57FA\u7840\u4EA7\u54C1\u6570\u636E\u63A5\u53E3\uFF08\u6765\u81EA\u5916\u90E8\u6570\u636E\u6E90\uFF09\n */\nexport interface BaseProductData {\n sku: string\n name: string\n image: string\n value: string\n handle: string\n shopify_id: string\n custom_name?: string\n custom_description?: string\n}\n\n/**\n * Shopify \u53D8\u4F53\u6570\u636E\u63A5\u53E3\n */\nexport interface VariantData {\n /**\n * \u4EA7\u54C1\u63CF\u8FF0\n */\n description?: string\n /**\n * \u53D8\u4F53id\n */\n variantId: string\n\n /**\n * \u4EA7\u54C1\u94FE\u63A5, \u70B9\u51FB\u56FE\u7247\u7684\u65F6\u5019\u8DF3\u8F6C\u5230\u8BE5\u94FE\u63A5\n */\n listingLink: string\n /**\n * \u539F\u4EF7\n */\n originalPrice: string\n /**\n * \u73B0\u4EF7\n */\n price: string\n /**\n * \u4EF7\u683C\u4E0A\u9762\u5C55\u793A\u7684\u6807\u7B7E\u6587\u672C\n */\n priceLabel?: string\n /**\n * \u603B\u5E93\u5B58\n */\n totalInventory: number\n /**\n * \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n */\n quantityAvailable: number\n /**\n * \u662F\u5426\u53EF\u552E\n */\n availableForSale: boolean\n\n /**\n * tags \u5217\u8868(\u4F1A\u5458\u4EF7\uFF0C\u6298\u6263\uFF0Cnew, hot\u7B49\u6807\u7B7E\u4FE1\u606F)\n */\n tags: Array<\n | {\n label: string\n variant: BadgeProps['variant']\n promotionalType?: BadgeProps['promotionalType']\n }\n | React.ReactNode\n >\n /**\n * \u901A\u7528\u6298\u6263\u6570\u636E\uFF0C\u5305\u62EC\u6298\u6263title, \u7C7B\u578B\u548C\u503C\n */\n coupon: any\n}\n\n/**\n * \u5B8C\u6574\u7684\u4EA7\u54C1\u5361\u7247\u6570\u636E\u63A5\u53E3\n */\nexport interface ProductCardData extends BaseProductData, VariantData {}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6 Props\n */\nexport interface ProductCardProps {\n /** \u4EA7\u54C1\u6570\u636E */\n product: ProductCardData\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n stockDisplayMode?: StockDisplayMode\n /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n stockThresholdValue?: number\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n secondaryButtonFun?: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n primaryButtonFun?: ButtonFunctionType\n /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n showOriginalPrice?: boolean\n /**\n * \u539F\u4EF7\u533A\u57DF\u6E32\u67D3\u51FD\u6570\uFF0C\u7528\u4E8E\u5728\u539F\u4EF7\u4F4D\u7F6E\u5C55\u793A\u81EA\u5B9A\u4E49\u5185\u5BB9\uFF08\u5982 Save \u91D1\u989D\u6587\u6848\uFF09\u3002\n * \u4E0D\u4F20\u65F6\u4F7F\u7528\u9ED8\u8BA4\u7684\u539F\u4EF7\u6E32\u67D3\uFF08\u5212\u7EBF\u4EF7\uFF09\u3002\n * @param product - \u5F53\u524D\u4EA7\u54C1\u6570\u636E\n * @param context - \u6E32\u67D3\u4E0A\u4E0B\u6587\uFF08\u542B showOriginalPrice\uFF09\n */\n renderOriginalPrice?: (product: ProductCardData, context: { showOriginalPrice?: boolean }) => React.ReactNode\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n onProductImageClick?: (product: ProductCardData) => void\n}\n\n/**\n * \u5224\u65AD\u662F\u5426\u5E94\u8BE5\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n * @param stockDisplayMode \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n * @param stockThresholdValue \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09\n * @param quantityAvailable \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n * @param totalInventory \u603B\u5E93\u5B58\n * @returns \u662F\u5426\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n */\nfunction shouldShowStock(\n stockDisplayMode: StockDisplayMode | undefined,\n stockThresholdValue: number | undefined,\n quantityAvailable: number,\n totalInventory: number\n): boolean {\n // \u672A\u914D\u7F6E\u65F6\u9ED8\u8BA4\u663E\u793A\n if (stockDisplayMode === undefined) {\n return true\n }\n\n // \u6839\u636E\u5C55\u793A\u6A21\u5F0F\u5224\u65AD\n switch (stockDisplayMode) {\n case 'always':\n // \u603B\u662F\u663E\u793A\n return true\n\n case 'never':\n // \u6C38\u4E0D\u663E\u793A\n return false\n\n case 'below-quantity':\n // \u5F53\u5E93\u5B58\u6570\u91CF\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n\n return quantityAvailable <= stockThresholdValue\n\n case 'below-percentage':\n // \u5F53\u5E93\u5B58\u767E\u5206\u6BD4\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n return (quantityAvailable / totalInventory) * 100 <= stockThresholdValue\n\n default:\n // \u672A\u77E5\u6A21\u5F0F\u65F6\u9ED8\u8BA4\u663E\u793A\n return true\n }\n}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n product,\n className,\n showTags = true,\n stockDisplayMode,\n stockThresholdValue,\n onLearnMore,\n onShopNow,\n onAddToCart,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n showOriginalPrice,\n renderOriginalPrice,\n copy,\n onProductImageClick,\n },\n ref\n ) => {\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n const stockPercentage = React.useMemo(() => {\n if (product?.availableForSale && product?.quantityAvailable <= 0) {\n return OVERSELLING_STOCK_PERCENTAGE\n }\n // \u4E0D\u53EF\u552E\u65F6\u663E\u793A0%\n if (!product?.availableForSale) {\n return 0\n }\n return ((product?.quantityAvailable ?? 0) / (product?.totalInventory ?? 1)) * 100\n }, [product?.availableForSale, product?.quantityAvailable, product?.totalInventory])\n\n // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n if (!buttonFun) return\n\n const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n setLoading(true)\n\n try {\n switch (buttonFun) {\n case 'buyNow':\n await onShopNow?.(product)\n break\n case 'addCart':\n await onAddToCart?.(product)\n break\n case 'learnMore':\n await onLearnMore?.(product)\n break\n default:\n break\n }\n } finally {\n setLoading(false)\n }\n }\n\n const overselling = product.availableForSale && product.quantityAvailable <= 0\n\n return (\n <Card\n ref={ref}\n className={cn(\n 'bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none',\n className,\n classNames?.productCard\n )}\n >\n <CardContent className=\"desktop:p-6 relative flex flex-1 flex-col justify-between p-4\">\n {/* \u6807\u7B7E */}\n <div className=\"lg-desktop:h-[28px] flex h-[24px] gap-1\">\n {showTags &&\n product.tags?.map((tag: any, index) =>\n (tag as any).label ? (\n <Badge\n key={index}\n size=\"sm\"\n variant={(tag.variant as any) || 'outline'}\n className={cn(tag.variant === 'promotional' ? 'ml-2' : '')}\n promotionalType={tag.promotionalType}\n >\n {tag.label}\n </Badge>\n ) : (\n <React.Fragment key={index}>{tag}</React.Fragment>\n )\n )}\n </div>\n\n {/* \u4EA7\u54C1\u56FE\u533A\u57DF */}\n <div className=\"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden\">\n <a\n onClick={() => onProductImageClick?.(product)}\n {...(!onProductImageClick && {\n href: product?.listingLink,\n })}\n rel=\"noreferrer\"\n >\n <Picture\n source={product.image}\n alt={product.name}\n className=\"aspect-square size-full object-contain\"\n imgClassName=\"w-full h-full object-contain\"\n />\n </a>\n </div>\n\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"flex h-full flex-1 grow flex-col justify-between\">\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className=\"mb-4\">\n <Heading\n as=\"h3\"\n size={2}\n className={cn('text-info-primary mb-2 line-clamp-2 min-h-[2.4em]', classNames?.productTitle)}\n html={product.custom_name || product.name}\n />\n {product?.description && (\n <Text\n size={2}\n className={cn(\n 'text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]',\n classNames?.productDescription\n )}\n html={product.custom_description || product.description}\n />\n )}\n </div>\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div>\n <div className={cn('mb-2', classNames?.productPrice)}>\n <div className=\"flex items-baseline gap-2\">\n {product.availableForSale ? (\n <>\n <Heading size={2} className=\"text-info-primary\" as=\"h6\">\n {product.price}\n </Heading>\n {renderOriginalPrice\n ? renderOriginalPrice(product, { showOriginalPrice })\n : showOriginalPrice &&\n product.originalPrice && (\n <Heading\n size={2}\n className={cn('text-info-tertiary line-through', classNames?.originalPrice)}\n as=\"h6\"\n >\n {product.originalPrice}\n </Heading>\n )}\n </>\n ) : (\n <Heading size={2} className=\"text-info-tertiary\">\n {copy?.outOfStockLabel ?? 'Sold Out'}\n </Heading>\n )}\n </div>\n </div>\n\n {product?.priceLabel && product?.availableForSale && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]',\n classNames?.productPriceLabel\n )}\n >\n {product.priceLabel}\n </Text>\n )}\n\n {/* \u6309\u94AE\u533A\u57DF */}\n <div className={cn('lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2', classNames?.buttonGroup)}>\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n size=\"base\"\n className={cn(\n 'tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap',\n classNames?.secondaryButton\n )}\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n data-headless-type-name=\"ActiveShelf#ProductCard\"\n data-headless-title-desc-button={`${product.custom_name || product.name}#${product.description || ''}#${secondaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {secondaryButtonText}\n </Button>\n )}\n {primaryButtonText && (\n <Button\n variant=\"primary\"\n size=\"base\"\n className={cn(\n 'tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap',\n classNames?.primaryButton\n )}\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n data-headless-type-name=\"ActiveShelf#ProductCard\"\n data-headless-title-desc-button={`${product.custom_name || product.name}#${product.description || ''}#${primaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {primaryButtonText}\n </Button>\n )}\n </div>\n\n {/* \u5E93\u5B58\u4FE1\u606F */}\n {shouldShowStock(\n stockDisplayMode,\n stockThresholdValue,\n product?.quantityAvailable ?? 0,\n product?.totalInventory ?? 0\n ) && (\n <div className=\"mt-4 space-y-2\">\n <Progress\n value={stockPercentage}\n max={100}\n min={0}\n size=\"base\"\n variant=\"default\"\n aria-label=\"stock progress\"\n classNames={{\n root: cn('bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]', classNames?.stockTrack),\n progressBar: cn('bg-brand-0 transition-all duration-300 ease-in-out', classNames?.stockBar),\n }}\n />\n <Text size={3} className=\"text-info-tertiary text-[14px]\">\n {overselling\n ? copy?.limitedStock\n : copy?.stockDisplayText?.replace(\n '{count}',\n `${product.availableForSale ? product.quantityAvailable : 0}`\n )}\n </Text>\n </div>\n )}\n </div>\n </div>\n </CardContent>\n </Card>\n )\n }\n)\n\nProductCard.displayName = 'ActiveShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
5
+ "mappings": "aAsSkB,OA4DE,YAAAA,EA5DF,OAAAC,EAoCN,QAAAC,MApCM,oBApSlB,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAS,UAAAC,EAAQ,SAAAC,EAAO,QAAAC,EAAM,eAAAC,EAAa,WAAAC,EAAS,QAAAC,EAAM,WAAAC,EAAS,YAAAC,MAAgB,4BASnF,MAAMC,EAA+B,EA4JrC,SAASC,EACPC,EACAC,EACAC,EACAC,EACS,CAET,GAAIH,IAAqB,OACvB,MAAO,GAIT,OAAQA,EAAkB,CACxB,IAAK,SAEH,MAAO,GAET,IAAK,QAEH,MAAO,GAET,IAAK,iBAEH,OAAIC,IAAwB,OACnB,GAGFC,GAAqBD,EAE9B,IAAK,mBAEH,OAAIA,IAAwB,OACnB,GAEDC,EAAoBC,EAAkB,KAAOF,EAEvD,QAEE,MAAO,EACX,CACF,CAKA,MAAMG,EAAchB,EAAM,WACxB,CACE,CACE,QAAAiB,EACA,UAAAC,EACA,SAAAC,EAAW,GACX,iBAAAP,EACA,oBAAAC,EACA,YAAAO,EACA,UAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,kBAAAC,EACA,oBAAAC,EACA,KAAAC,EACA,oBAAAC,CACF,EACAC,IACG,CACH,KAAM,CAACC,EAAgBC,CAAiB,EAAIlC,EAAM,SAAS,EAAK,EAC1D,CAACmC,EAAkBC,CAAmB,EAAIpC,EAAM,SAAS,EAAK,EAE9DqC,EAAkBrC,EAAM,QAAQ,IAChCiB,GAAS,kBAAoBA,GAAS,mBAAqB,EACtDP,EAGJO,GAAS,kBAGLA,GAAS,mBAAqB,IAAMA,GAAS,gBAAkB,GAAM,IAFrE,EAGR,CAACA,GAAS,iBAAkBA,GAAS,kBAAmBA,GAAS,cAAc,CAAC,EAG7EqB,EAAoB,MAAOC,EAAgCC,IAAyC,CACxG,GAAI,CAACD,EAAW,OAEhB,MAAME,EAAaD,IAAe,UAAYN,EAAoBE,EAClEK,EAAW,EAAI,EAEf,GAAI,CACF,OAAQF,EAAW,CACjB,IAAK,SACH,MAAMlB,IAAYJ,CAAO,EACzB,MACF,IAAK,UACH,MAAMK,IAAcL,CAAO,EAC3B,MACF,IAAK,YACH,MAAMG,IAAcH,CAAO,EAC3B,MACF,QACE,KACJ,CACF,QAAE,CACAwB,EAAW,EAAK,CAClB,CACF,EAEMC,EAAczB,EAAQ,kBAAoBA,EAAQ,mBAAqB,EAE7E,OACEnB,EAACM,EAAA,CACC,IAAK4B,EACL,UAAW/B,EACT,uGACAiB,EACAK,GAAY,WACd,EAEA,SAAAxB,EAACM,EAAA,CAAY,UAAU,gEAErB,UAAAP,EAAC,OAAI,UAAU,0CACZ,SAAAqB,GACCF,EAAQ,MAAM,IAAI,CAAC0B,EAAUC,IAC1BD,EAAY,MACX7C,EAACK,EAAA,CAEC,KAAK,KACL,QAAUwC,EAAI,SAAmB,UACjC,UAAW1C,EAAG0C,EAAI,UAAY,cAAgB,OAAS,EAAE,EACzD,gBAAiBA,EAAI,gBAEpB,SAAAA,EAAI,OANAC,CAOP,EAEA9C,EAACE,EAAM,SAAN,CAA4B,SAAA2C,GAARC,CAAY,CAErC,EACJ,EAGA9C,EAAC,OAAI,UAAU,oGACb,SAAAA,EAAC,KACC,QAAS,IAAMiC,IAAsBd,CAAO,EAC3C,GAAI,CAACc,GAAuB,CAC3B,KAAMd,GAAS,WACjB,EACA,IAAI,aAEJ,SAAAnB,EAACQ,EAAA,CACC,OAAQW,EAAQ,MAChB,IAAKA,EAAQ,KACb,UAAU,yCACV,aAAa,+BACf,EACF,EACF,EAGAlB,EAAC,OAAI,UAAU,mDAEb,UAAAA,EAAC,OAAI,UAAU,OACb,UAAAD,EAACU,EAAA,CACC,GAAG,KACH,KAAM,EACN,UAAWP,EAAG,oDAAqDsB,GAAY,YAAY,EAC3F,KAAMN,EAAQ,aAAeA,EAAQ,KACvC,EACCA,GAAS,aACRnB,EAACS,EAAA,CACC,KAAM,EACN,UAAWN,EACT,mJACAsB,GAAY,kBACd,EACA,KAAMN,EAAQ,oBAAsBA,EAAQ,YAC9C,GAEJ,EAGAlB,EAAC,OACC,UAAAD,EAAC,OAAI,UAAWG,EAAG,OAAQsB,GAAY,YAAY,EACjD,SAAAzB,EAAC,OAAI,UAAU,4BACZ,SAAAmB,EAAQ,iBACPlB,EAAAF,EAAA,CACE,UAAAC,EAACU,EAAA,CAAQ,KAAM,EAAG,UAAU,oBAAoB,GAAG,KAChD,SAAAS,EAAQ,MACX,EACCY,EACGA,EAAoBZ,EAAS,CAAE,kBAAAW,CAAkB,CAAC,EAClDA,GACAX,EAAQ,eACNnB,EAACU,EAAA,CACC,KAAM,EACN,UAAWP,EAAG,kCAAmCsB,GAAY,aAAa,EAC1E,GAAG,KAEF,SAAAN,EAAQ,cACX,GAER,EAEAnB,EAACU,EAAA,CAAQ,KAAM,EAAG,UAAU,qBACzB,SAAAsB,GAAM,iBAAmB,WAC5B,EAEJ,EACF,EAECb,GAAS,YAAcA,GAAS,kBAC/BnB,EAACS,EAAA,CACC,KAAM,EACN,UAAWN,EACT,+EACAsB,GAAY,iBACd,EAEC,SAAAN,EAAQ,WACX,EAIFlB,EAAC,OAAI,UAAWE,EAAG,2DAA4DsB,GAAY,WAAW,EACnG,UAAAC,GACC1B,EAACI,EAAA,CACC,QAAQ,YACR,KAAK,OACL,UAAWD,EACT,mGACAsB,GAAY,eACd,EACA,QAAS,IAAMe,EAAkBb,EAAoB,WAAW,EAChE,SAAU,CAACR,EAAQ,kBAAoBQ,IAAuB,YAC9D,QAASU,EACT,0BAAwB,0BACxB,kCAAiC,GAAGlB,EAAQ,aAAeA,EAAQ,IAAI,IAAIA,EAAQ,aAAe,EAAE,IAAIO,CAAmB,GAC3H,oBAAmBP,EAAQ,IAE1B,SAAAO,EACH,EAEDE,GACC5B,EAACI,EAAA,CACC,QAAQ,UACR,KAAK,OACL,UAAWD,EACT,mGACAsB,GAAY,aACd,EACA,QAAS,IAAMe,EAAkBX,EAAkB,SAAS,EAC5D,SAAU,CAACV,EAAQ,kBAAoBU,IAAqB,YAC5D,QAASM,EACT,0BAAwB,0BACxB,kCAAiC,GAAGhB,EAAQ,aAAeA,EAAQ,IAAI,IAAIA,EAAQ,aAAe,EAAE,IAAIS,CAAiB,GACzH,oBAAmBT,EAAQ,IAE1B,SAAAS,EACH,GAEJ,EAGCf,EACCC,EACAC,EACAI,GAAS,mBAAqB,EAC9BA,GAAS,gBAAkB,CAC7B,GACElB,EAAC,OAAI,UAAU,iBACb,UAAAD,EAACW,EAAA,CACC,MAAO4B,EACP,IAAK,IACL,IAAK,EACL,KAAK,OACL,QAAQ,UACR,aAAW,iBACX,WAAY,CACV,KAAMpC,EAAG,gDAAiDsB,GAAY,UAAU,EAChF,YAAatB,EAAG,qDAAsDsB,GAAY,QAAQ,CAC5F,EACF,EACAzB,EAACS,EAAA,CAAK,KAAM,EAAG,UAAU,iCACtB,SAAAmC,EACGZ,GAAM,aACNA,GAAM,kBAAkB,QACtB,UACA,GAAGb,EAAQ,iBAAmBA,EAAQ,kBAAoB,CAAC,EAC7D,EACN,GACF,GAEJ,GACF,GACF,EACF,CAEJ,CACF,EAEAD,EAAY,YAAc,0BAG1B,IAAO6B,EAAQ7B",
6
+ "names": ["Fragment", "jsx", "jsxs", "React", "cn", "Button", "Badge", "Card", "CardContent", "Picture", "Text", "Heading", "Progress", "OVERSELLING_STOCK_PERCENTAGE", "shouldShowStock", "stockDisplayMode", "stockThresholdValue", "quantityAvailable", "totalInventory", "ProductCard", "product", "className", "showTags", "onLearnMore", "onShopNow", "onAddToCart", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "showOriginalPrice", "renderOriginalPrice", "copy", "onProductImageClick", "ref", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "stockPercentage", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "overselling", "tag", "index", "ProductCard_default"]
7
7
  }
@@ -79,6 +79,15 @@ export interface ActiveShelfProps extends React.HTMLAttributes<HTMLDivElement> {
79
79
  onAddToCart?: (product: ProductCardData) => void;
80
80
  /** 语义化类名 */
81
81
  classNames?: Partial<Record<ActiveShelfSemanticName, string>>;
82
+ /**
83
+ * 原价区域渲染函数,用于在原价位置展示自定义内容(如 Save 金额文案)。
84
+ * 不传时使用默认的原价渲染(划线价)。
85
+ * @param product - 当前产品数据
86
+ * @param context - 渲染上下文(含 showOriginalPrice)
87
+ */
88
+ renderOriginalPrice?: (product: ProductCardData, context: {
89
+ showOriginalPrice?: boolean;
90
+ }) => React.ReactNode;
82
91
  }
83
92
  /**
84
93
  * ActiveShelf 复合组件类型定义
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as t,jsxs as x}from"react/jsx-runtime";import*as n from"react";import{cn as D}from"../../helpers/index.js";import{withLayout as H}from"../../shared/Styles.js";import{Text as z,Heading as $,Tabs as O,TabsList as V,TabsTrigger as I,TabsContent as W}from"../../components/index.js";import{Swiper as j,SwiperSlide as _}from"swiper/react";import{Navigation as q}from"swiper/modules";import"swiper/css";import"swiper/css/navigation";import{ProductCard as N}from"./ProductCard.js";import{useExposure as Z}from"../../hooks/useExposure.js";const G="shelf",J="active_shelf",K=({disabled:i})=>x("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]",children:[t("path",{d:"M0 28C0 43.464 12.536 56 28 56C43.464 56 56 43.464 56 28C56 12.536 43.464 0 28 0C12.536 0 0 12.536 0 28Z",fill:"currentColor",fillOpacity:i?"0.2":"0.6"}),t("path",{d:"M31 22L25 28L31 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),Q=({disabled:i})=>x("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]",children:[t("path",{d:"M0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28Z",fill:"currentColor",fillOpacity:i?"0.2":"0.6"}),t("path",{d:"M25 22L31 28L25 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),E=n.forwardRef(({products:i,layoutMode:o,className:S,copy:a,showTags:p,stockDisplayMode:r,stockThresholdValue:k,onLearnMore:B,onShopNow:l,onAddToCart:u,classNames:h,secondaryButtonText:m,secondaryButtonFun:y,primaryButtonText:g,primaryButtonFun:f,showOriginalPrice:T},P)=>{const v=n.useId().replace(/:/g,""),b=`swiper-button-next-custom-${v}`,M=`swiper-button-prev-custom-${v}`,[c,s]=n.useState({isBeginning:!0,isEnd:!1}),L=n.useRef(null),d=n.useCallback(()=>{const e=L.current;if(!e?.slides||e.slides.length===0)return;e.slides.forEach(C=>{C.style.height="auto"});const w=Array.from(e.slides).map(C=>C.scrollHeight),A=Math.max(...w);A>0&&e.slides.forEach(C=>{C.style.height=`${A}px`})},[]);return n.useEffect(()=>{const e=()=>{requestAnimationFrame(d)};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[d]),i?.length===0?null:t("div",{ref:P,className:S,children:o==="flex"?t("div",{className:"lg-desktop:gap-4 tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 laptop:gap-4 grid grid-cols-1 justify-start gap-3",children:i.map((e,w)=>t(N,{product:e,className:"shrink-0",showTags:p,stockDisplayMode:r,stockThresholdValue:k,onLearnMore:B,onShopNow:l,onAddToCart:u,classNames:h,secondaryButtonText:m,secondaryButtonFun:y,primaryButtonText:g,primaryButtonFun:f,showOriginalPrice:T,copy:a},e.shopify_id+"-"+e.sku||w))}):x("div",{className:"group relative",children:[t(j,{modules:[q],spaceBetween:16,slidesPerView:"auto",navigation:{nextEl:`.${b}`,prevEl:`.${M}`},onSwiper:e=>{L.current=e,s({isBeginning:e.isBeginning,isEnd:e.isEnd}),setTimeout(d,100)},onReachEnd:()=>{s(e=>({...e,isEnd:!0}))},onReachBeginning:()=>{s(e=>({...e,isBeginning:!0}))},onFromEdge:()=>{s({isBeginning:!1,isEnd:!1})},className:"!overflow-visible",children:i.map((e,w)=>t(_,{className:"tablet:!w-[288px] desktop:!w-[316px] lg-desktop:!w-[404px] !w-[296px] overflow-hidden",children:t(N,{product:e,className:"w-full max-w-full",showTags:p,stockDisplayMode:r,stockThresholdValue:k,onLearnMore:B,onShopNow:l,onAddToCart:u,classNames:h,secondaryButtonText:m,secondaryButtonFun:y,primaryButtonText:g,primaryButtonFun:f,showOriginalPrice:T,copy:a})},e.shopify_id+"-"+e.sku||w))}),t("button",{className:`${M} tablet:block absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${c.isBeginning?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":a?.previousSlideLabel,children:t(K,{disabled:c.isBeginning})}),t("button",{className:`${b} tablet:block absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${c.isEnd?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":a?.nextSlideLabel,children:t(Q,{disabled:c.isEnd})})]})})});E.displayName="ProductsList";const F=n.forwardRef(({className:i,data:o,onLearnMore:S,onShopNow:a,onAddToCart:p,classNames:r,...k},B)=>{const l=n.useRef(null);Z(l,{componentType:G,componentName:J,componentTitle:o.title,componentDescription:o.description}),n.useImperativeHandle(B,()=>l.current);const{theme:u="light",layoutMode:h="flex",showTags:m=!0,stockDisplayMode:y,stockThresholdValue:g,showOriginalPrice:f=!0,secondaryButtonText:T,primaryButtonText:P,secondaryButtonFun:v,primaryButtonFun:b,isShowTab:M=!0,copy:c}=o,s=c||{},L=o.productsTab&&o.productsTab.length>0,d=M&&L;return x("div",{ref:l,className:D("w-full",{"aiui-dark":u==="dark"},i,r?.root),style:{"--progress-track-bg":u==="dark"?"rgba(255, 255, 255, 0.2)":"rgba(0, 0, 0, 0.2)"},...k,children:[o.title&&t($,{as:"h2",html:o.title,size:4,className:D("text-info-primary mb-4",r?.title)}),o.description&&t(z,{size:3,as:"p",html:o.description,className:D("text-info-primary mb-6",r?.description)}),x(O,{defaultValue:o.productsTab?.[0]?.id,className:"w-full",children:[d&&t(V,{className:"mb-6",children:o.productsTab?.map(e=>t(I,{value:e.id,children:e.tab},"tab-"+e.id))}),d?o.productsTab?.map(e=>t(W,{value:e.id,children:t(E,{products:e.data,layoutMode:h,copy:s,showTags:m,stockDisplayMode:y,stockThresholdValue:g,onLearnMore:S,onShopNow:a,onAddToCart:p,classNames:r,secondaryButtonText:T,secondaryButtonFun:v,primaryButtonText:P,primaryButtonFun:b,showOriginalPrice:f})},"tab-content-"+e.id)):t(E,{products:o.productsCard,layoutMode:h,copy:s,showTags:m,stockDisplayMode:y,stockThresholdValue:g,onLearnMore:S,onShopNow:a,onAddToCart:p,classNames:r,secondaryButtonText:T,secondaryButtonFun:v,primaryButtonText:P,primaryButtonFun:b,showOriginalPrice:f})]})]})});F.displayName="ActiveShelf";const R=F;R.ProductCard=N;const U=H(R);var se=U;export{se as default};
1
+ "use client";import{jsx as t,jsxs as S}from"react/jsx-runtime";import*as r from"react";import{cn as N}from"../../helpers/index.js";import{withLayout as O}from"../../shared/Styles.js";import{Text as z,Heading as $,Tabs as V,TabsList as I,TabsTrigger as W,TabsContent as j}from"../../components/index.js";import{Swiper as _,SwiperSlide as q}from"swiper/react";import{Navigation as Z}from"swiper/modules";import"swiper/css";import"swiper/css/navigation";import{ProductCard as E}from"./ProductCard.js";import{useExposure as G}from"../../hooks/useExposure.js";const J="shelf",K="active_shelf",Q=({disabled:i})=>S("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]",children:[t("path",{d:"M0 28C0 43.464 12.536 56 28 56C43.464 56 56 43.464 56 28C56 12.536 43.464 0 28 0C12.536 0 0 12.536 0 28Z",fill:"currentColor",fillOpacity:i?"0.2":"0.6"}),t("path",{d:"M31 22L25 28L31 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),U=({disabled:i})=>S("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]",children:[t("path",{d:"M0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28Z",fill:"currentColor",fillOpacity:i?"0.2":"0.6"}),t("path",{d:"M25 22L31 28L25 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),A=r.forwardRef(({products:i,layoutMode:o,className:k,copy:n,showTags:p,stockDisplayMode:a,stockThresholdValue:u,onLearnMore:P,onShopNow:B,onAddToCart:l,classNames:h,secondaryButtonText:m,secondaryButtonFun:g,primaryButtonText:y,primaryButtonFun:f,showOriginalPrice:T,renderOriginalPrice:b},M)=>{const v=r.useId().replace(/:/g,""),w=`swiper-button-next-custom-${v}`,L=`swiper-button-prev-custom-${v}`,[c,s]=r.useState({isBeginning:!0,isEnd:!1}),D=r.useRef(null),d=r.useCallback(()=>{const e=D.current;if(!e?.slides||e.slides.length===0)return;e.slides.forEach(x=>{x.style.height="auto"});const C=Array.from(e.slides).map(x=>x.scrollHeight),R=Math.max(...C);R>0&&e.slides.forEach(x=>{x.style.height=`${R}px`})},[]);return r.useEffect(()=>{const e=()=>{requestAnimationFrame(d)};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[d]),i?.length===0?null:t("div",{ref:M,className:k,children:o==="flex"?t("div",{className:"lg-desktop:gap-4 tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 laptop:gap-4 grid grid-cols-1 justify-start gap-3",children:i.map((e,C)=>t(E,{product:e,className:"shrink-0",showTags:p,stockDisplayMode:a,stockThresholdValue:u,onLearnMore:P,onShopNow:B,onAddToCart:l,classNames:h,secondaryButtonText:m,secondaryButtonFun:g,primaryButtonText:y,primaryButtonFun:f,showOriginalPrice:T,renderOriginalPrice:b,copy:n},e.shopify_id+"-"+e.sku||C))}):S("div",{className:"group relative",children:[t(_,{modules:[Z],spaceBetween:16,slidesPerView:"auto",navigation:{nextEl:`.${w}`,prevEl:`.${L}`},onSwiper:e=>{D.current=e,s({isBeginning:e.isBeginning,isEnd:e.isEnd}),setTimeout(d,100)},onReachEnd:()=>{s(e=>({...e,isEnd:!0}))},onReachBeginning:()=>{s(e=>({...e,isBeginning:!0}))},onFromEdge:()=>{s({isBeginning:!1,isEnd:!1})},className:"!overflow-visible",children:i.map((e,C)=>t(q,{className:"tablet:!w-[288px] desktop:!w-[316px] lg-desktop:!w-[404px] !w-[296px] overflow-hidden",children:t(E,{product:e,className:"w-full max-w-full",showTags:p,stockDisplayMode:a,stockThresholdValue:u,onLearnMore:P,onShopNow:B,onAddToCart:l,classNames:h,secondaryButtonText:m,secondaryButtonFun:g,primaryButtonText:y,primaryButtonFun:f,showOriginalPrice:T,renderOriginalPrice:b,copy:n})},e.shopify_id+"-"+e.sku||C))}),t("button",{className:`${L} tablet:block absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${c.isBeginning?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":n?.previousSlideLabel,children:t(Q,{disabled:c.isBeginning})}),t("button",{className:`${w} tablet:block absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${c.isEnd?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":n?.nextSlideLabel,children:t(U,{disabled:c.isEnd})})]})})});A.displayName="ProductsList";const F=r.forwardRef(({className:i,data:o,onLearnMore:k,onShopNow:n,onAddToCart:p,classNames:a,renderOriginalPrice:u,...P},B)=>{const l=r.useRef(null);G(l,{componentType:J,componentName:K,componentTitle:o.title,componentDescription:o.description}),r.useImperativeHandle(B,()=>l.current);const{theme:h="light",layoutMode:m="flex",showTags:g=!0,stockDisplayMode:y,stockThresholdValue:f,showOriginalPrice:T=!0,secondaryButtonText:b,primaryButtonText:M,secondaryButtonFun:v,primaryButtonFun:w,isShowTab:L=!0,copy:c}=o,s=c||{},D=o.productsTab&&o.productsTab.length>0,d=L&&D;return S("div",{ref:l,className:N("w-full",{"aiui-dark":h==="dark"},i,a?.root),style:{"--progress-track-bg":h==="dark"?"rgba(255, 255, 255, 0.2)":"rgba(0, 0, 0, 0.2)"},...P,children:[o.title&&t($,{as:"h2",html:o.title,size:4,className:N("text-info-primary mb-4",a?.title)}),o.description&&t(z,{size:3,as:"p",html:o.description,className:N("text-info-primary mb-6",a?.description)}),S(V,{defaultValue:o.productsTab?.[0]?.id,className:"w-full",children:[d&&t(I,{className:"mb-6",children:o.productsTab?.map(e=>t(W,{value:e.id,children:e.tab},"tab-"+e.id))}),d?o.productsTab?.map(e=>t(j,{value:e.id,children:t(A,{products:e.data,layoutMode:m,copy:s,showTags:g,stockDisplayMode:y,stockThresholdValue:f,onLearnMore:k,onShopNow:n,onAddToCart:p,classNames:a,secondaryButtonText:b,secondaryButtonFun:v,primaryButtonText:M,primaryButtonFun:w,showOriginalPrice:T,renderOriginalPrice:u})},"tab-content-"+e.id)):t(A,{products:o.productsCard,layoutMode:m,copy:s,showTags:g,stockDisplayMode:y,stockThresholdValue:f,onLearnMore:k,onShopNow:n,onAddToCart:p,classNames:a,secondaryButtonText:b,secondaryButtonFun:v,primaryButtonText:M,primaryButtonFun:w,showOriginalPrice:T,renderOriginalPrice:u})]})]})});F.displayName="ActiveShelf";const H=F;H.ProductCard=E;const X=O(H);var le=X;export{le as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ActiveShelf/index.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Text, Heading, Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/index.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation } from 'swiper/modules'\n\n// Import Swiper styles\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport type { ButtonFunctionType, CopyConfig } from './types.js'\nimport {\n ProductCard,\n type ProductCardData,\n type ActiveShelfSemanticName,\n type StockDisplayMode,\n} from './ProductCard.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nconst componentType = 'shelf'\nconst componentName = 'active_shelf'\n\n/**\n * \u7EC4\u4EF6\u5E03\u5C40\u6A21\u5F0F\n */\nexport type ActiveShelfLayoutMode = 'flex' | 'horizontal'\n\n/**\n * Code Channel \u914D\u7F6E - \u6298\u6263\u524D\u7F00\n */\nexport type CodeChannelConfig = string\n\nconst PrevIcon = ({ disabled }: { disabled: boolean }) => (\n <svg\n width=\"56\"\n height=\"56\"\n viewBox=\"0 0 56 56\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]\"\n >\n <path\n d=\"M0 28C0 43.464 12.536 56 28 56C43.464 56 56 43.464 56 28C56 12.536 43.464 0 28 0C12.536 0 0 12.536 0 28Z\"\n fill=\"currentColor\"\n fillOpacity={disabled ? '0.2' : '0.6'}\n />\n <path d=\"M31 22L25 28L31 34\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n)\n\nconst NextIcon = ({ disabled }: { disabled: boolean }) => (\n <svg\n width=\"56\"\n height=\"56\"\n viewBox=\"0 0 56 56\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]\"\n >\n <path\n d=\"M0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28Z\"\n fill=\"currentColor\"\n fillOpacity={disabled ? '0.2' : '0.6'}\n />\n <path d=\"M25 22L31 28L25 34\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n)\n\n/**\n * \u4EA7\u54C1\u5206\u7EC4Tab\u6570\u636E\u63A5\u53E3\n */\nexport interface ProductTab {\n /** Tab ID */\n id: string\n /** Tab \u6807\u9898 */\n tab: string\n /** \u8BE5\u5206\u7EC4\u4E0B\u7684\u4EA7\u54C1\u6570\u636E */\n data: ProductCardData[]\n}\n\n/**\n * ActiveShelf \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface ActiveShelfData {\n theme?: 'light' | 'dark'\n /** \u7EC4\u4EF6\u6807\u9898 */\n title?: string\n /** \u7EC4\u4EF6\u63CF\u8FF0 */\n description?: string\n /** \u5206\u7EC4\u4EA7\u54C1Tab\u5217\u8868 */\n productsTab?: ProductTab[]\n /** \u662F\u5426\u663E\u793A Tab\uFF08\u9ED8\u8BA4\uFF1Atrue\uFF09 */\n isShowTab?: boolean\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n secondaryButtonFun: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n primaryButtonFun: ButtonFunctionType\n /** \u5E03\u5C40\u6A21\u5F0F\uFF1A\u7F51\u683C\u5E03\u5C40\u6216\u6A2A\u5411\u6ED1\u52A8 */\n layoutMode?: ActiveShelfLayoutMode\n /** Code Channel \u914D\u7F6E - \u6298\u6263\u524D\u7F00 */\n codeChannel?: CodeChannelConfig\n /** \u662F\u5426\u5C55\u793A\u4F1A\u5458\u4EF7\u683C */\n showMemberPrice?: boolean\n /** \u662F\u5426\u5C55\u793A\u6298\u6263\u6807\u7B7E */\n showDiscount?: boolean\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n stockDisplayMode?: StockDisplayMode\n /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n stockThresholdValue?: number\n /**\n * \u5E93\u5B58\u6587\u672C\u6A21\u677F\uFF0C\u652F\u6301 {count} \u5360\u4F4D\u7B26\n */\n stockDisplayText?: string\n /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n showOriginalPrice?: boolean\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n /**\n * \u4EA7\u54C1\u5217\u8868\uFF08\u5F53\u4E0D\u4F7F\u7528 Tab \u5206\u7EC4\u65F6\u53EF\u76F4\u63A5\u4F20\u5165\u4EA7\u54C1\u5217\u8868\uFF09\n */\n productsCard: ProductCardData[]\n}\n\nexport interface ActiveShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: ActiveShelfData\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n}\n\n/**\n * ActiveShelf \u590D\u5408\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface ActiveShelfComponent extends React.ForwardRefExoticComponent<\n ActiveShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n /** \u72EC\u7ACB\u7684 ProductCard \u7EC4\u4EF6 */\n ProductCard: typeof ProductCard\n}\n\n/**\n * \u4EA7\u54C1\u5217\u8868\u7EC4\u4EF6 Props\n */\ninterface ProductsListProps {\n products: ProductCardData[]\n layoutMode: ActiveShelfLayoutMode\n className?: string\n copy?: CopyConfig\n showTags?: boolean\n stockDisplayMode?: StockDisplayMode\n stockThresholdValue?: number\n onLearnMore?: (product: ProductCardData) => void\n onShopNow?: (product: ProductCardData) => void\n onAddToCart?: (product: ProductCardData) => void\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n secondaryButtonText?: string\n secondaryButtonFun?: ButtonFunctionType\n primaryButtonText?: string\n primaryButtonFun?: ButtonFunctionType\n showOriginalPrice?: boolean\n}\n\n/**\n * \u4EA7\u54C1\u5217\u8868\u7EC4\u4EF6 - \u652F\u6301\u7F51\u683C\u548C\u6A2A\u5411\u6ED1\u52A8\u4E24\u79CD\u5E03\u5C40\n */\nconst ProductsList = React.forwardRef<HTMLDivElement, ProductsListProps>(\n (\n {\n products,\n layoutMode,\n className,\n copy,\n showTags,\n stockDisplayMode,\n stockThresholdValue,\n onLearnMore,\n onShopNow,\n onAddToCart,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n showOriginalPrice,\n },\n ref\n ) => {\n // \u751F\u6210\u552F\u4E00 ID\uFF0C\u79FB\u9664\u7279\u6B8A\u5B57\u7B26\u4EE5\u786E\u4FDD\u53EF\u7528\u4E8E CSS \u9009\u62E9\u5668\n const id = React.useId().replace(/:/g, '')\n // \u9884\u5B9A\u4E49\u5BFC\u822A\u6309\u94AE\u9009\u62E9\u5668\uFF0C\u907F\u514D\u591A\u6B21\u62FC\u63A5\n const nextButtonClass = `swiper-button-next-custom-${id}`\n const prevButtonClass = `swiper-button-prev-custom-${id}`\n\n // Swiper \u5BFC\u822A\u72B6\u6001\n const [swiperState, setSwiperState] = React.useState({\n isBeginning: true,\n isEnd: false,\n })\n\n // Swiper \u5B9E\u4F8B\u5F15\u7528\n const swiperRef = React.useRef<any>(null)\n\n // \u8BA1\u7B97\u5E76\u8BBE\u7F6E\u6240\u6709 slide \u4E3A\u6700\u9AD8\u9AD8\u5EA6\n const equalizeSlideHeights = React.useCallback(() => {\n const swiper = swiperRef.current\n if (!swiper?.slides || swiper.slides.length === 0) return\n\n // \u5148\u91CD\u7F6E\u6240\u6709 slide \u9AD8\u5EA6\u4EE5\u83B7\u53D6\u771F\u5B9E\u5185\u5BB9\u9AD8\u5EA6\n swiper.slides.forEach((slide: HTMLElement) => {\n slide.style.height = 'auto'\n })\n\n // \u8BA1\u7B97\u6700\u5927\u9AD8\u5EA6\n // @ts-ignore\n const heights = Array.from(swiper.slides).map((slide: HTMLElement) => slide.scrollHeight)\n const maxHeight = Math.max(...heights)\n\n // \u8BBE\u7F6E\u6240\u6709 slide \u4E3A\u6700\u5927\u9AD8\u5EA6\n if (maxHeight > 0) {\n swiper.slides.forEach((slide: HTMLElement) => {\n slide.style.height = `${maxHeight}px`\n })\n }\n }, [])\n\n // \u76D1\u542C\u7A97\u53E3 resize \u91CD\u65B0\u8BA1\u7B97\u9AD8\u5EA6\n React.useEffect(() => {\n const handleResize = () => {\n // \u4F7F\u7528 requestAnimationFrame \u786E\u4FDD DOM \u66F4\u65B0\u5B8C\u6210\n requestAnimationFrame(equalizeSlideHeights)\n }\n\n window.addEventListener('resize', handleResize)\n return () => window.removeEventListener('resize', handleResize)\n }, [equalizeSlideHeights])\n\n if (products?.length === 0) {\n return null\n }\n\n return (\n <div ref={ref} className={className}>\n {layoutMode === 'flex' ? (\n /* \u7F51\u683C\u5E03\u5C40 */\n <div className=\"lg-desktop:gap-4 tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 laptop:gap-4 grid grid-cols-1 justify-start gap-3\">\n {products.map((product, index) => (\n <ProductCard\n key={product.shopify_id + '-' + product.sku || index}\n product={product}\n className=\"shrink-0\"\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n copy={copy}\n />\n ))}\n </div>\n ) : (\n /* Swiper \u6A2A\u5411\u6ED1\u52A8\u5E03\u5C40 */\n <div className=\"group relative\">\n <Swiper\n modules={[Navigation]}\n spaceBetween={16}\n slidesPerView=\"auto\"\n navigation={{\n nextEl: `.${nextButtonClass}`,\n prevEl: `.${prevButtonClass}`,\n }}\n onSwiper={swiper => {\n swiperRef.current = swiper\n setSwiperState({\n isBeginning: swiper.isBeginning,\n isEnd: swiper.isEnd,\n })\n // \u5EF6\u8FDF\u6267\u884C\u4EE5\u786E\u4FDD\u5185\u5BB9\u6E32\u67D3\u5B8C\u6210\n setTimeout(equalizeSlideHeights, 100)\n }}\n onReachEnd={() => {\n setSwiperState(prev => ({ ...prev, isEnd: true }))\n }}\n onReachBeginning={() => {\n setSwiperState(prev => ({ ...prev, isBeginning: true }))\n }}\n onFromEdge={() => {\n setSwiperState({ isBeginning: false, isEnd: false })\n }}\n className=\"!overflow-visible\"\n >\n {products.map((product, index) => (\n <SwiperSlide\n key={product.shopify_id + '-' + product.sku || index}\n className=\"tablet:!w-[288px] desktop:!w-[316px] lg-desktop:!w-[404px] !w-[296px] overflow-hidden\"\n >\n <ProductCard\n product={product}\n className=\"w-full max-w-full\"\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n copy={copy}\n />\n </SwiperSlide>\n ))}\n </Swiper>\n\n {/* \u81EA\u5B9A\u4E49\u5BFC\u822A\u6309\u94AE - \u9ED8\u8BA4\u9690\u85CF\uFF0Chover \u65F6\u663E\u793A\uFF0Cdisabled \u65F6\u9690\u85CF */}\n <button\n className={`${prevButtonClass} tablet:block absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${swiperState.isBeginning ? 'pointer-events-none opacity-0' : 'opacity-0 group-hover:opacity-100'}`}\n aria-label={copy?.previousSlideLabel}\n >\n <PrevIcon disabled={swiperState.isBeginning} />\n </button>\n <button\n className={`${nextButtonClass} tablet:block absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${swiperState.isEnd ? 'pointer-events-none opacity-0' : 'opacity-0 group-hover:opacity-100'}`}\n aria-label={copy?.nextSlideLabel}\n >\n <NextIcon disabled={swiperState.isEnd} />\n </button>\n </div>\n )}\n </div>\n )\n }\n)\n\nProductsList.displayName = 'ProductsList'\n\n/**\n * ActiveShelf - \u6D3B\u52A8\u8D27\u67B6\n *\n * @description \u80FD\u591F\u5B9E\u65F6\u663E\u793A\u5546\u54C1\u5E93\u5B58\u4FE1\u606F\u548C\u4F1A\u5458\u4EF7\u7684\u8D27\u67B6\uFF0C\u652F\u6301\u54CD\u5E94\u5F0F\u5E03\u5C40\u548C\u591A\u79CD\u914D\u7F6E\u9009\u9879\n */\nconst ActiveShelf = React.forwardRef<HTMLDivElement, ActiveShelfProps>(\n ({ className, data, onLearnMore, onShopNow, onAddToCart, classNames, ...props }, ref) => {\n const boxRef = React.useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: data.title,\n componentDescription: data.description,\n })\n\n React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n // \u4ECE data \u4E2D\u89E3\u6784\u914D\u7F6E\u9879\uFF0C\u5E76\u8BBE\u7F6E\u9ED8\u8BA4\u503C\n const {\n theme = 'light',\n layoutMode = 'flex',\n showTags = true,\n stockDisplayMode,\n stockThresholdValue,\n showOriginalPrice = true,\n secondaryButtonText,\n primaryButtonText,\n secondaryButtonFun,\n primaryButtonFun,\n isShowTab = true,\n copy,\n } = data\n\n // \u6784\u5EFA copy \u914D\u7F6E\uFF0C\u4F7F\u7528\u4F20\u5165\u7684 copy \u914D\u7F6E\n const finalCopy: CopyConfig = copy || {}\n\n // \u83B7\u53D6\u8981\u663E\u793A\u7684\u4EA7\u54C1\u6570\u636E\n const hasTabData = data.productsTab && data.productsTab.length > 0\n const shouldShowTab = isShowTab && hasTabData\n\n return (\n <div\n ref={boxRef}\n className={cn(\n 'w-full',\n {\n 'aiui-dark': theme === 'dark',\n },\n className,\n classNames?.root\n )}\n style={\n {\n '--progress-track-bg': theme === 'dark' ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)',\n } as React.CSSProperties\n }\n {...props}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n {data.title && (\n <Heading as=\"h2\" html={data.title} size={4} className={cn('text-info-primary mb-4', classNames?.title)} />\n )}\n {data.description && (\n <Text\n size={3}\n as=\"p\"\n html={data.description}\n className={cn('text-info-primary mb-6', classNames?.description)}\n />\n )}\n\n {/* \u4EA7\u54C1\u5C55\u793A\u533A\u57DF */}\n\n <Tabs defaultValue={data.productsTab?.[0]?.id} className=\"w-full\">\n {shouldShowTab && (\n <TabsList className=\"mb-6\">\n {data.productsTab?.map(tab => (\n <TabsTrigger key={'tab-' + tab.id} value={tab.id}>\n {tab.tab}\n </TabsTrigger>\n ))}\n </TabsList>\n )}\n {shouldShowTab ? (\n data.productsTab?.map(tab => (\n <TabsContent key={'tab-content-' + tab.id} value={tab.id}>\n <ProductsList\n products={tab.data}\n layoutMode={layoutMode}\n copy={finalCopy}\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n />\n </TabsContent>\n ))\n ) : (\n <ProductsList\n products={data.productsCard}\n layoutMode={layoutMode}\n copy={finalCopy}\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n />\n )}\n </Tabs>\n </div>\n )\n }\n)\n\nActiveShelf.displayName = 'ActiveShelf'\n\n// \u521B\u5EFA\u590D\u5408\u7EC4\u4EF6\nconst ActiveShelfWithProductCard = ActiveShelf as ActiveShelfComponent\nActiveShelfWithProductCard.ProductCard = ProductCard\n\nconst ActiveShelfWrapped = withLayout(ActiveShelfWithProductCard)\n\nexport default ActiveShelfWrapped\nexport type { StockDisplayMode, ActiveShelfSemanticName, ProductCardData }\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "React", "cn", "withLayout", "Text", "Heading", "Tabs", "TabsList", "TabsTrigger", "TabsContent", "Swiper", "SwiperSlide", "Navigation", "ProductCard", "useExposure", "componentType", "componentName", "PrevIcon", "disabled", "NextIcon", "ProductsList", "products", "layoutMode", "className", "copy", "showTags", "stockDisplayMode", "stockThresholdValue", "onLearnMore", "onShopNow", "onAddToCart", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "showOriginalPrice", "ref", "id", "nextButtonClass", "prevButtonClass", "swiperState", "setSwiperState", "swiperRef", "equalizeSlideHeights", "swiper", "slide", "heights", "maxHeight", "handleResize", "product", "index", "prev", "ActiveShelf", "data", "props", "boxRef", "theme", "isShowTab", "finalCopy", "hasTabData", "shouldShowTab", "tab", "ActiveShelfWithProductCard", "ActiveShelfWrapped", "ActiveShelf_default"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Text, Heading, Tabs, TabsList, TabsTrigger, TabsContent } from '../../components/index.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation } from 'swiper/modules'\n\n// Import Swiper styles\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport type { ButtonFunctionType, CopyConfig } from './types.js'\nimport {\n ProductCard,\n type ProductCardData,\n type ActiveShelfSemanticName,\n type StockDisplayMode,\n} from './ProductCard.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nconst componentType = 'shelf'\nconst componentName = 'active_shelf'\n\n/**\n * \u7EC4\u4EF6\u5E03\u5C40\u6A21\u5F0F\n */\nexport type ActiveShelfLayoutMode = 'flex' | 'horizontal'\n\n/**\n * Code Channel \u914D\u7F6E - \u6298\u6263\u524D\u7F00\n */\nexport type CodeChannelConfig = string\n\nconst PrevIcon = ({ disabled }: { disabled: boolean }) => (\n <svg\n width=\"56\"\n height=\"56\"\n viewBox=\"0 0 56 56\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]\"\n >\n <path\n d=\"M0 28C0 43.464 12.536 56 28 56C43.464 56 56 43.464 56 28C56 12.536 43.464 0 28 0C12.536 0 0 12.536 0 28Z\"\n fill=\"currentColor\"\n fillOpacity={disabled ? '0.2' : '0.6'}\n />\n <path d=\"M31 22L25 28L31 34\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n)\n\nconst NextIcon = ({ disabled }: { disabled: boolean }) => (\n <svg\n width=\"56\"\n height=\"56\"\n viewBox=\"0 0 56 56\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"text-info-primary laptop:block lg-desktop:size-[56px] hidden size-[40px]\"\n >\n <path\n d=\"M0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28Z\"\n fill=\"currentColor\"\n fillOpacity={disabled ? '0.2' : '0.6'}\n />\n <path d=\"M25 22L31 28L25 34\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n)\n\n/**\n * \u4EA7\u54C1\u5206\u7EC4Tab\u6570\u636E\u63A5\u53E3\n */\nexport interface ProductTab {\n /** Tab ID */\n id: string\n /** Tab \u6807\u9898 */\n tab: string\n /** \u8BE5\u5206\u7EC4\u4E0B\u7684\u4EA7\u54C1\u6570\u636E */\n data: ProductCardData[]\n}\n\n/**\n * ActiveShelf \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface ActiveShelfData {\n theme?: 'light' | 'dark'\n /** \u7EC4\u4EF6\u6807\u9898 */\n title?: string\n /** \u7EC4\u4EF6\u63CF\u8FF0 */\n description?: string\n /** \u5206\u7EC4\u4EA7\u54C1Tab\u5217\u8868 */\n productsTab?: ProductTab[]\n /** \u662F\u5426\u663E\u793A Tab\uFF08\u9ED8\u8BA4\uFF1Atrue\uFF09 */\n isShowTab?: boolean\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n secondaryButtonFun: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n primaryButtonFun: ButtonFunctionType\n /** \u5E03\u5C40\u6A21\u5F0F\uFF1A\u7F51\u683C\u5E03\u5C40\u6216\u6A2A\u5411\u6ED1\u52A8 */\n layoutMode?: ActiveShelfLayoutMode\n /** Code Channel \u914D\u7F6E - \u6298\u6263\u524D\u7F00 */\n codeChannel?: CodeChannelConfig\n /** \u662F\u5426\u5C55\u793A\u4F1A\u5458\u4EF7\u683C */\n showMemberPrice?: boolean\n /** \u662F\u5426\u5C55\u793A\u6298\u6263\u6807\u7B7E */\n showDiscount?: boolean\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n stockDisplayMode?: StockDisplayMode\n /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n stockThresholdValue?: number\n /**\n * \u5E93\u5B58\u6587\u672C\u6A21\u677F\uFF0C\u652F\u6301 {count} \u5360\u4F4D\u7B26\n */\n stockDisplayText?: string\n /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n showOriginalPrice?: boolean\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n /**\n * \u4EA7\u54C1\u5217\u8868\uFF08\u5F53\u4E0D\u4F7F\u7528 Tab \u5206\u7EC4\u65F6\u53EF\u76F4\u63A5\u4F20\u5165\u4EA7\u54C1\u5217\u8868\uFF09\n */\n productsCard: ProductCardData[]\n}\n\nexport interface ActiveShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: ActiveShelfData\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n /**\n * \u539F\u4EF7\u533A\u57DF\u6E32\u67D3\u51FD\u6570\uFF0C\u7528\u4E8E\u5728\u539F\u4EF7\u4F4D\u7F6E\u5C55\u793A\u81EA\u5B9A\u4E49\u5185\u5BB9\uFF08\u5982 Save \u91D1\u989D\u6587\u6848\uFF09\u3002\n * \u4E0D\u4F20\u65F6\u4F7F\u7528\u9ED8\u8BA4\u7684\u539F\u4EF7\u6E32\u67D3\uFF08\u5212\u7EBF\u4EF7\uFF09\u3002\n * @param product - \u5F53\u524D\u4EA7\u54C1\u6570\u636E\n * @param context - \u6E32\u67D3\u4E0A\u4E0B\u6587\uFF08\u542B showOriginalPrice\uFF09\n */\n renderOriginalPrice?: (product: ProductCardData, context: { showOriginalPrice?: boolean }) => React.ReactNode\n}\n\n/**\n * ActiveShelf \u590D\u5408\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface ActiveShelfComponent extends React.ForwardRefExoticComponent<\n ActiveShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n /** \u72EC\u7ACB\u7684 ProductCard \u7EC4\u4EF6 */\n ProductCard: typeof ProductCard\n}\n\n/**\n * \u4EA7\u54C1\u5217\u8868\u7EC4\u4EF6 Props\n */\ninterface ProductsListProps {\n products: ProductCardData[]\n layoutMode: ActiveShelfLayoutMode\n className?: string\n copy?: CopyConfig\n showTags?: boolean\n stockDisplayMode?: StockDisplayMode\n stockThresholdValue?: number\n onLearnMore?: (product: ProductCardData) => void\n onShopNow?: (product: ProductCardData) => void\n onAddToCart?: (product: ProductCardData) => void\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n secondaryButtonText?: string\n secondaryButtonFun?: ButtonFunctionType\n primaryButtonText?: string\n primaryButtonFun?: ButtonFunctionType\n showOriginalPrice?: boolean\n renderOriginalPrice?: (product: ProductCardData, context: { showOriginalPrice?: boolean }) => React.ReactNode\n}\n\n/**\n * \u4EA7\u54C1\u5217\u8868\u7EC4\u4EF6 - \u652F\u6301\u7F51\u683C\u548C\u6A2A\u5411\u6ED1\u52A8\u4E24\u79CD\u5E03\u5C40\n */\nconst ProductsList = React.forwardRef<HTMLDivElement, ProductsListProps>(\n (\n {\n products,\n layoutMode,\n className,\n copy,\n showTags,\n stockDisplayMode,\n stockThresholdValue,\n onLearnMore,\n onShopNow,\n onAddToCart,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n showOriginalPrice,\n renderOriginalPrice,\n },\n ref\n ) => {\n // \u751F\u6210\u552F\u4E00 ID\uFF0C\u79FB\u9664\u7279\u6B8A\u5B57\u7B26\u4EE5\u786E\u4FDD\u53EF\u7528\u4E8E CSS \u9009\u62E9\u5668\n const id = React.useId().replace(/:/g, '')\n // \u9884\u5B9A\u4E49\u5BFC\u822A\u6309\u94AE\u9009\u62E9\u5668\uFF0C\u907F\u514D\u591A\u6B21\u62FC\u63A5\n const nextButtonClass = `swiper-button-next-custom-${id}`\n const prevButtonClass = `swiper-button-prev-custom-${id}`\n\n // Swiper \u5BFC\u822A\u72B6\u6001\n const [swiperState, setSwiperState] = React.useState({\n isBeginning: true,\n isEnd: false,\n })\n\n // Swiper \u5B9E\u4F8B\u5F15\u7528\n const swiperRef = React.useRef<any>(null)\n\n // \u8BA1\u7B97\u5E76\u8BBE\u7F6E\u6240\u6709 slide \u4E3A\u6700\u9AD8\u9AD8\u5EA6\n const equalizeSlideHeights = React.useCallback(() => {\n const swiper = swiperRef.current\n if (!swiper?.slides || swiper.slides.length === 0) return\n\n // \u5148\u91CD\u7F6E\u6240\u6709 slide \u9AD8\u5EA6\u4EE5\u83B7\u53D6\u771F\u5B9E\u5185\u5BB9\u9AD8\u5EA6\n swiper.slides.forEach((slide: HTMLElement) => {\n slide.style.height = 'auto'\n })\n\n // \u8BA1\u7B97\u6700\u5927\u9AD8\u5EA6\n // @ts-ignore\n const heights = Array.from(swiper.slides).map((slide: HTMLElement) => slide.scrollHeight)\n const maxHeight = Math.max(...heights)\n\n // \u8BBE\u7F6E\u6240\u6709 slide \u4E3A\u6700\u5927\u9AD8\u5EA6\n if (maxHeight > 0) {\n swiper.slides.forEach((slide: HTMLElement) => {\n slide.style.height = `${maxHeight}px`\n })\n }\n }, [])\n\n // \u76D1\u542C\u7A97\u53E3 resize \u91CD\u65B0\u8BA1\u7B97\u9AD8\u5EA6\n React.useEffect(() => {\n const handleResize = () => {\n // \u4F7F\u7528 requestAnimationFrame \u786E\u4FDD DOM \u66F4\u65B0\u5B8C\u6210\n requestAnimationFrame(equalizeSlideHeights)\n }\n\n window.addEventListener('resize', handleResize)\n return () => window.removeEventListener('resize', handleResize)\n }, [equalizeSlideHeights])\n\n if (products?.length === 0) {\n return null\n }\n\n return (\n <div ref={ref} className={className}>\n {layoutMode === 'flex' ? (\n /* \u7F51\u683C\u5E03\u5C40 */\n <div className=\"lg-desktop:gap-4 tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 laptop:gap-4 grid grid-cols-1 justify-start gap-3\">\n {products.map((product, index) => (\n <ProductCard\n key={product.shopify_id + '-' + product.sku || index}\n product={product}\n className=\"shrink-0\"\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n renderOriginalPrice={renderOriginalPrice}\n copy={copy}\n />\n ))}\n </div>\n ) : (\n /* Swiper \u6A2A\u5411\u6ED1\u52A8\u5E03\u5C40 */\n <div className=\"group relative\">\n <Swiper\n modules={[Navigation]}\n spaceBetween={16}\n slidesPerView=\"auto\"\n navigation={{\n nextEl: `.${nextButtonClass}`,\n prevEl: `.${prevButtonClass}`,\n }}\n onSwiper={swiper => {\n swiperRef.current = swiper\n setSwiperState({\n isBeginning: swiper.isBeginning,\n isEnd: swiper.isEnd,\n })\n // \u5EF6\u8FDF\u6267\u884C\u4EE5\u786E\u4FDD\u5185\u5BB9\u6E32\u67D3\u5B8C\u6210\n setTimeout(equalizeSlideHeights, 100)\n }}\n onReachEnd={() => {\n setSwiperState(prev => ({ ...prev, isEnd: true }))\n }}\n onReachBeginning={() => {\n setSwiperState(prev => ({ ...prev, isBeginning: true }))\n }}\n onFromEdge={() => {\n setSwiperState({ isBeginning: false, isEnd: false })\n }}\n className=\"!overflow-visible\"\n >\n {products.map((product, index) => (\n <SwiperSlide\n key={product.shopify_id + '-' + product.sku || index}\n className=\"tablet:!w-[288px] desktop:!w-[316px] lg-desktop:!w-[404px] !w-[296px] overflow-hidden\"\n >\n <ProductCard\n product={product}\n className=\"w-full max-w-full\"\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n renderOriginalPrice={renderOriginalPrice}\n copy={copy}\n />\n </SwiperSlide>\n ))}\n </Swiper>\n\n {/* \u81EA\u5B9A\u4E49\u5BFC\u822A\u6309\u94AE - \u9ED8\u8BA4\u9690\u85CF\uFF0Chover \u65F6\u663E\u793A\uFF0Cdisabled \u65F6\u9690\u85CF */}\n <button\n className={`${prevButtonClass} tablet:block absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${swiperState.isBeginning ? 'pointer-events-none opacity-0' : 'opacity-0 group-hover:opacity-100'}`}\n aria-label={copy?.previousSlideLabel}\n >\n <PrevIcon disabled={swiperState.isBeginning} />\n </button>\n <button\n className={`${nextButtonClass} tablet:block absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${swiperState.isEnd ? 'pointer-events-none opacity-0' : 'opacity-0 group-hover:opacity-100'}`}\n aria-label={copy?.nextSlideLabel}\n >\n <NextIcon disabled={swiperState.isEnd} />\n </button>\n </div>\n )}\n </div>\n )\n }\n)\n\nProductsList.displayName = 'ProductsList'\n\n/**\n * ActiveShelf - \u6D3B\u52A8\u8D27\u67B6\n *\n * @description \u80FD\u591F\u5B9E\u65F6\u663E\u793A\u5546\u54C1\u5E93\u5B58\u4FE1\u606F\u548C\u4F1A\u5458\u4EF7\u7684\u8D27\u67B6\uFF0C\u652F\u6301\u54CD\u5E94\u5F0F\u5E03\u5C40\u548C\u591A\u79CD\u914D\u7F6E\u9009\u9879\n */\nconst ActiveShelf = React.forwardRef<HTMLDivElement, ActiveShelfProps>(\n ({ className, data, onLearnMore, onShopNow, onAddToCart, classNames, renderOriginalPrice, ...props }, ref) => {\n const boxRef = React.useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: data.title,\n componentDescription: data.description,\n })\n\n React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n // \u4ECE data \u4E2D\u89E3\u6784\u914D\u7F6E\u9879\uFF0C\u5E76\u8BBE\u7F6E\u9ED8\u8BA4\u503C\n const {\n theme = 'light',\n layoutMode = 'flex',\n showTags = true,\n stockDisplayMode,\n stockThresholdValue,\n showOriginalPrice = true,\n secondaryButtonText,\n primaryButtonText,\n secondaryButtonFun,\n primaryButtonFun,\n isShowTab = true,\n copy,\n } = data\n\n // \u6784\u5EFA copy \u914D\u7F6E\uFF0C\u4F7F\u7528\u4F20\u5165\u7684 copy \u914D\u7F6E\n const finalCopy: CopyConfig = copy || {}\n\n // \u83B7\u53D6\u8981\u663E\u793A\u7684\u4EA7\u54C1\u6570\u636E\n const hasTabData = data.productsTab && data.productsTab.length > 0\n const shouldShowTab = isShowTab && hasTabData\n\n return (\n <div\n ref={boxRef}\n className={cn(\n 'w-full',\n {\n 'aiui-dark': theme === 'dark',\n },\n className,\n classNames?.root\n )}\n style={\n {\n '--progress-track-bg': theme === 'dark' ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)',\n } as React.CSSProperties\n }\n {...props}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n {data.title && (\n <Heading as=\"h2\" html={data.title} size={4} className={cn('text-info-primary mb-4', classNames?.title)} />\n )}\n {data.description && (\n <Text\n size={3}\n as=\"p\"\n html={data.description}\n className={cn('text-info-primary mb-6', classNames?.description)}\n />\n )}\n\n {/* \u4EA7\u54C1\u5C55\u793A\u533A\u57DF */}\n\n <Tabs defaultValue={data.productsTab?.[0]?.id} className=\"w-full\">\n {shouldShowTab && (\n <TabsList className=\"mb-6\">\n {data.productsTab?.map(tab => (\n <TabsTrigger key={'tab-' + tab.id} value={tab.id}>\n {tab.tab}\n </TabsTrigger>\n ))}\n </TabsList>\n )}\n {shouldShowTab ? (\n data.productsTab?.map(tab => (\n <TabsContent key={'tab-content-' + tab.id} value={tab.id}>\n <ProductsList\n products={tab.data}\n layoutMode={layoutMode}\n copy={finalCopy}\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n renderOriginalPrice={renderOriginalPrice}\n />\n </TabsContent>\n ))\n ) : (\n <ProductsList\n products={data.productsCard}\n layoutMode={layoutMode}\n copy={finalCopy}\n showTags={showTags}\n stockDisplayMode={stockDisplayMode}\n stockThresholdValue={stockThresholdValue}\n onLearnMore={onLearnMore}\n onShopNow={onShopNow}\n onAddToCart={onAddToCart}\n classNames={classNames}\n secondaryButtonText={secondaryButtonText}\n secondaryButtonFun={secondaryButtonFun}\n primaryButtonText={primaryButtonText}\n primaryButtonFun={primaryButtonFun}\n showOriginalPrice={showOriginalPrice}\n renderOriginalPrice={renderOriginalPrice}\n />\n )}\n </Tabs>\n </div>\n )\n }\n)\n\nActiveShelf.displayName = 'ActiveShelf'\n\n// \u521B\u5EFA\u590D\u5408\u7EC4\u4EF6\nconst ActiveShelfWithProductCard = ActiveShelf as ActiveShelfComponent\nActiveShelfWithProductCard.ProductCard = ProductCard\n\nconst ActiveShelfWrapped = withLayout(ActiveShelfWithProductCard)\n\nexport default ActiveShelfWrapped\nexport type { StockDisplayMode, ActiveShelfSemanticName, ProductCardData }\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "cn", "withLayout", "Text", "Heading", "Tabs", "TabsList", "TabsTrigger", "TabsContent", "Swiper", "SwiperSlide", "Navigation", "ProductCard", "useExposure", "componentType", "componentName", "PrevIcon", "disabled", "NextIcon", "ProductsList", "products", "layoutMode", "className", "copy", "showTags", "stockDisplayMode", "stockThresholdValue", "onLearnMore", "onShopNow", "onAddToCart", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "showOriginalPrice", "renderOriginalPrice", "ref", "id", "nextButtonClass", "prevButtonClass", "swiperState", "setSwiperState", "swiperRef", "equalizeSlideHeights", "swiper", "slide", "heights", "maxHeight", "handleResize", "product", "index", "prev", "ActiveShelf", "data", "props", "boxRef", "theme", "isShowTab", "finalCopy", "hasTabData", "shouldShowTab", "tab", "ActiveShelfWithProductCard", "ActiveShelfWrapped", "ActiveShelf_default"]
7
7
  }
@@ -16,6 +16,12 @@ export interface PriceAndActionsProps extends React.HTMLAttributes<HTMLDivElemen
16
16
  trackingDescription?: string;
17
17
  trackingSku?: string;
18
18
  classNames?: Partial<Record<BuyOneGetOneShelfProductCardSemanticName, string>>;
19
+ /**
20
+ * 原价区域渲染函数,用于在原价位置展示自定义内容(如 Save 金额文案)。
21
+ * 不传时使用默认的原价渲染(划线价)。
22
+ * @param originalPrice - 格式化后的原价文本
23
+ */
24
+ renderOriginalPrice?: (originalPrice: string | undefined) => React.ReactNode;
19
25
  }
20
26
  declare const PriceAndActions: React.ForwardRefExoticComponent<PriceAndActionsProps & React.RefAttributes<HTMLDivElement>>;
21
27
  export default PriceAndActions;
@@ -1,2 +1,2 @@
1
- "use client";import{Fragment as O,jsx as t,jsxs as r}from"react/jsx-runtime";import*as C from"react";import{cn as e}from"../../helpers/index.js";import m from"../../components/button.js";import{Text as u}from"../../components/text.js";import{Heading as g}from"../../components/index.js";const x=C.forwardRef(({currentPrice:f,originalPrice:i,priceLabel:n,learnMoreText:o="Learn More",shopNowText:s="Shop Now",soldOutText:h="Sold out",onLearnMore:y,onShopNow:P,availableForSale:l,learnMoreLoading:N,shopNowLoading:v,className:b,trackingTitle:d,trackingDescription:c,trackingSku:p,classNames:a},w)=>r("div",{ref:w,className:e("flex w-full flex-col justify-center gap-2",b),children:[t("div",{className:"flex w-full items-center gap-2",children:l?r(O,{children:[t(g,{size:2,className:e("text-info-primary"),children:f}),i&&t(g,{size:2,className:e("text-info-tertiary line-through",a?.productCardOriginalPrice),children:i})]}):t(u,{size:4,className:e("text-info-primary text-2xl leading-[1.2] tracking-[-0.48px]","tablet:text-xl tablet:tracking-[-0.4px]"),children:h})}),n&&t(u,{size:4,className:e("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",a?.productCardPriceLabel),children:n}),r("div",{className:e("flex w-full items-stretch gap-3","tablet:gap-2"),children:[t(m,{variant:"secondary",size:"lg",onClick:y,loading:N,className:e("min-w-0 flex-1 whitespace-normal text-center",a?.productCardBtnGroup),"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${d||""}#${c||""}#${o}`,"data-headless-sku":p,children:o}),t(m,{variant:"primary",size:"lg",onClick:P,disabled:!l,loading:v,className:e("min-w-0 flex-1 whitespace-normal text-center",a?.productCardBtnGroup),"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${d||""}#${c||""}#${s}`,"data-headless-sku":p,children:s})]})]}));x.displayName="PriceAndActions";var L=x;export{L as default};
1
+ "use client";import{Fragment as k,jsx as t,jsxs as i}from"react/jsx-runtime";import*as O from"react";import{cn as e}from"../../helpers/index.js";import u from"../../components/button.js";import{Text as g}from"../../components/text.js";import{Heading as x}from"../../components/index.js";const f=O.forwardRef(({currentPrice:h,originalPrice:r,priceLabel:n,learnMoreText:o="Learn More",shopNowText:s="Shop Now",soldOutText:y="Sold out",onLearnMore:N,onShopNow:P,availableForSale:d,learnMoreLoading:v,shopNowLoading:b,className:w,trackingTitle:l,trackingDescription:c,trackingSku:p,classNames:a,renderOriginalPrice:m},C)=>i("div",{ref:C,className:e("flex w-full flex-col justify-center gap-2",w),children:[t("div",{className:"flex w-full items-center gap-2",children:d?i(k,{children:[t(x,{size:2,className:e("text-info-primary"),children:h}),m?m(r):r&&t(x,{size:2,className:e("text-info-tertiary line-through",a?.productCardOriginalPrice),children:r})]}):t(g,{size:4,className:e("text-info-primary text-2xl leading-[1.2] tracking-[-0.48px]","tablet:text-xl tablet:tracking-[-0.4px]"),children:y})}),n&&t(g,{size:4,className:e("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",a?.productCardPriceLabel),children:n}),i("div",{className:e("flex w-full items-stretch gap-3","tablet:gap-2"),children:[t(u,{variant:"secondary",size:"lg",onClick:N,loading:v,className:e("min-w-0 flex-1 whitespace-normal text-center",a?.productCardBtnGroup),"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${l||""}#${c||""}#${o}`,"data-headless-sku":p,children:o}),t(u,{variant:"primary",size:"lg",onClick:P,disabled:!d,loading:b,className:e("min-w-0 flex-1 whitespace-normal text-center",a?.productCardBtnGroup),"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${l||""}#${c||""}#${s}`,"data-headless-sku":p,children:s})]})]}));f.displayName="PriceAndActions";var T=f;export{T as default};
2
2
  //# sourceMappingURL=PriceAndActions.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/BuyOneGetOneShelf/PriceAndActions.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport Button from '../../components/button.js'\nimport { Text } from '../../components/text.js'\nimport { Heading } from '../../components/index.js'\nimport type { BuyOneGetOneShelfProductCardSemanticName } from './types.js'\n\nexport interface PriceAndActionsProps extends React.HTMLAttributes<HTMLDivElement> {\n currentPrice: string\n originalPrice?: string\n priceLabel?: string\n learnMoreText?: string\n shopNowText?: string\n soldOutText?: string\n onLearnMore?: () => void\n onShopNow?: () => void\n availableForSale: boolean\n learnMoreLoading?: boolean\n shopNowLoading?: boolean\n trackingTitle?: string\n trackingDescription?: string\n trackingSku?: string\n classNames?: Partial<Record<BuyOneGetOneShelfProductCardSemanticName, string>>\n}\n\nconst PriceAndActions = React.forwardRef<HTMLDivElement, PriceAndActionsProps>(\n (\n {\n currentPrice,\n originalPrice,\n priceLabel,\n learnMoreText = 'Learn More',\n shopNowText = 'Shop Now',\n soldOutText = 'Sold out',\n onLearnMore,\n onShopNow,\n availableForSale,\n learnMoreLoading,\n shopNowLoading,\n className,\n trackingTitle,\n trackingDescription,\n trackingSku,\n classNames,\n },\n ref\n ) => {\n return (\n <div ref={ref} className={cn('flex w-full flex-col justify-center gap-2', className)}>\n <div className=\"flex w-full items-center gap-2\">\n {availableForSale ? (\n <>\n <Heading size={2} className={cn('text-info-primary')}>\n {currentPrice}\n </Heading>\n {originalPrice && (\n <Heading\n size={2}\n className={cn('text-info-tertiary line-through', classNames?.productCardOriginalPrice)}\n >\n {originalPrice}\n </Heading>\n )}\n </>\n ) : (\n <Text\n size={4}\n className={cn(\n 'text-info-primary text-2xl leading-[1.2] tracking-[-0.48px]',\n 'tablet:text-xl tablet:tracking-[-0.4px]'\n )}\n >\n {soldOutText}\n </Text>\n )}\n </div>\n\n {priceLabel && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]',\n classNames?.productCardPriceLabel\n )}\n >\n {priceLabel}\n </Text>\n )}\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className={cn('flex w-full items-stretch gap-3', 'tablet:gap-2')}>\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={onLearnMore}\n loading={learnMoreLoading}\n className={cn('min-w-0 flex-1 whitespace-normal text-center', classNames?.productCardBtnGroup)}\n data-headless-type-name=\"BuyOneGetOneShelf#ProductCard\"\n data-headless-title-desc-button={`${trackingTitle || ''}#${trackingDescription || ''}#${learnMoreText}`}\n data-headless-sku={trackingSku}\n >\n {learnMoreText}\n </Button>\n <Button\n variant=\"primary\"\n size=\"lg\"\n onClick={onShopNow}\n disabled={!availableForSale}\n loading={shopNowLoading}\n className={cn('min-w-0 flex-1 whitespace-normal text-center', classNames?.productCardBtnGroup)}\n data-headless-type-name=\"BuyOneGetOneShelf#ProductCard\"\n data-headless-title-desc-button={`${trackingTitle || ''}#${trackingDescription || ''}#${shopNowText}`}\n data-headless-sku={trackingSku}\n >\n {shopNowText}\n </Button>\n </div>\n </div>\n )\n }\n)\n\nPriceAndActions.displayName = 'PriceAndActions'\n\nexport default PriceAndActions\n"],
5
- "mappings": "aAqDY,mBAAAA,EACE,OAAAC,EADF,QAAAC,MAAA,oBAnDZ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAY,6BACnB,OAAS,QAAAC,MAAY,2BACrB,OAAS,WAAAC,MAAe,4BAqBxB,MAAMC,EAAkBL,EAAM,WAC5B,CACE,CACE,aAAAM,EACA,cAAAC,EACA,WAAAC,EACA,cAAAC,EAAgB,aAChB,YAAAC,EAAc,WACd,YAAAC,EAAc,WACd,YAAAC,EACA,UAAAC,EACA,iBAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,UAAAC,EACA,cAAAC,EACA,oBAAAC,EACA,YAAAC,EACA,WAAAC,CACF,EACAC,IAGEvB,EAAC,OAAI,IAAKuB,EAAK,UAAWrB,EAAG,4CAA6CgB,CAAS,EACjF,UAAAnB,EAAC,OAAI,UAAU,iCACZ,SAAAgB,EACCf,EAAAF,EAAA,CACE,UAAAC,EAACM,EAAA,CAAQ,KAAM,EAAG,UAAWH,EAAG,mBAAmB,EAChD,SAAAK,EACH,EACCC,GACCT,EAACM,EAAA,CACC,KAAM,EACN,UAAWH,EAAG,kCAAmCoB,GAAY,wBAAwB,EAEpF,SAAAd,EACH,GAEJ,EAEAT,EAACK,EAAA,CACC,KAAM,EACN,UAAWF,EACT,8DACA,yCACF,EAEC,SAAAU,EACH,EAEJ,EAECH,GACCV,EAACK,EAAA,CACC,KAAM,EACN,UAAWF,EACT,0EACAoB,GAAY,qBACd,EAEC,SAAAb,EACH,EAIFT,EAAC,OAAI,UAAWE,EAAG,kCAAmC,cAAc,EAClE,UAAAH,EAACI,EAAA,CACC,QAAQ,YACR,KAAK,KACL,QAASU,EACT,QAASG,EACT,UAAWd,EAAG,+CAAgDoB,GAAY,mBAAmB,EAC7F,0BAAwB,gCACxB,kCAAiC,GAAGH,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIV,CAAa,GACrG,oBAAmBW,EAElB,SAAAX,EACH,EACAX,EAACI,EAAA,CACC,QAAQ,UACR,KAAK,KACL,QAASW,EACT,SAAU,CAACC,EACX,QAASE,EACT,UAAWf,EAAG,+CAAgDoB,GAAY,mBAAmB,EAC7F,0BAAwB,gCACxB,kCAAiC,GAAGH,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIT,CAAW,GACnG,oBAAmBU,EAElB,SAAAV,EACH,GACF,GACF,CAGN,EAEAL,EAAgB,YAAc,kBAE9B,IAAOkB,EAAQlB",
6
- "names": ["Fragment", "jsx", "jsxs", "React", "cn", "Button", "Text", "Heading", "PriceAndActions", "currentPrice", "originalPrice", "priceLabel", "learnMoreText", "shopNowText", "soldOutText", "onLearnMore", "onShopNow", "availableForSale", "learnMoreLoading", "shopNowLoading", "className", "trackingTitle", "trackingDescription", "trackingSku", "classNames", "ref", "PriceAndActions_default"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport Button from '../../components/button.js'\nimport { Text } from '../../components/text.js'\nimport { Heading } from '../../components/index.js'\nimport type { BuyOneGetOneShelfProductCardSemanticName } from './types.js'\n\nexport interface PriceAndActionsProps extends React.HTMLAttributes<HTMLDivElement> {\n currentPrice: string\n originalPrice?: string\n priceLabel?: string\n learnMoreText?: string\n shopNowText?: string\n soldOutText?: string\n onLearnMore?: () => void\n onShopNow?: () => void\n availableForSale: boolean\n learnMoreLoading?: boolean\n shopNowLoading?: boolean\n trackingTitle?: string\n trackingDescription?: string\n trackingSku?: string\n classNames?: Partial<Record<BuyOneGetOneShelfProductCardSemanticName, string>>\n /**\n * \u539F\u4EF7\u533A\u57DF\u6E32\u67D3\u51FD\u6570\uFF0C\u7528\u4E8E\u5728\u539F\u4EF7\u4F4D\u7F6E\u5C55\u793A\u81EA\u5B9A\u4E49\u5185\u5BB9\uFF08\u5982 Save \u91D1\u989D\u6587\u6848\uFF09\u3002\n * \u4E0D\u4F20\u65F6\u4F7F\u7528\u9ED8\u8BA4\u7684\u539F\u4EF7\u6E32\u67D3\uFF08\u5212\u7EBF\u4EF7\uFF09\u3002\n * @param originalPrice - \u683C\u5F0F\u5316\u540E\u7684\u539F\u4EF7\u6587\u672C\n */\n renderOriginalPrice?: (originalPrice: string | undefined) => React.ReactNode\n}\n\nconst PriceAndActions = React.forwardRef<HTMLDivElement, PriceAndActionsProps>(\n (\n {\n currentPrice,\n originalPrice,\n priceLabel,\n learnMoreText = 'Learn More',\n shopNowText = 'Shop Now',\n soldOutText = 'Sold out',\n onLearnMore,\n onShopNow,\n availableForSale,\n learnMoreLoading,\n shopNowLoading,\n className,\n trackingTitle,\n trackingDescription,\n trackingSku,\n classNames,\n renderOriginalPrice,\n },\n ref\n ) => {\n return (\n <div ref={ref} className={cn('flex w-full flex-col justify-center gap-2', className)}>\n <div className=\"flex w-full items-center gap-2\">\n {availableForSale ? (\n <>\n <Heading size={2} className={cn('text-info-primary')}>\n {currentPrice}\n </Heading>\n {renderOriginalPrice\n ? renderOriginalPrice(originalPrice)\n : originalPrice && (\n <Heading\n size={2}\n className={cn('text-info-tertiary line-through', classNames?.productCardOriginalPrice)}\n >\n {originalPrice}\n </Heading>\n )}\n </>\n ) : (\n <Text\n size={4}\n className={cn(\n 'text-info-primary text-2xl leading-[1.2] tracking-[-0.48px]',\n 'tablet:text-xl tablet:tracking-[-0.4px]'\n )}\n >\n {soldOutText}\n </Text>\n )}\n </div>\n\n {priceLabel && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]',\n classNames?.productCardPriceLabel\n )}\n >\n {priceLabel}\n </Text>\n )}\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className={cn('flex w-full items-stretch gap-3', 'tablet:gap-2')}>\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={onLearnMore}\n loading={learnMoreLoading}\n className={cn('min-w-0 flex-1 whitespace-normal text-center', classNames?.productCardBtnGroup)}\n data-headless-type-name=\"BuyOneGetOneShelf#ProductCard\"\n data-headless-title-desc-button={`${trackingTitle || ''}#${trackingDescription || ''}#${learnMoreText}`}\n data-headless-sku={trackingSku}\n >\n {learnMoreText}\n </Button>\n <Button\n variant=\"primary\"\n size=\"lg\"\n onClick={onShopNow}\n disabled={!availableForSale}\n loading={shopNowLoading}\n className={cn('min-w-0 flex-1 whitespace-normal text-center', classNames?.productCardBtnGroup)}\n data-headless-type-name=\"BuyOneGetOneShelf#ProductCard\"\n data-headless-title-desc-button={`${trackingTitle || ''}#${trackingDescription || ''}#${shopNowText}`}\n data-headless-sku={trackingSku}\n >\n {shopNowText}\n </Button>\n </div>\n </div>\n )\n }\n)\n\nPriceAndActions.displayName = 'PriceAndActions'\n\nexport default PriceAndActions\n"],
5
+ "mappings": "aA4DY,mBAAAA,EACE,OAAAC,EADF,QAAAC,MAAA,oBA1DZ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAOC,MAAY,6BACnB,OAAS,QAAAC,MAAY,2BACrB,OAAS,WAAAC,MAAe,4BA2BxB,MAAMC,EAAkBL,EAAM,WAC5B,CACE,CACE,aAAAM,EACA,cAAAC,EACA,WAAAC,EACA,cAAAC,EAAgB,aAChB,YAAAC,EAAc,WACd,YAAAC,EAAc,WACd,YAAAC,EACA,UAAAC,EACA,iBAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,UAAAC,EACA,cAAAC,EACA,oBAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,CACF,EACAC,IAGExB,EAAC,OAAI,IAAKwB,EAAK,UAAWtB,EAAG,4CAA6CgB,CAAS,EACjF,UAAAnB,EAAC,OAAI,UAAU,iCACZ,SAAAgB,EACCf,EAAAF,EAAA,CACE,UAAAC,EAACM,EAAA,CAAQ,KAAM,EAAG,UAAWH,EAAG,mBAAmB,EAChD,SAAAK,EACH,EACCgB,EACGA,EAAoBf,CAAa,EACjCA,GACET,EAACM,EAAA,CACC,KAAM,EACN,UAAWH,EAAG,kCAAmCoB,GAAY,wBAAwB,EAEpF,SAAAd,EACH,GAER,EAEAT,EAACK,EAAA,CACC,KAAM,EACN,UAAWF,EACT,8DACA,yCACF,EAEC,SAAAU,EACH,EAEJ,EAECH,GACCV,EAACK,EAAA,CACC,KAAM,EACN,UAAWF,EACT,0EACAoB,GAAY,qBACd,EAEC,SAAAb,EACH,EAIFT,EAAC,OAAI,UAAWE,EAAG,kCAAmC,cAAc,EAClE,UAAAH,EAACI,EAAA,CACC,QAAQ,YACR,KAAK,KACL,QAASU,EACT,QAASG,EACT,UAAWd,EAAG,+CAAgDoB,GAAY,mBAAmB,EAC7F,0BAAwB,gCACxB,kCAAiC,GAAGH,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIV,CAAa,GACrG,oBAAmBW,EAElB,SAAAX,EACH,EACAX,EAACI,EAAA,CACC,QAAQ,UACR,KAAK,KACL,QAASW,EACT,SAAU,CAACC,EACX,QAASE,EACT,UAAWf,EAAG,+CAAgDoB,GAAY,mBAAmB,EAC7F,0BAAwB,gCACxB,kCAAiC,GAAGH,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIT,CAAW,GACnG,oBAAmBU,EAElB,SAAAV,EACH,GACF,GACF,CAGN,EAEAL,EAAgB,YAAc,kBAE9B,IAAOmB,EAAQnB",
6
+ "names": ["Fragment", "jsx", "jsxs", "React", "cn", "Button", "Text", "Heading", "PriceAndActions", "currentPrice", "originalPrice", "priceLabel", "learnMoreText", "shopNowText", "soldOutText", "onLearnMore", "onShopNow", "availableForSale", "learnMoreLoading", "shopNowLoading", "className", "trackingTitle", "trackingDescription", "trackingSku", "classNames", "renderOriginalPrice", "ref", "PriceAndActions_default"]
7
7
  }
@@ -31,6 +31,12 @@ export interface ProductCardProps extends React.HTMLAttributes<HTMLDivElement> {
31
31
  onGiftSelectionChange?: (selectedGifts: FreeGift[], product: ProductCardData) => void;
32
32
  /** 选中赠品SKU变化回调(受控组件) */
33
33
  onSelectedGiftSkuChange?: (selectedSku: string | null) => void;
34
+ /**
35
+ * 原价区域渲染函数,用于在原价位置展示自定义内容(如 Save 金额文案)。
36
+ * 不传时使用默认的原价渲染(划线价)。
37
+ * @param originalPrice - 格式化后的原价文本
38
+ */
39
+ renderOriginalPrice?: (originalPrice: string | undefined) => React.ReactNode;
34
40
  }
35
41
  /**
36
42
  * ProductCard - 买赠货架产品卡片
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as a,jsxs as v}from"react/jsx-runtime";import*as n from"react";import{cn as y}from"../../helpers/index.js";import $ from"./ProductImage.js";import q from"./ProductInfo.js";import J from"./GiftSelection.js";import K from"./PriceAndActions.js";import{BuyOneGetOneShelfContext as Q}from"./context.js";const w=n.forwardRef(({productData:e,gifts:r=[],giftType:i=1,selectedGiftSku:L,sceneImages:g,tags:F,layout:N,className:M,onProductClick:p,onProductImageClick:h,onLearnMore:O,onShopNow:I,onGiftClick:G,onGiftSelectionChange:T,classNames:S,soldOutText:H,...B},R)=>{const{layout:j,theme:z}=n.useContext(Q),u=N??j,[A,P]=n.useState(!1),[E,x]=n.useState(!1),[b,d]=n.useState(()=>!r||r.length===0?[]:i===2?r.map(t=>t.id):[r[0].id]),c=n.useMemo(()=>r?r.map(t=>({...t,selected:b.includes(t.id)})):[],[r,b]);n.useEffect(()=>{if(!r||r.length===0){d([]);return}d(i===2?r.map(t=>t.id):t=>{const o=t[0];return o&&r.some(m=>m.id===o)?[o]:[r[0].id]})},[r,i]);const s=n.useMemo(()=>({...e,gifts:r,gift_type:i}),[e,r,i]),W=t=>{if(i===2){const o=c.filter(l=>l.selected);G?.(t,o);return}d(()=>{const o=[t.id],l=r?.filter(m=>o.includes(m.id))||[];return G?.(t,l),T?.(l,s),o})},f=!!(h??p),C=`/products/${e.handle}`,k=()=>{(h??p)?.(s)},V=async()=>{const t=c.filter(o=>o.selected);P(!0);try{await O?.(s,t)}finally{P(!1)}},_=async()=>{const t=c.filter(o=>o.selected);x(!0);try{await I?.(s,t)}finally{x(!1)}};return v("div",{ref:R,className:y("bg-container-primary rounded-box flex items-stretch overflow-hidden",u==="horizontal"?["laptop:flex-row lg-desktop:min-h-[560px] desktop:min-h-[448px] tablet:min-h-[526px] min-h-[610px] flex-col","laptop:col-span-2"]:["flex-col justify-between"],M),...B,children:[a($,{images:g,name:e.name,layout:u,tags:e.tags||F,onClick:f?k:void 0,href:f?void 0:C}),a("div",{className:y("bg-container-primary desktop:p-6 flex flex-col justify-between p-4",u==="horizontal"?["rounded-r-box laptop:rounded-r-box tablet:rounded-b-box tablet:rounded-l-none","laptop:basis-[39.1%]","desktop:basis-[42.1%]","lg-desktop:basis-[42.1%]","shrink-0"]:["rounded-b-box","w-full","grow"]),children:v("div",{className:"flex flex-1 flex-col justify-between gap-6",children:[a(q,{name:e.name,onClick:f?k:void 0,href:f?void 0:C,description:e.description,classNames:S}),a(J,{freeGiftLabel:e.freeGiftLabel,freeGifts:c,onGiftClick:W,giftType:i,selectedGiftSku:L,theme:z}),a(K,{currentPrice:e.currentPrice??"",originalPrice:e.originalPrice,priceLabel:e.priceLabel,learnMoreText:e.learnMoreText,shopNowText:e.shopNowText,soldOutText:H,onLearnMore:V,onShopNow:_,availableForSale:e.availableForSale,learnMoreLoading:A,shopNowLoading:E,trackingTitle:e.name,trackingDescription:e.description,trackingSku:e.sku,classNames:S})]})})]})});w.displayName="BuyOneGetOneShelf.ProductCard";var te=w;export{te as default};
1
+ "use client";import{jsx as a,jsxs as w}from"react/jsx-runtime";import*as n from"react";import{cn as y}from"../../helpers/index.js";import q from"./ProductImage.js";import J from"./ProductInfo.js";import K from"./GiftSelection.js";import Q from"./PriceAndActions.js";import{BuyOneGetOneShelfContext as U}from"./context.js";const g=n.forwardRef(({productData:e,gifts:r=[],giftType:i=1,selectedGiftSku:v,sceneImages:L,tags:F,layout:N,className:M,onProductClick:p,onProductImageClick:h,onLearnMore:O,onShopNow:I,onGiftClick:G,onGiftSelectionChange:T,classNames:P,soldOutText:R,renderOriginalPrice:H,...B},j)=>{const{layout:z,theme:A}=n.useContext(U),u=N??z,[E,S]=n.useState(!1),[W,x]=n.useState(!1),[b,d]=n.useState(()=>!r||r.length===0?[]:i===2?r.map(t=>t.id):[r[0].id]),c=n.useMemo(()=>r?r.map(t=>({...t,selected:b.includes(t.id)})):[],[r,b]);n.useEffect(()=>{if(!r||r.length===0){d([]);return}d(i===2?r.map(t=>t.id):t=>{const o=t[0];return o&&r.some(m=>m.id===o)?[o]:[r[0].id]})},[r,i]);const s=n.useMemo(()=>({...e,gifts:r,gift_type:i}),[e,r,i]),V=t=>{if(i===2){const o=c.filter(l=>l.selected);G?.(t,o);return}d(()=>{const o=[t.id],l=r?.filter(m=>o.includes(m.id))||[];return G?.(t,l),T?.(l,s),o})},f=!!(h??p),C=`/products/${e.handle}`,k=()=>{(h??p)?.(s)},_=async()=>{const t=c.filter(o=>o.selected);S(!0);try{await O?.(s,t)}finally{S(!1)}},$=async()=>{const t=c.filter(o=>o.selected);x(!0);try{await I?.(s,t)}finally{x(!1)}};return w("div",{ref:j,className:y("bg-container-primary rounded-box flex items-stretch overflow-hidden",u==="horizontal"?["laptop:flex-row lg-desktop:min-h-[560px] desktop:min-h-[448px] tablet:min-h-[526px] min-h-[610px] flex-col","laptop:col-span-2"]:["flex-col justify-between"],M),...B,children:[a(q,{images:L,name:e.name,layout:u,tags:e.tags||F,onClick:f?k:void 0,href:f?void 0:C}),a("div",{className:y("bg-container-primary desktop:p-6 flex flex-col justify-between p-4",u==="horizontal"?["rounded-r-box laptop:rounded-r-box tablet:rounded-b-box tablet:rounded-l-none","laptop:basis-[39.1%]","desktop:basis-[42.1%]","lg-desktop:basis-[42.1%]","shrink-0"]:["rounded-b-box","w-full","grow"]),children:w("div",{className:"flex flex-1 flex-col justify-between gap-6",children:[a(J,{name:e.name,onClick:f?k:void 0,href:f?void 0:C,description:e.description,classNames:P}),a(K,{freeGiftLabel:e.freeGiftLabel,freeGifts:c,onGiftClick:V,giftType:i,selectedGiftSku:v,theme:A}),a(Q,{currentPrice:e.currentPrice??"",originalPrice:e.originalPrice,priceLabel:e.priceLabel,learnMoreText:e.learnMoreText,shopNowText:e.shopNowText,soldOutText:R,onLearnMore:_,onShopNow:$,availableForSale:e.availableForSale,learnMoreLoading:E,shopNowLoading:W,trackingTitle:e.name,trackingDescription:e.description,trackingSku:e.sku,classNames:P,renderOriginalPrice:H})]})})]})});g.displayName="BuyOneGetOneShelf.ProductCard";var re=g;export{re as default};
2
2
  //# sourceMappingURL=ProductCard.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/BuyOneGetOneShelf/ProductCard.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport ProductImage from './ProductImage.js'\nimport ProductInfo from './ProductInfo.js'\nimport GiftSelection from './GiftSelection.js'\nimport PriceAndActions from './PriceAndActions.js'\nimport { BuyOneGetOneShelfContext } from './context.js'\nimport type {\n FreeGift,\n FreeGiftWithSelection,\n ProductCardData,\n PureProductData,\n ProductTag,\n BuyOneGetOneShelfProductCardSemanticName,\n} from './types.js'\n\nexport interface ProductCardProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4EA7\u54C1\u6570\u636E\uFF08\u4E0D\u5305\u542B\u8D60\u54C1\u4FE1\u606F\uFF09 */\n productData: PureProductData\n /** \u8D60\u54C1\u5217\u8868 */\n gifts?: FreeGift[]\n /** \u8D60\u54C1\u7C7B\u578B 1-> \u8D60\u9001\u5176\u4E2D\u4E00\u4E2A\u8D60\u54C1\uFF0C 2 -> \u8D60\u9001\u6240\u6709\u8D60\u54C1 */\n giftType?: 1 | 2\n /** \u573A\u666F\u56FE\u7247 */\n sceneImages: any\n /** \u4EA7\u54C1\u6807\u7B7E */\n tags?: ProductTag[]\n /** \u5F53\u524D\u9009\u4E2D\u7684\u8D60\u54C1SKU\uFF08\u53D7\u63A7\u7EC4\u4EF6\uFF09 */\n selectedGiftSku?: string\n /** @deprecated Layout is now automatically inferred by Root based on children count. */\n layout?: 'horizontal' | 'vertical'\n classNames?: Partial<Record<BuyOneGetOneShelfProductCardSemanticName, string>>\n soldOutText?: string\n /** @deprecated Use `onProductImageClick` instead. */\n onProductClick?: (product: ProductCardData) => void\n /** \u4EA7\u54C1\u56FE\u7247\u70B9\u51FB\u56DE\u8C03 */\n onProductImageClick?: (product: ProductCardData) => void\n /** Learn More \u70B9\u51FB\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData, selectedGifts: FreeGift[]) => void\n /** Shop Now \u70B9\u51FB\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData, selectedGifts: FreeGift[]) => void\n /** \u8D60\u54C1\u70B9\u51FB\u56DE\u8C03 */\n onGiftClick?: (gift: FreeGift, selectedGifts: FreeGift[]) => void\n /** \u8D60\u54C1\u9009\u62E9\u53D8\u5316\u56DE\u8C03 */\n onGiftSelectionChange?: (selectedGifts: FreeGift[], product: ProductCardData) => void\n /** \u9009\u4E2D\u8D60\u54C1SKU\u53D8\u5316\u56DE\u8C03\uFF08\u53D7\u63A7\u7EC4\u4EF6\uFF09 */\n onSelectedGiftSkuChange?: (selectedSku: string | null) => void\n}\n\n/**\n * ProductCard - \u4E70\u8D60\u8D27\u67B6\u4EA7\u54C1\u5361\u7247\n *\n * @description \u7528\u4E8E\u4E70\u4E00\u8D60\u4E00\u6D3B\u52A8\u7684\u4EA7\u54C1\u5C55\u793A\u5361\u7247\uFF0C\u5DE6\u4FA7\u5C55\u793A\u4EA7\u54C1\u56FE\u7247\u548C\u6807\u7B7E\uFF0C\u53F3\u4FA7\u5C55\u793A\u4EA7\u54C1\u4FE1\u606F\u3001\u8D60\u54C1\u548C\u8D2D\u4E70\u6309\u94AE\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n productData,\n gifts = [],\n giftType = 1,\n selectedGiftSku,\n sceneImages,\n tags,\n layout: layoutProp,\n className,\n onProductClick,\n onProductImageClick,\n onLearnMore,\n onShopNow,\n onGiftClick,\n onGiftSelectionChange,\n classNames,\n soldOutText,\n ...props\n },\n ref\n ) => {\n const { layout: contextLayout, theme } = React.useContext(BuyOneGetOneShelfContext)\n const layout = layoutProp ?? contextLayout\n\n const [learnMoreLoading, setLearnMoreLoading] = React.useState(false)\n const [shopNowLoading, setShopNowLoading] = React.useState(false)\n\n // \u5185\u90E8\u72B6\u6001\u7BA1\u7406\u8D60\u54C1\u7684\u9009\u62E9\u72B6\u6001 - \u4F7F\u7528\u9009\u4E2D\u7684ID\u6570\u7EC4\u800C\u4E0D\u662F\u4FEE\u6539gift\u5BF9\u8C61\n const [selectedGiftIds, setSelectedGiftIds] = React.useState<string[]>(() => {\n if (!gifts || gifts.length === 0) return []\n\n if (giftType === 2) {\n // gift_type 2 (\u5168\u9009\u6A21\u5F0F) - \u9009\u4E2D\u6240\u6709\u8D60\u54C1\n return gifts.map((gift: FreeGift) => gift.id)\n } else {\n // gift_type 1 (\u5355\u9009\u6A21\u5F0F) - \u9ED8\u8BA4\u9009\u4E2D\u7B2C\u4E00\u4E2A\u8D60\u54C1\n return [gifts[0].id]\n }\n })\n\n // \u751F\u6210\u5E26\u6709\u9009\u62E9\u72B6\u6001\u7684\u8D60\u54C1\u5217\u8868\u7528\u4E8E\u6E32\u67D3\n const giftsWithSelection = React.useMemo(() => {\n if (!gifts) return []\n\n return gifts.map((gift: FreeGift) => ({\n ...gift,\n selected: selectedGiftIds.includes(gift.id),\n }))\n }, [gifts, selectedGiftIds])\n\n // \u5F53 gifts \u6216 giftType \u66F4\u65B0\u65F6\uFF0C\u540C\u6B65\u66F4\u65B0\u5185\u90E8\u72B6\u6001\n React.useEffect(() => {\n if (!gifts || gifts.length === 0) {\n setSelectedGiftIds([])\n return\n }\n\n if (giftType === 2) {\n // gift_type 2 (\u5168\u9009\u6A21\u5F0F) - \u9009\u4E2D\u6240\u6709\u8D60\u54C1\n setSelectedGiftIds(gifts.map((gift: FreeGift) => gift.id))\n } else {\n // gift_type 1 (\u5355\u9009\u6A21\u5F0F) - \u667A\u80FD\u72B6\u6001\u7BA1\u7406\n setSelectedGiftIds(prevSelectedIds => {\n // \u68C0\u67E5\u5F53\u524D\u9009\u4E2D\u7684\u793C\u54C1\u662F\u5426\u4ECD\u7136\u5B58\u5728\u4E8E\u65B0\u7684 gifts \u5217\u8868\u4E2D\n const currentSelectedId = prevSelectedIds[0]\n const isCurrentSelectionValid =\n currentSelectedId && gifts.some((gift: FreeGift) => gift.id === currentSelectedId)\n\n // \u5982\u679C\u5F53\u524D\u9009\u4E2D\u72B6\u6001\u4ECD\u7136\u6709\u6548\uFF0C\u4FDD\u6301\u4E0D\u53D8\uFF1B\u5426\u5219\u9ED8\u8BA4\u9009\u4E2D\u7B2C\u4E00\u4E2A\n return isCurrentSelectionValid ? [currentSelectedId] : [gifts[0].id]\n })\n }\n }, [gifts, giftType])\n\n // \u6784\u9020\u5B8C\u6574\u7684\u4EA7\u54C1\u6570\u636E\u7528\u4E8E\u56DE\u8C03\n const fullProductData: ProductCardData = React.useMemo(\n () => ({\n ...productData,\n gifts,\n gift_type: giftType,\n }),\n [productData, gifts, giftType]\n )\n\n const handleGiftClick = (gift: FreeGift) => {\n // gift_type 2 (\u5168\u9009\u6A21\u5F0F) - \u4E0D\u5141\u8BB8\u53D6\u6D88\u9009\u62E9\uFF0C\u76F4\u63A5\u8FD4\u56DE\n if (giftType === 2) {\n // \u83B7\u53D6\u5F53\u524D\u6240\u6709\u9009\u4E2D\u7684gifts\u4F5C\u4E3A\u7B2C\u4E8C\u4E2A\u53C2\u6570\n const currentSelectedGifts = giftsWithSelection.filter((g: FreeGiftWithSelection) => g.selected)\n onGiftClick?.(gift, currentSelectedGifts)\n return\n }\n\n // gift_type 1 (\u5355\u9009\u6A21\u5F0F)\n setSelectedGiftIds(() => {\n const newSelectedIds = [gift.id] // \u5355\u9009\uFF1A\u59CB\u7EC8\u9009\u4E2D\u5F53\u524D\u9879\uFF0C\u70B9\u51FB\u5DF2\u9009\u4E2D\u9879\u4FDD\u6301\u72B6\u6001\uFF0C\u70B9\u51FB\u672A\u9009\u4E2D\u9879\u5207\u6362\u5230\u8BE5\u9879\n\n // \u8BA1\u7B97\u65B0\u7684\u9009\u4E2Dgifts\u4F5C\u4E3A\u7B2C\u4E8C\u4E2A\u53C2\u6570\u4F20\u9012\u7ED9\u56DE\u8C03\n const newSelectedGifts = gifts?.filter((g: FreeGift) => newSelectedIds.includes(g.id)) || []\n\n // \u8C03\u7528\u56DE\u8C03\u51FD\u6570\uFF0C\u7B2C\u4E8C\u4E2A\u53C2\u6570\u662F\u5F53\u524D\u9009\u4E2D\u7684gifts\n onGiftClick?.(gift, newSelectedGifts)\n onGiftSelectionChange?.(newSelectedGifts, fullProductData)\n\n return newSelectedIds\n })\n }\n\n const hasClickHandler = !!(onProductImageClick ?? onProductClick)\n const productHref = `/products/${productData.handle}`\n\n const handleProductImageClick = () => {\n const callback = onProductImageClick ?? onProductClick\n callback?.(fullProductData)\n }\n\n const handleLearnMoreClick = async () => {\n const selectedGifts = giftsWithSelection.filter(gift => gift.selected)\n setLearnMoreLoading(true)\n try {\n await onLearnMore?.(fullProductData, selectedGifts)\n } finally {\n setLearnMoreLoading(false)\n }\n }\n\n const handleShopNowClick = async () => {\n const selectedGifts = giftsWithSelection.filter(gift => gift.selected)\n setShopNowLoading(true)\n try {\n await onShopNow?.(fullProductData, selectedGifts)\n } finally {\n setShopNowLoading(false)\n }\n }\n\n return (\n <div\n ref={ref}\n className={cn(\n 'bg-container-primary rounded-box flex items-stretch overflow-hidden',\n // \u6839\u636E\u5E03\u5C40\u6A21\u5F0F\u8C03\u6574\u5BB9\u5668\n layout === 'horizontal'\n ? [\n 'laptop:flex-row lg-desktop:min-h-[560px] desktop:min-h-[448px] tablet:min-h-[526px] min-h-[610px] flex-col',\n 'laptop:col-span-2',\n ]\n : ['flex-col justify-between'],\n className\n )}\n {...props}\n >\n {/* \u4EA7\u54C1\u56FE\u7247\u533A\u57DF */}\n <ProductImage\n images={sceneImages}\n name={productData.name}\n layout={layout}\n tags={productData.tags || tags}\n onClick={hasClickHandler ? handleProductImageClick : undefined}\n href={hasClickHandler ? undefined : productHref}\n />\n\n {/* \u4EA7\u54C1\u4FE1\u606F\u533A\u57DF */}\n <div\n className={cn(\n 'bg-container-primary desktop:p-6 flex flex-col justify-between p-4',\n // \u6839\u636E\u5E03\u5C40\u6A21\u5F0F\u8C03\u6574\u5706\u89D2\u548C\u5C3A\u5BF8\n layout === 'horizontal'\n ? [\n 'rounded-r-box laptop:rounded-r-box tablet:rounded-b-box tablet:rounded-l-none',\n // \u4F7F\u7528 flex-basis \u8BBE\u7F6E\u5BBD\u5EA6\u6BD4\u4F8B\n 'laptop:basis-[39.1%]', // 360px / 921px \u2248 39.1%\n 'desktop:basis-[42.1%]', // 552px / 1312px \u2248 42.1%\n 'lg-desktop:basis-[42.1%]', // 700px / 1664px \u2248 42.1%\n 'shrink-0',\n ]\n : ['rounded-b-box', 'w-full', 'grow']\n )}\n >\n <div className=\"flex flex-1 flex-col justify-between gap-6\">\n {/* \u4EA7\u54C1\u6807\u9898\u548C\u63CF\u8FF0 */}\n <ProductInfo\n name={productData.name}\n onClick={hasClickHandler ? handleProductImageClick : undefined}\n href={hasClickHandler ? undefined : productHref}\n description={productData.description}\n classNames={classNames}\n />\n\n {/* \u514D\u8D39\u8D60\u54C1\u533A\u57DF */}\n <GiftSelection\n freeGiftLabel={productData.freeGiftLabel}\n freeGifts={giftsWithSelection}\n onGiftClick={handleGiftClick}\n giftType={giftType}\n selectedGiftSku={selectedGiftSku}\n theme={theme}\n />\n <PriceAndActions\n currentPrice={productData.currentPrice ?? ''}\n originalPrice={productData.originalPrice}\n priceLabel={productData.priceLabel}\n learnMoreText={productData.learnMoreText}\n shopNowText={productData.shopNowText}\n soldOutText={soldOutText}\n onLearnMore={handleLearnMoreClick}\n onShopNow={handleShopNowClick}\n availableForSale={productData.availableForSale}\n learnMoreLoading={learnMoreLoading}\n shopNowLoading={shopNowLoading}\n trackingTitle={productData.name}\n trackingDescription={productData.description}\n trackingSku={productData.sku}\n classNames={classNames}\n />\n </div>\n </div>\n </div>\n )\n }\n)\n\nProductCard.displayName = 'BuyOneGetOneShelf.ProductCard'\n\nexport default ProductCard\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "React", "cn", "ProductImage", "ProductInfo", "GiftSelection", "PriceAndActions", "BuyOneGetOneShelfContext", "ProductCard", "productData", "gifts", "giftType", "selectedGiftSku", "sceneImages", "tags", "layoutProp", "className", "onProductClick", "onProductImageClick", "onLearnMore", "onShopNow", "onGiftClick", "onGiftSelectionChange", "classNames", "soldOutText", "props", "ref", "contextLayout", "theme", "layout", "learnMoreLoading", "setLearnMoreLoading", "shopNowLoading", "setShopNowLoading", "selectedGiftIds", "setSelectedGiftIds", "gift", "giftsWithSelection", "prevSelectedIds", "currentSelectedId", "fullProductData", "handleGiftClick", "currentSelectedGifts", "g", "newSelectedIds", "newSelectedGifts", "hasClickHandler", "productHref", "handleProductImageClick", "handleLearnMoreClick", "selectedGifts", "handleShopNowClick", "ProductCard_default"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport ProductImage from './ProductImage.js'\nimport ProductInfo from './ProductInfo.js'\nimport GiftSelection from './GiftSelection.js'\nimport PriceAndActions from './PriceAndActions.js'\nimport { BuyOneGetOneShelfContext } from './context.js'\nimport type {\n FreeGift,\n FreeGiftWithSelection,\n ProductCardData,\n PureProductData,\n ProductTag,\n BuyOneGetOneShelfProductCardSemanticName,\n} from './types.js'\n\nexport interface ProductCardProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4EA7\u54C1\u6570\u636E\uFF08\u4E0D\u5305\u542B\u8D60\u54C1\u4FE1\u606F\uFF09 */\n productData: PureProductData\n /** \u8D60\u54C1\u5217\u8868 */\n gifts?: FreeGift[]\n /** \u8D60\u54C1\u7C7B\u578B 1-> \u8D60\u9001\u5176\u4E2D\u4E00\u4E2A\u8D60\u54C1\uFF0C 2 -> \u8D60\u9001\u6240\u6709\u8D60\u54C1 */\n giftType?: 1 | 2\n /** \u573A\u666F\u56FE\u7247 */\n sceneImages: any\n /** \u4EA7\u54C1\u6807\u7B7E */\n tags?: ProductTag[]\n /** \u5F53\u524D\u9009\u4E2D\u7684\u8D60\u54C1SKU\uFF08\u53D7\u63A7\u7EC4\u4EF6\uFF09 */\n selectedGiftSku?: string\n /** @deprecated Layout is now automatically inferred by Root based on children count. */\n layout?: 'horizontal' | 'vertical'\n classNames?: Partial<Record<BuyOneGetOneShelfProductCardSemanticName, string>>\n soldOutText?: string\n /** @deprecated Use `onProductImageClick` instead. */\n onProductClick?: (product: ProductCardData) => void\n /** \u4EA7\u54C1\u56FE\u7247\u70B9\u51FB\u56DE\u8C03 */\n onProductImageClick?: (product: ProductCardData) => void\n /** Learn More \u70B9\u51FB\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData, selectedGifts: FreeGift[]) => void\n /** Shop Now \u70B9\u51FB\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData, selectedGifts: FreeGift[]) => void\n /** \u8D60\u54C1\u70B9\u51FB\u56DE\u8C03 */\n onGiftClick?: (gift: FreeGift, selectedGifts: FreeGift[]) => void\n /** \u8D60\u54C1\u9009\u62E9\u53D8\u5316\u56DE\u8C03 */\n onGiftSelectionChange?: (selectedGifts: FreeGift[], product: ProductCardData) => void\n /** \u9009\u4E2D\u8D60\u54C1SKU\u53D8\u5316\u56DE\u8C03\uFF08\u53D7\u63A7\u7EC4\u4EF6\uFF09 */\n onSelectedGiftSkuChange?: (selectedSku: string | null) => void\n /**\n * \u539F\u4EF7\u533A\u57DF\u6E32\u67D3\u51FD\u6570\uFF0C\u7528\u4E8E\u5728\u539F\u4EF7\u4F4D\u7F6E\u5C55\u793A\u81EA\u5B9A\u4E49\u5185\u5BB9\uFF08\u5982 Save \u91D1\u989D\u6587\u6848\uFF09\u3002\n * \u4E0D\u4F20\u65F6\u4F7F\u7528\u9ED8\u8BA4\u7684\u539F\u4EF7\u6E32\u67D3\uFF08\u5212\u7EBF\u4EF7\uFF09\u3002\n * @param originalPrice - \u683C\u5F0F\u5316\u540E\u7684\u539F\u4EF7\u6587\u672C\n */\n renderOriginalPrice?: (originalPrice: string | undefined) => React.ReactNode\n}\n\n/**\n * ProductCard - \u4E70\u8D60\u8D27\u67B6\u4EA7\u54C1\u5361\u7247\n *\n * @description \u7528\u4E8E\u4E70\u4E00\u8D60\u4E00\u6D3B\u52A8\u7684\u4EA7\u54C1\u5C55\u793A\u5361\u7247\uFF0C\u5DE6\u4FA7\u5C55\u793A\u4EA7\u54C1\u56FE\u7247\u548C\u6807\u7B7E\uFF0C\u53F3\u4FA7\u5C55\u793A\u4EA7\u54C1\u4FE1\u606F\u3001\u8D60\u54C1\u548C\u8D2D\u4E70\u6309\u94AE\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n productData,\n gifts = [],\n giftType = 1,\n selectedGiftSku,\n sceneImages,\n tags,\n layout: layoutProp,\n className,\n onProductClick,\n onProductImageClick,\n onLearnMore,\n onShopNow,\n onGiftClick,\n onGiftSelectionChange,\n classNames,\n soldOutText,\n renderOriginalPrice,\n ...props\n },\n ref\n ) => {\n const { layout: contextLayout, theme } = React.useContext(BuyOneGetOneShelfContext)\n const layout = layoutProp ?? contextLayout\n\n const [learnMoreLoading, setLearnMoreLoading] = React.useState(false)\n const [shopNowLoading, setShopNowLoading] = React.useState(false)\n\n // \u5185\u90E8\u72B6\u6001\u7BA1\u7406\u8D60\u54C1\u7684\u9009\u62E9\u72B6\u6001 - \u4F7F\u7528\u9009\u4E2D\u7684ID\u6570\u7EC4\u800C\u4E0D\u662F\u4FEE\u6539gift\u5BF9\u8C61\n const [selectedGiftIds, setSelectedGiftIds] = React.useState<string[]>(() => {\n if (!gifts || gifts.length === 0) return []\n\n if (giftType === 2) {\n // gift_type 2 (\u5168\u9009\u6A21\u5F0F) - \u9009\u4E2D\u6240\u6709\u8D60\u54C1\n return gifts.map((gift: FreeGift) => gift.id)\n } else {\n // gift_type 1 (\u5355\u9009\u6A21\u5F0F) - \u9ED8\u8BA4\u9009\u4E2D\u7B2C\u4E00\u4E2A\u8D60\u54C1\n return [gifts[0].id]\n }\n })\n\n // \u751F\u6210\u5E26\u6709\u9009\u62E9\u72B6\u6001\u7684\u8D60\u54C1\u5217\u8868\u7528\u4E8E\u6E32\u67D3\n const giftsWithSelection = React.useMemo(() => {\n if (!gifts) return []\n\n return gifts.map((gift: FreeGift) => ({\n ...gift,\n selected: selectedGiftIds.includes(gift.id),\n }))\n }, [gifts, selectedGiftIds])\n\n // \u5F53 gifts \u6216 giftType \u66F4\u65B0\u65F6\uFF0C\u540C\u6B65\u66F4\u65B0\u5185\u90E8\u72B6\u6001\n React.useEffect(() => {\n if (!gifts || gifts.length === 0) {\n setSelectedGiftIds([])\n return\n }\n\n if (giftType === 2) {\n // gift_type 2 (\u5168\u9009\u6A21\u5F0F) - \u9009\u4E2D\u6240\u6709\u8D60\u54C1\n setSelectedGiftIds(gifts.map((gift: FreeGift) => gift.id))\n } else {\n // gift_type 1 (\u5355\u9009\u6A21\u5F0F) - \u667A\u80FD\u72B6\u6001\u7BA1\u7406\n setSelectedGiftIds(prevSelectedIds => {\n // \u68C0\u67E5\u5F53\u524D\u9009\u4E2D\u7684\u793C\u54C1\u662F\u5426\u4ECD\u7136\u5B58\u5728\u4E8E\u65B0\u7684 gifts \u5217\u8868\u4E2D\n const currentSelectedId = prevSelectedIds[0]\n const isCurrentSelectionValid =\n currentSelectedId && gifts.some((gift: FreeGift) => gift.id === currentSelectedId)\n\n // \u5982\u679C\u5F53\u524D\u9009\u4E2D\u72B6\u6001\u4ECD\u7136\u6709\u6548\uFF0C\u4FDD\u6301\u4E0D\u53D8\uFF1B\u5426\u5219\u9ED8\u8BA4\u9009\u4E2D\u7B2C\u4E00\u4E2A\n return isCurrentSelectionValid ? [currentSelectedId] : [gifts[0].id]\n })\n }\n }, [gifts, giftType])\n\n // \u6784\u9020\u5B8C\u6574\u7684\u4EA7\u54C1\u6570\u636E\u7528\u4E8E\u56DE\u8C03\n const fullProductData: ProductCardData = React.useMemo(\n () => ({\n ...productData,\n gifts,\n gift_type: giftType,\n }),\n [productData, gifts, giftType]\n )\n\n const handleGiftClick = (gift: FreeGift) => {\n // gift_type 2 (\u5168\u9009\u6A21\u5F0F) - \u4E0D\u5141\u8BB8\u53D6\u6D88\u9009\u62E9\uFF0C\u76F4\u63A5\u8FD4\u56DE\n if (giftType === 2) {\n // \u83B7\u53D6\u5F53\u524D\u6240\u6709\u9009\u4E2D\u7684gifts\u4F5C\u4E3A\u7B2C\u4E8C\u4E2A\u53C2\u6570\n const currentSelectedGifts = giftsWithSelection.filter((g: FreeGiftWithSelection) => g.selected)\n onGiftClick?.(gift, currentSelectedGifts)\n return\n }\n\n // gift_type 1 (\u5355\u9009\u6A21\u5F0F)\n setSelectedGiftIds(() => {\n const newSelectedIds = [gift.id] // \u5355\u9009\uFF1A\u59CB\u7EC8\u9009\u4E2D\u5F53\u524D\u9879\uFF0C\u70B9\u51FB\u5DF2\u9009\u4E2D\u9879\u4FDD\u6301\u72B6\u6001\uFF0C\u70B9\u51FB\u672A\u9009\u4E2D\u9879\u5207\u6362\u5230\u8BE5\u9879\n\n // \u8BA1\u7B97\u65B0\u7684\u9009\u4E2Dgifts\u4F5C\u4E3A\u7B2C\u4E8C\u4E2A\u53C2\u6570\u4F20\u9012\u7ED9\u56DE\u8C03\n const newSelectedGifts = gifts?.filter((g: FreeGift) => newSelectedIds.includes(g.id)) || []\n\n // \u8C03\u7528\u56DE\u8C03\u51FD\u6570\uFF0C\u7B2C\u4E8C\u4E2A\u53C2\u6570\u662F\u5F53\u524D\u9009\u4E2D\u7684gifts\n onGiftClick?.(gift, newSelectedGifts)\n onGiftSelectionChange?.(newSelectedGifts, fullProductData)\n\n return newSelectedIds\n })\n }\n\n const hasClickHandler = !!(onProductImageClick ?? onProductClick)\n const productHref = `/products/${productData.handle}`\n\n const handleProductImageClick = () => {\n const callback = onProductImageClick ?? onProductClick\n callback?.(fullProductData)\n }\n\n const handleLearnMoreClick = async () => {\n const selectedGifts = giftsWithSelection.filter(gift => gift.selected)\n setLearnMoreLoading(true)\n try {\n await onLearnMore?.(fullProductData, selectedGifts)\n } finally {\n setLearnMoreLoading(false)\n }\n }\n\n const handleShopNowClick = async () => {\n const selectedGifts = giftsWithSelection.filter(gift => gift.selected)\n setShopNowLoading(true)\n try {\n await onShopNow?.(fullProductData, selectedGifts)\n } finally {\n setShopNowLoading(false)\n }\n }\n\n return (\n <div\n ref={ref}\n className={cn(\n 'bg-container-primary rounded-box flex items-stretch overflow-hidden',\n // \u6839\u636E\u5E03\u5C40\u6A21\u5F0F\u8C03\u6574\u5BB9\u5668\n layout === 'horizontal'\n ? [\n 'laptop:flex-row lg-desktop:min-h-[560px] desktop:min-h-[448px] tablet:min-h-[526px] min-h-[610px] flex-col',\n 'laptop:col-span-2',\n ]\n : ['flex-col justify-between'],\n className\n )}\n {...props}\n >\n {/* \u4EA7\u54C1\u56FE\u7247\u533A\u57DF */}\n <ProductImage\n images={sceneImages}\n name={productData.name}\n layout={layout}\n tags={productData.tags || tags}\n onClick={hasClickHandler ? handleProductImageClick : undefined}\n href={hasClickHandler ? undefined : productHref}\n />\n\n {/* \u4EA7\u54C1\u4FE1\u606F\u533A\u57DF */}\n <div\n className={cn(\n 'bg-container-primary desktop:p-6 flex flex-col justify-between p-4',\n // \u6839\u636E\u5E03\u5C40\u6A21\u5F0F\u8C03\u6574\u5706\u89D2\u548C\u5C3A\u5BF8\n layout === 'horizontal'\n ? [\n 'rounded-r-box laptop:rounded-r-box tablet:rounded-b-box tablet:rounded-l-none',\n // \u4F7F\u7528 flex-basis \u8BBE\u7F6E\u5BBD\u5EA6\u6BD4\u4F8B\n 'laptop:basis-[39.1%]', // 360px / 921px \u2248 39.1%\n 'desktop:basis-[42.1%]', // 552px / 1312px \u2248 42.1%\n 'lg-desktop:basis-[42.1%]', // 700px / 1664px \u2248 42.1%\n 'shrink-0',\n ]\n : ['rounded-b-box', 'w-full', 'grow']\n )}\n >\n <div className=\"flex flex-1 flex-col justify-between gap-6\">\n {/* \u4EA7\u54C1\u6807\u9898\u548C\u63CF\u8FF0 */}\n <ProductInfo\n name={productData.name}\n onClick={hasClickHandler ? handleProductImageClick : undefined}\n href={hasClickHandler ? undefined : productHref}\n description={productData.description}\n classNames={classNames}\n />\n\n {/* \u514D\u8D39\u8D60\u54C1\u533A\u57DF */}\n <GiftSelection\n freeGiftLabel={productData.freeGiftLabel}\n freeGifts={giftsWithSelection}\n onGiftClick={handleGiftClick}\n giftType={giftType}\n selectedGiftSku={selectedGiftSku}\n theme={theme}\n />\n <PriceAndActions\n currentPrice={productData.currentPrice ?? ''}\n originalPrice={productData.originalPrice}\n priceLabel={productData.priceLabel}\n learnMoreText={productData.learnMoreText}\n shopNowText={productData.shopNowText}\n soldOutText={soldOutText}\n onLearnMore={handleLearnMoreClick}\n onShopNow={handleShopNowClick}\n availableForSale={productData.availableForSale}\n learnMoreLoading={learnMoreLoading}\n shopNowLoading={shopNowLoading}\n trackingTitle={productData.name}\n trackingDescription={productData.description}\n trackingSku={productData.sku}\n classNames={classNames}\n renderOriginalPrice={renderOriginalPrice}\n />\n </div>\n </div>\n </div>\n )\n }\n)\n\nProductCard.displayName = 'BuyOneGetOneShelf.ProductCard'\n\nexport default ProductCard\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "cn", "ProductImage", "ProductInfo", "GiftSelection", "PriceAndActions", "BuyOneGetOneShelfContext", "ProductCard", "productData", "gifts", "giftType", "selectedGiftSku", "sceneImages", "tags", "layoutProp", "className", "onProductClick", "onProductImageClick", "onLearnMore", "onShopNow", "onGiftClick", "onGiftSelectionChange", "classNames", "soldOutText", "renderOriginalPrice", "props", "ref", "contextLayout", "theme", "layout", "learnMoreLoading", "setLearnMoreLoading", "shopNowLoading", "setShopNowLoading", "selectedGiftIds", "setSelectedGiftIds", "gift", "giftsWithSelection", "prevSelectedIds", "currentSelectedId", "fullProductData", "handleGiftClick", "currentSelectedGifts", "g", "newSelectedIds", "newSelectedGifts", "hasClickHandler", "productHref", "handleProductImageClick", "handleLearnMoreClick", "selectedGifts", "handleShopNowClick", "ProductCard_default"]
7
7
  }