@anker-in/headless-ui 1.3.56 → 1.3.57

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 (34) hide show
  1. package/dist/cjs/biz-components/ActiveShelf/ProductCard.js +1 -1
  2. package/dist/cjs/biz-components/ActiveShelf/ProductCard.js.map +2 -2
  3. package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.js +1 -1
  4. package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.js.map +2 -2
  5. package/dist/cjs/biz-components/CreditsShelf/ProductCard.js +1 -1
  6. package/dist/cjs/biz-components/CreditsShelf/ProductCard.js.map +2 -2
  7. package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js +1 -1
  8. package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js.map +2 -2
  9. package/dist/cjs/biz-components/MediaShelf/ProductCard.js +1 -1
  10. package/dist/cjs/biz-components/MediaShelf/ProductCard.js.map +2 -2
  11. package/dist/cjs/biz-components/SceneShelf/ProductsPanel.js +1 -1
  12. package/dist/cjs/biz-components/SceneShelf/ProductsPanel.js.map +2 -2
  13. package/dist/cjs/biz-components/SceneShelfV2/index.js +1 -1
  14. package/dist/cjs/biz-components/SceneShelfV2/index.js.map +2 -2
  15. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.js +1 -1
  16. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.js.map +2 -2
  17. package/dist/esm/biz-components/ActiveShelf/ProductCard.js +1 -1
  18. package/dist/esm/biz-components/ActiveShelf/ProductCard.js.map +2 -2
  19. package/dist/esm/biz-components/BuyOneGetOneShelf/PriceAndActions.js +1 -1
  20. package/dist/esm/biz-components/BuyOneGetOneShelf/PriceAndActions.js.map +2 -2
  21. package/dist/esm/biz-components/CreditsShelf/ProductCard.js +1 -1
  22. package/dist/esm/biz-components/CreditsShelf/ProductCard.js.map +2 -2
  23. package/dist/esm/biz-components/ImageOverlayShelf/ProductCard.js +1 -1
  24. package/dist/esm/biz-components/ImageOverlayShelf/ProductCard.js.map +2 -2
  25. package/dist/esm/biz-components/MediaShelf/ProductCard.js +1 -1
  26. package/dist/esm/biz-components/MediaShelf/ProductCard.js.map +2 -2
  27. package/dist/esm/biz-components/SceneShelf/ProductsPanel.js +1 -1
  28. package/dist/esm/biz-components/SceneShelf/ProductsPanel.js.map +2 -2
  29. package/dist/esm/biz-components/SceneShelfV2/index.js +1 -1
  30. package/dist/esm/biz-components/SceneShelfV2/index.js.map +2 -2
  31. package/dist/esm/biz-components/SceneShelfV3/ProductCard.js +1 -1
  32. package/dist/esm/biz-components/SceneShelfV3/ProductCard.js.map +2 -2
  33. package/package.json +1 -1
  34. package/style.css +18 -6
package/dist/cjs/biz-components/ActiveShelf/ProductCard.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var q=Object.create;var p=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,$=Object.prototype.hasOwnProperty;var E=(e,i)=>{for(var r in i)p(e,r,{get:i[r],enumerable:!0})},P=(e,i,r,d)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of _(i))!$.call(e,s)&&s!==r&&p(e,s,{get:()=>i[s],enumerable:!(d=M(i,s))||d.enumerable});return e};var I=(e,i,r)=>(r=e!=null?q(R(e)):{},P(i||!e||!e.__esModule?p(r,"default",{value:e,enumerable:!0}):r,e)),j=e=>P(p({},"__esModule",{value:!0}),e);var K={};E(K,{ProductCard:()=>u,default:()=>G});module.exports=j(K);var a=require("react/jsx-runtime"),c=I(require("react")),n=require("../../helpers/index.js"),t=require("../../components/index.js");const H=5;function O(e,i,r,d){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:r<=i;case"below-percentage":return i===void 0?!0:r/d*100<=i;default:return!0}}const u=c.forwardRef(({product:e,className:i,showTags:r=!0,stockDisplayMode:d,stockThresholdValue:s,onLearnMore:C,onShopNow:S,onAddToCart:w,classNames:o,secondaryButtonText:f,secondaryButtonFun:y,primaryButtonText:g,primaryButtonFun:v,showOriginalPrice:N,copy:b,onProductImageClick:x},B)=>{const[D,L]=c.useState(!1),[T,F]=c.useState(!1),z=c.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?H:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),k=async(l,m)=>{if(!l)return;const h=m==="primary"?L:F;h(!0);try{switch(l){case"buyNow":await S?.(e);break;case"addCart":await w?.(e);break;case"learnMore":await C?.(e);break;default:break}}finally{h(!1)}},A=e.availableForSale&&e.quantityAvailable<=0;return(0,a.jsx)(t.Card,{ref:B,className:(0,n.cn)("bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none",i,o?.productCard),children:(0,a.jsxs)(t.CardContent,{className:"desktop:p-6 relative flex flex-1 flex-col justify-between p-4",children:[(0,a.jsx)("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:r&&e.tags?.map((l,m)=>l.label?(0,a.jsx)(t.Badge,{size:"sm",variant:l.variant||"outline",className:(0,n.cn)(l.variant==="promotional"?"ml-2":""),promotionalType:l.promotionalType,children:l.label},m):(0,a.jsx)(c.Fragment,{children:l},m))}),(0,a.jsx)("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:(0,a.jsx)("a",{onClick:()=>x?.(e),...!x&&{href:e?.listingLink},rel:"noreferrer",children:(0,a.jsx)(t.Picture,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),(0,a.jsxs)("div",{className:"flex h-full flex-1 grow flex-col justify-between",children:[(0,a.jsxs)("div",{className:"mb-4",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary mb-2 line-clamp-2 min-h-[2.4em]",o?.productTitle),html:e.custom_name||e.name}),e?.description&&(0,a.jsx)(t.Text,{size:2,className:(0,n.cn)("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]",o?.productDescription),html:e.custom_description||e.description})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("div",{className:(0,n.cn)("mb-2",o?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-2",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),N&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:(0,n.cn)("text-info-tertiary line-through",o?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:b?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&(0,a.jsx)(t.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",o?.productPriceLabel),children:e.priceLabel}),(0,a.jsxs)("div",{className:(0,n.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",o?.buttonGroup),children:[f&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",o?.secondaryButton),onClick:()=>k(y,"secondary"),disabled:!e.availableForSale&&y!=="learnMore",loading:T,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${f}`,"data-headless-sku":e.sku,children:f}),g&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",o?.primaryButton),onClick:()=>k(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:D,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${g}`,"data-headless-sku":e.sku,children:g})]}),O(d,s,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,a.jsxs)("div",{className:"mt-4 space-y-2",children:[(0,a.jsx)(t.Progress,{value:z,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:(0,n.cn)("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",o?.stockTrack),progressBar:(0,n.cn)("bg-brand-0 transition-all duration-300 ease-in-out",o?.stockBar)}}),(0,a.jsx)(t.Text,{size:3,className:"text-info-tertiary text-[14px]",children:A?b?.limitedStock:b?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]})})});u.displayName="ActiveShelf.ProductCard";var G=u;
1
+ "use strict";"use client";var q=Object.create;var p=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,$=Object.prototype.hasOwnProperty;var E=(e,i)=>{for(var r in i)p(e,r,{get:i[r],enumerable:!0})},w=(e,i,r,c)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of _(i))!$.call(e,s)&&s!==r&&p(e,s,{get:()=>i[s],enumerable:!(c=M(i,s))||c.enumerable});return e};var I=(e,i,r)=>(r=e!=null?q(R(e)):{},w(i||!e||!e.__esModule?p(r,"default",{value:e,enumerable:!0}):r,e)),j=e=>w(p({},"__esModule",{value:!0}),e);var K={};E(K,{ProductCard:()=>u,default:()=>G});module.exports=j(K);var a=require("react/jsx-runtime"),d=I(require("react")),n=require("../../helpers/index.js"),t=require("../../components/index.js");const H=5;function O(e,i,r,c){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:r<=i;case"below-percentage":return i===void 0?!0:r/c*100<=i;default:return!0}}const u=d.forwardRef(({product:e,className:i,showTags:r=!0,stockDisplayMode:c,stockThresholdValue:s,onLearnMore:P,onShopNow:C,onAddToCart:S,classNames:o,secondaryButtonText:b,secondaryButtonFun:y,primaryButtonText:f,primaryButtonFun:v,showOriginalPrice:N,copy:g,onProductImageClick:x},B)=>{const[D,L]=d.useState(!1),[T,F]=d.useState(!1),z=d.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?H:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),k=async(l,m)=>{if(!l)return;const h=m==="primary"?L:F;h(!0);try{switch(l){case"buyNow":await C?.(e);break;case"addCart":await S?.(e);break;case"learnMore":await P?.(e);break;default:break}}finally{h(!1)}},A=e.availableForSale&&e.quantityAvailable<=0;return(0,a.jsx)(t.Card,{ref:B,className:(0,n.cn)("bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none",i,o?.productCard),children:(0,a.jsxs)(t.CardContent,{className:"desktop:p-6 relative flex flex-1 flex-col justify-between p-4",children:[(0,a.jsx)("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:r&&e.tags?.map((l,m)=>l.label?(0,a.jsx)(t.Badge,{size:"sm",variant:l.variant||"outline",className:(0,n.cn)(l.variant==="promotional"?"ml-2":""),promotionalType:l.promotionalType,children:l.label},m):(0,a.jsx)(d.Fragment,{children:l},m))}),(0,a.jsx)("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:(0,a.jsx)("a",{onClick:()=>x?.(e),...!x&&{href:e?.listingLink},rel:"noreferrer",children:(0,a.jsx)(t.Picture,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),(0,a.jsxs)("div",{className:"flex h-full flex-1 grow flex-col justify-between",children:[(0,a.jsxs)("div",{className:"mb-4",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary mb-2 line-clamp-2 min-h-[2.4em]",o?.productTitle),html:e.custom_name||e.name}),e?.description&&(0,a.jsx)(t.Text,{size:2,className:(0,n.cn)("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]",o?.productDescription),html:e.custom_description||e.description})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("div",{className:(0,n.cn)("mb-2",o?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-2",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),N&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:(0,n.cn)("text-info-tertiary line-through",o?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:g?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&(0,a.jsx)(t.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",o?.productPriceLabel),children:e.priceLabel}),(0,a.jsxs)("div",{className:(0,n.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",o?.buttonGroup),children:[b&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,n.cn)("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",o?.secondaryButton),onClick:()=>k(y,"secondary"),disabled:!e.availableForSale&&y!=="learnMore",loading:T,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${b}`,"data-headless-sku":e.sku,children:b}),f&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,n.cn)("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",o?.primaryButton),onClick:()=>k(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:D,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${f}`,"data-headless-sku":e.sku,children:f})]}),O(c,s,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,a.jsxs)("div",{className:"mt-4 space-y-2",children:[(0,a.jsx)(t.Progress,{value:z,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:(0,n.cn)("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",o?.stockTrack),progressBar:(0,n.cn)("bg-brand-0 transition-all duration-300 ease-in-out",o?.stockBar)}}),(0,a.jsx)(t.Text,{size:3,className:"text-info-tertiary text-[14px]",children:A?g?.limitedStock:g?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]})})});u.displayName="ActiveShelf.ProductCard";var G=u;
2
2
  //# sourceMappingURL=ProductCard.js.map
package/dist/cjs/biz-components/ActiveShelf/ProductCard.js.map CHANGED
@@ -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('tablet:w-fit w-full', classNames?.secondaryButton)}\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('tablet:w-fit w-full', classNames?.primaryButton)}\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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",
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
6
  "names": ["ProductCard_exports", "__export", "ProductCard", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "OVERSELLING_STOCK_PERCENTAGE", "shouldShowStock", "stockDisplayMode", "stockThresholdValue", "quantityAvailable", "totalInventory", "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"]
7
7
  }
package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var S=Object.create;var s=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var w=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var i in t)s(e,i,{get:t[i],enumerable:!0})},x=(e,t,i,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of L(t))!B.call(e,r)&&r!==i&&s(e,r,{get:()=>t[r],enumerable:!(o=C(t,r))||o.enumerable});return e};var h=(e,t,i)=>(i=e!=null?S(w(e)):{},x(t||!e||!e.__esModule?s(i,"default",{value:e,enumerable:!0}):i,e)),z=e=>x(s({},"__esModule",{value:!0}),e);var $={};T($,{default:()=>M});module.exports=z($);var a=require("react/jsx-runtime"),H=h(require("react")),n=require("../../helpers/index.js"),l=h(require("../../components/button.js")),d=require("../../components/text.js"),c=require("../../components/index.js");const y=H.forwardRef(({currentPrice:e,originalPrice:t,priceLabel:i,learnMoreText:o="Learn More",shopNowText:r="Shop Now",soldOutText:P="Sold out",onLearnMore:N,onShopNow:v,availableForSale:p,learnMoreLoading:b,shopNowLoading:O,className:k,trackingTitle:m,trackingDescription:g,trackingSku:u,classNames:f},A)=>(0,a.jsxs)("div",{ref:A,className:(0,n.cn)("flex w-full flex-col justify-center gap-2",k),children:[(0,a.jsx)("div",{className:"flex w-full items-center gap-2",children:p?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(c.Heading,{size:2,className:(0,n.cn)("text-info-primary"),children:e}),t&&(0,a.jsx)(c.Heading,{size:2,className:(0,n.cn)("text-info-tertiary line-through",f?.productCardOriginalPrice),children:t})]}):(0,a.jsx)(d.Text,{size:4,className:(0,n.cn)("text-info-primary text-2xl leading-[1.2] tracking-[-0.48px]","tablet:text-xl tablet:tracking-[-0.4px]"),children:P})}),i&&(0,a.jsx)(d.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",f?.productCardPriceLabel),children:i}),(0,a.jsxs)("div",{className:(0,n.cn)("flex w-full items-center gap-3","tablet:gap-2"),children:[(0,a.jsx)(l.default,{variant:"secondary",size:"lg",onClick:N,loading:b,"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${m||""}#${g||""}#${o}`,"data-headless-sku":u,children:o}),(0,a.jsx)(l.default,{variant:"primary",size:"lg",onClick:v,disabled:!p,loading:O,"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${m||""}#${g||""}#${r}`,"data-headless-sku":u,children:r})]})]}));y.displayName="PriceAndActions";var M=y;
1
+ "use strict";"use client";var k=Object.create;var l=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,L=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var r in t)l(e,r,{get:t[r],enumerable:!0})},f=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of B(t))!L.call(e,n)&&n!==r&&l(e,n,{get:()=>t[n],enumerable:!(o=A(t,n))||o.enumerable});return e};var h=(e,t,r)=>(r=e!=null?k(S(e)):{},f(t||!e||!e.__esModule?l(r,"default",{value:e,enumerable:!0}):r,e)),z=e=>f(l({},"__esModule",{value:!0}),e);var M={};T(M,{default:()=>H});module.exports=z(M);var a=require("react/jsx-runtime"),G=h(require("react")),i=require("../../helpers/index.js"),d=h(require("../../components/button.js")),c=require("../../components/text.js"),p=require("../../components/index.js");const y=G.forwardRef(({currentPrice:e,originalPrice:t,priceLabel:r,learnMoreText:o="Learn More",shopNowText:n="Shop Now",soldOutText:P="Sold out",onLearnMore:N,onShopNow:v,availableForSale:m,learnMoreLoading:b,shopNowLoading:w,className:C,trackingTitle:u,trackingDescription:g,trackingSku:x,classNames:s},O)=>(0,a.jsxs)("div",{ref:O,className:(0,i.cn)("flex w-full flex-col justify-center gap-2",C),children:[(0,a.jsx)("div",{className:"flex w-full items-center gap-2",children:m?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(p.Heading,{size:2,className:(0,i.cn)("text-info-primary"),children:e}),t&&(0,a.jsx)(p.Heading,{size:2,className:(0,i.cn)("text-info-tertiary line-through",s?.productCardOriginalPrice),children:t})]}):(0,a.jsx)(c.Text,{size:4,className:(0,i.cn)("text-info-primary text-2xl leading-[1.2] tracking-[-0.48px]","tablet:text-xl tablet:tracking-[-0.4px]"),children:P})}),r&&(0,a.jsx)(c.Text,{size:4,className:(0,i.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",s?.productCardPriceLabel),children:r}),(0,a.jsxs)("div",{className:(0,i.cn)("flex w-full items-stretch gap-3","tablet:gap-2"),children:[(0,a.jsx)(d.default,{variant:"secondary",size:"lg",onClick:N,loading:b,className:(0,i.cn)("min-w-0 flex-1 whitespace-normal text-center",s?.productCardBtnGroup),"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${u||""}#${g||""}#${o}`,"data-headless-sku":x,children:o}),(0,a.jsx)(d.default,{variant:"primary",size:"lg",onClick:v,disabled:!m,loading:w,className:(0,i.cn)("min-w-0 flex-1 whitespace-normal text-center",s?.productCardBtnGroup),"data-headless-type-name":"BuyOneGetOneShelf#ProductCard","data-headless-title-desc-button":`${u||""}#${g||""}#${n}`,"data-headless-sku":x,children:n})]})]}));y.displayName="PriceAndActions";var H=y;
2
2
  //# sourceMappingURL=PriceAndActions.js.map
package/dist/cjs/biz-components/BuyOneGetOneShelf/PriceAndActions.js.map CHANGED
@@ -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-center gap-3', 'tablet:gap-2')}>\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={onLearnMore}\n loading={learnMoreLoading}\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 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": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqDY,IAAAI,EAAA,6BAnDZC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAAmB,yCACnBC,EAAqB,oCACrBC,EAAwB,qCAqBxB,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,OAGE,QAAC,OAAI,IAAKA,EAAK,aAAW,MAAG,4CAA6CL,CAAS,EACjF,oBAAC,OAAI,UAAU,iCACZ,SAAAH,KACC,oBACE,oBAAC,WAAQ,KAAM,EAAG,aAAW,MAAG,mBAAmB,EAChD,SAAAR,EACH,EACCC,MACC,OAAC,WACC,KAAM,EACN,aAAW,MAAG,kCAAmCc,GAAY,wBAAwB,EAEpF,SAAAd,EACH,GAEJ,KAEA,OAAC,QACC,KAAM,EACN,aAAW,MACT,8DACA,yCACF,EAEC,SAAAI,EACH,EAEJ,EAECH,MACC,OAAC,QACC,KAAM,EACN,aAAW,MACT,0EACAa,GAAY,qBACd,EAEC,SAAAb,EACH,KAIF,QAAC,OAAI,aAAW,MAAG,iCAAkC,cAAc,EACjE,oBAAC,EAAAe,QAAA,CACC,QAAQ,YACR,KAAK,KACL,QAASX,EACT,QAASG,EACT,0BAAwB,gCACxB,kCAAiC,GAAGG,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIV,CAAa,GACrG,oBAAmBW,EAElB,SAAAX,EACH,KACA,OAAC,EAAAc,QAAA,CACC,QAAQ,UACR,KAAK,KACL,QAASV,EACT,SAAU,CAACC,EACX,QAASE,EACT,0BAAwB,gCACxB,kCAAiC,GAAGE,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIT,CAAW,GACnG,oBAAmBU,EAElB,SAAAV,EACH,GACF,GACF,CAGN,EAEAL,EAAgB,YAAc,kBAE9B,IAAOR,EAAQQ",
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": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqDY,IAAAI,EAAA,6BAnDZC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAAmB,yCACnBC,EAAqB,oCACrBC,EAAwB,qCAqBxB,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,OAGE,QAAC,OAAI,IAAKA,EAAK,aAAW,MAAG,4CAA6CL,CAAS,EACjF,oBAAC,OAAI,UAAU,iCACZ,SAAAH,KACC,oBACE,oBAAC,WAAQ,KAAM,EAAG,aAAW,MAAG,mBAAmB,EAChD,SAAAR,EACH,EACCC,MACC,OAAC,WACC,KAAM,EACN,aAAW,MAAG,kCAAmCc,GAAY,wBAAwB,EAEpF,SAAAd,EACH,GAEJ,KAEA,OAAC,QACC,KAAM,EACN,aAAW,MACT,8DACA,yCACF,EAEC,SAAAI,EACH,EAEJ,EAECH,MACC,OAAC,QACC,KAAM,EACN,aAAW,MACT,0EACAa,GAAY,qBACd,EAEC,SAAAb,EACH,KAIF,QAAC,OAAI,aAAW,MAAG,kCAAmC,cAAc,EAClE,oBAAC,EAAAe,QAAA,CACC,QAAQ,YACR,KAAK,KACL,QAASX,EACT,QAASG,EACT,aAAW,MAAG,+CAAgDM,GAAY,mBAAmB,EAC7F,0BAAwB,gCACxB,kCAAiC,GAAGH,GAAiB,EAAE,IAAIC,GAAuB,EAAE,IAAIV,CAAa,GACrG,oBAAmBW,EAElB,SAAAX,EACH,KACA,OAAC,EAAAc,QAAA,CACC,QAAQ,UACR,KAAK,KACL,QAASV,EACT,SAAU,CAACC,EACX,QAASE,EACT,aAAW,MAAG,+CAAgDK,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,IAAOR,EAAQQ",
6
6
  "names": ["PriceAndActions_exports", "__export", "PriceAndActions_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_button", "import_text", "import_components", "PriceAndActions", "currentPrice", "originalPrice", "priceLabel", "learnMoreText", "shopNowText", "soldOutText", "onLearnMore", "onShopNow", "availableForSale", "learnMoreLoading", "shopNowLoading", "className", "trackingTitle", "trackingDescription", "trackingSku", "classNames", "ref", "Button"]
7
7
  }
package/dist/cjs/biz-components/CreditsShelf/ProductCard.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var Z=Object.create;var u=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.getPrototypeOf,U=Object.prototype.hasOwnProperty;var V=(e,o)=>{for(var n in o)u(e,n,{get:o[n],enumerable:!0})},w=(e,o,n,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let d of K(o))!U.call(e,d)&&d!==n&&u(e,d,{get:()=>o[d],enumerable:!(m=J(o,d))||m.enumerable});return e};var W=(e,o,n)=>(n=e!=null?Z(Q(e)):{},w(o||!e||!e.__esModule?u(n,"default",{value:e,enumerable:!0}):n,e)),X=e=>w(u({},"__esModule",{value:!0}),e);var ae={};V(ae,{CreditsProductCard:()=>g,default:()=>ee});module.exports=X(ae);var a=require("react/jsx-runtime"),c=W(require("react")),i=require("../../helpers/index.js"),t=require("../../components/index.js"),k=require("./context.js");const Y=()=>(0,a.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,a.jsx)("path",{d:"M8 1L10.163 5.279L15 6.001L11.5 9.409L12.326 14.226L8 11.97L3.674 14.226L4.5 9.409L1 6.001L5.837 5.279L8 1Z",fill:"currentColor"})}),g=c.forwardRef(({product:e,className:o,showTags:n,onLearnMore:m,onShopNow:d,onAddToCart:P,classNames:T,secondaryButtonText:B,secondaryButtonFun:L,primaryButtonText:S,primaryButtonFun:F,showOriginalPrice:z,copy:M,onProductImageClick:D},A)=>{const s=(0,k.useCreditsShelfContext)(),O=n??s?.showTags??!0,$=z??s?.showOriginalPrice??!0,y=M??s?.copy,r=T??s?.classNames,f=B??s?.secondaryButtonText,C=L??s?.secondaryButtonFun,x=S??s?.primaryButtonText,h=F??s?.primaryButtonFun,j=m??s?.onLearnMore,H=d??s?.onShopNow,I=P??s?.onAddToCart,v=D??s?.onProductImageClick,[R,_]=c.useState(!1),[q,E]=c.useState(!1),N=async(l,p)=>{if(!l)return;const b=p==="primary"?_:E;b(!0);try{switch(l){case"buyNow":await H?.(e);break;case"addCart":await I?.(e);break;case"learnMore":await j?.(e);break;default:break}}finally{b(!1)}},G=c.useMemo(()=>e.creditSavingAmount?(y?.creditsSavingLabel??"Save up to {amount} with Credits").replace("{amount}",e.creditSavingAmount):null,[e.creditSavingAmount,y?.creditsSavingLabel]);return(0,a.jsxs)(t.Card,{ref:A,className:(0,i.cn)("bg-container-primary hover:bg-container-secondary-0 box-border flex h-full flex-col overflow-hidden border-none",o,r?.productCard),children:[(0,a.jsxs)(t.CardContent,{className:"lg-desktop:gap-[10px] lg-desktop:px-6 lg-desktop:py-4 relative flex flex-1 flex-col gap-2 p-4",children:[(0,a.jsx)("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:O&&e.tags?.map((l,p)=>l.label?(0,a.jsx)(t.Badge,{size:"sm",variant:l.variant||"outline",className:(0,i.cn)(l.variant==="promotional"?"ml-2":""),promotionalType:l.promotionalType,children:l.label},p):(0,a.jsx)(c.Fragment,{children:l},p))}),(0,a.jsx)("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:(0,a.jsx)("a",{onClick:()=>v?.(e),...!v&&{href:e?.listingLink},rel:"noreferrer",children:(0,a.jsx)(t.Picture,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),(0,a.jsxs)("div",{className:"lg-desktop:gap-6 flex flex-1 grow flex-col justify-between gap-4",children:[(0,a.jsxs)("div",{className:"lg-desktop:gap-1 flex flex-col gap-0.5",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,i.cn)("text-info-primary line-clamp-2 min-h-[2.4em]",r?.productTitle),html:e.custom_name||e.name}),e?.description&&(0,a.jsx)(t.Text,{size:2,className:(0,i.cn)("text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] line-clamp-2 min-h-[2.4em]",r?.productDescription),html:e.custom_description||e.description})]}),(0,a.jsxs)("div",{className:"lg-desktop:gap-2 flex flex-col gap-1.5",children:[(0,a.jsx)("div",{className:(0,i.cn)(r?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-1",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),$&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:(0,i.cn)("text-info-tertiary line-through",r?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:y?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&(0,a.jsx)(t.Text,{size:4,className:(0,i.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",r?.productPriceLabel),children:e.priceLabel}),(0,a.jsxs)("div",{className:(0,i.cn)("lg-desktop:gap-3 flex flex-nowrap gap-2",r?.buttonGroup),children:[f&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,i.cn)("tablet:w-fit w-full",r?.secondaryButton),onClick:()=>N(C,"secondary"),disabled:!e.availableForSale&&C!=="learnMore",loading:q,"data-headless-type-name":"CreditsShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${f}`,"data-headless-sku":e.sku,children:f}),x&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,i.cn)("tablet:w-fit w-full",r?.primaryButton),onClick:()=>N(h,"primary"),disabled:!e.availableForSale&&h!=="learnMore",loading:R,"data-headless-type-name":"CreditsShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${x}`,"data-headless-sku":e.sku,children:x})]})]})]})]}),(0,a.jsxs)("div",{className:(0,i.cn)("bg-container-secondary-0 lg-desktop:px-6 lg-desktop:py-4 flex items-center justify-center gap-1 px-4 py-3",r?.creditTip),children:[(0,a.jsx)("div",{className:"bg-info-primary flex size-6 items-center justify-center rounded-full p-1",children:(0,a.jsx)("span",{className:"text-info-white",children:(0,a.jsx)(Y,{})})}),(0,a.jsx)(t.Text,{size:2,className:"text-info-primary",children:G})]})]})});g.displayName="CreditsShelf.ProductCard";var ee=g;
1
+ "use strict";"use client";var Z=Object.create;var u=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.getPrototypeOf,U=Object.prototype.hasOwnProperty;var V=(e,o)=>{for(var i in o)u(e,i,{get:o[i],enumerable:!0})},N=(e,o,i,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let c of K(o))!U.call(e,c)&&c!==i&&u(e,c,{get:()=>o[c],enumerable:!(m=J(o,c))||m.enumerable});return e};var W=(e,o,i)=>(i=e!=null?Z(Q(e)):{},N(o||!e||!e.__esModule?u(i,"default",{value:e,enumerable:!0}):i,e)),X=e=>N(u({},"__esModule",{value:!0}),e);var ae={};V(ae,{CreditsProductCard:()=>g,default:()=>ee});module.exports=X(ae);var a=require("react/jsx-runtime"),d=W(require("react")),s=require("../../helpers/index.js"),t=require("../../components/index.js"),k=require("./context.js");const Y=()=>(0,a.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,a.jsx)("path",{d:"M8 1L10.163 5.279L15 6.001L11.5 9.409L12.326 14.226L8 11.97L3.674 14.226L4.5 9.409L1 6.001L5.837 5.279L8 1Z",fill:"currentColor"})}),g=d.forwardRef(({product:e,className:o,showTags:i,onLearnMore:m,onShopNow:c,onAddToCart:P,classNames:T,secondaryButtonText:B,secondaryButtonFun:L,primaryButtonText:S,primaryButtonFun:F,showOriginalPrice:z,copy:M,onProductImageClick:D},A)=>{const n=(0,k.useCreditsShelfContext)(),O=i??n?.showTags??!0,$=z??n?.showOriginalPrice??!0,f=M??n?.copy,r=T??n?.classNames,y=B??n?.secondaryButtonText,h=L??n?.secondaryButtonFun,x=S??n?.primaryButtonText,C=F??n?.primaryButtonFun,j=m??n?.onLearnMore,H=c??n?.onShopNow,I=P??n?.onAddToCart,v=D??n?.onProductImageClick,[R,_]=d.useState(!1),[q,E]=d.useState(!1),w=async(l,p)=>{if(!l)return;const b=p==="primary"?_:E;b(!0);try{switch(l){case"buyNow":await H?.(e);break;case"addCart":await I?.(e);break;case"learnMore":await j?.(e);break;default:break}}finally{b(!1)}},G=d.useMemo(()=>e.creditSavingAmount?(f?.creditsSavingLabel??"Save up to {amount} with Credits").replace("{amount}",e.creditSavingAmount):null,[e.creditSavingAmount,f?.creditsSavingLabel]);return(0,a.jsxs)(t.Card,{ref:A,className:(0,s.cn)("bg-container-primary hover:bg-container-secondary-0 box-border flex h-full flex-col overflow-hidden border-none",o,r?.productCard),children:[(0,a.jsxs)(t.CardContent,{className:"lg-desktop:gap-[10px] lg-desktop:px-6 lg-desktop:py-4 relative flex flex-1 flex-col gap-2 p-4",children:[(0,a.jsx)("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:O&&e.tags?.map((l,p)=>l.label?(0,a.jsx)(t.Badge,{size:"sm",variant:l.variant||"outline",className:(0,s.cn)(l.variant==="promotional"?"ml-2":""),promotionalType:l.promotionalType,children:l.label},p):(0,a.jsx)(d.Fragment,{children:l},p))}),(0,a.jsx)("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:(0,a.jsx)("a",{onClick:()=>v?.(e),...!v&&{href:e?.listingLink},rel:"noreferrer",children:(0,a.jsx)(t.Picture,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),(0,a.jsxs)("div",{className:"lg-desktop:gap-6 flex flex-1 grow flex-col justify-between gap-4",children:[(0,a.jsxs)("div",{className:"lg-desktop:gap-1 flex flex-col gap-0.5",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,s.cn)("text-info-primary line-clamp-2 min-h-[2.4em]",r?.productTitle),html:e.custom_name||e.name}),e?.description&&(0,a.jsx)(t.Text,{size:2,className:(0,s.cn)("text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] line-clamp-2 min-h-[2.4em]",r?.productDescription),html:e.custom_description||e.description})]}),(0,a.jsxs)("div",{className:"lg-desktop:gap-2 flex flex-col gap-1.5",children:[(0,a.jsx)("div",{className:(0,s.cn)(r?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-1",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),$&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:(0,s.cn)("text-info-tertiary line-through",r?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:f?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&(0,a.jsx)(t.Text,{size:4,className:(0,s.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] text-[14px]",r?.productPriceLabel),children:e.priceLabel}),(0,a.jsxs)("div",{className:(0,s.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",r?.buttonGroup),children:[y&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,s.cn)("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",r?.secondaryButton),onClick:()=>w(h,"secondary"),disabled:!e.availableForSale&&h!=="learnMore",loading:q,"data-headless-type-name":"CreditsShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${y}`,"data-headless-sku":e.sku,children:y}),x&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,s.cn)("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",r?.primaryButton),onClick:()=>w(C,"primary"),disabled:!e.availableForSale&&C!=="learnMore",loading:R,"data-headless-type-name":"CreditsShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${x}`,"data-headless-sku":e.sku,children:x})]})]})]})]}),(0,a.jsxs)("div",{className:(0,s.cn)("bg-container-secondary-0 lg-desktop:px-6 lg-desktop:py-4 flex items-center justify-center gap-1 px-4 py-3",r?.creditTip),children:[(0,a.jsx)("div",{className:"bg-info-primary flex size-6 items-center justify-center rounded-full p-1",children:(0,a.jsx)("span",{className:"text-info-white",children:(0,a.jsx)(Y,{})})}),(0,a.jsx)(t.Text,{size:2,className:"text-info-primary",children:G})]})]})});g.displayName="CreditsShelf.ProductCard";var ee=g;
2
2
  //# sourceMappingURL=ProductCard.js.map
package/dist/cjs/biz-components/CreditsShelf/ProductCard.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/CreditsShelf/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 } from '../../components/index.js'\n\nimport type { ButtonFunctionType, CopyConfig, CreditsShelfSemanticName, CreditsProductCardData } from './types.js'\nimport { useCreditsShelfContext } from './context.js'\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6 Props\n */\nexport interface CreditsProductCardProps {\n /** \u4EA7\u54C1\u6570\u636E */\n product: CreditsProductCardData\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: CreditsProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: CreditsProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: CreditsProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<CreditsShelfSemanticName, 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 /** \u4EA7\u54C1\u56FE\u7247\u70B9\u51FB\u56DE\u8C03 */\n onProductImageClick?: (product: CreditsProductCardData) => void\n}\n\n/**\n * \u661F\u661F\u56FE\u6807\u7EC4\u4EF6\n */\nconst StarIcon = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8 1L10.163 5.279L15 6.001L11.5 9.409L12.326 14.226L8 11.97L3.674 14.226L4.5 9.409L1 6.001L5.837 5.279L8 1Z\"\n fill=\"currentColor\"\n />\n </svg>\n)\n\n/**\n * CreditsShelf \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst CreditsProductCard = React.forwardRef<HTMLDivElement, CreditsProductCardProps>(\n (\n {\n product,\n className,\n showTags: showTagsProp,\n onLearnMore: onLearnMoreProp,\n onShopNow: onShopNowProp,\n onAddToCart: onAddToCartProp,\n classNames: classNamesProp,\n secondaryButtonText: secondaryButtonTextProp,\n secondaryButtonFun: secondaryButtonFunProp,\n primaryButtonText: primaryButtonTextProp,\n primaryButtonFun: primaryButtonFunProp,\n showOriginalPrice: showOriginalPriceProp,\n copy: copyProp,\n onProductImageClick: onProductImageClickProp,\n },\n ref\n ) => {\n // \u4ECE Context \u8BFB\u53D6\u914D\u7F6E\n const context = useCreditsShelfContext()\n\n // Props \u4F18\u5148\u7EA7\u9AD8\u4E8E Context\n const showTags = showTagsProp ?? context?.showTags ?? true\n const showOriginalPrice = showOriginalPriceProp ?? context?.showOriginalPrice ?? true\n const copy = copyProp ?? context?.copy\n const classNames = classNamesProp ?? context?.classNames\n const secondaryButtonText = secondaryButtonTextProp ?? context?.secondaryButtonText\n const secondaryButtonFun = secondaryButtonFunProp ?? context?.secondaryButtonFun\n const primaryButtonText = primaryButtonTextProp ?? context?.primaryButtonText\n const primaryButtonFun = primaryButtonFunProp ?? context?.primaryButtonFun\n const onLearnMore = onLearnMoreProp ?? context?.onLearnMore\n const onShopNow = onShopNowProp ?? context?.onShopNow\n const onAddToCart = onAddToCartProp ?? context?.onAddToCart\n const onProductImageClick = onProductImageClickProp ?? context?.onProductImageClick\n\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\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 // \u751F\u6210\u79EF\u5206\u62B5\u73B0\u63D0\u793A\u6587\u672C\n const creditTipText = React.useMemo(() => {\n if (!product.creditSavingAmount) return null\n const template = copy?.creditsSavingLabel ?? 'Save up to {amount} with Credits'\n return template.replace('{amount}', product.creditSavingAmount)\n }, [product.creditSavingAmount, copy?.creditsSavingLabel])\n\n return (\n <Card\n ref={ref}\n className={cn(\n 'bg-container-primary hover:bg-container-secondary-0 box-border flex h-full flex-col overflow-hidden border-none',\n className,\n classNames?.productCard\n )}\n >\n {/* \u4E3B\u5185\u5BB9\u533A\u57DF */}\n <CardContent className=\"lg-desktop:gap-[10px] lg-desktop:px-6 lg-desktop:py-4 relative flex flex-1 flex-col gap-2 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=\"lg-desktop:gap-6 flex flex-1 grow flex-col justify-between gap-4\">\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className=\"lg-desktop:gap-1 flex flex-col gap-0.5\">\n <Heading\n as=\"h3\"\n size={2}\n className={cn('text-info-primary 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] line-clamp-2 min-h-[2.4em]',\n classNames?.productDescription\n )}\n html={product.custom_description || product.description}\n />\n )}\n </div>\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div className=\"lg-desktop:gap-2 flex flex-col gap-1.5\">\n {/* \u4EF7\u683C */}\n <div className={cn(classNames?.productPrice)}>\n <div className=\"flex items-baseline gap-1\">\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 && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] 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 flex flex-nowrap gap-2', classNames?.buttonGroup)}>\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n size=\"base\"\n className={cn('tablet:w-fit w-full', classNames?.secondaryButton)}\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n data-headless-type-name=\"CreditsShelf#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('tablet:w-fit w-full', classNames?.primaryButton)}\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n data-headless-type-name=\"CreditsShelf#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 </div>\n </div>\n </CardContent>\n\n {/* \u5E95\u90E8\u79EF\u5206\u62B5\u73B0\u63D0\u793A\u6761 */}\n <div\n className={cn(\n 'bg-container-secondary-0 lg-desktop:px-6 lg-desktop:py-4 flex items-center justify-center gap-1 px-4 py-3',\n classNames?.creditTip\n )}\n >\n <div className=\"bg-info-primary flex size-6 items-center justify-center rounded-full p-1\">\n <span className=\"text-info-white\">\n <StarIcon />\n </span>\n </div>\n <Text size={2} className=\"text-info-primary\">\n {creditTipText}\n </Text>\n </div>\n </Card>\n )\n }\n)\n\nCreditsProductCard.displayName = 'CreditsShelf.ProductCard'\n\nexport { CreditsProductCard }\nexport default CreditsProductCard\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading } from '../../components/index.js'\n\nimport type { ButtonFunctionType, CopyConfig, CreditsShelfSemanticName, CreditsProductCardData } from './types.js'\nimport { useCreditsShelfContext } from './context.js'\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6 Props\n */\nexport interface CreditsProductCardProps {\n /** \u4EA7\u54C1\u6570\u636E */\n product: CreditsProductCardData\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: CreditsProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: CreditsProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: CreditsProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<CreditsShelfSemanticName, 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 /** \u4EA7\u54C1\u56FE\u7247\u70B9\u51FB\u56DE\u8C03 */\n onProductImageClick?: (product: CreditsProductCardData) => void\n}\n\n/**\n * \u661F\u661F\u56FE\u6807\u7EC4\u4EF6\n */\nconst StarIcon = () => (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8 1L10.163 5.279L15 6.001L11.5 9.409L12.326 14.226L8 11.97L3.674 14.226L4.5 9.409L1 6.001L5.837 5.279L8 1Z\"\n fill=\"currentColor\"\n />\n </svg>\n)\n\n/**\n * CreditsShelf \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst CreditsProductCard = React.forwardRef<HTMLDivElement, CreditsProductCardProps>(\n (\n {\n product,\n className,\n showTags: showTagsProp,\n onLearnMore: onLearnMoreProp,\n onShopNow: onShopNowProp,\n onAddToCart: onAddToCartProp,\n classNames: classNamesProp,\n secondaryButtonText: secondaryButtonTextProp,\n secondaryButtonFun: secondaryButtonFunProp,\n primaryButtonText: primaryButtonTextProp,\n primaryButtonFun: primaryButtonFunProp,\n showOriginalPrice: showOriginalPriceProp,\n copy: copyProp,\n onProductImageClick: onProductImageClickProp,\n },\n ref\n ) => {\n // \u4ECE Context \u8BFB\u53D6\u914D\u7F6E\n const context = useCreditsShelfContext()\n\n // Props \u4F18\u5148\u7EA7\u9AD8\u4E8E Context\n const showTags = showTagsProp ?? context?.showTags ?? true\n const showOriginalPrice = showOriginalPriceProp ?? context?.showOriginalPrice ?? true\n const copy = copyProp ?? context?.copy\n const classNames = classNamesProp ?? context?.classNames\n const secondaryButtonText = secondaryButtonTextProp ?? context?.secondaryButtonText\n const secondaryButtonFun = secondaryButtonFunProp ?? context?.secondaryButtonFun\n const primaryButtonText = primaryButtonTextProp ?? context?.primaryButtonText\n const primaryButtonFun = primaryButtonFunProp ?? context?.primaryButtonFun\n const onLearnMore = onLearnMoreProp ?? context?.onLearnMore\n const onShopNow = onShopNowProp ?? context?.onShopNow\n const onAddToCart = onAddToCartProp ?? context?.onAddToCart\n const onProductImageClick = onProductImageClickProp ?? context?.onProductImageClick\n\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\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 // \u751F\u6210\u79EF\u5206\u62B5\u73B0\u63D0\u793A\u6587\u672C\n const creditTipText = React.useMemo(() => {\n if (!product.creditSavingAmount) return null\n const template = copy?.creditsSavingLabel ?? 'Save up to {amount} with Credits'\n return template.replace('{amount}', product.creditSavingAmount)\n }, [product.creditSavingAmount, copy?.creditsSavingLabel])\n\n return (\n <Card\n ref={ref}\n className={cn(\n 'bg-container-primary hover:bg-container-secondary-0 box-border flex h-full flex-col overflow-hidden border-none',\n className,\n classNames?.productCard\n )}\n >\n {/* \u4E3B\u5185\u5BB9\u533A\u57DF */}\n <CardContent className=\"lg-desktop:gap-[10px] lg-desktop:px-6 lg-desktop:py-4 relative flex flex-1 flex-col gap-2 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=\"lg-desktop:gap-6 flex flex-1 grow flex-col justify-between gap-4\">\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className=\"lg-desktop:gap-1 flex flex-col gap-0.5\">\n <Heading\n as=\"h3\"\n size={2}\n className={cn('text-info-primary 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] line-clamp-2 min-h-[2.4em]',\n classNames?.productDescription\n )}\n html={product.custom_description || product.description}\n />\n )}\n </div>\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div className=\"lg-desktop:gap-2 flex flex-col gap-1.5\">\n {/* \u4EF7\u683C */}\n <div className={cn(classNames?.productPrice)}>\n <div className=\"flex items-baseline gap-1\">\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 && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] 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=\"CreditsShelf#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=\"CreditsShelf#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 </div>\n </div>\n </CardContent>\n\n {/* \u5E95\u90E8\u79EF\u5206\u62B5\u73B0\u63D0\u793A\u6761 */}\n <div\n className={cn(\n 'bg-container-secondary-0 lg-desktop:px-6 lg-desktop:py-4 flex items-center justify-center gap-1 px-4 py-3',\n classNames?.creditTip\n )}\n >\n <div className=\"bg-info-primary flex size-6 items-center justify-center rounded-full p-1\">\n <span className=\"text-info-white\">\n <StarIcon />\n </span>\n </div>\n <Text size={2} className=\"text-info-primary\">\n {creditTipText}\n </Text>\n </div>\n </Card>\n )\n }\n)\n\nCreditsProductCard.displayName = 'CreditsShelf.ProductCard'\n\nexport { CreditsProductCard }\nexport default CreditsProductCard\n"],
5
+ "mappings": "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",
6
6
  "names": ["ProductCard_exports", "__export", "CreditsProductCard", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import_context", "StarIcon", "product", "className", "showTagsProp", "onLearnMoreProp", "onShopNowProp", "onAddToCartProp", "classNamesProp", "secondaryButtonTextProp", "secondaryButtonFunProp", "primaryButtonTextProp", "primaryButtonFunProp", "showOriginalPriceProp", "copyProp", "onProductImageClickProp", "ref", "context", "showTags", "showOriginalPrice", "copy", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "creditTipText", "tag", "index"]
7
7
  }
package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var E=Object.create;var p=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,V=Object.prototype.hasOwnProperty;var q=(e,i)=>{for(var l in i)p(e,l,{get:i[l],enumerable:!0})},L=(e,i,l,m)=>{if(i&&typeof i=="object"||typeof i=="function")for(let n of H(i))!V.call(e,n)&&n!==l&&p(e,n,{get:()=>i[n],enumerable:!(m=F(i,n))||m.enumerable});return e};var f=(e,i,l)=>(l=e!=null?E(G(e)):{},L(i||!e||!e.__esModule?p(l,"default",{value:e,enumerable:!0}):l,e)),A=e=>L(p({},"__esModule",{value:!0}),e);var Q={};q(Q,{ProductCard:()=>x,default:()=>K});module.exports=A(Q);var t=require("react/jsx-runtime"),d=f(require("react")),o=require("../../helpers/utils.js"),S=f(require("../../components/badge.js")),y=require("../../components/text.js"),h=f(require("../../components/button.js")),O=f(require("../../components/picture.js")),N=require("../../components/heading.js");const J={center:"object-center",top:"object-top",bottom:"object-bottom",left:"object-left",right:"object-right","top-left":"object-left-top","top-right":"object-right-top","bottom-left":"object-left-bottom","bottom-right":"object-right-bottom"},x=d.forwardRef(({product:e,className:i,showTags:l=!0,showOriginalPrice:m=!0,onLearnMore:n,onShopNow:$,onAddToCart:z,onProductImageClick:k,classNames:a,secondaryButtonText:g,secondaryButtonFun:P,primaryButtonText:v,primaryButtonFun:j,copy:I},M)=>{const[T,_]=d.useState(!1),[B,R]=d.useState(!1),u=!e.availableForSale,w=async(r,b)=>{if(!r)return;const C=b==="primary"?_:R;C(!0);try{switch(r){case"buyNow":await $?.(e);break;case"addCart":await z?.(e);break;case"learnMore":await n?.(e);break;default:break}}finally{C(!1)}},s=e.custom_name||e.name,c=e.custom_description||e.description,D=e.custom_theme??"dark";return(0,t.jsx)("div",{ref:M,className:(0,o.cn)("rounded-box relative box-border w-full cursor-pointer overflow-hidden duration-300","desktop:h-[384px] lg-desktop:h-[480px] h-[360px]","tablet:min-w-[auto] min-w-[276px] max-w-[824px]",{"aiui-dark":D==="dark"},i,a?.productCard),children:(0,t.jsxs)("div",{className:"box-border flex h-full flex-col justify-between overflow-hidden",children:[(0,t.jsx)("a",{onClick:()=>k?.(e),...!k&&e.listingLink&&{href:e.listingLink},rel:"noreferrer",className:(0,o.cn)("absolute inset-0",a?.productImage),children:(0,t.jsx)(O.default,{alt:e.name,source:e.custom_image??e.image,className:(0,o.cn)("rounded-box h-full overflow-hidden object-cover transition-all duration-300 [&_img]:size-full"),imgClassName:(0,o.cn)("object-cover",J[e.imageObjectPosition??"center"])})}),(0,t.jsxs)("div",{className:(0,o.cn)("desktop:p-6 collection-shelves-product-content pointer-events-none z-10 box-border flex flex-1 flex-col justify-end overflow-hidden p-4",a?.productContent),children:[l&&e.tags?.length?(0,t.jsx)("div",{className:(0,o.cn)("mb-2 box-border flex flex-wrap gap-1 overflow-visible",a?.tagsContainer),children:e.tags.map((r,b)=>r.label?(0,t.jsx)(S.default,{size:"sm",variant:r.variant||"outline",promotionalType:r.promotionalType,children:r.label},b):d.isValidElement(r)&&(0,t.jsx)(d.Fragment,{children:r},b))}):null,s?(0,t.jsx)(N.Heading,{as:"h3",title:s,html:s,className:(0,o.cn)("lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl text-info-primary tablet:leading-6 line-clamp-2 text-base font-bold",a?.productTitle)}):null,c?(0,t.jsx)(y.Text,{size:2,html:c,className:(0,o.cn)("lg-desktop:text-lg desktop:text-base text-info-primary line-clamp-1 text-sm font-bold",a?.productDescription)}):null,(0,t.jsx)("div",{className:(0,o.cn)("mb-1 mt-4 flex items-center",a?.priceContainer),children:u?(0,t.jsx)("div",{className:(0,o.cn)("tablet:text-xl text-info-primary text-xl font-bold",a?.productPrice),children:I?.outOfStockLabel??"Sold Out"}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:(0,o.cn)("tablet:text-xl text-info-primary text-xl font-bold",a?.productPrice),children:e.price}),m&&e.originalPrice&&(0,t.jsx)("div",{className:(0,o.cn)("tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",a?.originalPrice),children:e.originalPrice})]})}),e?.priceLabel&&(0,t.jsx)(y.Text,{size:4,className:(0,o.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",a?.productPriceLabel),children:e.priceLabel}),(0,t.jsxs)("div",{className:(0,o.cn)("lg-desktop:gap-3 pointer-events-auto flex items-center gap-2",a?.buttonGroup),children:[g&&(0,t.jsx)(h.default,{variant:"secondary",onClick:()=>w(P,"secondary"),disabled:u&&P!=="learnMore",loading:B,className:(0,o.cn)(a?.secondaryButton),"data-headless-type-name":"ImageOverlayShelf#ProductCard","data-headless-title-desc-button":`${s}#${c||""}#${g}`,"data-headless-sku":e.sku,children:g}),v&&(0,t.jsx)(h.default,{variant:"primary",onClick:()=>w(j,"primary"),disabled:u&&j!=="learnMore",loading:T,className:(0,o.cn)(a?.primaryButton),"data-headless-type-name":"ImageOverlayShelf#ProductCard","data-headless-title-desc-button":`${s}#${c||""}#${v}`,"data-headless-sku":e.sku,children:v})]})]})]})})});x.displayName="ImageOverlayShelf.ProductCard";var K=x;
1
+ "use strict";"use client";var E=Object.create;var p=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,V=Object.prototype.hasOwnProperty;var q=(e,i)=>{for(var l in i)p(e,l,{get:i[l],enumerable:!0})},L=(e,i,l,m)=>{if(i&&typeof i=="object"||typeof i=="function")for(let n of H(i))!V.call(e,n)&&n!==l&&p(e,n,{get:()=>i[n],enumerable:!(m=F(i,n))||m.enumerable});return e};var f=(e,i,l)=>(l=e!=null?E(G(e)):{},L(i||!e||!e.__esModule?p(l,"default",{value:e,enumerable:!0}):l,e)),A=e=>L(p({},"__esModule",{value:!0}),e);var Q={};q(Q,{ProductCard:()=>x,default:()=>K});module.exports=A(Q);var t=require("react/jsx-runtime"),d=f(require("react")),a=require("../../helpers/utils.js"),S=f(require("../../components/badge.js")),u=require("../../components/text.js"),y=f(require("../../components/button.js")),O=f(require("../../components/picture.js")),N=require("../../components/heading.js");const J={center:"object-center",top:"object-top",bottom:"object-bottom",left:"object-left",right:"object-right","top-left":"object-left-top","top-right":"object-right-top","bottom-left":"object-left-bottom","bottom-right":"object-right-bottom"},x=d.forwardRef(({product:e,className:i,showTags:l=!0,showOriginalPrice:m=!0,onLearnMore:n,onShopNow:$,onAddToCart:z,onProductImageClick:k,classNames:o,secondaryButtonText:g,secondaryButtonFun:w,primaryButtonText:h,primaryButtonFun:P,copy:I},M)=>{const[T,_]=d.useState(!1),[B,R]=d.useState(!1),v=!e.availableForSale,j=async(r,b)=>{if(!r)return;const C=b==="primary"?_:R;C(!0);try{switch(r){case"buyNow":await $?.(e);break;case"addCart":await z?.(e);break;case"learnMore":await n?.(e);break;default:break}}finally{C(!1)}},s=e.custom_name||e.name,c=e.custom_description||e.description,D=e.custom_theme??"dark";return(0,t.jsx)("div",{ref:M,className:(0,a.cn)("rounded-box relative box-border w-full cursor-pointer overflow-hidden duration-300","desktop:h-[384px] lg-desktop:h-[480px] h-[360px]","tablet:min-w-[auto] min-w-[276px] max-w-[824px]",{"aiui-dark":D==="dark"},i,o?.productCard),children:(0,t.jsxs)("div",{className:"box-border flex h-full flex-col justify-between overflow-hidden",children:[(0,t.jsx)("a",{onClick:()=>k?.(e),...!k&&e.listingLink&&{href:e.listingLink},rel:"noreferrer",className:(0,a.cn)("absolute inset-0",o?.productImage),children:(0,t.jsx)(O.default,{alt:e.name,source:e.custom_image??e.image,className:(0,a.cn)("rounded-box h-full overflow-hidden object-cover transition-all duration-300 [&_img]:size-full"),imgClassName:(0,a.cn)("object-cover",J[e.imageObjectPosition??"center"])})}),(0,t.jsxs)("div",{className:(0,a.cn)("desktop:p-6 collection-shelves-product-content pointer-events-none z-10 box-border flex flex-1 flex-col justify-end overflow-hidden p-4",o?.productContent),children:[l&&e.tags?.length?(0,t.jsx)("div",{className:(0,a.cn)("mb-2 box-border flex flex-wrap gap-1 overflow-visible",o?.tagsContainer),children:e.tags.map((r,b)=>r.label?(0,t.jsx)(S.default,{size:"sm",variant:r.variant||"outline",promotionalType:r.promotionalType,children:r.label},b):d.isValidElement(r)&&(0,t.jsx)(d.Fragment,{children:r},b))}):null,s?(0,t.jsx)(N.Heading,{as:"h3",title:s,html:s,className:(0,a.cn)("lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl text-info-primary tablet:leading-6 line-clamp-2 text-base font-bold",o?.productTitle)}):null,c?(0,t.jsx)(u.Text,{size:2,html:c,className:(0,a.cn)("lg-desktop:text-lg desktop:text-base text-info-primary line-clamp-1 text-sm font-bold",o?.productDescription)}):null,(0,t.jsx)("div",{className:(0,a.cn)("mb-1 mt-4 flex items-center",o?.priceContainer),children:v?(0,t.jsx)("div",{className:(0,a.cn)("tablet:text-xl text-info-primary text-xl font-bold",o?.productPrice),children:I?.outOfStockLabel??"Sold Out"}):(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:(0,a.cn)("tablet:text-xl text-info-primary text-xl font-bold",o?.productPrice),children:e.price}),m&&e.originalPrice&&(0,t.jsx)("div",{className:(0,a.cn)("tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through",o?.originalPrice),children:e.originalPrice})]})}),e?.priceLabel&&(0,t.jsx)(u.Text,{size:4,className:(0,a.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",o?.productPriceLabel),children:e.priceLabel}),(0,t.jsxs)("div",{className:(0,a.cn)("lg-desktop:gap-3 pointer-events-auto flex items-stretch gap-2",o?.buttonGroup),children:[g&&(0,t.jsx)(y.default,{variant:"secondary",onClick:()=>j(w,"secondary"),disabled:v&&w!=="learnMore",loading:B,className:(0,a.cn)("min-w-0 whitespace-normal text-center",o?.secondaryButton),"data-headless-type-name":"ImageOverlayShelf#ProductCard","data-headless-title-desc-button":`${s}#${c||""}#${g}`,"data-headless-sku":e.sku,children:g}),h&&(0,t.jsx)(y.default,{variant:"primary",onClick:()=>j(P,"primary"),disabled:v&&P!=="learnMore",loading:T,className:(0,a.cn)("min-w-0 whitespace-normal text-center",o?.primaryButton),"data-headless-type-name":"ImageOverlayShelf#ProductCard","data-headless-title-desc-button":`${s}#${c||""}#${h}`,"data-headless-sku":e.sku,children:h})]})]})]})})});x.displayName="ImageOverlayShelf.ProductCard";var K=x;
2
2
  //# sourceMappingURL=ProductCard.js.map
package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ImageOverlayShelf/ProductCard.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\n\nimport Badge from '../../components/badge.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ProductCardProps, ButtonFunctionType, ImageObjectPosition } from './types.js'\n\n/**\n * \u56FE\u7247\u88C1\u5207\u4F4D\u7F6E\u6620\u5C04\n */\nconst objectPositionClassMap: Record<ImageObjectPosition, string> = {\n center: 'object-center',\n top: 'object-top',\n bottom: 'object-bottom',\n left: 'object-left',\n right: 'object-right',\n 'top-left': 'object-left-top',\n 'top-right': 'object-right-top',\n 'bottom-left': 'object-left-bottom',\n 'bottom-right': 'object-right-bottom',\n}\n\n/**\n * ProductCard - ImageOverlayShelf \u7684\u5355\u4E2A\u4EA7\u54C1\u5361\u7247\n * \u56FE\u6587\u53E0\u52A0\u6837\u5F0F\uFF0C\u80CC\u666F\u56FE\u5B8C\u5168\u8986\u76D6\u5361\u7247\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n product,\n className,\n showTags = true,\n showOriginalPrice = true,\n onLearnMore,\n onShopNow,\n onAddToCart,\n onProductImageClick,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n copy,\n },\n ref\n ) => {\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n const isSoldOut = !product.availableForSale\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 displayTitle = product.custom_name || product.name\n const displayDescription = product.custom_description || product.description\n const theme = product.custom_theme ?? 'dark'\n\n return (\n <div\n ref={ref}\n className={cn(\n 'rounded-box relative box-border w-full cursor-pointer overflow-hidden duration-300',\n 'desktop:h-[384px] lg-desktop:h-[480px] h-[360px]',\n 'tablet:min-w-[auto] min-w-[276px] max-w-[824px]',\n {\n 'aiui-dark': theme === 'dark',\n },\n className,\n classNames?.productCard\n )}\n >\n <div className=\"box-border flex h-full flex-col justify-between overflow-hidden\">\n {/* \u80CC\u666F\u56FE */}\n <a\n onClick={() => onProductImageClick?.(product)}\n {...(!onProductImageClick &&\n product.listingLink && {\n href: product.listingLink,\n })}\n rel=\"noreferrer\"\n className={cn('absolute inset-0', classNames?.productImage)}\n >\n <Picture\n alt={product.name}\n source={product.custom_image ?? product.image}\n className={cn(\n 'rounded-box h-full overflow-hidden object-cover transition-all duration-300 [&_img]:size-full'\n )}\n imgClassName={cn('object-cover', objectPositionClassMap[product.imageObjectPosition ?? 'center'])}\n />\n </a>\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div\n className={cn(\n 'desktop:p-6 collection-shelves-product-content pointer-events-none z-10 box-border flex flex-1 flex-col justify-end overflow-hidden p-4',\n classNames?.productContent\n )}\n >\n {/* \u6807\u7B7E */}\n {showTags && product.tags?.length ? (\n <div className={cn('mb-2 box-border flex flex-wrap gap-1 overflow-visible', classNames?.tagsContainer)}>\n {product.tags.map((tag: any, index: number) =>\n (tag as any).label ? (\n <Badge\n key={index}\n size=\"sm\"\n variant={(tag.variant as any) || 'outline'}\n promotionalType={tag.promotionalType}\n >\n {tag.label}\n </Badge>\n ) : (\n React.isValidElement(tag) && <React.Fragment key={index}>{tag}</React.Fragment>\n )\n )}\n </div>\n ) : null}\n\n {/* \u4EA7\u54C1\u6807\u9898 */}\n {displayTitle ? (\n <Heading\n as=\"h3\"\n title={displayTitle}\n html={displayTitle}\n className={cn(\n 'lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl text-info-primary tablet:leading-6 line-clamp-2 text-base font-bold',\n classNames?.productTitle\n )}\n />\n ) : null}\n\n {/* \u4EA7\u54C1\u63CF\u8FF0 */}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription}\n className={cn(\n 'lg-desktop:text-lg desktop:text-base text-info-primary line-clamp-1 text-sm font-bold',\n classNames?.productDescription\n )}\n />\n ) : null}\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div className={cn('mb-1 mt-4 flex items-center', classNames?.priceContainer)}>\n {isSoldOut ? (\n <div className={cn('tablet:text-xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n {copy?.outOfStockLabel ?? 'Sold Out'}\n </div>\n ) : (\n <>\n <div className={cn('tablet:text-xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n {product.price}\n </div>\n {showOriginalPrice && product.originalPrice && (\n <div\n className={cn(\n 'tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through',\n classNames?.originalPrice\n )}\n >\n {product.originalPrice}\n </div>\n )}\n </>\n )}\n </div>\n\n {/** \u4EF7\u683C\u6807\u7B7E */}\n {product?.priceLabel && (\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\n className={cn('lg-desktop:gap-3 pointer-events-auto flex items-center gap-2', classNames?.buttonGroup)}\n >\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={isSoldOut && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n className={cn(classNames?.secondaryButton)}\n data-headless-type-name=\"ImageOverlayShelf#ProductCard\"\n data-headless-title-desc-button={`${displayTitle}#${displayDescription || ''}#${secondaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {secondaryButtonText}\n </Button>\n )}\n {primaryButtonText && (\n <Button\n variant=\"primary\"\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={isSoldOut && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n className={cn(classNames?.primaryButton)}\n data-headless-type-name=\"ImageOverlayShelf#ProductCard\"\n data-headless-title-desc-button={`${displayTitle}#${displayDescription || ''}#${primaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {primaryButtonText}\n </Button>\n )}\n </div>\n </div>\n </div>\n </div>\n )\n }\n)\n\nProductCard.displayName = 'ImageOverlayShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\n\nimport Badge from '../../components/badge.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport Picture from '../../components/picture.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ProductCardProps, ButtonFunctionType, ImageObjectPosition } from './types.js'\n\n/**\n * \u56FE\u7247\u88C1\u5207\u4F4D\u7F6E\u6620\u5C04\n */\nconst objectPositionClassMap: Record<ImageObjectPosition, string> = {\n center: 'object-center',\n top: 'object-top',\n bottom: 'object-bottom',\n left: 'object-left',\n right: 'object-right',\n 'top-left': 'object-left-top',\n 'top-right': 'object-right-top',\n 'bottom-left': 'object-left-bottom',\n 'bottom-right': 'object-right-bottom',\n}\n\n/**\n * ProductCard - ImageOverlayShelf \u7684\u5355\u4E2A\u4EA7\u54C1\u5361\u7247\n * \u56FE\u6587\u53E0\u52A0\u6837\u5F0F\uFF0C\u80CC\u666F\u56FE\u5B8C\u5168\u8986\u76D6\u5361\u7247\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n product,\n className,\n showTags = true,\n showOriginalPrice = true,\n onLearnMore,\n onShopNow,\n onAddToCart,\n onProductImageClick,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n copy,\n },\n ref\n ) => {\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n const isSoldOut = !product.availableForSale\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 displayTitle = product.custom_name || product.name\n const displayDescription = product.custom_description || product.description\n const theme = product.custom_theme ?? 'dark'\n\n return (\n <div\n ref={ref}\n className={cn(\n 'rounded-box relative box-border w-full cursor-pointer overflow-hidden duration-300',\n 'desktop:h-[384px] lg-desktop:h-[480px] h-[360px]',\n 'tablet:min-w-[auto] min-w-[276px] max-w-[824px]',\n {\n 'aiui-dark': theme === 'dark',\n },\n className,\n classNames?.productCard\n )}\n >\n <div className=\"box-border flex h-full flex-col justify-between overflow-hidden\">\n {/* \u80CC\u666F\u56FE */}\n <a\n onClick={() => onProductImageClick?.(product)}\n {...(!onProductImageClick &&\n product.listingLink && {\n href: product.listingLink,\n })}\n rel=\"noreferrer\"\n className={cn('absolute inset-0', classNames?.productImage)}\n >\n <Picture\n alt={product.name}\n source={product.custom_image ?? product.image}\n className={cn(\n 'rounded-box h-full overflow-hidden object-cover transition-all duration-300 [&_img]:size-full'\n )}\n imgClassName={cn('object-cover', objectPositionClassMap[product.imageObjectPosition ?? 'center'])}\n />\n </a>\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div\n className={cn(\n 'desktop:p-6 collection-shelves-product-content pointer-events-none z-10 box-border flex flex-1 flex-col justify-end overflow-hidden p-4',\n classNames?.productContent\n )}\n >\n {/* \u6807\u7B7E */}\n {showTags && product.tags?.length ? (\n <div className={cn('mb-2 box-border flex flex-wrap gap-1 overflow-visible', classNames?.tagsContainer)}>\n {product.tags.map((tag: any, index: number) =>\n (tag as any).label ? (\n <Badge\n key={index}\n size=\"sm\"\n variant={(tag.variant as any) || 'outline'}\n promotionalType={tag.promotionalType}\n >\n {tag.label}\n </Badge>\n ) : (\n React.isValidElement(tag) && <React.Fragment key={index}>{tag}</React.Fragment>\n )\n )}\n </div>\n ) : null}\n\n {/* \u4EA7\u54C1\u6807\u9898 */}\n {displayTitle ? (\n <Heading\n as=\"h3\"\n title={displayTitle}\n html={displayTitle}\n className={cn(\n 'lg-desktop:text-2xl lg-desktop:leading-7 tablet:text-xl text-info-primary tablet:leading-6 line-clamp-2 text-base font-bold',\n classNames?.productTitle\n )}\n />\n ) : null}\n\n {/* \u4EA7\u54C1\u63CF\u8FF0 */}\n {displayDescription ? (\n <Text\n size={2}\n html={displayDescription}\n className={cn(\n 'lg-desktop:text-lg desktop:text-base text-info-primary line-clamp-1 text-sm font-bold',\n classNames?.productDescription\n )}\n />\n ) : null}\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div className={cn('mb-1 mt-4 flex items-center', classNames?.priceContainer)}>\n {isSoldOut ? (\n <div className={cn('tablet:text-xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n {copy?.outOfStockLabel ?? 'Sold Out'}\n </div>\n ) : (\n <>\n <div className={cn('tablet:text-xl text-info-primary text-xl font-bold', classNames?.productPrice)}>\n {product.price}\n </div>\n {showOriginalPrice && product.originalPrice && (\n <div\n className={cn(\n 'tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through',\n classNames?.originalPrice\n )}\n >\n {product.originalPrice}\n </div>\n )}\n </>\n )}\n </div>\n\n {/** \u4EF7\u683C\u6807\u7B7E */}\n {product?.priceLabel && (\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\n className={cn('lg-desktop:gap-3 pointer-events-auto flex items-stretch gap-2', classNames?.buttonGroup)}\n >\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={isSoldOut && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n className={cn('min-w-0 whitespace-normal text-center', classNames?.secondaryButton)}\n data-headless-type-name=\"ImageOverlayShelf#ProductCard\"\n data-headless-title-desc-button={`${displayTitle}#${displayDescription || ''}#${secondaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {secondaryButtonText}\n </Button>\n )}\n {primaryButtonText && (\n <Button\n variant=\"primary\"\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={isSoldOut && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n className={cn('min-w-0 whitespace-normal text-center', classNames?.primaryButton)}\n data-headless-type-name=\"ImageOverlayShelf#ProductCard\"\n data-headless-title-desc-button={`${displayTitle}#${displayDescription || ''}#${primaryButtonText}`}\n data-headless-sku={product.sku}\n >\n {primaryButtonText}\n </Button>\n )}\n </div>\n </div>\n </div>\n </div>\n )\n }\n)\n\nProductCard.displayName = 'ImageOverlayShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
5
+ "mappings": "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",
6
6
  "names": ["ProductCard_exports", "__export", "ProductCard", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "React", "import_utils", "import_badge", "import_text", "import_button", "import_picture", "import_heading", "objectPositionClassMap", "product", "className", "showTags", "showOriginalPrice", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "copy", "ref", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "isSoldOut", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "displayTitle", "displayDescription", "theme", "Picture", "tag", "index", "Badge", "Button"]
7
7
  }
package/dist/cjs/biz-components/MediaShelf/ProductCard.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var _=Object.create;var u=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var H=(e,i)=>{for(var r in i)u(e,r,{get:i[r],enumerable:!0})},C=(e,i,r,d)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of q(i))!E.call(e,o)&&o!==r&&u(e,o,{get:()=>i[o],enumerable:!(d=A(i,o))||d.enumerable});return e};var R=(e,i,r)=>(r=e!=null?_($(e)):{},C(i||!e||!e.__esModule?u(r,"default",{value:e,enumerable:!0}):r,e)),I=e=>C(u({},"__esModule",{value:!0}),e);var K={};H(K,{ProductCard:()=>b,default:()=>j});module.exports=I(K);var a=require("react/jsx-runtime"),c=R(require("react")),n=require("../../helpers/index.js"),t=require("../../components/index.js");const O=5;function G(e,i,r,d){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:r<=i;case"below-percentage":return i===void 0?!0:r/d*100<=i;default:return!0}}const b=c.forwardRef(({product:e,className:i,stockDisplayMode:r,stockThresholdValue:d,onLearnMore:o,onShopNow:S,onAddToCart:w,classNames:l,secondaryButtonText:p,secondaryButtonFun:v,primaryButtonText:y,primaryButtonFun:h,showOriginalPrice:P,copy:g,onProductImageClick:m,showTags:N=!0},M)=>{const[F,L]=c.useState(!1),[B,D]=c.useState(!1),T=c.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?O:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),x=async(s,f)=>{if(!s)return;const k=f==="primary"?L:D;k(!0);try{switch(s){case"buyNow":await S?.(e);break;case"addCart":await w?.(e);break;case"learnMore":await o?.(e);break;default:break}}finally{k(!1)}},z=e.availableForSale&&e.quantityAvailable<=0;return(0,a.jsxs)(t.Card,{ref:M,className:(0,n.cn)("tablet:min-w-[auto] hover:bg-container-secondary-0 flex h-full min-w-[296px] flex-col overflow-hidden border-none",e.custom_link?"cursor-pointer":"",i,l?.productCard),children:[(0,a.jsxs)("div",{className:(0,n.cn)("media-shelf-product-card-image-wrapper desktop:h-[240px] relative h-[200px] shrink-0 overflow-hidden",l?.productCardImageWrapper),children:[(0,a.jsx)("div",{className:(0,n.cn)("media-shelf-product-card-image-bg absolute inset-0 ",l?.productCardImageBg),children:(0,a.jsx)("a",{onClick:()=>m?.(e),...!m&&{href:e.custom_link||e.listingLink},className:"cursor-pointer",children:(0,a.jsx)(t.Picture,{source:e.custom_image||e.image,alt:e.name,className:(0,n.cn)("h-full",l?.productCardImage),imgClassName:"h-full object-contain"})})}),N&&e.tags&&e.tags.length>0&&(0,a.jsx)("div",{className:"lg-desktop:h-[28px] absolute left-4 top-4 flex h-[24px]",children:e.tags.map((s,f)=>s.label?(0,a.jsx)(t.Badge,{size:"sm",variant:s.variant||"outline",className:(0,n.cn)("mr-1"),promotionalType:s.promotionalType,children:s.label},f):(0,a.jsx)(c.Fragment,{children:s},f))})]}),(0,a.jsxs)(t.CardContent,{className:"desktop:p-6 bg-container-primary laptop:gap-6 flex h-[calc(100%-240px)] grow flex-col justify-between gap-4 p-4",children:[(0,a.jsxs)("div",{className:"flex-0",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary mb-1 line-clamp-2 tracking-tight",m?"cursor-pointer":"",l?.productTitle),onClick:m?()=>m(e):void 0,children:e.custom_name||e.name}),(e.custom_description||e?.description)&&(0,a.jsx)(t.Text,{size:2,className:(0,n.cn)("text-info-primary line-clamp-1",l?.productDescription),html:e.custom_description||e.description})]}),G(r,d,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,a.jsxs)("div",{"data-total":e?.totalInventory??0,"data-available":e?.quantityAvailable??0,className:"space-y-2",children:[(0,a.jsx)(t.Progress,{value:T,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{progressBar:"transition-all duration-300 ease-in-out"}}),(0,a.jsx)(t.Text,{size:3,className:"text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[12px]",children:z?g?.limitedStock:g?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("div",{className:(0,n.cn)("mb-2",l?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-2",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),P&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:(0,n.cn)("text-info-tertiary line-through",l?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:g?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&(0,a.jsx)(t.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[12px]",l?.productPriceLabel),children:e.priceLabel}),(0,a.jsxs)("div",{className:(0,n.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",l?.buttonGroup),children:[p&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",l?.secondaryButton),onClick:()=>x(v,"secondary"),disabled:!e.availableForSale&&v!=="learnMore",loading:B,"data-headless-type-name":"MediaShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${p}`,"data-headless-sku":e.sku,children:p}),y&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,n.cn)("tablet:w-fit w-full",l?.primaryButton),onClick:()=>x(h,"primary"),disabled:!e.availableForSale&&h!=="learnMore",loading:F,"data-headless-type-name":"MediaShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${y}`,"data-headless-sku":e.sku,children:y})]})]})]})]})});b.displayName="MediaShelf.ProductCard";var j=b;
1
+ "use strict";"use client";var _=Object.create;var b=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var H=(e,i)=>{for(var l in i)b(e,l,{get:i[l],enumerable:!0})},k=(e,i,l,d)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of q(i))!E.call(e,o)&&o!==l&&b(e,o,{get:()=>i[o],enumerable:!(d=A(i,o))||d.enumerable});return e};var R=(e,i,l)=>(l=e!=null?_($(e)):{},k(i||!e||!e.__esModule?b(l,"default",{value:e,enumerable:!0}):l,e)),I=e=>k(b({},"__esModule",{value:!0}),e);var K={};H(K,{ProductCard:()=>u,default:()=>j});module.exports=I(K);var a=require("react/jsx-runtime"),c=R(require("react")),n=require("../../helpers/index.js"),t=require("../../components/index.js");const O=5;function G(e,i,l,d){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:l<=i;case"below-percentage":return i===void 0?!0:l/d*100<=i;default:return!0}}const u=c.forwardRef(({product:e,className:i,stockDisplayMode:l,stockThresholdValue:d,onLearnMore:o,onShopNow:C,onAddToCart:S,classNames:r,secondaryButtonText:p,secondaryButtonFun:v,primaryButtonText:y,primaryButtonFun:h,showOriginalPrice:P,copy:g,onProductImageClick:m,showTags:N=!0},M)=>{const[F,L]=c.useState(!1),[B,D]=c.useState(!1),T=c.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?O:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),x=async(s,f)=>{if(!s)return;const w=f==="primary"?L:D;w(!0);try{switch(s){case"buyNow":await C?.(e);break;case"addCart":await S?.(e);break;case"learnMore":await o?.(e);break;default:break}}finally{w(!1)}},z=e.availableForSale&&e.quantityAvailable<=0;return(0,a.jsxs)(t.Card,{ref:M,className:(0,n.cn)("tablet:min-w-[auto] hover:bg-container-secondary-0 flex h-full min-w-[296px] flex-col overflow-hidden border-none",e.custom_link?"cursor-pointer":"",i,r?.productCard),children:[(0,a.jsxs)("div",{className:(0,n.cn)("media-shelf-product-card-image-wrapper desktop:h-[240px] relative h-[200px] shrink-0 overflow-hidden",r?.productCardImageWrapper),children:[(0,a.jsx)("div",{className:(0,n.cn)("media-shelf-product-card-image-bg absolute inset-0 ",r?.productCardImageBg),children:(0,a.jsx)("a",{onClick:()=>m?.(e),...!m&&{href:e.custom_link||e.listingLink},className:"cursor-pointer",children:(0,a.jsx)(t.Picture,{source:e.custom_image||e.image,alt:e.name,className:(0,n.cn)("h-full",r?.productCardImage),imgClassName:"h-full object-contain"})})}),N&&e.tags&&e.tags.length>0&&(0,a.jsx)("div",{className:"lg-desktop:h-[28px] absolute left-4 top-4 flex h-[24px]",children:e.tags.map((s,f)=>s.label?(0,a.jsx)(t.Badge,{size:"sm",variant:s.variant||"outline",className:(0,n.cn)("mr-1"),promotionalType:s.promotionalType,children:s.label},f):(0,a.jsx)(c.Fragment,{children:s},f))})]}),(0,a.jsxs)(t.CardContent,{className:"desktop:p-6 bg-container-primary laptop:gap-6 flex h-[calc(100%-240px)] grow flex-col justify-between gap-4 p-4",children:[(0,a.jsxs)("div",{className:"flex-0",children:[(0,a.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary mb-1 line-clamp-2 tracking-tight",m?"cursor-pointer":"",r?.productTitle),onClick:m?()=>m(e):void 0,children:e.custom_name||e.name}),(e.custom_description||e?.description)&&(0,a.jsx)(t.Text,{size:2,className:(0,n.cn)("text-info-primary line-clamp-1",r?.productDescription),html:e.custom_description||e.description})]}),G(l,d,e?.quantityAvailable??0,e?.totalInventory??0)&&(0,a.jsxs)("div",{"data-total":e?.totalInventory??0,"data-available":e?.quantityAvailable??0,className:"space-y-2",children:[(0,a.jsx)(t.Progress,{value:T,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{progressBar:"transition-all duration-300 ease-in-out"}}),(0,a.jsx)(t.Text,{size:3,className:"text-info-tertiary desktop:text-[16px] lg-desktop:text-[18px] text-[12px]",children:z?g?.limitedStock:g?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("div",{className:(0,n.cn)("mb-2",r?.productPrice),children:(0,a.jsx)("div",{className:"flex items-baseline gap-2",children:e.availableForSale?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Heading,{size:2,className:"text-info-primary",as:"h6",children:e.price}),P&&e.originalPrice&&(0,a.jsx)(t.Heading,{size:2,className:(0,n.cn)("text-info-tertiary line-through",r?.originalPrice),as:"h6",children:e.originalPrice})]}):(0,a.jsx)(t.Heading,{size:2,className:"text-info-tertiary",children:g?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&(0,a.jsx)(t.Text,{size:4,className:(0,n.cn)("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[12px]",r?.productPriceLabel),children:e.priceLabel}),(0,a.jsxs)("div",{className:(0,n.cn)("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",r?.buttonGroup),children:[p&&(0,a.jsx)(t.Button,{variant:"secondary",size:"base",className:(0,n.cn)("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",r?.secondaryButton),onClick:()=>x(v,"secondary"),disabled:!e.availableForSale&&v!=="learnMore",loading:B,"data-headless-type-name":"MediaShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${p}`,"data-headless-sku":e.sku,children:p}),y&&(0,a.jsx)(t.Button,{variant:"primary",size:"base",className:(0,n.cn)("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",r?.primaryButton),onClick:()=>x(h,"primary"),disabled:!e.availableForSale&&h!=="learnMore",loading:F,"data-headless-type-name":"MediaShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${y}`,"data-headless-sku":e.sku,children:y})]})]})]})]})});u.displayName="MediaShelf.ProductCard";var j=u;
2
2
  //# sourceMappingURL=ProductCard.js.map