@anker-in/headless-ui 1.3.57 → 1.3.58

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoriesProductGrid/index.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export interface ProductGridProps {
+    children: React.ReactNode;
+    maxVisible?: number;
+    showMoreText?: string;
+    showLessText?: string;
+    animated?: boolean;
+    className?: string;
+}
+declare const AccessoriesProductGrid: React.ForwardRefExoticComponent<ProductGridProps & React.RefAttributes<HTMLDivElement>>;
+export default AccessoriesProductGrid;

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoriesProductGrid/index.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var w=Object.create;var a=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var C=Object.getPrototypeOf,L=Object.prototype.hasOwnProperty;var P=(e,t)=>{for(var s in t)a(e,s,{get:t[s],enumerable:!0})},p=(e,t,s,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of b(t))!L.call(e,r)&&r!==s&&a(e,r,{get:()=>t[r],enumerable:!(i=N(t,r))||i.enumerable});return e};var y=(e,t,s)=>(s=e!=null?w(C(e)):{},p(t||!e||!e.__esModule?a(s,"default",{value:e,enumerable:!0}):s,e)),G=e=>p(a({},"__esModule",{value:!0}),e);var A={};P(A,{default:()=>R});module.exports=G(A);var o=require("react/jsx-runtime"),d=y(require("react")),l=require("../../../../helpers/index.js");const M=({className:e})=>(0,o.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:e,width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",children:(0,o.jsx)("path",{d:"M17.2929 8.29302C17.6834 7.90249 18.3164 7.90249 18.707 8.29302C19.0975 8.68354 19.0975 9.31655 18.707 9.70708L12.707 15.7071C12.3164 16.0976 11.6834 16.0976 11.2929 15.7071L5.29289 9.70708C4.90237 9.31655 4.90237 8.68354 5.29289 8.29302C5.68342 7.90249 6.31643 7.90249 6.70696 8.29302L11.9999 13.586L17.2929 8.29302Z",fill:"currentColor"})}),g=d.forwardRef(({children:e,maxVisible:t=8,showMoreText:s="Show more",showLessText:i="Show less",animated:r=!0,className:f},u)=>{const[n,h]=d.useState(!1),c=d.Children.toArray(e),m=c.length>t,x=m&&!n?c.slice(0,t):c;return(0,o.jsxs)("div",{ref:u,className:(0,l.cn)("flex flex-col gap-6",f),children:[(0,o.jsx)("div",{className:(0,l.cn)("tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 grid grid-cols-1 gap-4",r&&"transition-all duration-500 ease-in-out"),children:x}),m&&(0,o.jsxs)("div",{className:"hover:text-brand-0 text-info-primary flex items-center justify-center",children:[(0,o.jsx)("button",{className:"laptop:text-base text-sm font-bold",onClick:()=>h(v=>!v),children:n?i:s}),(0,o.jsx)(M,{className:(0,l.cn)("laptop:size-5 size-4",n&&"rotate-180")})]})]})});g.displayName="AccessoriesProductGrid";var R=g;
+//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoriesProductGrid/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/biz-components/AccessoriesShelf/components/AccessoriesProductGrid/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../../helpers/index.js'\n\nexport interface ProductGridProps {\n  children: React.ReactNode\n  maxVisible?: number\n  showMoreText?: string\n  showLessText?: string\n  animated?: boolean\n  className?: string\n}\n\nconst DownIcon = ({ className }: { className?: string }) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n    >\n      <path\n        d=\"M17.2929 8.29302C17.6834 7.90249 18.3164 7.90249 18.707 8.29302C19.0975 8.68354 19.0975 9.31655 18.707 9.70708L12.707 15.7071C12.3164 16.0976 11.6834 16.0976 11.2929 15.7071L5.29289 9.70708C4.90237 9.31655 4.90237 8.68354 5.29289 8.29302C5.68342 7.90249 6.31643 7.90249 6.70696 8.29302L11.9999 13.586L17.2929 8.29302Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  )\n}\n\nconst AccessoriesProductGrid = React.forwardRef<HTMLDivElement, ProductGridProps>(\n  (\n    { children, maxVisible = 8, showMoreText = 'Show more', showLessText = 'Show less', animated = true, className },\n    ref\n  ) => {\n    const [expanded, setExpanded] = React.useState(false)\n    const items = React.Children.toArray(children)\n    const hasMore = items.length > maxVisible\n    const visibleItems = hasMore && !expanded ? items.slice(0, maxVisible) : items\n\n    return (\n      <div ref={ref} className={cn('flex flex-col gap-6', className)}>\n        <div\n          className={cn(\n            'tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 grid grid-cols-1 gap-4',\n            animated && 'transition-all duration-500 ease-in-out'\n          )}\n        >\n          {visibleItems}\n        </div>\n        {hasMore && (\n          <div className=\"hover:text-brand-0 text-info-primary flex items-center justify-center\">\n            <button className=\"laptop:text-base text-sm font-bold\" onClick={() => setExpanded(prev => !prev)}>\n              {expanded ? showLessText : showMoreText}\n            </button>\n            <DownIcon className={cn('laptop:size-5 size-4', expanded && 'rotate-180')} />\n          </div>\n        )}\n      </div>\n    )\n  }\n)\n\nAccessoriesProductGrid.displayName = 'AccessoriesProductGrid'\n\nexport default AccessoriesProductGrid\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAwBM,IAAAI,EAAA,6BAtBNC,EAAuB,oBACvBC,EAAmB,wCAWnB,MAAMC,EAAW,CAAC,CAAE,UAAAC,CAAU,OAE1B,OAAC,OACC,MAAM,6BACN,UAAWA,EACX,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,mBAAC,QACC,EAAE,gUACF,KAAK,eACP,EACF,EAIEC,EAAyBJ,EAAM,WACnC,CACE,CAAE,SAAAK,EAAU,WAAAC,EAAa,EAAG,aAAAC,EAAe,YAAa,aAAAC,EAAe,YAAa,SAAAC,EAAW,GAAM,UAAAN,CAAU,EAC/GO,IACG,CACH,KAAM,CAACC,EAAUC,CAAW,EAAIZ,EAAM,SAAS,EAAK,EAC9Ca,EAAQb,EAAM,SAAS,QAAQK,CAAQ,EACvCS,EAAUD,EAAM,OAASP,EACzBS,EAAeD,GAAW,CAACH,EAAWE,EAAM,MAAM,EAAGP,CAAU,EAAIO,EAEzE,SACE,QAAC,OAAI,IAAKH,EAAK,aAAW,MAAG,sBAAuBP,CAAS,EAC3D,oBAAC,OACC,aAAW,MACT,mFACAM,GAAY,yCACd,EAEC,SAAAM,EACH,EACCD,MACC,QAAC,OAAI,UAAU,wEACb,oBAAC,UAAO,UAAU,qCAAqC,QAAS,IAAMF,EAAYI,GAAQ,CAACA,CAAI,EAC5F,SAAAL,EAAWH,EAAeD,EAC7B,KACA,OAACL,EAAA,CAAS,aAAW,MAAG,uBAAwBS,GAAY,YAAY,EAAG,GAC7E,GAEJ,CAEJ,CACF,EAEAP,EAAuB,YAAc,yBAErC,IAAOP,EAAQO",
+  "names": ["AccessoriesProductGrid_exports", "__export", "AccessoriesProductGrid_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "DownIcon", "className", "AccessoriesProductGrid", "children", "maxVisible", "showMoreText", "showLessText", "animated", "ref", "expanded", "setExpanded", "items", "hasMore", "visibleItems", "prev"]
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/ProductCard.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import type { AccessoryProductCardProps, AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig } from './types.js';
+export type { AccessoryProductCardProps, AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig };
+/**
+ * AccessoryProductCard - 配件卡片（UI 组件）
+ *
+ * 组件职责（UI 层）：
+ * - 渲染产品图（1:1 object-contain）
+ * - 渲染标题、描述、tags
+ * - 渲染现价 + 原价（删除线）+ 会员价（下方小字）
+ * - 渲染加购按钮及 Add / Added(n) / Unavailable 状态
+ * - Hover 效果（卡片背景变白 + 阴影，PC 端）
+ * - Loading 状态展示
+ *
+ * 业务职责（业务端负责）：
+ * - 获取产品数据、计算价格
+ * - 维护 addedQuantity、isLoading 状态
+ * - 实现 onAddToCart 逻辑（调用购物车 API）
+ * - 库存检查后将 quantityAvailable 传入
+ */
+declare const AccessoryProductCard: React.ForwardRefExoticComponent<AccessoryProductCardProps & React.RefAttributes<HTMLDivElement>>;
+export { AccessoryProductCard };
+export default AccessoryProductCard;

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/ProductCard.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var q=Object.create;var b=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var U=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var j=(e,i)=>{for(var n in i)b(e,n,{get:i[n],enumerable:!0})},h=(e,i,n,d)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of O(i))!_.call(e,s)&&s!==n&&b(e,s,{get:()=>i[s],enumerable:!(d=E(i,s))||d.enumerable});return e};var G=(e,i,n)=>(n=e!=null?q(U(e)):{},h(i||!e||!e.__esModule?b(n,"default",{value:e,enumerable:!0}):n,e)),I=e=>h(b({},"__esModule",{value:!0}),e);var J={};j(J,{AccessoryProductCard:()=>g,default:()=>V});module.exports=I(J);var a=require("react/jsx-runtime"),u=G(require("react")),l=require("../../../../helpers/index.js"),t=require("../../../../components/index.js");const g=u.forwardRef(({product:e,addedQuantity:i=0,maxQuantity:n,isLoading:d=!1,showTags:s=!0,showOriginalPrice:A=!1,showDiscountPrice:y=!0,showMemberPrice:L=!0,onProductClick:x,onAddToCart:N,className:T,classNames:r,copy:o},w)=>{const v=n??e.quantityAvailable??void 0,m=!e.availableForSale,S=!m&&v!=null&&i>=v,B=m||S,P=i>0,M=o?.addLabel??"Add",$=o?.addedLabel??"in Cart",z=o?.unavailableLabel??"Unavailable",D=o?.memberPriceLabel??"Member price",F=o?.plusMemberPriceLabel??"Plus member price",k=m?z:P?`${i} ${$}`:M,H=e.memberPriceType==="plus-member"?F:D,p=e.custom_name||e.name,f=e.custom_description||e.description,R=e.image;return(0,a.jsx)(t.Card,{ref:w,className:(0,l.cn)("rounded-card desktop:p-6 group flex flex-col border-none p-4","bg-container-primary transition-colors duration-200","hover:bg-white",P&&"bg-white",T,r?.root),children:(0,a.jsxs)(t.CardContent,{className:"flex flex-1 flex-col gap-3 p-0",children:[(0,a.jsx)("a",{onClick:x?()=>x(e):void 0,href:!x&&e.listingLink?e.listingLink:void 0,rel:"noreferrer",className:(0,l.cn)("laptop:size-[196px] mx-auto block size-[138px] overflow-hidden",x||e.listingLink?"cursor-pointer":"cursor-default",r?.image),"aria-label":p,children:(0,a.jsx)(t.Picture,{source:R,alt:p,className:"aspect-square w-full mix-blend-multiply",imgClassName:"w-full h-full object-contain"})}),(0,a.jsxs)("div",{className:"flex flex-1 flex-col gap-4",children:[s&&e.tags&&e.tags.length>0&&(0,a.jsx)("div",{className:(0,l.cn)("flex flex-wrap items-center gap-1",r?.tags),children:e.tags.map((c,C)=>c?.label?(0,a.jsx)(t.Badge,{size:"sm",variant:c.variant||"outline",promotionalType:c.promotionalType,children:c.label},C):u.isValidElement(c)&&(0,a.jsx)(u.Fragment,{children:c},C))}),(0,a.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,a.jsx)(t.Heading,{as:"h2",className:(0,l.cn)("lg-desktop:text-[18px] text-info-primary line-clamp-3 text-[16px] font-bold leading-[1.2] tracking-[-0.64px]",r?.title),children:p}),f&&(0,a.jsx)(t.Text,{as:"p",className:(0,l.cn)("lg-desktop:text-[18px] text-info-bold line-clamp-2 text-[14px] font-bold leading-[1.4] tracking-[-0.28px]",r?.description),children:f})]}),(0,a.jsxs)("div",{className:(0,l.cn)("mt-auto flex flex-col gap-2",r?.priceArea),children:[(0,a.jsxs)("div",{children:[(0,a.jsx)("div",{className:"flex flex-wrap items-baseline gap-1",children:m?(0,a.jsx)(t.Text,{as:"p",className:(0,l.cn)("lg-desktop:text-[24px] text-info-tertiary text-[20px] font-bold leading-[1.2] tracking-[-0.8px]",r?.currentPrice),children:o?.outOfStockLabel??"Sold Out"}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.Text,{as:"p",className:(0,l.cn)("lg-desktop:text-[24px] text-info-primary text-[20px] font-bold leading-[1.2] tracking-[-0.8px]",r?.currentPrice),children:e.price}),y&&e.discountPrice&&(0,a.jsx)(t.Text,{as:"p",className:(0,l.cn)("text-brand-0 lg-desktop:text-[24px] text-[20px] font-bold leading-tight tracking-[-0.32px]",r?.discountPrice),children:e.discountPrice}),(!y||!e.discountPrice)&&A&&e.originalPrice&&(0,a.jsx)(t.Text,{as:"p",className:(0,l.cn)("text-info-tertiary lg-desktop:text-[24px] text-[20px] font-bold leading-tight tracking-[-0.32px] line-through",r?.originalPrice),children:e.originalPrice})]})}),L&&!m&&e.memberPriceNote&&(0,a.jsxs)(t.Text,{as:"p",className:(0,l.cn)("lg-desktop:text-[18px] text-marketing-1 text-[14px] font-bold leading-tight tracking-[-0.24px]",r?.memberPriceNote),children:[H," ",(0,a.jsx)("span",{className:"text-marketing-1",children:e.memberPriceNote})]})]}),(0,a.jsx)("div",{className:(0,l.cn)(r?.buttonGroup),children:(0,a.jsx)(t.Button,{variant:"primary",size:"lg",loading:d,disabled:B&&!d,onClick:()=>N?.(e),className:(0,l.cn)("w-full",r?.addButton),"data-headless-type-name":"AccessoryShelf#ProductCard","data-headless-sku":e.sku,"data-headless-title-desc-button":`${p}#${f??""}#${k}`,children:k})})]})]})]})})});g.displayName="AccessoryShelf.ProductCard";var V=g;
+//# sourceMappingURL=ProductCard.js.map

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/ProductCard.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/biz-components/AccessoriesShelf/components/AccessoryShelf/ProductCard.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../../helpers/index.js'\nimport { Badge, Card, CardContent, Picture, Text, Heading, Button } from '../../../../components/index.js'\nimport type {\n  AccessoryProductCardProps,\n  AccessoryProductData,\n  AccessoryCardSemanticName,\n  AccessoryCopyConfig,\n} from './types.js'\n\nexport type { AccessoryProductCardProps, AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig }\n\n/**\n * AccessoryProductCard - \u914D\u4EF6\u5361\u7247\uFF08UI \u7EC4\u4EF6\uFF09\n *\n * \u7EC4\u4EF6\u804C\u8D23\uFF08UI \u5C42\uFF09\uFF1A\n * - \u6E32\u67D3\u4EA7\u54C1\u56FE\uFF081:1 object-contain\uFF09\n * - \u6E32\u67D3\u6807\u9898\u3001\u63CF\u8FF0\u3001tags\n * - \u6E32\u67D3\u73B0\u4EF7 + \u539F\u4EF7\uFF08\u5220\u9664\u7EBF\uFF09+ \u4F1A\u5458\u4EF7\uFF08\u4E0B\u65B9\u5C0F\u5B57\uFF09\n * - \u6E32\u67D3\u52A0\u8D2D\u6309\u94AE\u53CA Add / Added(n) / Unavailable \u72B6\u6001\n * - Hover \u6548\u679C\uFF08\u5361\u7247\u80CC\u666F\u53D8\u767D + \u9634\u5F71\uFF0CPC \u7AEF\uFF09\n * - Loading \u72B6\u6001\u5C55\u793A\n *\n * \u4E1A\u52A1\u804C\u8D23\uFF08\u4E1A\u52A1\u7AEF\u8D1F\u8D23\uFF09\uFF1A\n * - \u83B7\u53D6\u4EA7\u54C1\u6570\u636E\u3001\u8BA1\u7B97\u4EF7\u683C\n * - \u7EF4\u62A4 addedQuantity\u3001isLoading \u72B6\u6001\n * - \u5B9E\u73B0 onAddToCart \u903B\u8F91\uFF08\u8C03\u7528\u8D2D\u7269\u8F66 API\uFF09\n * - \u5E93\u5B58\u68C0\u67E5\u540E\u5C06 quantityAvailable \u4F20\u5165\n */\nconst AccessoryProductCard = React.forwardRef<HTMLDivElement, AccessoryProductCardProps>(\n  (\n    {\n      product,\n      addedQuantity = 0,\n      maxQuantity,\n      isLoading = false,\n      showTags = true,\n      showOriginalPrice = false,\n      showDiscountPrice = true,\n      showMemberPrice = true,\n      onProductClick,\n      onAddToCart,\n      className,\n      classNames,\n      copy,\n    },\n    ref\n  ) => {\n    // \u5E93\u5B58\u9650\u5236\uFF1A\u4F18\u5148\u53D6 maxQuantity\uFF0C\u5176\u6B21\u53D6 product.quantityAvailable\n    const resolvedMax = maxQuantity ?? product.quantityAvailable ?? undefined\n    const isUnavailable = !product.availableForSale\n    const isAtLimit = !isUnavailable && resolvedMax != null && addedQuantity >= resolvedMax\n    const isDisabled = isUnavailable || isAtLimit\n    const isAdded = addedQuantity > 0\n\n    // \u6587\u6848\n    const addLabel = copy?.addLabel ?? 'Add'\n    const addedLabel = copy?.addedLabel ?? 'in Cart'\n    const unavailableLabel = copy?.unavailableLabel ?? 'Unavailable'\n    const memberPriceLabel = copy?.memberPriceLabel ?? 'Member price'\n    const plusMemberPriceLabel = copy?.plusMemberPriceLabel ?? 'Plus member price'\n\n    const buttonLabel = isUnavailable ? unavailableLabel : isAdded ? `${addedQuantity} ${addedLabel}` : addLabel\n\n    const memberLabel = product.memberPriceType === 'plus-member' ? plusMemberPriceLabel : memberPriceLabel\n\n    const displayTitle = product.custom_name || product.name\n    const displayDescription = product.custom_description || product.description\n    const displayImage = product.image\n\n    return (\n      <Card\n        ref={ref}\n        className={cn(\n          'rounded-card desktop:p-6 group flex flex-col border-none p-4',\n          'bg-container-primary transition-colors duration-200',\n          'hover:bg-white',\n          isAdded && 'bg-white',\n          className,\n          classNames?.root\n        )}\n      >\n        <CardContent className=\"flex flex-1 flex-col gap-3 p-0\">\n          {/* \u4EA7\u54C1\u56FE 1:1 */}\n          <a\n            onClick={onProductClick ? () => onProductClick(product) : undefined}\n            href={!onProductClick && product.listingLink ? product.listingLink : undefined}\n            rel=\"noreferrer\"\n            className={cn(\n              'laptop:size-[196px] mx-auto block size-[138px] overflow-hidden',\n              onProductClick || product.listingLink ? 'cursor-pointer' : 'cursor-default',\n              classNames?.image\n            )}\n            aria-label={displayTitle}\n          >\n            <Picture\n              source={displayImage}\n              alt={displayTitle}\n              className=\"aspect-square w-full mix-blend-multiply\"\n              imgClassName=\"w-full h-full object-contain\"\n            />\n          </a>\n\n          {/* \u5185\u5BB9\u533A */}\n          <div className=\"flex flex-1 flex-col gap-4\">\n            {/* Tags */}\n            {showTags && product.tags && product.tags.length > 0 && (\n              <div className={cn('flex flex-wrap items-center gap-1', classNames?.tags)}>\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                      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            )}\n\n            {/* \u6807\u9898 + \u63CF\u8FF0 */}\n            <div className=\"flex flex-col gap-1\">\n              <Heading\n                as=\"h2\"\n                className={cn(\n                  'lg-desktop:text-[18px] text-info-primary line-clamp-3 text-[16px] font-bold leading-[1.2] tracking-[-0.64px]',\n                  classNames?.title\n                )}\n              >\n                {displayTitle}\n              </Heading>\n              {displayDescription && (\n                <Text\n                  as=\"p\"\n                  className={cn(\n                    'lg-desktop:text-[18px] text-info-bold line-clamp-2 text-[14px] font-bold leading-[1.4] tracking-[-0.28px]',\n                    classNames?.description\n                  )}\n                >\n                  {displayDescription}\n                </Text>\n              )}\n            </div>\n\n            {/* \u4EF7\u683C + \u6309\u94AE */}\n            <div className={cn('mt-auto flex flex-col gap-2', classNames?.priceArea)}>\n              <div>\n                {/* \u73B0\u4EF7 + \u539F\u4EF7\uFF08\u5220\u9664\u7EBF\uFF09 */}\n                <div className=\"flex flex-wrap items-baseline gap-1\">\n                  {isUnavailable ? (\n                    <Text\n                      as=\"p\"\n                      className={cn(\n                        'lg-desktop:text-[24px] text-info-tertiary text-[20px] font-bold leading-[1.2] tracking-[-0.8px]',\n                        classNames?.currentPrice\n                      )}\n                    >\n                      {copy?.outOfStockLabel ?? 'Sold Out'}\n                    </Text>\n                  ) : (\n                    <>\n                      <Text\n                        as=\"p\"\n                        className={cn(\n                          'lg-desktop:text-[24px] text-info-primary text-[20px] font-bold leading-[1.2] tracking-[-0.8px]',\n                          classNames?.currentPrice\n                        )}\n                      >\n                        {product.price}\n                      </Text>\n                      {showDiscountPrice && product.discountPrice && (\n                        <Text\n                          as=\"p\"\n                          className={cn(\n                            'text-brand-0 lg-desktop:text-[24px] text-[20px] font-bold leading-tight tracking-[-0.32px]',\n                            classNames?.discountPrice\n                          )}\n                        >\n                          {product.discountPrice}\n                        </Text>\n                      )}\n                      {(!showDiscountPrice || !product.discountPrice) && showOriginalPrice && product.originalPrice && (\n                        <Text\n                          as=\"p\"\n                          className={cn(\n                            'text-info-tertiary lg-desktop:text-[24px] text-[20px] font-bold leading-tight tracking-[-0.32px] line-through',\n                            classNames?.originalPrice\n                          )}\n                        >\n                          {product.originalPrice}\n                        </Text>\n                      )}\n                    </>\n                  )}\n                </div>\n\n                {/* \u4F1A\u5458\u4EF7\u5C0F\u5B57 */}\n                {showMemberPrice && !isUnavailable && product.memberPriceNote && (\n                  <Text\n                    as=\"p\"\n                    className={cn(\n                      'lg-desktop:text-[18px] text-marketing-1 text-[14px] font-bold leading-tight tracking-[-0.24px]',\n                      classNames?.memberPriceNote\n                    )}\n                  >\n                    {memberLabel} <span className=\"text-marketing-1\">{product.memberPriceNote}</span>\n                  </Text>\n                )}\n              </div>\n\n              {/* \u52A0\u8D2D\u6309\u94AE\uFF08\u5355\u4E00\uFF09 */}\n              <div className={cn(classNames?.buttonGroup)}>\n                <Button\n                  variant=\"primary\"\n                  size=\"lg\"\n                  loading={isLoading}\n                  disabled={isDisabled && !isLoading}\n                  onClick={() => onAddToCart?.(product)}\n                  className={cn('w-full', classNames?.addButton)}\n                  data-headless-type-name=\"AccessoryShelf#ProductCard\"\n                  data-headless-sku={product.sku}\n                  data-headless-title-desc-button={`${displayTitle}#${displayDescription ?? ''}#${buttonLabel}`}\n                >\n                  {buttonLabel}\n                </Button>\n              </div>\n            </div>\n          </div>\n        </CardContent>\n      </Card>\n    )\n  }\n)\n\nAccessoryProductCard.displayName = 'AccessoryShelf.ProductCard'\n\nexport { AccessoryProductCard }\nexport default AccessoryProductCard\n"],
+  "mappings": "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",
+  "names": ["ProductCard_exports", "__export", "AccessoryProductCard", "ProductCard_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "product", "addedQuantity", "maxQuantity", "isLoading", "showTags", "showOriginalPrice", "showDiscountPrice", "showMemberPrice", "onProductClick", "onAddToCart", "className", "classNames", "copy", "ref", "resolvedMax", "isUnavailable", "isAtLimit", "isDisabled", "isAdded", "addLabel", "addedLabel", "unavailableLabel", "memberPriceLabel", "plusMemberPriceLabel", "buttonLabel", "memberLabel", "displayTitle", "displayDescription", "displayImage", "tag", "index"]
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/index.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import AccessoryProductCard from './ProductCard.js';
+import type { AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig } from './types.js';
+export type { AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig };
+export type { AccessoryProductCardProps } from './ProductCard.js';
+export interface AccessoryShelfProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * 产品卡片区域 — 业务端自行组合布局容器 + AccessoryShelf.ProductCard
+     *
+     * @example 搭配 AccessoriesProductGrid
+     * ```tsx
+     * <AccessoryShelf data={{ title: 'Add-ons' }}>
+     *   <AccessoriesProductGrid maxVisible={8} showMoreText="Show more" showLessText="Show less">
+     *     {products.map(p => (
+     *       <AccessoryShelf.ProductCard
+     *         key={p.sku}
+     *         product={p}
+     *         addedQuantity={quantities[p.sku]}
+     *         isLoading={loadingSkus.has(p.sku)}
+     *         onAddToCart={handleAddToCart}
+     *       />
+     *     ))}
+     *   </AccessoriesProductGrid>
+     * </AccessoryShelf>
+     * ```
+     */
+    children: React.ReactNode;
+    /** 语义化类名覆盖（仅 root/title/description 有效） */
+    classNames?: Partial<Record<'root' | 'title' | 'description', string>>;
+}
+export interface AccessoryShelfComponent extends React.ForwardRefExoticComponent<AccessoryShelfProps & React.RefAttributes<HTMLDivElement>> {
+    /** 配件卡片子组件，业务端在 children 中直接使用 */
+    ProductCard: typeof AccessoryProductCard;
+}
+export { AccessoryProductCard };
+declare const _default: React.ForwardRefExoticComponent<Omit<AccessoryShelfProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../../../shared/Styles.js").StylesProps> & import("../../../../shared/Styles.js").StylesProps & import("../../../index.js").ContainerProps & React.RefAttributes<unknown>> & {
+    readonly $$typeof: symbol;
+    ProductCard: typeof AccessoryProductCard;
+};
+export default _default;

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/index.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var A=Object.create;var s=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty;var S=(e,r)=>{for(var o in r)s(e,o,{get:r[o],enumerable:!0})},n=(e,r,o,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of P(r))!h.call(e,t)&&t!==o&&s(e,t,{get:()=>r[t],enumerable:!(c=C(r,t))||c.enumerable});return e};var f=(e,r,o)=>(o=e!=null?A(R(e)):{},n(r||!e||!e.__esModule?s(o,"default",{value:e,enumerable:!0}):o,e)),x=e=>n(s({},"__esModule",{value:!0}),e);var D={};S(D,{AccessoryProductCard:()=>a.default,default:()=>v});module.exports=x(D);var u=require("react/jsx-runtime"),d=f(require("react")),m=require("../../../../helpers/index.js"),y=require("../../../../shared/Styles.js"),a=f(require("./ProductCard.js"));const p=d.forwardRef(({className:e,children:r,classNames:o,...c},t)=>{const i=d.useRef(null);return d.useImperativeHandle(t,()=>i.current),(0,u.jsx)("div",{ref:i,className:(0,m.cn)("w-full",e,o?.root),...c,children:r})});p.displayName="AccessoryShelf";const l=p;l.ProductCard=a.default;var v=(0,y.withLayout)(l);
+//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/biz-components/AccessoriesShelf/components/AccessoryShelf/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../../helpers/index.js'\nimport { withLayout } from '../../../../shared/Styles.js'\nimport AccessoryProductCard from './ProductCard.js'\nimport type { AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig } from './types.js'\n\nexport type { AccessoryProductData, AccessoryCardSemanticName, AccessoryCopyConfig }\nexport type { AccessoryProductCardProps } from './ProductCard.js'\n\nexport interface AccessoryShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * \u4EA7\u54C1\u5361\u7247\u533A\u57DF \u2014 \u4E1A\u52A1\u7AEF\u81EA\u884C\u7EC4\u5408\u5E03\u5C40\u5BB9\u5668 + AccessoryShelf.ProductCard\n   *\n   * @example \u642D\u914D AccessoriesProductGrid\n   * ```tsx\n   * <AccessoryShelf data={{ title: 'Add-ons' }}>\n   *   <AccessoriesProductGrid maxVisible={8} showMoreText=\"Show more\" showLessText=\"Show less\">\n   *     {products.map(p => (\n   *       <AccessoryShelf.ProductCard\n   *         key={p.sku}\n   *         product={p}\n   *         addedQuantity={quantities[p.sku]}\n   *         isLoading={loadingSkus.has(p.sku)}\n   *         onAddToCart={handleAddToCart}\n   *       />\n   *     ))}\n   *   </AccessoriesProductGrid>\n   * </AccessoryShelf>\n   * ```\n   */\n  children: React.ReactNode\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6\uFF08\u4EC5 root/title/description \u6709\u6548\uFF09 */\n  classNames?: Partial<Record<'root' | 'title' | 'description', string>>\n}\n\nexport interface AccessoryShelfComponent extends React.ForwardRefExoticComponent<\n  AccessoryShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n  /** \u914D\u4EF6\u5361\u7247\u5B50\u7EC4\u4EF6\uFF0C\u4E1A\u52A1\u7AEF\u5728 children \u4E2D\u76F4\u63A5\u4F7F\u7528 */\n  ProductCard: typeof AccessoryProductCard\n}\n\nconst AccessoryShelf = React.forwardRef<HTMLDivElement, AccessoryShelfProps>(\n  ({ className, children, classNames, ...props }, ref) => {\n    const boxRef = React.useRef<HTMLDivElement>(null)\n\n    React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n    return (\n      <div ref={boxRef} className={cn('w-full', className, classNames?.root)} {...props}>\n        {children}\n      </div>\n    )\n  }\n)\n\nAccessoryShelf.displayName = 'AccessoryShelf'\n\n// \u590D\u5408\u7EC4\u4EF6\uFF1AAccessoryShelf.ProductCard \u53EF\u76F4\u63A5\u4F7F\u7528\nconst AccessoryShelfWithProductCard = AccessoryShelf as AccessoryShelfComponent\nAccessoryShelfWithProductCard.ProductCard = AccessoryProductCard\n\nexport { AccessoryProductCard }\nexport default withLayout(AccessoryShelfWithProductCard)\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,4BAAAE,QAAA,YAAAC,IAAA,eAAAC,EAAAJ,GAmDM,IAAAK,EAAA,6BAjDNC,EAAuB,oBACvBC,EAAmB,wCACnBC,EAA2B,wCAC3BC,EAAiC,+BAuCjC,MAAMC,EAAiBJ,EAAM,WAC3B,CAAC,CAAE,UAAAK,EAAW,SAAAC,EAAU,WAAAC,EAAY,GAAGC,CAAM,EAAGC,IAAQ,CACtD,MAAMC,EAASV,EAAM,OAAuB,IAAI,EAEhD,OAAAA,EAAM,oBAAoBS,EAAK,IAAMC,EAAO,OAAyB,KAGnE,OAAC,OAAI,IAAKA,EAAQ,aAAW,MAAG,SAAUL,EAAWE,GAAY,IAAI,EAAI,GAAGC,EACzE,SAAAF,EACH,CAEJ,CACF,EAEAF,EAAe,YAAc,iBAG7B,MAAMO,EAAgCP,EACtCO,EAA8B,YAAc,EAAAf,QAG5C,IAAOC,KAAQ,cAAWc,CAA6B",
+  "names": ["AccessoryShelf_exports", "__export", "AccessoryProductCard", "AccessoryShelf_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_Styles", "import_ProductCard", "AccessoryShelf", "className", "children", "classNames", "props", "ref", "boxRef", "AccessoryShelfWithProductCard"]
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/types.d.ts

@@ -0,0 +1,107 @@
+import type React from 'react';
+import type { BadgeProps } from '../../../../components/badge.js';
+/**
+ * 语义化类名
+ */
+export type AccessoryCardSemanticName = 'root' | 'image' | 'tags' | 'title' | 'description' | 'priceArea' | 'currentPrice' | 'originalPrice' | 'discountPrice' | 'memberPriceNote' | 'buttonGroup' | 'addButton';
+/**
+ * 文案配置
+ */
+export interface AccessoryCopyConfig {
+    /** 售罄文案，默认 "Sold Out" */
+    outOfStockLabel?: string;
+    /** 加购按钮文案，默认 "Add" */
+    addLabel?: string;
+    /** 已加购按钮文案前缀，默认 "Added"，最终显示为 "Added (n)" */
+    addedLabel?: string;
+    /** 不可用按钮文案，默认 "Unavailable" */
+    unavailableLabel?: string;
+    /** 会员价标签文本，默认 "Member price" */
+    memberPriceLabel?: string;
+    /** Plus 会员价标签文本，默认 "Plus member price" */
+    plusMemberPriceLabel?: string;
+}
+/**
+ * 产品数据接口（UI 层，价格已格式化为字符串）
+ * 业务端负责从 API 获取并转换后传入
+ */
+export interface AccessoryProductData {
+    /** SKU 唯一标识 */
+    sku: string;
+    /** 产品名称 */
+    name: string;
+    /** 产品主图 URL */
+    image: string;
+    /** 自定义图片 URL（覆盖 image） */
+    custom_image?: string;
+    /** 产品 handle */
+    handle: string;
+    /** Shopify ID */
+    shopify_id?: string;
+    /** 产品链接 */
+    listingLink?: string;
+    /** 自定义名称（覆盖 name） */
+    custom_name?: string;
+    /** 自定义描述（覆盖 description） */
+    custom_description?: string;
+    /** 产品描述 */
+    description?: string;
+    /** 现价（已格式化，如 "$49.99"） */
+    price: string;
+    /** 原价（已格式化，有则显示删除线），优先级低于 discountPrice */
+    originalPrice?: string;
+    /** 折扣金额（已格式化，如 "-$10.00"），显示在现价旁边，品牌色、无删除线 */
+    discountPrice?: string;
+    /**
+     * 会员价提示（已格式化，如 "$42.49"）
+     * 显示在现价下方小字，配合 memberPriceType 决定标签颜色
+     */
+    memberPriceNote?: string;
+    /** 会员价类型，决定标签文案和颜色 */
+    memberPriceType?: 'member' | 'plus-member';
+    /** 是否可售 */
+    availableForSale: boolean;
+    /**
+     * 可用库存上限（用于限制加购数量）
+     * 业务端从库存 API 获取后传入，组件只用于判断是否达到上限
+     */
+    quantityAvailable?: number | null;
+    /** tags 列表 */
+    tags?: Array<{
+        label: string;
+        variant: BadgeProps['variant'];
+        promotionalType?: BadgeProps['promotionalType'];
+    } | React.ReactNode>;
+}
+/**
+ * AccessoryProductCard Props
+ * 所有业务状态（addedQuantity、isLoading 等）由业务端维护并传入
+ */
+export interface AccessoryProductCardProps {
+    /** 产品数据 */
+    product: AccessoryProductData;
+    /** 已加购数量（业务端维护） */
+    addedQuantity?: number;
+    /** 最大可加购数量（undefined 则不限制） */
+    maxQuantity?: number;
+    /** 加购 loading 状态（业务端维护） */
+    isLoading?: boolean;
+    /** 是否显示 tags */
+    showTags?: boolean;
+    /** 是否显示原价（删除线） */
+    showOriginalPrice?: boolean;
+    /** 是否显示折扣金额（品牌色，无删除线，优先级高于 showOriginalPrice） */
+    showDiscountPrice?: boolean;
+    /** 是否显示会员价小字 */
+    showMemberPrice?: boolean;
+    /** 点击产品图/标题回调（不传则降级为 listingLink href） */
+    onProductClick?: (product: AccessoryProductData) => void;
+    /** 点击加购按钮回调 */
+    onAddToCart?: (product: AccessoryProductData) => void;
+    /** 样式类名 */
+    className?: string;
+    /** 语义化类名覆盖 */
+    classNames?: Partial<Record<AccessoryCardSemanticName, string>>;
+    /** 文案配置 */
+    copy?: AccessoryCopyConfig;
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/types.js

@@ -0,0 +1,2 @@
+"use strict";var i=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var d=(r,e,a,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of n(e))!c.call(r,t)&&t!==a&&i(r,t,{get:()=>e[t],enumerable:!(o=s(e,t))||o.enumerable});return r};var g=r=>d(i({},"__esModule",{value:!0}),r);var m={};module.exports=g(m);
+//# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/AccessoriesShelf/components/AccessoryShelf/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/biz-components/AccessoriesShelf/components/AccessoryShelf/types.ts"],
+  "sourcesContent": ["import type React from 'react'\nimport type { BadgeProps } from '../../../../components/badge.js'\n\n/**\n * \u8BED\u4E49\u5316\u7C7B\u540D\n */\nexport type AccessoryCardSemanticName =\n  | 'root'\n  | 'image'\n  | 'tags'\n  | 'title'\n  | 'description'\n  | 'priceArea'\n  | 'currentPrice'\n  | 'originalPrice'\n  | 'discountPrice'\n  | 'memberPriceNote'\n  | 'buttonGroup'\n  | 'addButton'\n\n/**\n * \u6587\u6848\u914D\u7F6E\n */\nexport interface AccessoryCopyConfig {\n  /** \u552E\u7F44\u6587\u6848\uFF0C\u9ED8\u8BA4 \"Sold Out\" */\n  outOfStockLabel?: string\n  /** \u52A0\u8D2D\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 \"Add\" */\n  addLabel?: string\n  /** \u5DF2\u52A0\u8D2D\u6309\u94AE\u6587\u6848\u524D\u7F00\uFF0C\u9ED8\u8BA4 \"Added\"\uFF0C\u6700\u7EC8\u663E\u793A\u4E3A \"Added (n)\" */\n  addedLabel?: string\n  /** \u4E0D\u53EF\u7528\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 \"Unavailable\" */\n  unavailableLabel?: string\n  /** \u4F1A\u5458\u4EF7\u6807\u7B7E\u6587\u672C\uFF0C\u9ED8\u8BA4 \"Member price\" */\n  memberPriceLabel?: string\n  /** Plus \u4F1A\u5458\u4EF7\u6807\u7B7E\u6587\u672C\uFF0C\u9ED8\u8BA4 \"Plus member price\" */\n  plusMemberPriceLabel?: string\n}\n\n/**\n * \u4EA7\u54C1\u6570\u636E\u63A5\u53E3\uFF08UI \u5C42\uFF0C\u4EF7\u683C\u5DF2\u683C\u5F0F\u5316\u4E3A\u5B57\u7B26\u4E32\uFF09\n * \u4E1A\u52A1\u7AEF\u8D1F\u8D23\u4ECE API \u83B7\u53D6\u5E76\u8F6C\u6362\u540E\u4F20\u5165\n */\nexport interface AccessoryProductData {\n  /** SKU \u552F\u4E00\u6807\u8BC6 */\n  sku: string\n  /** \u4EA7\u54C1\u540D\u79F0 */\n  name: string\n  /** \u4EA7\u54C1\u4E3B\u56FE URL */\n  image: string\n  /** \u81EA\u5B9A\u4E49\u56FE\u7247 URL\uFF08\u8986\u76D6 image\uFF09 */\n  custom_image?: string\n  /** \u4EA7\u54C1 handle */\n  handle: string\n  /** Shopify ID */\n  shopify_id?: string\n  /** \u4EA7\u54C1\u94FE\u63A5 */\n  listingLink?: string\n  /** \u81EA\u5B9A\u4E49\u540D\u79F0\uFF08\u8986\u76D6 name\uFF09 */\n  custom_name?: string\n  /** \u81EA\u5B9A\u4E49\u63CF\u8FF0\uFF08\u8986\u76D6 description\uFF09 */\n  custom_description?: string\n  /** \u4EA7\u54C1\u63CF\u8FF0 */\n  description?: string\n  /** \u73B0\u4EF7\uFF08\u5DF2\u683C\u5F0F\u5316\uFF0C\u5982 \"$49.99\"\uFF09 */\n  price: string\n  /** \u539F\u4EF7\uFF08\u5DF2\u683C\u5F0F\u5316\uFF0C\u6709\u5219\u663E\u793A\u5220\u9664\u7EBF\uFF09\uFF0C\u4F18\u5148\u7EA7\u4F4E\u4E8E discountPrice */\n  originalPrice?: string\n  /** \u6298\u6263\u91D1\u989D\uFF08\u5DF2\u683C\u5F0F\u5316\uFF0C\u5982 \"-$10.00\"\uFF09\uFF0C\u663E\u793A\u5728\u73B0\u4EF7\u65C1\u8FB9\uFF0C\u54C1\u724C\u8272\u3001\u65E0\u5220\u9664\u7EBF */\n  discountPrice?: string\n  /**\n   * \u4F1A\u5458\u4EF7\u63D0\u793A\uFF08\u5DF2\u683C\u5F0F\u5316\uFF0C\u5982 \"$42.49\"\uFF09\n   * \u663E\u793A\u5728\u73B0\u4EF7\u4E0B\u65B9\u5C0F\u5B57\uFF0C\u914D\u5408 memberPriceType \u51B3\u5B9A\u6807\u7B7E\u989C\u8272\n   */\n  memberPriceNote?: string\n  /** \u4F1A\u5458\u4EF7\u7C7B\u578B\uFF0C\u51B3\u5B9A\u6807\u7B7E\u6587\u6848\u548C\u989C\u8272 */\n  memberPriceType?: 'member' | 'plus-member'\n  /** \u662F\u5426\u53EF\u552E */\n  availableForSale: boolean\n  /**\n   * \u53EF\u7528\u5E93\u5B58\u4E0A\u9650\uFF08\u7528\u4E8E\u9650\u5236\u52A0\u8D2D\u6570\u91CF\uFF09\n   * \u4E1A\u52A1\u7AEF\u4ECE\u5E93\u5B58 API \u83B7\u53D6\u540E\u4F20\u5165\uFF0C\u7EC4\u4EF6\u53EA\u7528\u4E8E\u5224\u65AD\u662F\u5426\u8FBE\u5230\u4E0A\u9650\n   */\n  quantityAvailable?: number | null\n  /** tags \u5217\u8868 */\n  tags?: Array<\n    | {\n        label: string\n        variant: BadgeProps['variant']\n        promotionalType?: BadgeProps['promotionalType']\n      }\n    | React.ReactNode\n  >\n}\n\n/**\n * AccessoryProductCard Props\n * \u6240\u6709\u4E1A\u52A1\u72B6\u6001\uFF08addedQuantity\u3001isLoading \u7B49\uFF09\u7531\u4E1A\u52A1\u7AEF\u7EF4\u62A4\u5E76\u4F20\u5165\n */\nexport interface AccessoryProductCardProps {\n  /** \u4EA7\u54C1\u6570\u636E */\n  product: AccessoryProductData\n  /** \u5DF2\u52A0\u8D2D\u6570\u91CF\uFF08\u4E1A\u52A1\u7AEF\u7EF4\u62A4\uFF09 */\n  addedQuantity?: number\n  /** \u6700\u5927\u53EF\u52A0\u8D2D\u6570\u91CF\uFF08undefined \u5219\u4E0D\u9650\u5236\uFF09 */\n  maxQuantity?: number\n  /** \u52A0\u8D2D loading \u72B6\u6001\uFF08\u4E1A\u52A1\u7AEF\u7EF4\u62A4\uFF09 */\n  isLoading?: boolean\n  /** \u662F\u5426\u663E\u793A tags */\n  showTags?: boolean\n  /** \u662F\u5426\u663E\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\uFF09 */\n  showOriginalPrice?: boolean\n  /** \u662F\u5426\u663E\u793A\u6298\u6263\u91D1\u989D\uFF08\u54C1\u724C\u8272\uFF0C\u65E0\u5220\u9664\u7EBF\uFF0C\u4F18\u5148\u7EA7\u9AD8\u4E8E showOriginalPrice\uFF09 */\n  showDiscountPrice?: boolean\n  /** \u662F\u5426\u663E\u793A\u4F1A\u5458\u4EF7\u5C0F\u5B57 */\n  showMemberPrice?: boolean\n  /** \u70B9\u51FB\u4EA7\u54C1\u56FE/\u6807\u9898\u56DE\u8C03\uFF08\u4E0D\u4F20\u5219\u964D\u7EA7\u4E3A listingLink href\uFF09 */\n  onProductClick?: (product: AccessoryProductData) => void\n  /** \u70B9\u51FB\u52A0\u8D2D\u6309\u94AE\u56DE\u8C03 */\n  onAddToCart?: (product: AccessoryProductData) => void\n  /** \u6837\u5F0F\u7C7B\u540D */\n  className?: string\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n  classNames?: Partial<Record<AccessoryCardSemanticName, string>>\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: AccessoryCopyConfig\n}\n"],
+  "mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
+  "names": ["types_exports", "__toCommonJS"]
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/AddToCartSuccessPopover/index.d.ts

@@ -0,0 +1,82 @@
+import * as React from 'react';
+import type { AccessoryProductData } from '../AccessoryShelf/types.js';
+export type { AccessoryProductData };
+/**
+ * 语义化类名
+ */
+export type AddToCartSuccessSemanticName = 'root' | 'arrow' | 'closeButton' | 'header' | 'successIcon' | 'successTitle' | 'productRow' | 'productImage' | 'productInfo' | 'productTitle' | 'productVariant' | 'priceRow' | 'currentPrice' | 'originalPrice' | 'quantity' | 'cartCountText' | 'viewCartButton';
+/**
+ * 文案配置
+ */
+export interface AddToCartSuccessCopyConfig {
+    /** 成功提示标题，默认 "Successfully added to cart!" */
+    successTitle?: string;
+    /** 购物车商品总数文案，{count} 会被替换为总数量，默认 "There are {count} items in the shopping cart." */
+    cartCountText?: string;
+    /** 查看购物车按钮文案，默认 "View Cart" */
+    viewCartLabel?: string;
+    /** 关闭按钮无障碍标签，默认 "Close" */
+    closeLabel?: string;
+    /** 数量前缀符号，默认 "x"，最终展示为 "x1" */
+    quantityPrefix?: string;
+}
+export interface AddToCartSuccessPopoverProps {
+    /**
+     * 弹窗触发器，通常是购物车图标按钮，内部使用 asChild 包裹。
+     * 当提供 triggerRef 时可为空（此时 Popover 锚定到外部 DOM 元素）。
+     */
+    children?: React.ReactNode;
+    /**
+     * 外部锚点元素 ref，用于将 Popover 锚定到页面上已有的元素（如导航栏中的购物车图标），
+     * 无需包裹该元素作为 children。传入后 children 可省略，内部使用 PopoverAnchor + virtualRef 实现。
+     * 注意：仅在 children 未提供时生效；如果同时提供 children 和 triggerRef，children 优先。
+     */
+    triggerRef?: React.RefObject<HTMLElement>;
+    /** 受控展示状态 */
+    open?: boolean;
+    /** 非受控默认展示状态 */
+    defaultOpen?: boolean;
+    /** 展示状态变化回调 */
+    onOpenChange?: (open: boolean) => void;
+    /** 刚加购的商品数据（复用 AccessoryShelf 的 AccessoryProductData） */
+    product: AccessoryProductData;
+    /** 商品参数列表，如颜色/赠品，渲染为 "Color: Classic Black · Gift: 1" */
+    paramList?: {
+        label: string;
+        value: string;
+    }[];
+    /** 是否展示原价（删除线），默认 true（当 product.originalPrice 存在时） */
+    showOriginalPrice?: boolean;
+    /** 本次加购数量，用于展示 "x1"，默认 1 */
+    quantity?: number;
+    /** 购物车商品总数，用于底部文案插值；不传则回退为 quantity */
+    cartTotalCount?: number;
+    /** 点击 "View Cart" 按钮回调 */
+    onViewCart?: () => void;
+    /** 文案配置 */
+    copy?: AddToCartSuccessCopyConfig;
+    /**
+     * 自动关闭延时（毫秒），设为 0 或 null 则禁用自动关闭。
+     * 默认 8000（8秒），用户无任何操作时自动隐藏。
+     */
+    autoCloseDuration?: number | null;
+    /** Popover 对齐方式，默认 center（居中于触发器），移动端自动居中于屏幕 */
+    align?: 'start' | 'center' | 'end';
+    /** Popover 弹出方向，默认 bottom */
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    /** 距离触发器的偏移量，默认 12 */
+    sideOffset?: number;
+    /** 根元素类名 */
+    className?: string;
+    /** 语义化类名覆盖 */
+    classNames?: Partial<Record<AddToCartSuccessSemanticName, string>>;
+}
+/**
+ * AddToCartSuccessPopover - 加购成功悬浮提示
+ *
+ * @description 用户点击加购后，锚定在触发器（如购物车图标）下方展示的非模态悬浮提示，
+ * 展示成功提示、商品信息、购物车总数及"查看购物车"入口。
+ */
+declare const AddToCartSuccessPopover: React.ForwardRefExoticComponent<AddToCartSuccessPopoverProps & React.RefAttributes<HTMLDivElement>>;
+export default AddToCartSuccessPopover;
+export { AddToCartSuccessPopover };

package/dist/cjs/biz-components/AccessoriesShelf/components/AddToCartSuccessPopover/index.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var ee=Object.create;var C=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var ne=Object.getPrototypeOf,ie=Object.prototype.hasOwnProperty;var re=(o,i)=>{for(var s in i)C(o,s,{get:i[s],enumerable:!0})},I=(o,i,s,x)=>{if(i&&typeof i=="object"||typeof i=="function")for(let l of oe(i))!ie.call(o,l)&&l!==s&&C(o,l,{get:()=>i[l],enumerable:!(x=te(i,l))||x.enumerable});return o};var ae=(o,i,s)=>(s=o!=null?ee(ne(o)):{},I(i||!o||!o.__esModule?C(s,"default",{value:o,enumerable:!0}):s,o)),se=o=>I(C({},"__esModule",{value:!0}),o);var de={};re(de,{AddToCartSuccessPopover:()=>h,default:()=>pe});module.exports=se(de);var e=require("react/jsx-runtime"),m=ae(require("react")),z=require("react"),n=require("../../../../helpers/index.js"),t=require("../../../../components/index.js"),B=require("../../../../hooks/useExposure.js"),k=require("../../../../shared/track.js"),D=require("../../../AiuiProvider/index.js");const R="popover",L="add_to_cart_success_popover",ce=({className:o})=>(0,e.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",className:o,"aria-hidden":!0,children:[(0,e.jsx)("circle",{cx:"10",cy:"10",r:"8.75",fill:"#30D158"}),(0,e.jsx)("path",{d:"M5.8335 9.58333L9.16683 12.5L14.1668 7.5",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),le=o=>(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",...o,children:(0,e.jsx)("path",{d:"M4.69617 4.69673C5.02156 4.37125 5.54924 4.3713 5.87468 4.69673L9.99947 8.82152L14.1243 4.69673C14.4497 4.37129 14.9774 4.37125 15.3028 4.69673C15.6281 5.02219 15.6281 5.5498 15.3028 5.87524L11.178 10L15.3028 14.1248C15.6281 14.4503 15.6281 14.9779 15.3028 15.3033C14.9774 15.6288 14.4497 15.6288 14.1243 15.3033L9.99947 11.1785L5.87468 15.3033C5.54924 15.6288 5.02156 15.6288 4.69617 15.3033C4.3708 14.9779 4.37081 14.4503 4.69617 14.1248L8.82096 10L4.69617 5.87524C4.37081 5.5498 4.3708 5.02219 4.69617 4.69673Z",fill:"#080A0F"})}),h=m.forwardRef(({children:o,triggerRef:i,open:s,defaultOpen:x,onOpenChange:l,product:c,paramList:w,showOriginalPrice:E=!0,quantity:A=1,cartTotalCount:H,onViewCart:j,copy:u,autoCloseDuration:f=8e3,align:q="center",side:V="bottom",sideOffset:F=12,className:W,classNames:r},G)=>{const{trackingData:M}=(0,D.useAiuiContext)(),[Z,J]=m.useState(x??!1),b=s!==void 0,T=b?s:Z,y=m.useCallback(p=>{b||J(p),l?.(p)},[b,l]);m.useEffect(()=>{if(!T||f==null||f<=0)return;const p=setTimeout(()=>y(!1),f);return()=>clearTimeout(p)},[T,f,y]);const g=u?.successTitle??"Successfully added to cart!",K=u?.cartCountText??"There are {count} items in the shopping cart.",P=u?.viewCartLabel??"View Cart",Q=u?.closeLabel??"Close",U=u?.quantityPrefix??"x",v=K.replace("{count}",String(H??A)),N=c.custom_name||c.name,X=c.custom_image||c.image,_=(0,z.useRef)(null);(0,B.useExposure)(_,{componentType:R,componentName:L,componentTitle:g,componentDescription:v}),m.useImperativeHandle(G,()=>_.current);const Y=m.useMemo(()=>{if(i)return{current:{getBoundingClientRect:()=>{const a=i.current?.getBoundingClientRect()??new DOMRect,S=window.innerWidth,O=window.innerHeight,d=16;return a.bottom<=d?new DOMRect(Math.max(d,Math.min(a.left,S-d-a.width)),d,a.width||0,0):a.top>=O-d?new DOMRect(Math.max(d,Math.min(a.left,S-d-a.width)),O-d,a.width||0,0):a},contextElement:i.current||void 0}}},[i]),$=o!=null?(0,e.jsx)(t.PopoverTrigger,{asChild:!0,children:o}):i&&(0,e.jsx)(t.PopoverAnchor,{virtualRef:Y});return(0,e.jsxs)(t.Popover,{open:T,onOpenChange:y,children:[$,(0,e.jsxs)(t.PopoverContent,{ref:_,align:q,side:V,sideOffset:F,zIndex:101,avoidCollisions:!0,collisionPadding:16,className:(0,n.cn)("rounded-card laptop:w-[420px] laptop:p-6 relative w-[calc(100vw-32px)] max-w-[420px] border-none bg-white p-4 shadow-[0_2px_8px_0_rgba(0,0,0,0.12)] outline-none",W,r?.root),children:[(0,e.jsx)(t.PopoverArrow,{className:(0,n.cn)("drop-shadow-[0_2px_8px_rgba(0,0,0,0.12)]",r?.arrow)}),(0,e.jsx)(t.PopoverClose,{asChild:!0,children:(0,e.jsx)("button",{type:"button",className:(0,n.cn)("text-info-tertiary hover:text-info-primary absolute right-4 top-4 transition-colors",r?.closeButton),"aria-label":Q,onClick:()=>{(0,k.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:M?.pageGroup||"Home Page",component_type:R,component_name:L,component_description:v,position:1,navigation:"Close",component_title:g,sku:c?.sku,button_name:"Close",creative_id:""}})},children:(0,e.jsx)(le,{className:"laptop:size-6 size-5"})})}),(0,e.jsxs)("div",{className:(0,n.cn)("laptop:pt-6 flex items-center gap-1 pr-4 pt-5",r?.header),children:[(0,e.jsx)(ce,{className:(0,n.cn)("laptop:size-6 size-5 shrink-0",r?.successIcon)}),(0,e.jsx)(t.Heading,{as:"h3",size:2,className:(0,n.cn)("text-info-primary laptop:text-2xl text-xl",r?.successTitle),children:g})]}),(0,e.jsxs)("div",{className:(0,n.cn)("bg-container-secondary-0 rounded-box-small laptop:mt-4 laptop:p-4 mt-3 flex items-start gap-2 p-3",r?.productRow),children:[(0,e.jsx)("div",{className:(0,n.cn)("laptop:size-16 size-12 shrink-0 overflow-hidden rounded-md mix-blend-multiply",r?.productImage),children:(0,e.jsx)(t.Picture,{source:X,alt:N,className:"size-full",imgClassName:"object-contain size-full"})}),(0,e.jsxs)("div",{className:(0,n.cn)("flex min-w-0 flex-1 flex-col",r?.productInfo),children:[(0,e.jsx)(t.Text,{as:"p",className:(0,n.cn)("text-info-primary laptop:text-[14px] line-clamp-2 text-[12px] font-bold leading-[1.2]",r?.productTitle),children:N}),w&&w.length>0&&(0,e.jsx)(t.Text,{as:"p",className:(0,n.cn)("text-info-tertiary laptop:mt-1 laptop:text-[14px] mt-[2px] text-[12px] font-bold",r?.productVariant),children:w.map((p,a)=>(0,e.jsxs)(m.Fragment,{children:[a>0&&" \xB7 ",p.label,": ",p.value]},a))}),(0,e.jsxs)("div",{className:(0,n.cn)("mt-1 flex items-center justify-between gap-2",r?.priceRow),children:[(0,e.jsxs)("div",{className:"flex items-baseline gap-1",children:[(0,e.jsx)(t.Text,{as:"span",className:(0,n.cn)("text-info-primary text-[14px] font-bold",r?.currentPrice),children:c.price}),E&&c.originalPrice&&(0,e.jsx)(t.Text,{as:"span",className:(0,n.cn)("text-info-tertiary text-[14px] font-bold line-through",r?.originalPrice),children:c.originalPrice})]}),(0,e.jsxs)(t.Text,{as:"span",className:(0,n.cn)("text-info-primary shrink-0 text-[14px] font-bold",r?.quantity),children:[U,A]})]})]})]}),(0,e.jsx)(t.Text,{as:"p",className:(0,n.cn)("text-info-primary laptop:mt-6 laptop:text-[18px] mt-4 text-[14px] font-bold",r?.cartCountText),children:v}),(0,e.jsx)("div",{className:"laptop:mt-4 mt-3 flex justify-end",children:(0,e.jsx)(t.Button,{variant:"primary",size:"lg",onClick:()=>{(0,k.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{component_type:R,component_name:L,button_name:P,page_group:M?.pageGroup||"Home Page",component_description:v,position:1,navigation:P,component_title:g,sku:c?.sku,creative_id:""}}),j?.()},className:(0,n.cn)("rounded-full",r?.viewCartButton),children:P})})]})]})});h.displayName="AddToCartSuccessPopover";var pe=h;
+//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/AccessoriesShelf/components/AddToCartSuccessPopover/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/biz-components/AccessoriesShelf/components/AddToCartSuccessPopover/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { useRef } from 'react'\nimport { cn } from '../../../../helpers/index.js'\nimport {\n  Popover,\n  PopoverTrigger,\n  PopoverAnchor,\n  PopoverContent,\n  PopoverClose,\n  PopoverArrow,\n  Button,\n  Text,\n  Heading,\n  Picture,\n} from '../../../../components/index.js'\nimport { useExposure } from '../../../../hooks/useExposure.js'\nimport { gaTrack } from '../../../../shared/track.js'\nimport type { AccessoryProductData } from '../AccessoryShelf/types.js'\nimport { useAiuiContext } from '../../../AiuiProvider/index.js'\n\nconst componentType = 'popover'\nconst componentName = 'add_to_cart_success_popover'\n\nexport type { AccessoryProductData }\n\n/**\n * \u8BED\u4E49\u5316\u7C7B\u540D\n */\nexport type AddToCartSuccessSemanticName =\n  | 'root'\n  | 'arrow'\n  | 'closeButton'\n  | 'header'\n  | 'successIcon'\n  | 'successTitle'\n  | 'productRow'\n  | 'productImage'\n  | 'productInfo'\n  | 'productTitle'\n  | 'productVariant'\n  | 'priceRow'\n  | 'currentPrice'\n  | 'originalPrice'\n  | 'quantity'\n  | 'cartCountText'\n  | 'viewCartButton'\n\n/**\n * \u6587\u6848\u914D\u7F6E\n */\nexport interface AddToCartSuccessCopyConfig {\n  /** \u6210\u529F\u63D0\u793A\u6807\u9898\uFF0C\u9ED8\u8BA4 \"Successfully added to cart!\" */\n  successTitle?: string\n  /** \u8D2D\u7269\u8F66\u5546\u54C1\u603B\u6570\u6587\u6848\uFF0C{count} \u4F1A\u88AB\u66FF\u6362\u4E3A\u603B\u6570\u91CF\uFF0C\u9ED8\u8BA4 \"There are {count} items in the shopping cart.\" */\n  cartCountText?: string\n  /** \u67E5\u770B\u8D2D\u7269\u8F66\u6309\u94AE\u6587\u6848\uFF0C\u9ED8\u8BA4 \"View Cart\" */\n  viewCartLabel?: string\n  /** \u5173\u95ED\u6309\u94AE\u65E0\u969C\u788D\u6807\u7B7E\uFF0C\u9ED8\u8BA4 \"Close\" */\n  closeLabel?: string\n  /** \u6570\u91CF\u524D\u7F00\u7B26\u53F7\uFF0C\u9ED8\u8BA4 \"x\"\uFF0C\u6700\u7EC8\u5C55\u793A\u4E3A \"x1\" */\n  quantityPrefix?: string\n}\n\nexport interface AddToCartSuccessPopoverProps {\n  /**\n   * \u5F39\u7A97\u89E6\u53D1\u5668\uFF0C\u901A\u5E38\u662F\u8D2D\u7269\u8F66\u56FE\u6807\u6309\u94AE\uFF0C\u5185\u90E8\u4F7F\u7528 asChild \u5305\u88F9\u3002\n   * \u5F53\u63D0\u4F9B triggerRef \u65F6\u53EF\u4E3A\u7A7A\uFF08\u6B64\u65F6 Popover \u951A\u5B9A\u5230\u5916\u90E8 DOM \u5143\u7D20\uFF09\u3002\n   */\n  children?: React.ReactNode\n  /**\n   * \u5916\u90E8\u951A\u70B9\u5143\u7D20 ref\uFF0C\u7528\u4E8E\u5C06 Popover \u951A\u5B9A\u5230\u9875\u9762\u4E0A\u5DF2\u6709\u7684\u5143\u7D20\uFF08\u5982\u5BFC\u822A\u680F\u4E2D\u7684\u8D2D\u7269\u8F66\u56FE\u6807\uFF09\uFF0C\n   * \u65E0\u9700\u5305\u88F9\u8BE5\u5143\u7D20\u4F5C\u4E3A children\u3002\u4F20\u5165\u540E children \u53EF\u7701\u7565\uFF0C\u5185\u90E8\u4F7F\u7528 PopoverAnchor + virtualRef \u5B9E\u73B0\u3002\n   * \u6CE8\u610F\uFF1A\u4EC5\u5728 children \u672A\u63D0\u4F9B\u65F6\u751F\u6548\uFF1B\u5982\u679C\u540C\u65F6\u63D0\u4F9B children \u548C triggerRef\uFF0Cchildren \u4F18\u5148\u3002\n   */\n  triggerRef?: React.RefObject<HTMLElement>\n  /** \u53D7\u63A7\u5C55\u793A\u72B6\u6001 */\n  open?: boolean\n  /** \u975E\u53D7\u63A7\u9ED8\u8BA4\u5C55\u793A\u72B6\u6001 */\n  defaultOpen?: boolean\n  /** \u5C55\u793A\u72B6\u6001\u53D8\u5316\u56DE\u8C03 */\n  onOpenChange?: (open: boolean) => void\n  /** \u521A\u52A0\u8D2D\u7684\u5546\u54C1\u6570\u636E\uFF08\u590D\u7528 AccessoryShelf \u7684 AccessoryProductData\uFF09 */\n  product: AccessoryProductData\n  /** \u5546\u54C1\u53C2\u6570\u5217\u8868\uFF0C\u5982\u989C\u8272/\u8D60\u54C1\uFF0C\u6E32\u67D3\u4E3A \"Color: Classic Black \u00B7 Gift: 1\" */\n  paramList?: { label: string; value: string }[]\n  /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\uFF09\uFF0C\u9ED8\u8BA4 true\uFF08\u5F53 product.originalPrice \u5B58\u5728\u65F6\uFF09 */\n  showOriginalPrice?: boolean\n  /** \u672C\u6B21\u52A0\u8D2D\u6570\u91CF\uFF0C\u7528\u4E8E\u5C55\u793A \"x1\"\uFF0C\u9ED8\u8BA4 1 */\n  quantity?: number\n  /** \u8D2D\u7269\u8F66\u5546\u54C1\u603B\u6570\uFF0C\u7528\u4E8E\u5E95\u90E8\u6587\u6848\u63D2\u503C\uFF1B\u4E0D\u4F20\u5219\u56DE\u9000\u4E3A quantity */\n  cartTotalCount?: number\n  /** \u70B9\u51FB \"View Cart\" \u6309\u94AE\u56DE\u8C03 */\n  onViewCart?: () => void\n  /** \u6587\u6848\u914D\u7F6E */\n  copy?: AddToCartSuccessCopyConfig\n  /**\n   * \u81EA\u52A8\u5173\u95ED\u5EF6\u65F6\uFF08\u6BEB\u79D2\uFF09\uFF0C\u8BBE\u4E3A 0 \u6216 null \u5219\u7981\u7528\u81EA\u52A8\u5173\u95ED\u3002\n   * \u9ED8\u8BA4 8000\uFF088\u79D2\uFF09\uFF0C\u7528\u6237\u65E0\u4EFB\u4F55\u64CD\u4F5C\u65F6\u81EA\u52A8\u9690\u85CF\u3002\n   */\n  autoCloseDuration?: number | null\n  /** Popover \u5BF9\u9F50\u65B9\u5F0F\uFF0C\u9ED8\u8BA4 center\uFF08\u5C45\u4E2D\u4E8E\u89E6\u53D1\u5668\uFF09\uFF0C\u79FB\u52A8\u7AEF\u81EA\u52A8\u5C45\u4E2D\u4E8E\u5C4F\u5E55 */\n  align?: 'start' | 'center' | 'end'\n  /** Popover \u5F39\u51FA\u65B9\u5411\uFF0C\u9ED8\u8BA4 bottom */\n  side?: 'top' | 'right' | 'bottom' | 'left'\n  /** \u8DDD\u79BB\u89E6\u53D1\u5668\u7684\u504F\u79FB\u91CF\uFF0C\u9ED8\u8BA4 12 */\n  sideOffset?: number\n  /** \u6839\u5143\u7D20\u7C7B\u540D */\n  className?: string\n  /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n  classNames?: Partial<Record<AddToCartSuccessSemanticName, string>>\n}\n\nconst CheckIcon = ({ className }: { className?: string }) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"20\"\n    height=\"20\"\n    viewBox=\"0 0 20 20\"\n    fill=\"none\"\n    className={className}\n    aria-hidden\n  >\n    <circle cx=\"10\" cy=\"10\" r=\"8.75\" fill=\"#30D158\" />\n    <path\n      d=\"M5.8335 9.58333L9.16683 12.5L14.1668 7.5\"\n      stroke=\"white\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n  </svg>\n)\n\nconst CloseIcon = (props: React.ComponentPropsWithoutRef<'svg'>) => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" {...props}>\n    <path\n      d=\"M4.69617 4.69673C5.02156 4.37125 5.54924 4.3713 5.87468 4.69673L9.99947 8.82152L14.1243 4.69673C14.4497 4.37129 14.9774 4.37125 15.3028 4.69673C15.6281 5.02219 15.6281 5.5498 15.3028 5.87524L11.178 10L15.3028 14.1248C15.6281 14.4503 15.6281 14.9779 15.3028 15.3033C14.9774 15.6288 14.4497 15.6288 14.1243 15.3033L9.99947 11.1785L5.87468 15.3033C5.54924 15.6288 5.02156 15.6288 4.69617 15.3033C4.3708 14.9779 4.37081 14.4503 4.69617 14.1248L8.82096 10L4.69617 5.87524C4.37081 5.5498 4.3708 5.02219 4.69617 4.69673Z\"\n      fill=\"#080A0F\"\n    />\n  </svg>\n)\n\n/**\n * AddToCartSuccessPopover - \u52A0\u8D2D\u6210\u529F\u60AC\u6D6E\u63D0\u793A\n *\n * @description \u7528\u6237\u70B9\u51FB\u52A0\u8D2D\u540E\uFF0C\u951A\u5B9A\u5728\u89E6\u53D1\u5668\uFF08\u5982\u8D2D\u7269\u8F66\u56FE\u6807\uFF09\u4E0B\u65B9\u5C55\u793A\u7684\u975E\u6A21\u6001\u60AC\u6D6E\u63D0\u793A\uFF0C\n * \u5C55\u793A\u6210\u529F\u63D0\u793A\u3001\u5546\u54C1\u4FE1\u606F\u3001\u8D2D\u7269\u8F66\u603B\u6570\u53CA\"\u67E5\u770B\u8D2D\u7269\u8F66\"\u5165\u53E3\u3002\n */\nconst AddToCartSuccessPopover = React.forwardRef<HTMLDivElement, AddToCartSuccessPopoverProps>(\n  (\n    {\n      children,\n      triggerRef,\n      open: controlledOpen,\n      defaultOpen,\n      onOpenChange,\n      product,\n      paramList,\n      showOriginalPrice = true,\n      quantity = 1,\n      cartTotalCount,\n      onViewCart,\n      copy,\n      autoCloseDuration = 8000,\n      align = 'center',\n      side = 'bottom',\n      sideOffset = 12,\n      className,\n      classNames,\n    },\n    ref\n  ) => {\n    const { trackingData } = useAiuiContext()\n    const [internalOpen, setInternalOpen] = React.useState(defaultOpen ?? false)\n    const isControlled = controlledOpen !== undefined\n    const isOpen = isControlled ? controlledOpen : internalOpen\n\n    const handleOpenChange = React.useCallback(\n      (nextOpen: boolean) => {\n        if (!isControlled) setInternalOpen(nextOpen)\n        onOpenChange?.(nextOpen)\n      },\n      [isControlled, onOpenChange]\n    )\n\n    // \u81EA\u52A8\u5173\u95ED\u8BA1\u65F6\u5668\n    React.useEffect(() => {\n      if (!isOpen || autoCloseDuration == null || autoCloseDuration <= 0) return\n      const timer = setTimeout(() => handleOpenChange(false), autoCloseDuration)\n      return () => clearTimeout(timer)\n    }, [isOpen, autoCloseDuration, handleOpenChange])\n\n    const successTitle = copy?.successTitle ?? 'Successfully added to cart!'\n    const cartCountTemplate = copy?.cartCountText ?? 'There are {count} items in the shopping cart.'\n    const viewCartLabel = copy?.viewCartLabel ?? 'View Cart'\n    const closeLabel = copy?.closeLabel ?? 'Close'\n    const quantityPrefix = copy?.quantityPrefix ?? 'x'\n\n    const cartCountText = cartCountTemplate.replace('{count}', String(cartTotalCount ?? quantity))\n    const displayTitle = product.custom_name || product.name\n    const displayImage = product.custom_image || product.image\n\n    const boxRef = useRef<HTMLDivElement>(null)\n\n    useExposure(boxRef, {\n      componentType,\n      componentName,\n      componentTitle: successTitle,\n      componentDescription: cartCountText,\n    })\n\n    React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n    // virtualRef \u9002\u914D\uFF1A\u521B\u5EFA\u5305\u542B contextElement \u7684\u865A\u62DF\u5143\u7D20\uFF0C\n    // \u786E\u4FDD Floating UI \u80FD\u6B63\u786E\u8FFD\u8E2A\u951A\u70B9\u7684\u6EDA\u52A8\u548C\u4F4D\u7F6E\u53D8\u5316\u3002\n    // getBoundingClientRect \u4F1A\u5C06\u951A\u70B9\u4F4D\u7F6E\u5939\u6301\u5728\u89C6\u53E3\u5185\uFF0C\u4FDD\u8BC1\u5F39\u7A97\u5728\u951A\u70B9\u6EDA\u51FA\u5C4F\u5E55\u540E\u4ECD\u53EF\u89C1\u3002\n    const virtualRef = React.useMemo(() => {\n      if (!triggerRef) return undefined\n\n      return {\n        current: {\n          getBoundingClientRect: () => {\n            const el = triggerRef.current\n            const rect = el?.getBoundingClientRect() ?? new DOMRect()\n            const vw = window.innerWidth\n            const vh = window.innerHeight\n            const pad = 16\n\n            // \u951A\u70B9\u5728\u89C6\u53E3\u4E0A\u65B9\uFF08\u5411\u4E0A\u6EDA\u51FA\uFF09\n            if (rect.bottom <= pad) {\n              return new DOMRect(Math.max(pad, Math.min(rect.left, vw - pad - rect.width)), pad, rect.width || 0, 0)\n            }\n            // \u951A\u70B9\u5728\u89C6\u53E3\u4E0B\u65B9\uFF08\u5411\u4E0B\u6EDA\u51FA\uFF09\n            if (rect.top >= vh - pad) {\n              return new DOMRect(\n                Math.max(pad, Math.min(rect.left, vw - pad - rect.width)),\n                vh - pad,\n                rect.width || 0,\n                0\n              )\n            }\n            return rect\n          },\n          contextElement: triggerRef.current || undefined,\n        },\n      } as React.RefObject<{ getBoundingClientRect(): DOMRect; contextElement?: HTMLElement }>\n    }, [triggerRef])\n\n    const trigger =\n      children != null ? (\n        <PopoverTrigger asChild>{children}</PopoverTrigger>\n      ) : (\n        triggerRef && <PopoverAnchor virtualRef={virtualRef} />\n      )\n\n    return (\n      <Popover open={isOpen} onOpenChange={handleOpenChange}>\n        {trigger}\n        <PopoverContent\n          ref={boxRef}\n          align={align}\n          side={side}\n          sideOffset={sideOffset}\n          zIndex={101}\n          avoidCollisions\n          collisionPadding={16}\n          className={cn(\n            'rounded-card laptop:w-[420px] laptop:p-6 relative w-[calc(100vw-32px)] max-w-[420px] border-none bg-white p-4 shadow-[0_2px_8px_0_rgba(0,0,0,0.12)] outline-none',\n            className,\n            classNames?.root\n          )}\n        >\n          <PopoverArrow className={cn('drop-shadow-[0_2px_8px_rgba(0,0,0,0.12)]', classNames?.arrow)} />\n\n          <PopoverClose asChild>\n            <button\n              type=\"button\"\n              className={cn(\n                'text-info-tertiary hover:text-info-primary absolute right-4 top-4 transition-colors',\n                classNames?.closeButton\n              )}\n              aria-label={closeLabel}\n              onClick={() => {\n                gaTrack({\n                  event: 'ga4Event',\n                  event_name: 'component_click',\n                  event_parameters: {\n                    page_group: trackingData?.pageGroup || 'Home Page',\n                    component_type: componentType,\n                    component_name: componentName,\n                    component_description: cartCountText,\n                    position: 1,\n                    navigation: 'Close',\n                    component_title: successTitle,\n                    sku: product?.sku,\n                    button_name: 'Close',\n                    creative_id: '',\n                  },\n                })\n              }}\n            >\n              <CloseIcon className=\"laptop:size-6 size-5\" />\n            </button>\n          </PopoverClose>\n\n          <div className={cn('laptop:pt-6 flex items-center gap-1 pr-4 pt-5', classNames?.header)}>\n            <CheckIcon className={cn('laptop:size-6 size-5 shrink-0', classNames?.successIcon)} />\n            <Heading\n              as=\"h3\"\n              size={2}\n              className={cn('text-info-primary laptop:text-2xl text-xl', classNames?.successTitle)}\n            >\n              {successTitle}\n            </Heading>\n          </div>\n\n          <div\n            className={cn(\n              'bg-container-secondary-0 rounded-box-small laptop:mt-4 laptop:p-4 mt-3 flex items-start gap-2 p-3',\n              classNames?.productRow\n            )}\n          >\n            <div\n              className={cn(\n                'laptop:size-16 size-12 shrink-0 overflow-hidden rounded-md mix-blend-multiply',\n                classNames?.productImage\n              )}\n            >\n              <Picture\n                source={displayImage}\n                alt={displayTitle}\n                className=\"size-full\"\n                imgClassName=\"object-contain size-full\"\n              />\n            </div>\n            <div className={cn('flex min-w-0 flex-1 flex-col', classNames?.productInfo)}>\n              <Text\n                as=\"p\"\n                className={cn(\n                  'text-info-primary laptop:text-[14px] line-clamp-2 text-[12px] font-bold leading-[1.2]',\n                  classNames?.productTitle\n                )}\n              >\n                {displayTitle}\n              </Text>\n              {paramList && paramList.length > 0 && (\n                <Text\n                  as=\"p\"\n                  className={cn(\n                    'text-info-tertiary laptop:mt-1 laptop:text-[14px] mt-[2px] text-[12px] font-bold',\n                    classNames?.productVariant\n                  )}\n                >\n                  {paramList.map((p, i) => (\n                    <React.Fragment key={i}>\n                      {i > 0 && ' \u00B7 '}\n                      {p.label}: {p.value}\n                    </React.Fragment>\n                  ))}\n                </Text>\n              )}\n              <div className={cn('mt-1 flex items-center justify-between gap-2', classNames?.priceRow)}>\n                <div className=\"flex items-baseline gap-1\">\n                  <Text as=\"span\" className={cn('text-info-primary text-[14px] font-bold', classNames?.currentPrice)}>\n                    {product.price}\n                  </Text>\n                  {showOriginalPrice && product.originalPrice && (\n                    <Text\n                      as=\"span\"\n                      className={cn('text-info-tertiary text-[14px] font-bold line-through', classNames?.originalPrice)}\n                    >\n                      {product.originalPrice}\n                    </Text>\n                  )}\n                </div>\n                <Text\n                  as=\"span\"\n                  className={cn('text-info-primary shrink-0 text-[14px] font-bold', classNames?.quantity)}\n                >\n                  {quantityPrefix}\n                  {quantity}\n                </Text>\n              </div>\n            </div>\n          </div>\n\n          <Text\n            as=\"p\"\n            className={cn(\n              'text-info-primary laptop:mt-6 laptop:text-[18px] mt-4 text-[14px] font-bold',\n              classNames?.cartCountText\n            )}\n          >\n            {cartCountText}\n          </Text>\n\n          <div className=\"laptop:mt-4 mt-3 flex justify-end\">\n            <Button\n              variant=\"primary\"\n              size=\"lg\"\n              onClick={() => {\n                gaTrack({\n                  event: 'ga4Event',\n                  event_name: 'component_click',\n                  event_parameters: {\n                    component_type: componentType,\n                    component_name: componentName,\n                    button_name: viewCartLabel,\n                    page_group: trackingData?.pageGroup || 'Home Page',\n                    component_description: cartCountText,\n                    position: 1,\n                    navigation: viewCartLabel,\n                    component_title: successTitle,\n                    sku: product?.sku,\n                    creative_id: '',\n                  },\n                })\n                onViewCart?.()\n              }}\n              className={cn('rounded-full', classNames?.viewCartButton)}\n            >\n              {viewCartLabel}\n            </Button>\n          </div>\n        </PopoverContent>\n      </Popover>\n    )\n  }\n)\n\nAddToCartSuccessPopover.displayName = 'AddToCartSuccessPopover'\n\nexport default AddToCartSuccessPopover\nexport { AddToCartSuccessPopover }\n"],
+  "mappings": "olBAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,6BAAAE,EAAA,YAAAC,KAAA,eAAAC,GAAAJ,IAmHE,IAAAK,EAAA,6BAjHFC,EAAuB,qBACvBC,EAAuB,iBACvBC,EAAmB,wCACnBC,EAWO,2CACPC,EAA4B,4CAC5BC,EAAwB,uCAExBC,EAA+B,0CAE/B,MAAMC,EAAgB,UAChBC,EAAgB,8BA2FhBC,GAAY,CAAC,CAAE,UAAAC,CAAU,OAC7B,QAAC,OACC,MAAM,6BACN,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OACL,UAAWA,EACX,cAAW,GAEX,oBAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,OAAO,KAAK,UAAU,KAChD,OAAC,QACC,EAAE,2CACF,OAAO,QACP,YAAY,IACZ,cAAc,QACd,eAAe,QACjB,GACF,EAGIC,GAAaC,MACjB,OAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAQ,GAAGA,EACjG,mBAAC,QACC,EAAE,ogBACF,KAAK,UACP,EACF,EASIhB,EAA0BI,EAAM,WACpC,CACE,CACE,SAAAa,EACA,WAAAC,EACA,KAAMC,EACN,YAAAC,EACA,aAAAC,EACA,QAAAC,EACA,UAAAC,EACA,kBAAAC,EAAoB,GACpB,SAAAC,EAAW,EACX,eAAAC,EACA,WAAAC,EACA,KAAAC,EACA,kBAAAC,EAAoB,IACpB,MAAAC,EAAQ,SACR,KAAAC,EAAO,SACP,WAAAC,EAAa,GACb,UAAAlB,EACA,WAAAmB,CACF,EACAC,IACG,CACH,KAAM,CAAE,aAAAC,CAAa,KAAI,kBAAe,EAClC,CAACC,EAAcC,CAAe,EAAIjC,EAAM,SAASgB,GAAe,EAAK,EACrEkB,EAAenB,IAAmB,OAClCoB,EAASD,EAAenB,EAAiBiB,EAEzCI,EAAmBpC,EAAM,YAC5BqC,GAAsB,CAChBH,GAAcD,EAAgBI,CAAQ,EAC3CpB,IAAeoB,CAAQ,CACzB,EACA,CAACH,EAAcjB,CAAY,CAC7B,EAGAjB,EAAM,UAAU,IAAM,CACpB,GAAI,CAACmC,GAAUV,GAAqB,MAAQA,GAAqB,EAAG,OACpE,MAAMa,EAAQ,WAAW,IAAMF,EAAiB,EAAK,EAAGX,CAAiB,EACzE,MAAO,IAAM,aAAaa,CAAK,CACjC,EAAG,CAACH,EAAQV,EAAmBW,CAAgB,CAAC,EAEhD,MAAMG,EAAef,GAAM,cAAgB,8BACrCgB,EAAoBhB,GAAM,eAAiB,gDAC3CiB,EAAgBjB,GAAM,eAAiB,YACvCkB,EAAalB,GAAM,YAAc,QACjCmB,EAAiBnB,GAAM,gBAAkB,IAEzCoB,EAAgBJ,EAAkB,QAAQ,UAAW,OAAOlB,GAAkBD,CAAQ,CAAC,EACvFwB,EAAe3B,EAAQ,aAAeA,EAAQ,KAC9C4B,EAAe5B,EAAQ,cAAgBA,EAAQ,MAE/C6B,KAAS,UAAuB,IAAI,KAE1C,eAAYA,EAAQ,CAClB,cAAAxC,EACA,cAAAC,EACA,eAAgB+B,EAChB,qBAAsBK,CACxB,CAAC,EAED5C,EAAM,oBAAoB8B,EAAK,IAAMiB,EAAO,OAAyB,EAKrE,MAAMC,EAAahD,EAAM,QAAQ,IAAM,CACrC,GAAKc,EAEL,MAAO,CACL,QAAS,CACP,sBAAuB,IAAM,CAE3B,MAAMmC,EADKnC,EAAW,SACL,sBAAsB,GAAK,IAAI,QAC1CoC,EAAK,OAAO,WACZC,EAAK,OAAO,YACZC,EAAM,GAGZ,OAAIH,EAAK,QAAUG,EACV,IAAI,QAAQ,KAAK,IAAIA,EAAK,KAAK,IAAIH,EAAK,KAAMC,EAAKE,EAAMH,EAAK,KAAK,CAAC,EAAGG,EAAKH,EAAK,OAAS,EAAG,CAAC,EAGnGA,EAAK,KAAOE,EAAKC,EACZ,IAAI,QACT,KAAK,IAAIA,EAAK,KAAK,IAAIH,EAAK,KAAMC,EAAKE,EAAMH,EAAK,KAAK,CAAC,EACxDE,EAAKC,EACLH,EAAK,OAAS,EACd,CACF,EAEKA,CACT,EACA,eAAgBnC,EAAW,SAAW,MACxC,CACF,CACF,EAAG,CAACA,CAAU,CAAC,EAETuC,EACJxC,GAAY,QACV,OAAC,kBAAe,QAAO,GAAE,SAAAA,EAAS,EAElCC,MAAc,OAAC,iBAAc,WAAYkC,EAAY,EAGzD,SACE,QAAC,WAAQ,KAAMb,EAAQ,aAAcC,EAClC,UAAAiB,KACD,QAAC,kBACC,IAAKN,EACL,MAAOrB,EACP,KAAMC,EACN,WAAYC,EACZ,OAAQ,IACR,gBAAe,GACf,iBAAkB,GAClB,aAAW,MACT,mKACAlB,EACAmB,GAAY,IACd,EAEA,oBAAC,gBAAa,aAAW,MAAG,2CAA4CA,GAAY,KAAK,EAAG,KAE5F,OAAC,gBAAa,QAAO,GACnB,mBAAC,UACC,KAAK,SACL,aAAW,MACT,sFACAA,GAAY,WACd,EACA,aAAYa,EACZ,QAAS,IAAM,IACb,WAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYX,GAAc,WAAa,YACvC,eAAgBxB,EAChB,eAAgBC,EAChB,sBAAuBoC,EACvB,SAAU,EACV,WAAY,QACZ,gBAAiBL,EACjB,IAAKrB,GAAS,IACd,YAAa,QACb,YAAa,EACf,CACF,CAAC,CACH,EAEA,mBAACP,GAAA,CAAU,UAAU,uBAAuB,EAC9C,EACF,KAEA,QAAC,OAAI,aAAW,MAAG,gDAAiDkB,GAAY,MAAM,EACpF,oBAACpB,GAAA,CAAU,aAAW,MAAG,gCAAiCoB,GAAY,WAAW,EAAG,KACpF,OAAC,WACC,GAAG,KACH,KAAM,EACN,aAAW,MAAG,4CAA6CA,GAAY,YAAY,EAElF,SAAAU,EACH,GACF,KAEA,QAAC,OACC,aAAW,MACT,oGACAV,GAAY,UACd,EAEA,oBAAC,OACC,aAAW,MACT,gFACAA,GAAY,YACd,EAEA,mBAAC,WACC,OAAQiB,EACR,IAAKD,EACL,UAAU,YACV,aAAa,2BACf,EACF,KACA,QAAC,OAAI,aAAW,MAAG,+BAAgChB,GAAY,WAAW,EACxE,oBAAC,QACC,GAAG,IACH,aAAW,MACT,wFACAA,GAAY,YACd,EAEC,SAAAgB,EACH,EACC1B,GAAaA,EAAU,OAAS,MAC/B,OAAC,QACC,GAAG,IACH,aAAW,MACT,mFACAU,GAAY,cACd,EAEC,SAAAV,EAAU,IAAI,CAAC,EAAGmC,OACjB,QAACtD,EAAM,SAAN,CACE,UAAAsD,EAAI,GAAK,SACT,EAAE,MAAM,KAAG,EAAE,QAFKA,CAGrB,CACD,EACH,KAEF,QAAC,OAAI,aAAW,MAAG,+CAAgDzB,GAAY,QAAQ,EACrF,qBAAC,OAAI,UAAU,4BACb,oBAAC,QAAK,GAAG,OAAO,aAAW,MAAG,0CAA2CA,GAAY,YAAY,EAC9F,SAAAX,EAAQ,MACX,EACCE,GAAqBF,EAAQ,kBAC5B,OAAC,QACC,GAAG,OACH,aAAW,MAAG,wDAAyDW,GAAY,aAAa,EAE/F,SAAAX,EAAQ,cACX,GAEJ,KACA,QAAC,QACC,GAAG,OACH,aAAW,MAAG,mDAAoDW,GAAY,QAAQ,EAErF,UAAAc,EACAtB,GACH,GACF,GACF,GACF,KAEA,OAAC,QACC,GAAG,IACH,aAAW,MACT,8EACAQ,GAAY,aACd,EAEC,SAAAe,EACH,KAEA,OAAC,OAAI,UAAU,oCACb,mBAAC,UACC,QAAQ,UACR,KAAK,KACL,QAAS,IAAM,IACb,WAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,eAAgBrC,EAChB,eAAgBC,EAChB,YAAaiC,EACb,WAAYV,GAAc,WAAa,YACvC,sBAAuBa,EACvB,SAAU,EACV,WAAYH,EACZ,gBAAiBF,EACjB,IAAKrB,GAAS,IACd,YAAa,EACf,CACF,CAAC,EACDK,IAAa,CACf,EACA,aAAW,MAAG,eAAgBM,GAAY,cAAc,EAEvD,SAAAY,EACH,EACF,GACF,GACF,CAEJ,CACF,EAEA7C,EAAwB,YAAc,0BAEtC,IAAOC,GAAQD",
+  "names": ["AddToCartSuccessPopover_exports", "__export", "AddToCartSuccessPopover", "AddToCartSuccessPopover_default", "__toCommonJS", "import_jsx_runtime", "React", "import_react", "import_helpers", "import_components", "import_useExposure", "import_track", "import_AiuiProvider", "componentType", "componentName", "CheckIcon", "className", "CloseIcon", "props", "children", "triggerRef", "controlledOpen", "defaultOpen", "onOpenChange", "product", "paramList", "showOriginalPrice", "quantity", "cartTotalCount", "onViewCart", "copy", "autoCloseDuration", "align", "side", "sideOffset", "classNames", "ref", "trackingData", "internalOpen", "setInternalOpen", "isControlled", "isOpen", "handleOpenChange", "nextOpen", "timer", "successTitle", "cartCountTemplate", "viewCartLabel", "closeLabel", "quantityPrefix", "cartCountText", "displayTitle", "displayImage", "boxRef", "virtualRef", "rect", "vw", "vh", "pad", "trigger", "i"]
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/MainProductArea/index.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import type { AccessoryProductData } from '../AccessoryShelf/types.js';
+export interface MainProductAreaProps {
+    productTitle: string;
+    variantImage?: {
+        url: string;
+        altText?: string | null;
+    } | null;
+    paramList?: {
+        label: string;
+        value: string;
+    }[];
+    addedItems?: AccessoryProductData[];
+    priceSlot?: React.ReactNode;
+    actionSlot?: React.ReactNode;
+    onItemQuantityChange?: (item: AccessoryProductData, qty: number) => void;
+    onItemRemove?: (item: AccessoryProductData) => void;
+    addedItemQuantities?: Record<string, number>;
+    className?: string;
+}
+declare const MainProductArea: React.ForwardRefExoticComponent<MainProductAreaProps & React.RefAttributes<HTMLDivElement>>;
+export default MainProductArea;

package/dist/cjs/biz-components/AccessoriesShelf/components/MainProductArea/index.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var F=Object.create;var f=Object.defineProperty;var Q=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var B=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var L=(t,a)=>{for(var o in a)f(t,o,{get:a[o],enumerable:!0})},k=(t,a,o,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let s of q(a))!I.call(t,s)&&s!==o&&f(t,s,{get:()=>a[s],enumerable:!(i=Q(a,s))||i.enumerable});return t};var y=(t,a,o)=>(o=t!=null?F(B(t)):{},k(a||!t||!t.__esModule?f(o,"default",{value:t,enumerable:!0}):o,t)),_=t=>k(f({},"__esModule",{value:!0}),t);var K={};L(K,{default:()=>J});module.exports=_(K);var e=require("react/jsx-runtime"),p=y(require("react")),R=require("react"),D=require("../../../../helpers/index.js"),P=y(require("../../../../components/input-number.js")),c=require("../../../../components/dialog.js"),N=y(require("../../../../components/button.js")),r=require("../../../../components/index.js"),C=require("../../../../hooks/useExposure.js");const O="product",W="main_product_area",G=({item:t,quantity:a,onQuantityChange:o,onRemoveClick:i})=>{const s=m=>{m<1?i():o(m)};return(0,e.jsxs)("div",{className:"flex items-center gap-3",children:[(0,e.jsx)("div",{className:"size-[80px] shrink-0 overflow-hidden rounded-md mix-blend-multiply",children:(0,e.jsx)("img",{src:t.image??"",alt:t.name,className:"size-full object-contain"})}),(0,e.jsxs)("div",{className:"laptop:gap-2 flex w-full flex-col gap-2",children:[(0,e.jsxs)("div",{className:"laptop:flex-row laptop:justify-between flex w-full min-w-0 flex-1 flex-col gap-1",children:[(0,e.jsx)(r.Heading,{size:2,className:"text-info-primary laptop:text-base line-clamp-2 text-[14px] font-bold leading-[1.2] tracking-[-0.28px]",children:t.name}),(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(r.Text,{as:"span",className:"text-info-primary laptop:text-base text-[14px] font-bold leading-tight tracking-[-0.28px]",children:t.price}),(0,e.jsx)(r.Text,{as:"span",className:"text-info-tertiary text-[14px] font-bold leading-tight tracking-[-0.28px] line-through",children:t.originalPrice})]})]}),(0,e.jsxs)("div",{className:"flex shrink-0 flex-row justify-between",children:[(0,e.jsx)(P.default,{classNames:{root:"border-lines border-[1px] rounded-lg",inputWrapper:"mx-0 laptop:w-[40px] size-[28px] laptop:h-[32px]",input:"border-none",button:"border-none size-[28px] laptop:size-8"},value:a,min:0,onChange:s}),(0,e.jsx)("button",{onClick:i,className:"text-info-tertiary laptop:text-base text-[14px] font-bold leading-tight tracking-[-0.28px] underline",children:"Remove"})]})]})]})},w=p.forwardRef(({productTitle:t,variantImage:a,paramList:o,addedItems:i=[],priceSlot:s,actionSlot:m,onItemQuantityChange:A,onItemRemove:T,addedItemQuantities:d,className:z},H)=>{const g=(0,R.useRef)(null);(0,C.useExposure)(g,{componentType:O,componentName:W,componentTitle:t}),p.useImperativeHandle(H,()=>g.current);const[M,b]=p.useState(()=>d??{}),[u,x]=p.useState(null);p.useEffect(()=>{d&&b(d)},[d]);const j=(n,l)=>{b(v=>({...v,[n.sku]:l})),A?.(n,l)},S=()=>{if(!u)return;const n=i.find(l=>l.sku===u);x(null),n&&T?.(n)},E=i.find(n=>n.sku===u),h=n=>n.map(l=>(0,e.jsx)(G,{item:l,quantity:M[l.sku]??1,onQuantityChange:v=>j(l,v),onRemoveClick:()=>x(l.sku)},l.sku));return(0,e.jsxs)("div",{ref:g,className:(0,D.cn)("rounded-card",z),children:[(0,e.jsxs)("div",{className:"laptop:gap-16 laptop:items-center flex items-start gap-2",children:[(0,e.jsx)("div",{className:"laptop:size-[216px] size-[80px] shrink-0 overflow-hidden mix-blend-multiply",children:(0,e.jsx)(r.Picture,{source:a?.url,alt:a?.altText??t,className:"size-full",imgClassName:"object-cover h-full"})}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsxs)("div",{className:"laptop:flex-row flex min-w-0 flex-col items-center justify-between gap-4",children:[(0,e.jsxs)("div",{className:"flex w-full min-w-0 flex-1 flex-col gap-1",children:[(0,e.jsx)(r.Heading,{as:"h1",size:2,className:"text-info-primary tracking-[-0.8px]",html:t}),o&&o.length>0&&(0,e.jsx)(r.Text,{as:"p",className:"lg-desktop:text-[16px] text-info-tertiary text-[14px] font-bold leading-[1.4] tracking-[-0.28px]",children:o.map((n,l)=>(0,e.jsxs)(p.Fragment,{children:[l>0&&" \xB7 ",n.label,": ",n.value]},l))})]}),(0,e.jsxs)("div",{className:"laptop:justify-end laptop:flex-row laptop:items-center flex w-full flex-1 shrink-0 flex-col items-start gap-2",children:[s&&(0,e.jsx)("div",{className:"flex flex-col gap-1",children:s}),m]})]}),i.length>0&&(0,e.jsxs)("div",{className:"laptop:block hidden",children:[(0,e.jsx)("div",{className:"bg-lines-1 my-6 h-px"}),(0,e.jsx)("div",{className:"flex flex-col gap-4",children:h(i)})]})]})]}),i.length>0&&(0,e.jsxs)("div",{className:"laptop:hidden",children:[(0,e.jsx)("div",{className:"bg-lines-1 my-8 h-px"}),(0,e.jsx)("div",{className:"flex flex-col gap-4",children:h(i)})]}),(0,e.jsx)(c.Dialog,{open:!!u,onOpenChange:n=>!n&&x(null),children:(0,e.jsxs)(c.DialogContent,{className:"max-w-sm",children:[(0,e.jsx)(c.DialogHeader,{children:(0,e.jsx)(c.DialogTitle,{children:"Remove item?"})}),(0,e.jsxs)(r.Text,{as:"p",className:"text-info-tertiary text-[14px] leading-[1.4]",children:["Are you sure you want to remove ",(0,e.jsx)("span",{className:"text-info-primary",children:E?.name})," from your cart?"]}),(0,e.jsxs)(c.DialogFooter,{className:"gap-2",children:[(0,e.jsx)(N.default,{variant:"secondary",size:"base",onClick:()=>x(null),children:"Cancel"}),(0,e.jsx)(N.default,{variant:"primary",size:"base",onClick:S,children:"Remove"})]})]})})]})});w.displayName="MainProductArea";var J=w;
+//# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/AccessoriesShelf/components/MainProductArea/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/biz-components/AccessoriesShelf/components/MainProductArea/index.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { useRef } from 'react'\nimport { cn } from '../../../../helpers/index.js'\nimport InputNumber, { type InputNumberProps } from '../../../../components/input-number.js'\nimport { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '../../../../components/dialog.js'\nimport Button from '../../../../components/button.js'\nimport { Text, Heading, Picture } from '../../../../components/index.js'\nimport { useExposure } from '../../../../hooks/useExposure.js'\nimport type { AccessoryProductData } from '../AccessoryShelf/types.js'\n\nconst componentType = 'product'\nconst componentName = 'main_product_area'\n\nexport interface MainProductAreaProps {\n  productTitle: string\n  variantImage?: { url: string; altText?: string | null } | null\n  paramList?: { label: string; value: string }[]\n  addedItems?: AccessoryProductData[]\n  priceSlot?: React.ReactNode\n  actionSlot?: React.ReactNode\n  onItemQuantityChange?: (item: AccessoryProductData, qty: number) => void\n  onItemRemove?: (item: AccessoryProductData) => void\n  addedItemQuantities?: Record<string, number>\n  className?: string\n}\n\nconst AddedItemRow = ({\n  item,\n  quantity,\n  onQuantityChange,\n  onRemoveClick,\n}: {\n  item: AccessoryProductData\n  quantity: number\n  onQuantityChange: (qty: number) => void\n  onRemoveClick: () => void\n}) => {\n  const handleQuantityChange = (qty: number) => {\n    if (qty < 1) {\n      onRemoveClick()\n    } else {\n      onQuantityChange(qty)\n    }\n  }\n\n  return (\n    <div className=\"flex items-center gap-3\">\n      <div className=\"size-[80px] shrink-0 overflow-hidden rounded-md mix-blend-multiply\">\n        <img src={item.image ?? ''} alt={item.name} className=\"size-full object-contain\" />\n      </div>\n      <div className=\"laptop:gap-2 flex w-full flex-col gap-2\">\n        <div className=\"laptop:flex-row laptop:justify-between flex w-full min-w-0 flex-1 flex-col gap-1\">\n          <Heading\n            size={2}\n            className=\"text-info-primary laptop:text-base line-clamp-2 text-[14px] font-bold leading-[1.2] tracking-[-0.28px]\"\n          >\n            {item.name}\n          </Heading>\n          <div className=\"flex items-center gap-1\">\n            <Text\n              as=\"span\"\n              className=\"text-info-primary laptop:text-base text-[14px] font-bold leading-tight tracking-[-0.28px]\"\n            >\n              {item.price}\n            </Text>\n            <Text\n              as=\"span\"\n              className=\"text-info-tertiary text-[14px] font-bold leading-tight tracking-[-0.28px] line-through\"\n            >\n              {item.originalPrice}\n            </Text>\n          </div>\n        </div>\n        <div className=\"flex shrink-0 flex-row justify-between\">\n          <InputNumber\n            classNames={{\n              root: 'border-lines border-[1px] rounded-lg',\n              inputWrapper: 'mx-0 laptop:w-[40px] size-[28px] laptop:h-[32px]',\n              input: 'border-none',\n              button: 'border-none size-[28px] laptop:size-8',\n            }}\n            value={quantity}\n            min={0}\n            onChange={handleQuantityChange as InputNumberProps['onChange']}\n          />\n          <button\n            onClick={onRemoveClick}\n            className=\"text-info-tertiary laptop:text-base text-[14px] font-bold leading-tight tracking-[-0.28px] underline\"\n          >\n            Remove\n          </button>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MainProductArea = React.forwardRef<HTMLDivElement, MainProductAreaProps>(\n  (\n    {\n      productTitle,\n      variantImage,\n      paramList,\n      addedItems = [],\n      priceSlot,\n      actionSlot,\n      onItemQuantityChange,\n      onItemRemove,\n      addedItemQuantities,\n      className,\n    },\n    ref\n  ) => {\n    const boxRef = useRef<HTMLDivElement>(null)\n\n    useExposure(boxRef, {\n      componentType,\n      componentName,\n      componentTitle: productTitle,\n    })\n\n    React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n    const [quantities, setQuantities] = React.useState<Record<string, number>>(() => addedItemQuantities ?? {})\n    const [pendingRemoveSku, setPendingRemoveSku] = React.useState<string | null>(null)\n\n    React.useEffect(() => {\n      if (addedItemQuantities) {\n        setQuantities(addedItemQuantities)\n      }\n    }, [addedItemQuantities])\n\n    const handleQuantityChange = (item: AccessoryProductData, qty: number) => {\n      setQuantities(prev => ({ ...prev, [item.sku]: qty }))\n      onItemQuantityChange?.(item, qty)\n    }\n\n    const handleRemoveConfirm = () => {\n      if (!pendingRemoveSku) return\n      const item = addedItems.find(i => i.sku === pendingRemoveSku)\n      setPendingRemoveSku(null)\n      if (item) onItemRemove?.(item)\n    }\n\n    const pendingRemoveItem = addedItems.find(i => i.sku === pendingRemoveSku)\n\n    const renderItems = (items: AccessoryProductData[]) =>\n      items.map(item => (\n        <AddedItemRow\n          key={item.sku}\n          item={item}\n          quantity={quantities[item.sku] ?? 1}\n          onQuantityChange={qty => handleQuantityChange(item, qty)}\n          onRemoveClick={() => setPendingRemoveSku(item.sku)}\n        />\n      ))\n\n    return (\n      <div ref={boxRef} className={cn('rounded-card', className)}>\n        <div className=\"laptop:gap-16 laptop:items-center flex items-start gap-2\">\n          <div className=\"laptop:size-[216px] size-[80px] shrink-0 overflow-hidden mix-blend-multiply\">\n            <Picture\n              source={variantImage?.url}\n              alt={variantImage?.altText ?? productTitle}\n              className=\"size-full\"\n              imgClassName=\"object-cover h-full\"\n            />\n          </div>\n\n          <div className=\"flex-1\">\n            <div className=\"laptop:flex-row flex min-w-0 flex-col items-center justify-between gap-4\">\n              <div className=\"flex w-full min-w-0 flex-1 flex-col gap-1\">\n                <Heading as=\"h1\" size={2} className=\"text-info-primary tracking-[-0.8px]\" html={productTitle} />\n                {paramList && paramList.length > 0 && (\n                  <Text\n                    as=\"p\"\n                    className=\"lg-desktop:text-[16px] text-info-tertiary text-[14px] font-bold leading-[1.4] tracking-[-0.28px]\"\n                  >\n                    {paramList.map((p, i) => (\n                      <React.Fragment key={i}>\n                        {i > 0 && ' \u00B7 '}\n                        {p.label}: {p.value}\n                      </React.Fragment>\n                    ))}\n                  </Text>\n                )}\n              </div>\n              <div className=\"laptop:justify-end laptop:flex-row laptop:items-center flex w-full flex-1 shrink-0 flex-col items-start gap-2\">\n                {priceSlot && <div className=\"flex flex-col gap-1\">{priceSlot}</div>}\n                {actionSlot}\n              </div>\n            </div>\n\n            {addedItems.length > 0 && (\n              <div className=\"laptop:block hidden\">\n                <div className=\"bg-lines-1 my-6 h-px\" />\n                <div className=\"flex flex-col gap-4\">{renderItems(addedItems)}</div>\n              </div>\n            )}\n          </div>\n        </div>\n\n        {addedItems.length > 0 && (\n          <div className=\"laptop:hidden\">\n            <div className=\"bg-lines-1 my-8 h-px\" />\n            <div className=\"flex flex-col gap-4\">{renderItems(addedItems)}</div>\n          </div>\n        )}\n\n        <Dialog open={!!pendingRemoveSku} onOpenChange={open => !open && setPendingRemoveSku(null)}>\n          <DialogContent className=\"max-w-sm\">\n            <DialogHeader>\n              <DialogTitle>Remove item?</DialogTitle>\n            </DialogHeader>\n            <Text as=\"p\" className=\"text-info-tertiary text-[14px] leading-[1.4]\">\n              Are you sure you want to remove <span className=\"text-info-primary\">{pendingRemoveItem?.name}</span> from\n              your cart?\n            </Text>\n            <DialogFooter className=\"gap-2\">\n              <Button variant=\"secondary\" size=\"base\" onClick={() => setPendingRemoveSku(null)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" size=\"base\" onClick={handleRemoveConfirm}>\n                Remove\n              </Button>\n            </DialogFooter>\n          </DialogContent>\n        </Dialog>\n      </div>\n    )\n  }\n)\n\nMainProductArea.displayName = 'MainProductArea'\n\nexport default MainProductArea\n"],
+  "mappings": "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",
+  "names": ["MainProductArea_exports", "__export", "MainProductArea_default", "__toCommonJS", "import_jsx_runtime", "React", "import_react", "import_helpers", "import_input_number", "import_dialog", "import_button", "import_components", "import_useExposure", "componentType", "componentName", "AddedItemRow", "item", "quantity", "onQuantityChange", "onRemoveClick", "handleQuantityChange", "qty", "InputNumber", "MainProductArea", "productTitle", "variantImage", "paramList", "addedItems", "priceSlot", "actionSlot", "onItemQuantityChange", "onItemRemove", "addedItemQuantities", "className", "ref", "boxRef", "quantities", "setQuantities", "pendingRemoveSku", "setPendingRemoveSku", "prev", "handleRemoveConfirm", "i", "pendingRemoveItem", "renderItems", "items", "p", "open", "Button"]
+}

package/dist/cjs/biz-components/AccessoriesShelf/components/PromoBanner/index.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import type { UserType, BannerConfig, BannerAction } from '../../types.js';
+export interface PromoBannerProps {
+    userType: UserType;
+    configs: Partial<Record<UserType, BannerConfig | null>>;
+    onAction?: (action: BannerAction) => void;
+    className?: string;
+}
+declare const PromoBanner: React.ForwardRefExoticComponent<PromoBannerProps & React.RefAttributes<HTMLDivElement>>;
+export default PromoBanner;

package/dist/cjs/biz-components/AccessoriesShelf/components/PromoBanner/index.js

@@ -0,0 +1,2 @@
+"use strict";"use client";var u=Object.create;var l=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var v=Object.getPrototypeOf,L=Object.prototype.hasOwnProperty;var y=(e,t)=>{for(var o in t)l(e,o,{get:t[o],enumerable:!0})},p=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of h(t))!L.call(e,i)&&i!==o&&l(e,i,{get:()=>t[i],enumerable:!(s=x(t,i))||s.enumerable});return e};var b=(e,t,o)=>(o=e!=null?u(v(e)):{},p(t||!e||!e.__esModule?l(o,"default",{value:e,enumerable:!0}):o,e)),w=e=>p(l({},"__esModule",{value:!0}),e);var F={};y(F,{default:()=>E});module.exports=w(F);var n=require("react/jsx-runtime"),_=b(require("react")),m=require("../../../../helpers/index.js"),g=require("../../../../components/index.js");const k=({className:e})=>(0,n.jsxs)("svg",{className:e,xmlns:"http://www.w3.org/2000/svg",width:"28",height:"24",viewBox:"0 0 28 24",fill:"none",children:[(0,n.jsx)("path",{d:"M20.3194 0C21.1834 0 21.9923 0.429768 22.479 1.14948L27.5462 8.64391C28.2476 9.68126 28.125 11.0736 27.254 11.9707L16.6544 22.8856C15.2122 24.3702 12.8426 24.3716 11.3981 22.8891L0.748688 11.9602C-0.114133 11.0747 -0.24628 9.7017 0.430898 8.66496L5.31604 1.18456C5.79941 0.444636 6.62004 0 7.49882 0H20.3194Z",fill:"#005D8E"}),(0,n.jsx)("path",{d:"M19.0076 8.33664C19.4627 7.88876 20.2013 7.88756 20.6574 8.3344C21.1132 8.78154 21.1144 9.50728 20.6596 9.95535L14.8762 15.6466C14.3983 16.1168 13.6232 16.118 13.1443 15.6488L7.34264 9.95759C6.88678 9.51045 6.88556 8.78471 7.34036 8.33664C7.79546 7.88876 8.53413 7.88756 8.99017 8.3344L14.008 13.2555L19.0076 8.33664Z",fill:"white"})]}),B=({className:e})=>(0,n.jsxs)("svg",{className:e,xmlns:"http://www.w3.org/2000/svg",width:"28",height:"24",viewBox:"0 0 28 24",fill:"none",children:[(0,n.jsx)("path",{d:"M20.3194 0C21.1834 0 21.9923 0.429768 22.479 1.14948L27.5462 8.64391C28.2476 9.68126 28.125 11.0736 27.254 11.9707L16.6544 22.8856C15.2122 24.3702 12.8426 24.3716 11.3981 22.8891L0.748688 11.9602C-0.114133 11.0747 -0.24628 9.7017 0.430898 8.66496L5.31604 1.18456C5.79941 0.444636 6.62004 0 7.49882 0H20.3194Z",fill:"url(#paint0_linear_5861_8479)"}),(0,n.jsx)("path",{d:"M19.0076 8.33664C19.4627 7.88876 20.2013 7.88756 20.6574 8.3344C21.1132 8.78154 21.1144 9.50728 20.6596 9.95535L14.8762 15.6466C14.3983 16.1168 13.6232 16.118 13.1443 15.6488L7.34264 9.95759C6.88678 9.51045 6.88556 8.78471 7.34036 8.33664C7.79546 7.88876 8.53413 7.88756 8.99017 8.3344L14.008 13.2555L19.0076 8.33664Z",fill:"url(#paint1_linear_5861_8479)"}),(0,n.jsxs)("defs",{children:[(0,n.jsxs)("linearGradient",{id:"paint0_linear_5861_8479",x1:"-0.341464",y1:"1.07126e-06",x2:"30.68",y2:"4.66513",gradientUnits:"userSpaceOnUse",children:[(0,n.jsx)("stop",{stopColor:"#6E6754"}),(0,n.jsx)("stop",{offset:"1",stopColor:"#070708"})]}),(0,n.jsxs)("linearGradient",{id:"paint1_linear_5861_8479",x1:"6.82927",y1:"8",x2:"21.9228",y2:"11.4047",gradientUnits:"userSpaceOnUse",children:[(0,n.jsx)("stop",{stopColor:"#FFF5E0"}),(0,n.jsx)("stop",{offset:"1",stopColor:"#E8C08A"})]})]})]}),N={guest:"bg-[#E1F8FE]",member:"bg-[#FFF1E1]","plus-member":"bg-[#FFF1E1]"},f=_.forwardRef(({userType:e,configs:t,onAction:o,className:s},i)=>{const r=t[e];if(!r?.text)return null;const c=()=>{r.action&&o?.(r.action)},a=!!r.action,C=r.backgroundColor?void 0:N[e];return(0,n.jsx)("div",{ref:i,role:a?"button":void 0,tabIndex:a?0:void 0,onClick:a?c:void 0,onKeyDown:a?d=>{(d.key==="Enter"||d.key===" ")&&(d.preventDefault(),c())}:void 0,className:(0,m.cn)("rounded-card flex items-center justify-center px-6 py-4","lg-desktop:text-[16px] text-[14px] font-bold leading-[1.4] tracking-[-0.28px]",C,a&&"cursor-pointer",s),style:r.backgroundColor?{backgroundColor:r.backgroundColor}:void 0,children:(0,n.jsxs)("div",{className:"flex items-end gap-1",children:[e==="guest"?(0,n.jsx)(k,{className:"shrink-0"}):(0,n.jsx)(B,{className:"shrink-0"}),(0,n.jsx)(g.Text,{html:r.text,as:"div",className:"[&_a]:text-brand-0 flex items-center gap-1 [&_a]:underline"})]})})});f.displayName="PromoBanner";var E=f;
+//# sourceMappingURL=index.js.map