@anker-in/headless-ui 1.3.41-alpha.1784773353886 → 1.3.41-alpha.1784792113239
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/CartDetail/CartPerksSection/CartPerksSection.d.ts +0 -2
- package/dist/cjs/biz-components/CartDetail/CartPerksSection/CartPerksSection.js +1 -1
- package/dist/cjs/biz-components/CartDetail/CartPerksSection/CartPerksSection.js.map +2 -2
- package/dist/cjs/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.d.ts +2 -0
- package/dist/cjs/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.js +1 -1
- package/dist/cjs/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.js.map +3 -3
- package/dist/esm/biz-components/CartDetail/CartPerksSection/CartPerksSection.d.ts +0 -2
- package/dist/esm/biz-components/CartDetail/CartPerksSection/CartPerksSection.js +1 -1
- package/dist/esm/biz-components/CartDetail/CartPerksSection/CartPerksSection.js.map +2 -2
- package/dist/esm/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.d.ts +2 -0
- package/dist/esm/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.js +1 -1
- package/dist/esm/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.js.map +3 -3
- package/package.json +1 -1
- package/style.css +9 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var v=Object.create;var
|
|
1
|
+
"use strict";"use client";var v=Object.create;var d=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var L=(i,o)=>{for(var l in o)d(i,l,{get:o[l],enumerable:!0})},f=(i,o,l,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of C(o))!w.call(i,e)&&e!==l&&d(i,e,{get:()=>o[e],enumerable:!(s=y(o,e))||s.enumerable});return i};var k=(i,o,l)=>(l=i!=null?v(h(i)):{},f(o||!i||!i.__esModule?d(l,"default",{value:i,enumerable:!0}):l,i)),P=i=>f(d({},"__esModule",{value:!0}),i);var A={};L(A,{default:()=>q});module.exports=P(A);var t=require("react/jsx-runtime"),M=k(require("react")),r=require("../../../helpers/index.js"),n=require("../../../components/index.js"),p=require("../index.js"),x=require("../../../shared/LocalizedLink.js");const N=({className:i})=>(0,t.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",className:i,width:"17",height:"15",viewBox:"0 0 17 15",fill:"none",children:[(0,t.jsx)("path",{d:"M12.0945 0C12.6087 0 13.09 0.26113 13.3797 0.698242L16.3963 5.25195C16.8137 5.88217 16.7407 6.72832 16.2225 7.27344L9.91291 13.9062C9.05444 14.8082 7.64375 14.809 6.784 13.9082L0.445134 7.26758C-0.0683205 6.72952 -0.146289 5.89553 0.256657 5.26562L3.16388 0.719727C3.4516 0.270119 3.94061 0 4.46369 0H12.0945ZM12.5037 5.31738C12.2188 5.0332 11.7569 5.03363 11.4725 5.31836L8.34748 8.44727L5.21174 5.31738C4.92672 5.03315 4.46491 5.03346 4.18049 5.31836C3.89625 5.60337 3.89754 6.06518 4.18244 6.34961L7.80842 9.96973C8.10764 10.2681 8.59181 10.2677 8.89045 9.96875L12.5047 6.34863C12.7889 6.06369 12.7884 5.60183 12.5037 5.31738Z",fill:"url(#paint0_linear_6135_9275)"}),(0,t.jsx)("defs",{children:(0,t.jsxs)("linearGradient",{id:"paint0_linear_6135_9275",x1:"-1.69612e-07",y1:"-5.81363e-06",x2:"12.6513",y2:"8.69315",gradientUnits:"userSpaceOnUse",children:[(0,t.jsx)("stop",{stopColor:"#F1EADB"}),(0,t.jsx)("stop",{offset:"1",stopColor:"#D9A66A"})]})})]}),m=M.forwardRef(({title:i,perks:o,copy:l,className:s,classNames:e={},...g},b)=>{const u=l?.addButton??p.DEFAULT_CART_COPY.addButton,c=l?.learnMoreButton??p.DEFAULT_CART_COPY.learnMoreButton;return(0,t.jsxs)("div",{ref:b,className:(0,r.cn)("flex flex-col gap-4",s,e.root),...g,children:[i&&(0,t.jsx)(n.Heading,{size:2,className:(0,r.cn)("text-info-primary font-bold",e.title),children:i}),o.map(a=>(0,t.jsxs)("div",{className:(0,r.cn)("cart-perks-section-item bg-container-secondary rounded-box tablet:p-8 flex flex-col gap-2 p-2",e.item),children:[(0,t.jsxs)("div",{className:"tablet:p-0 tablet:items-center tablet:gap-4 flex w-full gap-2 p-2",children:[(0,t.jsx)("div",{className:(0,r.cn)("cart-perks-section-image shrink-0",e.image),children:(0,t.jsx)(n.Picture,{source:a.image.src,alt:a.image.alt??"",className:"h-15 tablet:w-[232px] tablet:h-[176px] w-20 ",imgClassName:"object-contain h-full"})}),(0,t.jsxs)("div",{className:(0,r.cn)("cart-perks-section-content tablet:flex-row flex flex-1 flex-col gap-4",e.content),children:[(0,t.jsxs)("div",{className:(0,r.cn)("cart-perks-section-info tablet:flex-[2] tablet:gap-2 flex flex-1 flex-col justify-start",e.info),children:[(0,t.jsx)(n.Heading,{size:2,className:(0,r.cn)("cart-perks-section-name text-info-primary font-bold",e.name),html:a.title}),(0,t.jsx)(n.Text,{className:(0,r.cn)("cart-perks-section-description tablet:text-base text-info-tertiary text-sm leading-normal",e.description),html:a.description}),a?.learnMoreLink&&c&&(0,t.jsx)(x.LocalizedLink,{href:a.learnMoreLink,children:(0,t.jsx)("div",{className:(0,r.cn)("tablet:flex tablet:w-max text-brand-0 tablet:justify-start tablet:text-base hidden p-0 text-sm font-bold",e.learnMore),children:c})})]}),a.quantity&&(0,t.jsxs)(n.Text,{className:(0,r.cn)("cart-perks-section-quantity tablet:block tablet:text-base text-info-primary hidden text-sm font-bold",e.quantity),children:["X",a.quantity]}),(0,t.jsxs)("div",{className:(0,r.cn)("cart-perks-section-price-wrap tablet:flex-1 tablet:items-end flex flex-col items-start gap-2",e.priceWrap),children:[(0,t.jsxs)("div",{className:(0,r.cn)("cart-perks-section-price-row tablet:w-auto flex w-full items-center justify-between",e.priceRow),children:[(0,t.jsxs)("div",{className:"flex items-center gap-1",children:[(0,t.jsx)(n.Text,{className:(0,r.cn)("cart-perks-section-price text-info-primary tablet:text-2xl text-xl font-bold",e.price),html:a.price}),a.originalPrice&&(0,t.jsx)(n.Text,{className:(0,r.cn)("cart-perks-section-original-price tablet:text-2xl text-info-tertiary text-xl font-bold line-through",e.originalPrice),html:a.originalPrice})]}),a.quantity&&(0,t.jsxs)(n.Text,{className:(0,r.cn)("cart-perks-section-quantity tablet:hidden tablet:text-base text-info-primary text-sm font-bold",e.quantity),children:["X",a.quantity]})]}),a.onAdd&&(0,t.jsx)(n.Button,{variant:"link",type:"button",onClick:a.onAdd,className:(0,r.cn)("cart-perks-section-action tablet:text-base text-brand-0 !p-0",e.action),children:u})]})]})]}),a?.learnMoreLink&&c&&(0,t.jsxs)(x.LocalizedLink,{href:a.learnMoreLink,className:(0,r.cn)("rounded-box-small tablet:hidden tablet:text-base flex items-center bg-white px-4 py-3 text-sm font-bold",e.learnMore),children:[(0,t.jsxs)("div",{className:"flex flex-1 items-center gap-1",children:[(0,t.jsx)(N,{className:"size-5"}),(0,t.jsx)(n.Text,{className:"cart-perks-section-learn-more text-info-tertiary",children:c})]}),(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,t.jsx)("path",{d:"M5.52864 3.52827C5.78899 3.26792 6.211 3.26792 6.47134 3.52827L10.4713 7.52827C10.7317 7.78862 10.7317 8.21063 10.4713 8.47098L6.47134 12.471C6.211 12.7313 5.78899 12.7313 5.52864 12.471C5.26829 12.2106 5.26829 11.7886 5.52864 11.5283L9.05728 7.99962L5.52864 4.47098C5.26829 4.21063 5.26829 3.78862 5.52864 3.52827Z",fill:"#4A4C56"})})]})]},a.sku))]})});m.displayName="CartPerksSection";var q=m;
|
|
2
2
|
//# sourceMappingURL=CartPerksSection.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/CartDetail/CartPerksSection/CartPerksSection.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Heading, Picture, Text } from '../../../components/index.js'\nimport type { CartPerksSectionCopy } from '../types.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport { LocalizedLink } from '../../../shared/LocalizedLink.js'\n\nconst LearnMoreIcon = ({ className }: { className?: string }) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n width=\"17\"\n height=\"15\"\n viewBox=\"0 0 17 15\"\n fill=\"none\"\n >\n <path\n d=\"M12.0945 0C12.6087 0 13.09 0.26113 13.3797 0.698242L16.3963 5.25195C16.8137 5.88217 16.7407 6.72832 16.2225 7.27344L9.91291 13.9062C9.05444 14.8082 7.64375 14.809 6.784 13.9082L0.445134 7.26758C-0.0683205 6.72952 -0.146289 5.89553 0.256657 5.26562L3.16388 0.719727C3.4516 0.270119 3.94061 0 4.46369 0H12.0945ZM12.5037 5.31738C12.2188 5.0332 11.7569 5.03363 11.4725 5.31836L8.34748 8.44727L5.21174 5.31738C4.92672 5.03315 4.46491 5.03346 4.18049 5.31836C3.89625 5.60337 3.89754 6.06518 4.18244 6.34961L7.80842 9.96973C8.10764 10.2681 8.59181 10.2677 8.89045 9.96875L12.5047 6.34863C12.7889 6.06369 12.7884 5.60183 12.5037 5.31738Z\"\n fill=\"url(#paint0_linear_6135_9275)\"\n />\n <defs>\n <linearGradient\n id=\"paint0_linear_6135_9275\"\n x1=\"-1.69612e-07\"\n y1=\"-5.81363e-06\"\n x2=\"12.6513\"\n y2=\"8.69315\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stopColor=\"#F1EADB\" />\n <stop offset=\"1\" stopColor=\"#D9A66A\" />\n </linearGradient>\n </defs>\n </svg>\n )\n}\n\nexport interface CartPerk {\n /** \u5546\u54C1\u552F\u4E00\u6807\u8BC6\uFF08SKU\uFF09 */\n sku: string\n /** \u5546\u54C1\u56FE\u7247 */\n image: { src: string; alt?: string }\n /** \u5546\u54C1\u6807\u9898 */\n title: string\n /** \u5546\u54C1\u63CF\u8FF0 */\n description: string\n /** \u5F53\u524D\u4EF7\u683C */\n price: string\n /** \u539F\u4EF7\uFF08\u5C55\u793A\u5220\u9664\u7EBF\uFF09 */\n originalPrice?: string\n /** \u6570\u91CF\u6587\u6848 */\n quantity?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u6848 */\n learnMoreText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u94FE\u63A5 */\n learnMoreLink?: string\n /** \u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAdd?: () => void\n // /** \u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n // onLearnMore?: () => void\n}\n\nexport interface CartPerksSectionProps {\n title?: string\n perks: CartPerk[]\n copy?: CartPerksSectionCopy\n className?: string\n classNames?: Partial<\n Record<\n | 'root'\n | 'title'\n | 'item'\n | 'image'\n | 'content'\n | 'info'\n | 'name'\n | 'description'\n | 'priceWrap'\n | 'priceRow'\n | 'price'\n | 'originalPrice'\n | 'quantity'\n | 'action'\n | 'learnMore',\n string\n >\n >\n}\n\nconst CartPerksSection = React.forwardRef<HTMLDivElement, CartPerksSectionProps>(\n ({ title, perks, copy, className, classNames = {}, ...props }, ref) => {\n const addText = copy?.addButton ?? DEFAULT_CART_COPY.addButton\n const learnMoreText = copy?.learnMoreButton ?? DEFAULT_CART_COPY.learnMoreButton\n return (\n <div ref={ref} className={cn('flex flex-col gap-4', className, classNames.root)} {...props}>\n {title && (\n <Heading size={2} className={cn('text-info-primary font-bold', classNames.title)}>\n {title}\n </Heading>\n )}\n {perks.map(perk => (\n <div\n key={perk.sku}\n className={cn(\n 'cart-perks-section-item bg-container-secondary rounded-box tablet:p-8 flex flex-col gap-2 p-2',\n classNames.item\n )}\n >\n <div className=\"tablet:p-0 tablet:items-center tablet:gap-4 flex w-full gap-2 p-2\">\n {/* \u589E\u503C\u670D\u52A1\u4E3B\u56FE */}\n <div className={cn('cart-perks-section-image shrink-0', classNames.image)}>\n <Picture\n source={perk.image.src}\n alt={perk.image.alt ?? ''}\n className=\"h-15 tablet:w-[232px] tablet:h-[176px] w-20 \"\n imgClassName=\"object-contain\"\n />\n </div>\n {/* \u589E\u503C\u670D\u52A1\u5185\u5BB9 */}\n <div\n className={cn(\n 'cart-perks-section-content tablet:flex-row flex flex-1 flex-col gap-4',\n classNames.content\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u6807\u9898\u53CA\u63CF\u8FF0 */}\n <div\n className={cn(\n 'cart-perks-section-info tablet:flex-[2] tablet:gap-2 flex flex-1 flex-col justify-start',\n classNames.info\n )}\n >\n <Heading\n size={2}\n className={cn('cart-perks-section-name text-info-primary font-bold', classNames.name)}\n html={perk.title}\n />\n <Text\n className={cn(\n 'cart-perks-section-description tablet:text-base text-info-tertiary text-sm leading-normal',\n classNames.description\n )}\n html={perk.description}\n />\n {perk?.learnMoreLink && (\n <LocalizedLink href={perk.learnMoreLink}>\n <div\n className={cn(\n 'tablet:flex tablet:w-max text-brand-0 tablet:justify-start tablet:text-base hidden p-0 text-sm font-bold',\n classNames.learnMore\n )}\n >\n {perk.learnMoreText ?? learnMoreText}\n </div>\n </LocalizedLink>\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:block tablet:text-base text-info-primary hidden text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n <div\n className={cn(\n 'cart-perks-section-price-wrap tablet:flex-1 tablet:items-end flex flex-col items-start gap-2',\n classNames.priceWrap\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u4EF7\u683C */}\n <div\n className={cn(\n 'cart-perks-section-price-row tablet:w-auto flex w-full items-center justify-between',\n classNames.priceRow\n )}\n >\n <div className=\"flex items-center gap-1\">\n <Text\n className={cn(\n 'cart-perks-section-price text-info-primary tablet:text-2xl text-xl font-bold',\n classNames.price\n )}\n html={perk.price}\n />\n {perk.originalPrice && (\n <Text\n className={cn(\n 'cart-perks-section-original-price tablet:text-2xl text-info-tertiary text-xl font-bold line-through',\n classNames.originalPrice\n )}\n html={perk.originalPrice}\n />\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:hidden tablet:text-base text-info-primary text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n </div>\n {/* \u589E\u503C\u670D\u52A1\u6309\u94AE */}\n {perk.onAdd && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={perk.onAdd}\n className={cn('cart-perks-section-action tablet:text-base text-brand-0 p-0', classNames.action)}\n >\n {addText}\n </Button>\n )}\n </div>\n </div>\n </div>\n\n {perk.learnMoreLink && (\n <LocalizedLink\n href={perk.learnMoreLink}\n className={cn(\n 'rounded-box-small tablet:hidden tablet:text-base flex items-center bg-white px-4 py-3 text-sm font-bold',\n classNames.learnMore\n )}\n >\n <div className=\"flex flex-1 items-center gap-1\">\n <LearnMoreIcon className=\"size-5\" />\n <Text className=\"cart-perks-section-learn-more text-info-tertiary\">\n {perk.learnMoreText ?? learnMoreText}\n </Text>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52864 3.52827C5.78899 3.26792 6.211 3.26792 6.47134 3.52827L10.4713 7.52827C10.7317 7.78862 10.7317 8.21063 10.4713 8.47098L6.47134 12.471C6.211 12.7313 5.78899 12.7313 5.52864 12.471C5.26829 12.2106 5.26829 11.7886 5.52864 11.5283L9.05728 7.99962L5.52864 4.47098C5.26829 4.21063 5.26829 3.78862 5.52864 3.52827Z\"\n fill=\"#4A4C56\"\n />\n </svg>\n </LocalizedLink>\n )}\n </div>\n ))}\n </div>\n )\n }\n)\n\nCartPerksSection.displayName = 'CartPerksSection'\n\nexport default CartPerksSection\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAmBM,IAAAI,EAAA,6BAjBNC,EAAuB,oBACvBC,EAAmB,qCACnBC,EAA+C,wCAE/CC,EAAkC,uBAClCC,EAA8B,4CAE9B,MAAMC,EAAgB,CAAC,CAAE,UAAAC,CAAU,OAE/B,QAAC,OACC,MAAM,6BACN,UAAWA,EACX,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,oBAAC,QACC,EAAE,wnBACF,KAAK,gCACP,KACA,OAAC,QACC,oBAAC,kBACC,GAAG,0BACH,GAAG,eACH,GAAG,eACH,GAAG,UACH,GAAG,UACH,cAAc,iBAEd,oBAAC,QAAK,UAAU,UAAU,KAC1B,OAAC,QAAK,OAAO,IAAI,UAAU,UAAU,GACvC,EACF,GACF,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Heading, Picture, Text } from '../../../components/index.js'\nimport type { CartPerksSectionCopy } from '../types.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport { LocalizedLink } from '../../../shared/LocalizedLink.js'\n\nconst LearnMoreIcon = ({ className }: { className?: string }) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n width=\"17\"\n height=\"15\"\n viewBox=\"0 0 17 15\"\n fill=\"none\"\n >\n <path\n d=\"M12.0945 0C12.6087 0 13.09 0.26113 13.3797 0.698242L16.3963 5.25195C16.8137 5.88217 16.7407 6.72832 16.2225 7.27344L9.91291 13.9062C9.05444 14.8082 7.64375 14.809 6.784 13.9082L0.445134 7.26758C-0.0683205 6.72952 -0.146289 5.89553 0.256657 5.26562L3.16388 0.719727C3.4516 0.270119 3.94061 0 4.46369 0H12.0945ZM12.5037 5.31738C12.2188 5.0332 11.7569 5.03363 11.4725 5.31836L8.34748 8.44727L5.21174 5.31738C4.92672 5.03315 4.46491 5.03346 4.18049 5.31836C3.89625 5.60337 3.89754 6.06518 4.18244 6.34961L7.80842 9.96973C8.10764 10.2681 8.59181 10.2677 8.89045 9.96875L12.5047 6.34863C12.7889 6.06369 12.7884 5.60183 12.5037 5.31738Z\"\n fill=\"url(#paint0_linear_6135_9275)\"\n />\n <defs>\n <linearGradient\n id=\"paint0_linear_6135_9275\"\n x1=\"-1.69612e-07\"\n y1=\"-5.81363e-06\"\n x2=\"12.6513\"\n y2=\"8.69315\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stopColor=\"#F1EADB\" />\n <stop offset=\"1\" stopColor=\"#D9A66A\" />\n </linearGradient>\n </defs>\n </svg>\n )\n}\n\nexport interface CartPerk {\n /** \u5546\u54C1\u552F\u4E00\u6807\u8BC6\uFF08SKU\uFF09 */\n sku: string\n /** \u5546\u54C1\u56FE\u7247 */\n image: { src: string; alt?: string }\n /** \u5546\u54C1\u6807\u9898 */\n title: string\n /** \u5546\u54C1\u63CF\u8FF0 */\n description: string\n /** \u5F53\u524D\u4EF7\u683C */\n price: string\n /** \u539F\u4EF7\uFF08\u5C55\u793A\u5220\u9664\u7EBF\uFF09 */\n originalPrice?: string\n /** \u6570\u91CF\u6587\u6848 */\n quantity?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u94FE\u63A5 */\n learnMoreLink?: string\n /** \u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAdd?: () => void\n // /** \u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n // onLearnMore?: () => void\n}\n\nexport interface CartPerksSectionProps {\n title?: string\n perks: CartPerk[]\n copy?: CartPerksSectionCopy\n className?: string\n classNames?: Partial<\n Record<\n | 'root'\n | 'title'\n | 'item'\n | 'image'\n | 'content'\n | 'info'\n | 'name'\n | 'description'\n | 'priceWrap'\n | 'priceRow'\n | 'price'\n | 'originalPrice'\n | 'quantity'\n | 'action'\n | 'learnMore',\n string\n >\n >\n}\n\nconst CartPerksSection = React.forwardRef<HTMLDivElement, CartPerksSectionProps>(\n ({ title, perks, copy, className, classNames = {}, ...props }, ref) => {\n const addText = copy?.addButton ?? DEFAULT_CART_COPY.addButton\n const learnMoreText = copy?.learnMoreButton ?? DEFAULT_CART_COPY.learnMoreButton\n return (\n <div ref={ref} className={cn('flex flex-col gap-4', className, classNames.root)} {...props}>\n {title && (\n <Heading size={2} className={cn('text-info-primary font-bold', classNames.title)}>\n {title}\n </Heading>\n )}\n {perks.map(perk => (\n <div\n key={perk.sku}\n className={cn(\n 'cart-perks-section-item bg-container-secondary rounded-box tablet:p-8 flex flex-col gap-2 p-2',\n classNames.item\n )}\n >\n <div className=\"tablet:p-0 tablet:items-center tablet:gap-4 flex w-full gap-2 p-2\">\n {/* \u589E\u503C\u670D\u52A1\u4E3B\u56FE */}\n <div className={cn('cart-perks-section-image shrink-0', classNames.image)}>\n <Picture\n source={perk.image.src}\n alt={perk.image.alt ?? ''}\n className=\"h-15 tablet:w-[232px] tablet:h-[176px] w-20 \"\n imgClassName=\"object-contain h-full\"\n />\n </div>\n {/* \u589E\u503C\u670D\u52A1\u5185\u5BB9 */}\n <div\n className={cn(\n 'cart-perks-section-content tablet:flex-row flex flex-1 flex-col gap-4',\n classNames.content\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u6807\u9898\u53CA\u63CF\u8FF0 */}\n <div\n className={cn(\n 'cart-perks-section-info tablet:flex-[2] tablet:gap-2 flex flex-1 flex-col justify-start',\n classNames.info\n )}\n >\n <Heading\n size={2}\n className={cn('cart-perks-section-name text-info-primary font-bold', classNames.name)}\n html={perk.title}\n />\n <Text\n className={cn(\n 'cart-perks-section-description tablet:text-base text-info-tertiary text-sm leading-normal',\n classNames.description\n )}\n html={perk.description}\n />\n {perk?.learnMoreLink && learnMoreText && (\n <LocalizedLink href={perk.learnMoreLink}>\n <div\n className={cn(\n 'tablet:flex tablet:w-max text-brand-0 tablet:justify-start tablet:text-base hidden p-0 text-sm font-bold',\n classNames.learnMore\n )}\n >\n {learnMoreText}\n </div>\n </LocalizedLink>\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:block tablet:text-base text-info-primary hidden text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n <div\n className={cn(\n 'cart-perks-section-price-wrap tablet:flex-1 tablet:items-end flex flex-col items-start gap-2',\n classNames.priceWrap\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u4EF7\u683C */}\n <div\n className={cn(\n 'cart-perks-section-price-row tablet:w-auto flex w-full items-center justify-between',\n classNames.priceRow\n )}\n >\n <div className=\"flex items-center gap-1\">\n <Text\n className={cn(\n 'cart-perks-section-price text-info-primary tablet:text-2xl text-xl font-bold',\n classNames.price\n )}\n html={perk.price}\n />\n {perk.originalPrice && (\n <Text\n className={cn(\n 'cart-perks-section-original-price tablet:text-2xl text-info-tertiary text-xl font-bold line-through',\n classNames.originalPrice\n )}\n html={perk.originalPrice}\n />\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:hidden tablet:text-base text-info-primary text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n </div>\n {/* \u589E\u503C\u670D\u52A1\u6309\u94AE */}\n {perk.onAdd && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={perk.onAdd}\n className={cn('cart-perks-section-action tablet:text-base text-brand-0 !p-0', classNames.action)}\n >\n {addText}\n </Button>\n )}\n </div>\n </div>\n </div>\n\n {perk?.learnMoreLink && learnMoreText && (\n <LocalizedLink\n href={perk.learnMoreLink}\n className={cn(\n 'rounded-box-small tablet:hidden tablet:text-base flex items-center bg-white px-4 py-3 text-sm font-bold',\n classNames.learnMore\n )}\n >\n <div className=\"flex flex-1 items-center gap-1\">\n <LearnMoreIcon className=\"size-5\" />\n <Text className=\"cart-perks-section-learn-more text-info-tertiary\">{learnMoreText}</Text>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52864 3.52827C5.78899 3.26792 6.211 3.26792 6.47134 3.52827L10.4713 7.52827C10.7317 7.78862 10.7317 8.21063 10.4713 8.47098L6.47134 12.471C6.211 12.7313 5.78899 12.7313 5.52864 12.471C5.26829 12.2106 5.26829 11.7886 5.52864 11.5283L9.05728 7.99962L5.52864 4.47098C5.26829 4.21063 5.26829 3.78862 5.52864 3.52827Z\"\n fill=\"#4A4C56\"\n />\n </svg>\n </LocalizedLink>\n )}\n </div>\n ))}\n </div>\n )\n }\n)\n\nCartPerksSection.displayName = 'CartPerksSection'\n\nexport default CartPerksSection\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["CartPerksSection_exports", "__export", "CartPerksSection_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import__", "import_LocalizedLink", "LearnMoreIcon", "className", "CartPerksSection", "title", "perks", "copy", "classNames", "props", "ref", "addText", "learnMoreText", "perk"]
|
|
7
7
|
}
|
|
@@ -11,6 +11,8 @@ export interface CartPriceSummaryProps {
|
|
|
11
11
|
appliedCoupons?: string[];
|
|
12
12
|
/** 移除折扣码回调,参数为折扣码 */
|
|
13
13
|
onCouponRemove?: (code: string) => void;
|
|
14
|
+
/** 折扣码应用按钮 loading 状态 */
|
|
15
|
+
couponLoading?: boolean;
|
|
14
16
|
/** 小计金额(格式化字符串,含货币符号) */
|
|
15
17
|
subtotal?: string;
|
|
16
18
|
/** 运费文案 */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var A=Object.create;var m=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var O=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var H=(n,r)=>{for(var o in r)m(n,o,{get:r[o],enumerable:!0})},N=(n,r,o,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let c of E(r))!W.call(n,c)&&c!==o&&m(n,c,{get:()=>r[c],enumerable:!(l=D(r,c))||l.enumerable});return n};var _=(n,r,o)=>(o=n!=null?A(O(n)):{},N(r||!n||!n.__esModule?m(o,"default",{value:n,enumerable:!0}):o,n)),F=n=>N(m({},"__esModule",{value:!0}),n);var G={};H(G,{default:()=>Z});module.exports=F(G);var t=require("react/jsx-runtime"),T=_(require("react")),a=require("../../../helpers/index.js"),p=require("../../../components/index.js"),z=require("../index.js");const U=({className:n})=>(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:(0,a.cn)("shrink-0",n),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,t.jsx)("path",{fill:"currentColor",d:"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z"})}),Y=({className:n})=>(0,t.jsxs)("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:(0,a.cn)("shrink-0",n),children:[(0,t.jsx)("circle",{cx:"10",cy:"10",r:"7.5",stroke:"currentColor",strokeWidth:"1.5"}),(0,t.jsx)("path",{d:"M7 7L13 13M13 7L7 13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),g=({className:n})=>(0,t.jsxs)("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:(0,a.cn)("shrink-0",n),children:[(0,t.jsx)("circle",{cx:"10",cy:"10",r:"7.5",stroke:"currentColor",strokeWidth:"1.5"}),(0,t.jsx)("path",{d:"M10 9V14M10 6V6.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),L=T.forwardRef(({couponInputValue:n,onCouponInputChange:r,onCouponApply:o,appliedCoupons:l,onCouponRemove:c,subtotal:w,shipping:y,taxes:v,productDiscount:x,orderDiscount:b,discountTotal:u,total:d,onCheckout:h,showCashReduction:k,showInstallment:R,installmentIcons:f,copy:V,className:j,classNames:e={},...P},S)=>{const i={...z.DEFAULT_CART_COPY,...V},B=r!==void 0||o!==void 0||l&&l.length>0,[C,I]=T.useState(!1),q=x!==void 0||b!==void 0;return(0,t.jsx)("div",{ref:S,className:(0,a.cn)("cart-price-summary-root","tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ","",j,e.root),...P,children:(0,t.jsxs)("div",{className:"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end flex flex-col gap-2 p-4",children:[B&&(0,t.jsxs)("button",{type:"button",className:(0,a.cn)("cart-price-summary-coupon-toggle","group flex w-full cursor-pointer items-center justify-between",e.couponToggle),onClick:()=>I(s=>!s),children:[(0,t.jsx)("span",{className:"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.couponTitle||"Have a discount code?"}),(0,t.jsxs)("span",{className:(0,a.cn)("cart-price-summary-coupon-link","text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]",e.couponLink),children:[i.couponLink||"Apply/Check",(0,t.jsx)(U,{className:(0,a.cn)("text-brand-primary tablet:size-5 size-4 transition-transform duration-200",C&&"rotate-180")})]})]}),C&&(0,t.jsxs)("div",{className:"flex flex-col items-end gap-2",children:[(0,t.jsx)(p.Input,{size:"lg",type:"text",value:n,onChange:s=>r?.(s.target.value),placeholder:i.couponPlaceholder||"Enter Code",className:(0,a.cn)("cart-price-summary-coupon-input","border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent",e.couponInput),inputClassName:"text-sm tablet:text-base font-bold w-[315px]",children:(0,t.jsx)(p.InputSlot,{children:(0,t.jsx)("div",{className:"border-lines-primary flex items-center border-l pl-2 pr-4",children:(0,t.jsx)("button",{type:"button",className:"text-info-primary tablet:text-base cursor-pointer text-sm font-bold leading-[1.4] tracking-[-0.02em] underline",onClick:()=>o?.(n||""),children:i.couponApply||"Apply"})})})}),l&&l.length>0&&(0,t.jsx)("div",{className:(0,a.cn)("cart-price-summary-coupon-tags","tablet:gap-2 flex flex-wrap gap-1",e.couponTags),children:l.map(s=>(0,t.jsxs)("span",{className:(0,a.cn)("cart-price-summary-coupon-tag","bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1",e.couponTag),children:[(0,t.jsx)("span",{className:(0,a.cn)("cart-price-summary-coupon-tag-text","text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.couponTagText),children:s}),(0,t.jsx)("button",{type:"button",className:(0,a.cn)("cart-price-summary-coupon-tag-remove","text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center",e.couponTagRemove),onClick:()=>c?.(s),children:(0,t.jsx)(Y,{})})]},s))})]}),w!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.subtotalLabel||"Subtotal:"}),(0,t.jsx)("span",{className:e.priceRowValue,children:w})]}),y!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.shippingLabel||"Shipping:"}),(0,t.jsx)("span",{className:e.priceRowValue,children:y})]}),v!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.taxesLabel||"Taxes:"}),(0,t.jsx)("span",{className:e.priceRowValue,children:v})]}),q&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-box","bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2",e.discountBox),children:[x!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-row","text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.discountRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.productDiscountsLabel||"Product discounts:"}),(0,t.jsx)("span",{className:(0,a.cn)("text-marketing-1",e.discountRowValue),children:x})]}),b!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-row","text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.discountRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.orderDiscountLabel||"Order discount:"}),(0,t.jsx)("span",{className:(0,a.cn)("text-marketing-1",e.discountRowValue),children:b})]})]}),(u!==void 0||d!==void 0)&&(0,t.jsxs)("div",{className:"flex w-full flex-col gap-4",children:[u!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-total-row","flex w-full items-center justify-between whitespace-nowrap",e.discountTotalRow),children:[(0,t.jsx)("span",{className:"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.discountTotalLabel||"Discount total:"}),(0,t.jsx)("span",{className:(0,a.cn)("cart-price-summary-discount-total-value","text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]",e.discountTotalValue),children:u})]}),u!==void 0&&d!==void 0&&(0,t.jsx)("div",{className:(0,a.cn)("cart-price-summary-divider","border-lines-primary w-full border-t",e.divider)}),d!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-total-row","flex w-full items-center justify-between whitespace-nowrap",e.totalRow),children:[(0,t.jsx)("span",{className:"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]",children:i.totalLabel||"Total:"}),(0,t.jsx)("span",{className:(0,a.cn)("cart-price-summary-total-value","text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]",e.totalValue),children:d})]})]}),k&&i.cashReductionText&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-cash-reduction-mobile","tablet:hidden flex items-start gap-1",e.cashReduction),children:[(0,t.jsx)("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.cashReductionText}),(0,t.jsx)(g,{className:"text-info-quaternary tablet:size-5 size-4"})]}),(0,t.jsxs)("div",{className:(0,a.cn)("tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4",!R&&"justify-end"),children:[h&&(0,t.jsx)(p.Button,{variant:"primary",size:"lg",className:(0,a.cn)("cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0",e.checkoutButton),onClick:h,children:i.checkOut||"Check Out"}),k&&i.cashReductionText&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-cash-reduction","tablet:flex hidden items-start gap-1",e.cashReduction),children:[(0,t.jsx)("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.cashReductionText}),(0,t.jsx)(g,{className:"text-info-quaternary tablet:size-5 size-4"})]}),R&&i.installmentText&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-installment","tablet:flex-row order-1 flex flex-col items-start gap-0.5",e.installment),children:[f&&f.length>0&&(0,t.jsx)("span",{className:"flex shrink-0 items-center",children:f.map((s,M)=>(0,t.jsx)("img",{src:s.src,alt:s.alt||"",className:"tablet:size-5 -mr-1 size-4 object-cover"},M))}),(0,t.jsxs)("div",{className:"flex gap-1",children:[(0,t.jsx)("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.installmentText}),(0,t.jsx)(g,{className:"text-info-quaternary tablet:size-5 size-4"})]})]})]})]})})});L.displayName="CartPriceSummary";var Z=L;
|
|
1
|
+
"use strict";"use client";var D=Object.create;var m=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var W=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var _=(n,r)=>{for(var o in r)m(n,o,{get:r[o],enumerable:!0})},L=(n,r,o,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let c of O(r))!H.call(n,c)&&c!==o&&m(n,c,{get:()=>r[c],enumerable:!(l=E(r,c))||l.enumerable});return n};var F=(n,r,o)=>(o=n!=null?D(W(n)):{},L(r||!n||!n.__esModule?m(o,"default",{value:n,enumerable:!0}):o,n)),U=n=>L(m({},"__esModule",{value:!0}),n);var J={};_(J,{default:()=>G});module.exports=U(J);var t=require("react/jsx-runtime"),T=F(require("react")),a=require("../../../helpers/index.js"),p=require("../../../components/index.js"),V=require("../index.js");const Y=({className:n})=>(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:(0,a.cn)("shrink-0",n),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:(0,t.jsx)("path",{fill:"currentColor",d:"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z"})}),Z=({className:n})=>(0,t.jsxs)("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:(0,a.cn)("shrink-0",n),children:[(0,t.jsx)("circle",{cx:"10",cy:"10",r:"7.5",stroke:"currentColor",strokeWidth:"1.5"}),(0,t.jsx)("path",{d:"M7 7L13 13M13 7L7 13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),w=({className:n})=>(0,t.jsxs)("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:(0,a.cn)("shrink-0",n),children:[(0,t.jsx)("circle",{cx:"10",cy:"10",r:"7.5",stroke:"currentColor",strokeWidth:"1.5"}),(0,t.jsx)("path",{d:"M10 9V14M10 6V6.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),z=T.forwardRef(({couponInputValue:n,onCouponInputChange:r,onCouponApply:o,appliedCoupons:l,onCouponRemove:c,couponLoading:j=!1,subtotal:y,shipping:v,taxes:h,productDiscount:x,orderDiscount:f,discountTotal:d,total:u,onCheckout:k,showCashReduction:R,showInstallment:N,installmentIcons:b,copy:P,className:S,classNames:e={},...B},I)=>{const i={...V.DEFAULT_CART_COPY,...P},C=r!==void 0||o!==void 0||l&&l.length>0,[g,q]=T.useState(!1),M=x!==void 0||f!==void 0;return(0,t.jsx)("div",{ref:I,className:(0,a.cn)("cart-price-summary-root","tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ","",S,e.root),...B,children:(0,t.jsxs)("div",{className:"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end tablet:p-0 flex flex-col gap-2 p-4",children:[C&&(0,t.jsxs)("button",{type:"button",className:(0,a.cn)("cart-price-summary-coupon-toggle","group flex w-full cursor-pointer items-center justify-between",e.couponToggle),onClick:()=>q(s=>!s),children:[(0,t.jsx)("span",{className:"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.couponTitle||"Have a discount code?"}),(0,t.jsxs)("span",{className:(0,a.cn)("cart-price-summary-coupon-link","text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]",e.couponLink),children:[i.couponLink||"Apply/Check",(0,t.jsx)(Y,{className:(0,a.cn)("text-brand-primary tablet:size-5 size-4 transition-transform duration-200",g&&"rotate-180")})]})]}),g&&(0,t.jsxs)("div",{className:"tablet:max-w-[404px] flex flex-col items-end gap-2",children:[(0,t.jsx)(p.Input,{size:"lg",type:"text",value:n,onChange:s=>r?.(s.target.value),placeholder:i.couponPlaceholder||"Enter Code",className:(0,a.cn)("cart-price-summary-coupon-input","border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent",e.couponInput),inputClassName:"text-sm tablet:text-base font-bold w-[315px]",children:(0,t.jsx)(p.InputSlot,{children:(0,t.jsx)("div",{className:"border-lines-primary flex items-center border-l pl-2 pr-4",children:(0,t.jsx)(p.Button,{variant:"ghost",size:"lg",loading:j,className:"hover:!text-info-primary text-info-primary tablet:text-base cursor-pointer !p-0 text-sm font-bold leading-[1.4] tracking-[-0.02em] underline hover:!bg-transparent",onClick:()=>o?.(n||""),children:i.couponApply||"Apply"})})})}),l&&l.length>0&&(0,t.jsx)("div",{className:(0,a.cn)("cart-price-summary-coupon-tags","tablet:gap-2 flex flex-wrap gap-1",e.couponTags),children:l.map(s=>(0,t.jsxs)("span",{className:(0,a.cn)("cart-price-summary-coupon-tag","bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1",e.couponTag),children:[(0,t.jsx)("span",{className:(0,a.cn)("cart-price-summary-coupon-tag-text","text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.couponTagText),children:s}),(0,t.jsx)("button",{type:"button",className:(0,a.cn)("cart-price-summary-coupon-tag-remove","text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center",e.couponTagRemove),onClick:()=>c?.(s),children:(0,t.jsx)(Z,{})})]},s))})]}),(0,t.jsxs)("div",{className:(0,a.cn)("tablet:gap-4 flex w-full flex-col gap-2",!g&&C&&"tablet:flex hidden"),children:[y!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.subtotalLabel||"Subtotal:"}),(0,t.jsx)("span",{className:e.priceRowValue,children:y})]}),v!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.shippingLabel||"Shipping:"}),(0,t.jsx)("span",{className:e.priceRowValue,children:v})]}),h!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.taxesLabel||"Taxes:"}),(0,t.jsx)("span",{className:e.priceRowValue,children:h})]}),M&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-box","bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2",e.discountBox),children:[x!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-row","text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.discountRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.productDiscountsLabel||"Product discounts:"}),(0,t.jsx)("span",{className:(0,a.cn)("text-marketing-1",e.discountRowValue),children:x})]}),f!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-row","text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.discountRow),children:[(0,t.jsx)("span",{className:e.priceRowLabel,children:i.orderDiscountLabel||"Order discount:"}),(0,t.jsx)("span",{className:(0,a.cn)("text-marketing-1",e.discountRowValue),children:f})]})]})]}),(d!==void 0||u!==void 0)&&(0,t.jsxs)("div",{className:"flex w-full flex-col gap-4",children:[d!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-discount-total-row","flex w-full items-center justify-between whitespace-nowrap",e.discountTotalRow),children:[(0,t.jsx)("span",{className:"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.discountTotalLabel||"Discount total:"}),(0,t.jsx)("span",{className:(0,a.cn)("cart-price-summary-discount-total-value","text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]",e.discountTotalValue),children:d})]}),d!==void 0&&u!==void 0&&(0,t.jsx)("div",{className:(0,a.cn)("cart-price-summary-divider","border-lines-primary w-full border-t",e.divider)}),u!==void 0&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-total-row","flex w-full items-center justify-between whitespace-nowrap",e.totalRow),children:[(0,t.jsx)("span",{className:"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]",children:i.totalLabel||"Total:"}),(0,t.jsx)("span",{className:(0,a.cn)("cart-price-summary-total-value","text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]",e.totalValue),children:u})]})]}),R&&i.cashReductionText&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-cash-reduction-mobile","tablet:hidden flex items-start gap-1",e.cashReduction),children:[(0,t.jsx)("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.cashReductionText}),(0,t.jsx)(w,{className:"text-info-quaternary tablet:size-5 size-4"})]}),(0,t.jsxs)("div",{className:(0,a.cn)("tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4",!N&&"justify-end"),children:[k&&(0,t.jsx)(p.Button,{variant:"primary",size:"lg",className:(0,a.cn)("cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0",e.checkoutButton),onClick:k,children:i.checkOut||"Check Out"}),R&&i.cashReductionText&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-cash-reduction","tablet:flex hidden items-start gap-1",e.cashReduction),children:[(0,t.jsx)("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.cashReductionText}),(0,t.jsx)(w,{className:"text-info-quaternary tablet:size-5 size-4"})]}),N&&i.installmentText&&(0,t.jsxs)("div",{className:(0,a.cn)("cart-price-summary-installment","tablet:flex-row order-1 flex flex-col items-start gap-0.5",e.installment),children:[b&&b.length>0&&(0,t.jsx)("span",{className:"flex shrink-0 items-center",children:b.map((s,A)=>(0,t.jsx)("img",{src:s.src,alt:s.alt||"",className:"tablet:size-5 -mr-1 size-4 object-cover"},A))}),(0,t.jsxs)("div",{className:"flex gap-1",children:[(0,t.jsx)("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.installmentText}),(0,t.jsx)(w,{className:"text-info-quaternary tablet:size-5 size-4"})]})]})]})]})})});z.displayName="CartPriceSummary";var G=z;
|
|
2
2
|
//# sourceMappingURL=CartPriceSummary.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Input, InputSlot } from '../../../components/index.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport type { CartPriceSummaryCopy } from '../types.js'\n\n// \u2500\u2500 Icon: Chevron right \u2500\u2500\nconst DownIcon = ({ className }: { className?: string }) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill=\"currentColor\"\n d=\"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z\"\n />\n </svg>\n)\n\n// \u2500\u2500 Icon: Close (used in coupon tag remove button) \u2500\u2500\nconst CloseIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\n// \u2500\u2500 Icon: Info \u2500\u2500\nconst InfoIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M10 9V14M10 6V6.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\nexport interface CartPriceSummaryProps {\n /** \u6298\u6263\u7801\u8F93\u5165\u6846\u7684\u503C */\n couponInputValue?: string\n /** \u6298\u6263\u7801\u8F93\u5165\u53D8\u5316\u56DE\u8C03 */\n onCouponInputChange?: (value: string) => void\n /** \u70B9\u51FB\u5E94\u7528\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u8F93\u5165\u6846\u4E2D\u7684\u6298\u6263\u7801 */\n onCouponApply?: (code: string) => void\n /** \u5DF2\u5E94\u7528\u7684\u6298\u6263\u7801\u5217\u8868 */\n appliedCoupons?: string[]\n /** \u79FB\u9664\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u6298\u6263\u7801 */\n onCouponRemove?: (code: string) => void\n\n /** \u5C0F\u8BA1\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n subtotal?: string\n /** \u8FD0\u8D39\u6587\u6848 */\n shipping?: string\n /** \u7A0E\u8D39\u6587\u6848 */\n taxes?: string\n\n /** \u4EA7\u54C1\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n productDiscount?: string\n /** \u8BA2\u5355\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n orderDiscount?: string\n\n /** \u6298\u6263\u603B\u8BA1\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n discountTotal?: string\n /** \u6700\u7EC8\u603B\u4EF7\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n total?: string\n\n /** \u7ED3\u8D26\u6309\u94AE\u70B9\u51FB\u56DE\u8C03 */\n onCheckout?: () => void\n\n /** \u662F\u5426\u663E\u793A\u73B0\u91D1\u51CF\u514D\u63D0\u793A */\n showCashReduction?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */\n showInstallment?: boolean\n /** \u5206\u671F\u4ED8\u6B3E\u652F\u4ED8\u65B9\u5F0F\u56FE\u6807\u5217\u8868 */\n installmentIcons?: { src: string; alt?: string }[]\n\n /** \u6587\u6848\u8986\u76D6\uFF0C\u7528\u4E8E\u56FD\u9645\u5316 */\n copy?: CartPriceSummaryCopy\n /** \u6839\u5BB9\u5668 className */\n className?: string\n /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n classNames?: Partial<\n Record<\n | 'root'\n | 'couponToggle'\n | 'couponLink'\n | 'couponInput'\n | 'couponTags'\n | 'couponTag'\n | 'couponTagText'\n | 'couponTagRemove'\n | 'priceRow'\n | 'priceRowLabel'\n | 'priceRowValue'\n | 'discountBox'\n | 'discountRow'\n | 'discountRowValue'\n | 'discountTotalRow'\n | 'discountTotalValue'\n | 'divider'\n | 'totalRow'\n | 'totalValue'\n | 'checkoutButton'\n | 'cashReduction'\n | 'installment',\n string\n >\n >\n}\n\nconst CartPriceSummary = React.forwardRef<HTMLDivElement, CartPriceSummaryProps>(\n (\n {\n couponInputValue,\n onCouponInputChange,\n onCouponApply,\n appliedCoupons,\n onCouponRemove,\n\n subtotal,\n shipping,\n taxes,\n\n productDiscount,\n orderDiscount,\n\n discountTotal,\n total,\n\n onCheckout,\n\n showCashReduction,\n showInstallment,\n installmentIcons,\n\n copy,\n className,\n classNames = {},\n ...props\n },\n ref\n ) => {\n const c = { ...DEFAULT_CART_COPY, ...copy }\n\n const hasCouponSection =\n onCouponInputChange !== undefined || onCouponApply !== undefined || (appliedCoupons && appliedCoupons.length > 0)\n\n const [couponExpanded, setCouponExpanded] = React.useState(false)\n\n const hasDiscounts = productDiscount !== undefined || orderDiscount !== undefined\n\n return (\n <div\n ref={ref}\n className={cn(\n 'cart-price-summary-root',\n 'tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ',\n '',\n className,\n classNames.root\n )}\n {...props}\n >\n <div className=\"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end flex flex-col gap-2 p-4\">\n {/* \u6298\u6263\u7801\u5165\u53E3 */}\n {hasCouponSection && (\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-toggle',\n 'group flex w-full cursor-pointer items-center justify-between',\n classNames.couponToggle\n )}\n onClick={() => setCouponExpanded(prev => !prev)}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.couponTitle || 'Have a discount code?'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-coupon-link',\n 'text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.couponLink\n )}\n >\n {c.couponLink || 'Apply/Check'}\n <DownIcon\n className={cn(\n 'text-brand-primary tablet:size-5 size-4 transition-transform duration-200',\n couponExpanded && 'rotate-180'\n )}\n />\n </span>\n </button>\n )}\n\n {/* \u6298\u6263\u7801\u8F93\u5165\u4E0E\u6807\u7B7E */}\n {couponExpanded && (\n <div className=\"flex flex-col items-end gap-2\">\n {/* \u8F93\u5165\u6846 + \u5E94\u7528\u6309\u94AE */}\n <Input\n size=\"lg\"\n type=\"text\"\n value={couponInputValue}\n onChange={e => onCouponInputChange?.(e.target.value)}\n placeholder={c.couponPlaceholder || 'Enter Code'}\n className={cn(\n 'cart-price-summary-coupon-input',\n 'border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent',\n classNames.couponInput\n )}\n inputClassName=\"text-sm tablet:text-base font-bold w-[315px]\"\n >\n <InputSlot>\n <div className=\"border-lines-primary flex items-center border-l pl-2 pr-4\">\n <button\n type=\"button\"\n className=\"text-info-primary tablet:text-base cursor-pointer text-sm font-bold leading-[1.4] tracking-[-0.02em] underline\"\n onClick={() => onCouponApply?.(couponInputValue || '')}\n >\n {c.couponApply || 'Apply'}\n </button>\n </div>\n </InputSlot>\n </Input>\n\n {/* \u5DF2\u5E94\u7528\u6298\u6263\u7801\u6807\u7B7E */}\n {appliedCoupons && appliedCoupons.length > 0 && (\n <div\n className={cn(\n 'cart-price-summary-coupon-tags',\n 'tablet:gap-2 flex flex-wrap gap-1',\n classNames.couponTags\n )}\n >\n {appliedCoupons.map(code => (\n <span\n key={code}\n className={cn(\n 'cart-price-summary-coupon-tag',\n 'bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1',\n classNames.couponTag\n )}\n >\n <span\n className={cn(\n 'cart-price-summary-coupon-tag-text',\n 'text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.couponTagText\n )}\n >\n {code}\n </span>\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-tag-remove',\n 'text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center',\n classNames.couponTagRemove\n )}\n onClick={() => onCouponRemove?.(code)}\n >\n <CloseIcon />\n </button>\n </span>\n ))}\n </div>\n )}\n </div>\n )}\n\n {/* \u5C0F\u8BA1 */}\n {subtotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.subtotalLabel || 'Subtotal:'}</span>\n <span className={classNames.priceRowValue}>{subtotal}</span>\n </div>\n )}\n\n {/* \u8FD0\u8D39 */}\n {shipping !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.shippingLabel || 'Shipping:'}</span>\n <span className={classNames.priceRowValue}>{shipping}</span>\n </div>\n )}\n\n {/* \u7A0E\u8D39 */}\n {taxes !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.taxesLabel || 'Taxes:'}</span>\n <span className={classNames.priceRowValue}>{taxes}</span>\n </div>\n )}\n\n {/* \u6298\u6263\u6C47\u603B */}\n {hasDiscounts && (\n <div\n className={cn(\n 'cart-price-summary-discount-box',\n 'bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2',\n classNames.discountBox\n )}\n >\n {productDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.productDiscountsLabel || 'Product discounts:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{productDiscount}</span>\n </div>\n )}\n {orderDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.orderDiscountLabel || 'Order discount:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{orderDiscount}</span>\n </div>\n )}\n </div>\n )}\n\n {/* \u6298\u6263\u603B\u8BA1\u4E0E\u6700\u7EC8\u603B\u4EF7 */}\n {(discountTotal !== undefined || total !== undefined) && (\n <div className=\"flex w-full flex-col gap-4\">\n {discountTotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.discountTotalRow\n )}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.discountTotalLabel || 'Discount total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-discount-total-value',\n 'text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.discountTotalValue\n )}\n >\n {discountTotal}\n </span>\n </div>\n )}\n\n {discountTotal !== undefined && total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-divider',\n 'border-lines-primary w-full border-t',\n classNames.divider\n )}\n />\n )}\n\n {total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.totalRow\n )}\n >\n <span className=\"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]\">\n {c.totalLabel || 'Total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-total-value',\n 'text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.totalValue\n )}\n >\n {total}\n </span>\n </div>\n )}\n </div>\n )}\n {/* \u79FB\u52A8\u7AEF\u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction-mobile',\n 'tablet:hidden flex items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n <div\n className={cn(\n 'tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4',\n !showInstallment && 'justify-end'\n )}\n >\n {/* \u7ED3\u8D26\u6309\u94AE */}\n {onCheckout && (\n <Button\n variant=\"primary\"\n size=\"lg\"\n className={cn(\n 'cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0',\n classNames.checkoutButton\n )}\n onClick={onCheckout}\n >\n {c.checkOut || 'Check Out'}\n </Button>\n )}\n\n {/* \u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction',\n 'tablet:flex hidden items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n\n {/* \u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */}\n {showInstallment && c.installmentText && (\n <div\n className={cn(\n 'cart-price-summary-installment',\n 'tablet:flex-row order-1 flex flex-col items-start gap-0.5',\n classNames.installment\n )}\n >\n {installmentIcons && installmentIcons.length > 0 && (\n <span className=\"flex shrink-0 items-center\">\n {installmentIcons.map((icon, index) => (\n <img\n key={index}\n src={icon.src}\n alt={icon.alt || ''}\n className=\"tablet:size-5 -mr-1 size-4 object-cover\"\n />\n ))}\n </span>\n )}\n <div className=\"flex gap-1\">\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.installmentText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n }\n)\n\nCartPriceSummary.displayName = 'CartPriceSummary'\n\nexport default CartPriceSummary\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAkBI,IAAAI,EAAA,6BAhBJC,EAAuB,oBACvBC,EAAmB,qCACnBC,EAAyC,wCACzCC,EAAkC,uBAIlC,MAAMC,EAAW,CAAC,CAAE,UAAAC,CAAU,OAC5B,OAAC,OACC,MAAM,6BACN,aAAW,MAAG,WAAYA,CAAS,EACnC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,mBAAC,QACC,KAAK,eACL,EAAE,4TACJ,EACF,EAIIC,EAAY,CAAC,CAAE,UAAAD,CAAU,OAC7B,QAAC,OACC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,aAAW,MAAG,WAAYA,CAAS,EAEnC,oBAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,MAAM,OAAO,eAAe,YAAY,MAAM,KACxE,OAAC,QAAK,EAAE,uBAAuB,OAAO,eAAe,YAAY,MAAM,cAAc,QAAQ,GAC/F,EAIIE,EAAW,CAAC,CAAE,UAAAF,CAAU,OAC5B,QAAC,OACC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,aAAW,MAAG,WAAYA,CAAS,EAEnC,oBAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,MAAM,OAAO,eAAe,YAAY,MAAM,KACxE,OAAC,QAAK,EAAE,oBAAoB,OAAO,eAAe,YAAY,MAAM,cAAc,QAAQ,GAC5F,
|
|
6
|
-
"names": ["CartPriceSummary_exports", "__export", "CartPriceSummary_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import__", "DownIcon", "className", "CloseIcon", "InfoIcon", "CartPriceSummary", "couponInputValue", "onCouponInputChange", "onCouponApply", "appliedCoupons", "onCouponRemove", "subtotal", "shipping", "taxes", "productDiscount", "orderDiscount", "discountTotal", "total", "onCheckout", "showCashReduction", "showInstallment", "installmentIcons", "copy", "classNames", "props", "ref", "c", "hasCouponSection", "couponExpanded", "setCouponExpanded", "hasDiscounts", "prev", "e", "code", "icon", "index"]
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Input, InputSlot } from '../../../components/index.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport type { CartPriceSummaryCopy } from '../types.js'\n\n// \u2500\u2500 Icon: Chevron right \u2500\u2500\nconst DownIcon = ({ className }: { className?: string }) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill=\"currentColor\"\n d=\"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z\"\n />\n </svg>\n)\n\n// \u2500\u2500 Icon: Close (used in coupon tag remove button) \u2500\u2500\nconst CloseIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\n// \u2500\u2500 Icon: Info \u2500\u2500\nconst InfoIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M10 9V14M10 6V6.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\nexport interface CartPriceSummaryProps {\n /** \u6298\u6263\u7801\u8F93\u5165\u6846\u7684\u503C */\n couponInputValue?: string\n /** \u6298\u6263\u7801\u8F93\u5165\u53D8\u5316\u56DE\u8C03 */\n onCouponInputChange?: (value: string) => void\n /** \u70B9\u51FB\u5E94\u7528\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u8F93\u5165\u6846\u4E2D\u7684\u6298\u6263\u7801 */\n onCouponApply?: (code: string) => void\n /** \u5DF2\u5E94\u7528\u7684\u6298\u6263\u7801\u5217\u8868 */\n appliedCoupons?: string[]\n /** \u79FB\u9664\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u6298\u6263\u7801 */\n onCouponRemove?: (code: string) => void\n /** \u6298\u6263\u7801\u5E94\u7528\u6309\u94AE loading \u72B6\u6001 */\n couponLoading?: boolean\n\n /** \u5C0F\u8BA1\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n subtotal?: string\n /** \u8FD0\u8D39\u6587\u6848 */\n shipping?: string\n /** \u7A0E\u8D39\u6587\u6848 */\n taxes?: string\n\n /** \u4EA7\u54C1\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n productDiscount?: string\n /** \u8BA2\u5355\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n orderDiscount?: string\n\n /** \u6298\u6263\u603B\u8BA1\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n discountTotal?: string\n /** \u6700\u7EC8\u603B\u4EF7\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n total?: string\n\n /** \u7ED3\u8D26\u6309\u94AE\u70B9\u51FB\u56DE\u8C03 */\n onCheckout?: () => void\n\n /** \u662F\u5426\u663E\u793A\u73B0\u91D1\u51CF\u514D\u63D0\u793A */\n showCashReduction?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */\n showInstallment?: boolean\n /** \u5206\u671F\u4ED8\u6B3E\u652F\u4ED8\u65B9\u5F0F\u56FE\u6807\u5217\u8868 */\n installmentIcons?: { src: string; alt?: string }[]\n\n /** \u6587\u6848\u8986\u76D6\uFF0C\u7528\u4E8E\u56FD\u9645\u5316 */\n copy?: CartPriceSummaryCopy\n /** \u6839\u5BB9\u5668 className */\n className?: string\n /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n classNames?: Partial<\n Record<\n | 'root'\n | 'couponToggle'\n | 'couponLink'\n | 'couponInput'\n | 'couponTags'\n | 'couponTag'\n | 'couponTagText'\n | 'couponTagRemove'\n | 'priceRow'\n | 'priceRowLabel'\n | 'priceRowValue'\n | 'discountBox'\n | 'discountRow'\n | 'discountRowValue'\n | 'discountTotalRow'\n | 'discountTotalValue'\n | 'divider'\n | 'totalRow'\n | 'totalValue'\n | 'checkoutButton'\n | 'cashReduction'\n | 'installment',\n string\n >\n >\n}\n\nconst CartPriceSummary = React.forwardRef<HTMLDivElement, CartPriceSummaryProps>(\n (\n {\n couponInputValue,\n onCouponInputChange,\n onCouponApply,\n appliedCoupons,\n onCouponRemove,\n couponLoading = false,\n\n subtotal,\n shipping,\n taxes,\n\n productDiscount,\n orderDiscount,\n\n discountTotal,\n total,\n\n onCheckout,\n\n showCashReduction,\n showInstallment,\n installmentIcons,\n\n copy,\n className,\n classNames = {},\n ...props\n },\n ref\n ) => {\n const c = { ...DEFAULT_CART_COPY, ...copy }\n\n const hasCouponSection =\n onCouponInputChange !== undefined || onCouponApply !== undefined || (appliedCoupons && appliedCoupons.length > 0)\n\n const [couponExpanded, setCouponExpanded] = React.useState(false)\n\n const hasDiscounts = productDiscount !== undefined || orderDiscount !== undefined\n\n return (\n <div\n ref={ref}\n className={cn(\n 'cart-price-summary-root',\n 'tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ',\n '',\n className,\n classNames.root\n )}\n {...props}\n >\n <div className=\"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end tablet:p-0 flex flex-col gap-2 p-4\">\n {/* \u6298\u6263\u7801\u5165\u53E3 */}\n {hasCouponSection && (\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-toggle',\n 'group flex w-full cursor-pointer items-center justify-between',\n classNames.couponToggle\n )}\n onClick={() => setCouponExpanded(prev => !prev)}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.couponTitle || 'Have a discount code?'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-coupon-link',\n 'text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.couponLink\n )}\n >\n {c.couponLink || 'Apply/Check'}\n <DownIcon\n className={cn(\n 'text-brand-primary tablet:size-5 size-4 transition-transform duration-200',\n couponExpanded && 'rotate-180'\n )}\n />\n </span>\n </button>\n )}\n\n {/* \u6298\u6263\u7801\u8F93\u5165\u4E0E\u6807\u7B7E */}\n {couponExpanded && (\n <div className=\"tablet:max-w-[404px] flex flex-col items-end gap-2\">\n {/* \u8F93\u5165\u6846 + \u5E94\u7528\u6309\u94AE */}\n <Input\n size=\"lg\"\n type=\"text\"\n value={couponInputValue}\n onChange={e => onCouponInputChange?.(e.target.value)}\n placeholder={c.couponPlaceholder || 'Enter Code'}\n className={cn(\n 'cart-price-summary-coupon-input',\n 'border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent',\n classNames.couponInput\n )}\n inputClassName=\"text-sm tablet:text-base font-bold w-[315px]\"\n >\n <InputSlot>\n <div className=\"border-lines-primary flex items-center border-l pl-2 pr-4\">\n <Button\n variant=\"ghost\"\n size=\"lg\"\n loading={couponLoading}\n className=\"hover:!text-info-primary text-info-primary tablet:text-base cursor-pointer !p-0 text-sm font-bold leading-[1.4] tracking-[-0.02em] underline hover:!bg-transparent\"\n onClick={() => onCouponApply?.(couponInputValue || '')}\n >\n {c.couponApply || 'Apply'}\n </Button>\n </div>\n </InputSlot>\n </Input>\n\n {/* \u5DF2\u5E94\u7528\u6298\u6263\u7801\u6807\u7B7E */}\n {appliedCoupons && appliedCoupons.length > 0 && (\n <div\n className={cn(\n 'cart-price-summary-coupon-tags',\n 'tablet:gap-2 flex flex-wrap gap-1',\n classNames.couponTags\n )}\n >\n {appliedCoupons.map(code => (\n <span\n key={code}\n className={cn(\n 'cart-price-summary-coupon-tag',\n 'bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1',\n classNames.couponTag\n )}\n >\n <span\n className={cn(\n 'cart-price-summary-coupon-tag-text',\n 'text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.couponTagText\n )}\n >\n {code}\n </span>\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-tag-remove',\n 'text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center',\n classNames.couponTagRemove\n )}\n onClick={() => onCouponRemove?.(code)}\n >\n <CloseIcon />\n </button>\n </span>\n ))}\n </div>\n )}\n </div>\n )}\n\n {/* \u4EF7\u683C\u660E\u7EC6\uFF1A\u79FB\u52A8\u7AEF\u6298\u6263\u7801\u6298\u53E0\u65F6\u9690\u85CF\uFF1B\u5E73\u677F\u53CA\u4EE5\u4E0A\u59CB\u7EC8\u53EF\u89C1 */}\n <div\n className={cn(\n 'tablet:gap-4 flex w-full flex-col gap-2',\n !couponExpanded && hasCouponSection && 'tablet:flex hidden'\n )}\n >\n {/* \u5C0F\u8BA1 */}\n {subtotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.subtotalLabel || 'Subtotal:'}</span>\n <span className={classNames.priceRowValue}>{subtotal}</span>\n </div>\n )}\n\n {/* \u8FD0\u8D39 */}\n {shipping !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.shippingLabel || 'Shipping:'}</span>\n <span className={classNames.priceRowValue}>{shipping}</span>\n </div>\n )}\n\n {/* \u7A0E\u8D39 */}\n {taxes !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.taxesLabel || 'Taxes:'}</span>\n <span className={classNames.priceRowValue}>{taxes}</span>\n </div>\n )}\n\n {/* \u6298\u6263\u6C47\u603B */}\n {hasDiscounts && (\n <div\n className={cn(\n 'cart-price-summary-discount-box',\n 'bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2',\n classNames.discountBox\n )}\n >\n {productDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.productDiscountsLabel || 'Product discounts:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{productDiscount}</span>\n </div>\n )}\n {orderDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.orderDiscountLabel || 'Order discount:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{orderDiscount}</span>\n </div>\n )}\n </div>\n )}\n </div>\n\n {/* \u6298\u6263\u603B\u8BA1\u4E0E\u6700\u7EC8\u603B\u4EF7 */}\n {(discountTotal !== undefined || total !== undefined) && (\n <div className=\"flex w-full flex-col gap-4\">\n {discountTotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.discountTotalRow\n )}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.discountTotalLabel || 'Discount total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-discount-total-value',\n 'text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.discountTotalValue\n )}\n >\n {discountTotal}\n </span>\n </div>\n )}\n\n {discountTotal !== undefined && total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-divider',\n 'border-lines-primary w-full border-t',\n classNames.divider\n )}\n />\n )}\n\n {total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.totalRow\n )}\n >\n <span className=\"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]\">\n {c.totalLabel || 'Total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-total-value',\n 'text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.totalValue\n )}\n >\n {total}\n </span>\n </div>\n )}\n </div>\n )}\n {/* \u79FB\u52A8\u7AEF\u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction-mobile',\n 'tablet:hidden flex items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n <div\n className={cn(\n 'tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4',\n !showInstallment && 'justify-end'\n )}\n >\n {/* \u7ED3\u8D26\u6309\u94AE */}\n {onCheckout && (\n <Button\n variant=\"primary\"\n size=\"lg\"\n className={cn(\n 'cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0',\n classNames.checkoutButton\n )}\n onClick={onCheckout}\n >\n {c.checkOut || 'Check Out'}\n </Button>\n )}\n\n {/* \u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction',\n 'tablet:flex hidden items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n\n {/* \u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */}\n {showInstallment && c.installmentText && (\n <div\n className={cn(\n 'cart-price-summary-installment',\n 'tablet:flex-row order-1 flex flex-col items-start gap-0.5',\n classNames.installment\n )}\n >\n {installmentIcons && installmentIcons.length > 0 && (\n <span className=\"flex shrink-0 items-center\">\n {installmentIcons.map((icon, index) => (\n <img\n key={index}\n src={icon.src}\n alt={icon.alt || ''}\n className=\"tablet:size-5 -mr-1 size-4 object-cover\"\n />\n ))}\n </span>\n )}\n <div className=\"flex gap-1\">\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.installmentText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n }\n)\n\nCartPriceSummary.displayName = 'CartPriceSummary'\n\nexport default CartPriceSummary\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["CartPriceSummary_exports", "__export", "CartPriceSummary_default", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_components", "import__", "DownIcon", "className", "CloseIcon", "InfoIcon", "CartPriceSummary", "couponInputValue", "onCouponInputChange", "onCouponApply", "appliedCoupons", "onCouponRemove", "couponLoading", "subtotal", "shipping", "taxes", "productDiscount", "orderDiscount", "discountTotal", "total", "onCheckout", "showCashReduction", "showInstallment", "installmentIcons", "copy", "classNames", "props", "ref", "c", "hasCouponSection", "couponExpanded", "setCouponExpanded", "hasDiscounts", "prev", "e", "code", "icon", "index"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as v from"react";import{cn as a}from"../../../helpers/index.js";import{Button as y,Heading as c,Picture as C,Text as n}from"../../../components/index.js";import{DEFAULT_CART_COPY as d}from"../index.js";import{LocalizedLink as
|
|
1
|
+
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as v from"react";import{cn as a}from"../../../helpers/index.js";import{Button as y,Heading as c,Picture as C,Text as n}from"../../../components/index.js";import{DEFAULT_CART_COPY as d}from"../index.js";import{LocalizedLink as p}from"../../../shared/LocalizedLink.js";const h=({className:o})=>r("svg",{xmlns:"http://www.w3.org/2000/svg",className:o,width:"17",height:"15",viewBox:"0 0 17 15",fill:"none",children:[e("path",{d:"M12.0945 0C12.6087 0 13.09 0.26113 13.3797 0.698242L16.3963 5.25195C16.8137 5.88217 16.7407 6.72832 16.2225 7.27344L9.91291 13.9062C9.05444 14.8082 7.64375 14.809 6.784 13.9082L0.445134 7.26758C-0.0683205 6.72952 -0.146289 5.89553 0.256657 5.26562L3.16388 0.719727C3.4516 0.270119 3.94061 0 4.46369 0H12.0945ZM12.5037 5.31738C12.2188 5.0332 11.7569 5.03363 11.4725 5.31836L8.34748 8.44727L5.21174 5.31738C4.92672 5.03315 4.46491 5.03346 4.18049 5.31836C3.89625 5.60337 3.89754 6.06518 4.18244 6.34961L7.80842 9.96973C8.10764 10.2681 8.59181 10.2677 8.89045 9.96875L12.5047 6.34863C12.7889 6.06369 12.7884 5.60183 12.5037 5.31738Z",fill:"url(#paint0_linear_6135_9275)"}),e("defs",{children:r("linearGradient",{id:"paint0_linear_6135_9275",x1:"-1.69612e-07",y1:"-5.81363e-06",x2:"12.6513",y2:"8.69315",gradientUnits:"userSpaceOnUse",children:[e("stop",{stopColor:"#F1EADB"}),e("stop",{offset:"1",stopColor:"#D9A66A"})]})})]}),x=v.forwardRef(({title:o,perks:f,copy:s,className:m,classNames:i={},...g},b)=>{const u=s?.addButton??d.addButton,l=s?.learnMoreButton??d.learnMoreButton;return r("div",{ref:b,className:a("flex flex-col gap-4",m,i.root),...g,children:[o&&e(c,{size:2,className:a("text-info-primary font-bold",i.title),children:o}),f.map(t=>r("div",{className:a("cart-perks-section-item bg-container-secondary rounded-box tablet:p-8 flex flex-col gap-2 p-2",i.item),children:[r("div",{className:"tablet:p-0 tablet:items-center tablet:gap-4 flex w-full gap-2 p-2",children:[e("div",{className:a("cart-perks-section-image shrink-0",i.image),children:e(C,{source:t.image.src,alt:t.image.alt??"",className:"h-15 tablet:w-[232px] tablet:h-[176px] w-20 ",imgClassName:"object-contain h-full"})}),r("div",{className:a("cart-perks-section-content tablet:flex-row flex flex-1 flex-col gap-4",i.content),children:[r("div",{className:a("cart-perks-section-info tablet:flex-[2] tablet:gap-2 flex flex-1 flex-col justify-start",i.info),children:[e(c,{size:2,className:a("cart-perks-section-name text-info-primary font-bold",i.name),html:t.title}),e(n,{className:a("cart-perks-section-description tablet:text-base text-info-tertiary text-sm leading-normal",i.description),html:t.description}),t?.learnMoreLink&&l&&e(p,{href:t.learnMoreLink,children:e("div",{className:a("tablet:flex tablet:w-max text-brand-0 tablet:justify-start tablet:text-base hidden p-0 text-sm font-bold",i.learnMore),children:l})})]}),t.quantity&&r(n,{className:a("cart-perks-section-quantity tablet:block tablet:text-base text-info-primary hidden text-sm font-bold",i.quantity),children:["X",t.quantity]}),r("div",{className:a("cart-perks-section-price-wrap tablet:flex-1 tablet:items-end flex flex-col items-start gap-2",i.priceWrap),children:[r("div",{className:a("cart-perks-section-price-row tablet:w-auto flex w-full items-center justify-between",i.priceRow),children:[r("div",{className:"flex items-center gap-1",children:[e(n,{className:a("cart-perks-section-price text-info-primary tablet:text-2xl text-xl font-bold",i.price),html:t.price}),t.originalPrice&&e(n,{className:a("cart-perks-section-original-price tablet:text-2xl text-info-tertiary text-xl font-bold line-through",i.originalPrice),html:t.originalPrice})]}),t.quantity&&r(n,{className:a("cart-perks-section-quantity tablet:hidden tablet:text-base text-info-primary text-sm font-bold",i.quantity),children:["X",t.quantity]})]}),t.onAdd&&e(y,{variant:"link",type:"button",onClick:t.onAdd,className:a("cart-perks-section-action tablet:text-base text-brand-0 !p-0",i.action),children:u})]})]})]}),t?.learnMoreLink&&l&&r(p,{href:t.learnMoreLink,className:a("rounded-box-small tablet:hidden tablet:text-base flex items-center bg-white px-4 py-3 text-sm font-bold",i.learnMore),children:[r("div",{className:"flex flex-1 items-center gap-1",children:[e(h,{className:"size-5"}),e(n,{className:"cart-perks-section-learn-more text-info-tertiary",children:l})]}),e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:e("path",{d:"M5.52864 3.52827C5.78899 3.26792 6.211 3.26792 6.47134 3.52827L10.4713 7.52827C10.7317 7.78862 10.7317 8.21063 10.4713 8.47098L6.47134 12.471C6.211 12.7313 5.78899 12.7313 5.52864 12.471C5.26829 12.2106 5.26829 11.7886 5.52864 11.5283L9.05728 7.99962L5.52864 4.47098C5.26829 4.21063 5.26829 3.78862 5.52864 3.52827Z",fill:"#4A4C56"})})]})]},t.sku))]})});x.displayName="CartPerksSection";var M=x;export{M as default};
|
|
2
2
|
//# sourceMappingURL=CartPerksSection.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/CartDetail/CartPerksSection/CartPerksSection.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Heading, Picture, Text } from '../../../components/index.js'\nimport type { CartPerksSectionCopy } from '../types.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport { LocalizedLink } from '../../../shared/LocalizedLink.js'\n\nconst LearnMoreIcon = ({ className }: { className?: string }) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n width=\"17\"\n height=\"15\"\n viewBox=\"0 0 17 15\"\n fill=\"none\"\n >\n <path\n d=\"M12.0945 0C12.6087 0 13.09 0.26113 13.3797 0.698242L16.3963 5.25195C16.8137 5.88217 16.7407 6.72832 16.2225 7.27344L9.91291 13.9062C9.05444 14.8082 7.64375 14.809 6.784 13.9082L0.445134 7.26758C-0.0683205 6.72952 -0.146289 5.89553 0.256657 5.26562L3.16388 0.719727C3.4516 0.270119 3.94061 0 4.46369 0H12.0945ZM12.5037 5.31738C12.2188 5.0332 11.7569 5.03363 11.4725 5.31836L8.34748 8.44727L5.21174 5.31738C4.92672 5.03315 4.46491 5.03346 4.18049 5.31836C3.89625 5.60337 3.89754 6.06518 4.18244 6.34961L7.80842 9.96973C8.10764 10.2681 8.59181 10.2677 8.89045 9.96875L12.5047 6.34863C12.7889 6.06369 12.7884 5.60183 12.5037 5.31738Z\"\n fill=\"url(#paint0_linear_6135_9275)\"\n />\n <defs>\n <linearGradient\n id=\"paint0_linear_6135_9275\"\n x1=\"-1.69612e-07\"\n y1=\"-5.81363e-06\"\n x2=\"12.6513\"\n y2=\"8.69315\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stopColor=\"#F1EADB\" />\n <stop offset=\"1\" stopColor=\"#D9A66A\" />\n </linearGradient>\n </defs>\n </svg>\n )\n}\n\nexport interface CartPerk {\n /** \u5546\u54C1\u552F\u4E00\u6807\u8BC6\uFF08SKU\uFF09 */\n sku: string\n /** \u5546\u54C1\u56FE\u7247 */\n image: { src: string; alt?: string }\n /** \u5546\u54C1\u6807\u9898 */\n title: string\n /** \u5546\u54C1\u63CF\u8FF0 */\n description: string\n /** \u5F53\u524D\u4EF7\u683C */\n price: string\n /** \u539F\u4EF7\uFF08\u5C55\u793A\u5220\u9664\u7EBF\uFF09 */\n originalPrice?: string\n /** \u6570\u91CF\u6587\u6848 */\n quantity?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u6848 */\n learnMoreText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u94FE\u63A5 */\n learnMoreLink?: string\n /** \u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAdd?: () => void\n // /** \u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n // onLearnMore?: () => void\n}\n\nexport interface CartPerksSectionProps {\n title?: string\n perks: CartPerk[]\n copy?: CartPerksSectionCopy\n className?: string\n classNames?: Partial<\n Record<\n | 'root'\n | 'title'\n | 'item'\n | 'image'\n | 'content'\n | 'info'\n | 'name'\n | 'description'\n | 'priceWrap'\n | 'priceRow'\n | 'price'\n | 'originalPrice'\n | 'quantity'\n | 'action'\n | 'learnMore',\n string\n >\n >\n}\n\nconst CartPerksSection = React.forwardRef<HTMLDivElement, CartPerksSectionProps>(\n ({ title, perks, copy, className, classNames = {}, ...props }, ref) => {\n const addText = copy?.addButton ?? DEFAULT_CART_COPY.addButton\n const learnMoreText = copy?.learnMoreButton ?? DEFAULT_CART_COPY.learnMoreButton\n return (\n <div ref={ref} className={cn('flex flex-col gap-4', className, classNames.root)} {...props}>\n {title && (\n <Heading size={2} className={cn('text-info-primary font-bold', classNames.title)}>\n {title}\n </Heading>\n )}\n {perks.map(perk => (\n <div\n key={perk.sku}\n className={cn(\n 'cart-perks-section-item bg-container-secondary rounded-box tablet:p-8 flex flex-col gap-2 p-2',\n classNames.item\n )}\n >\n <div className=\"tablet:p-0 tablet:items-center tablet:gap-4 flex w-full gap-2 p-2\">\n {/* \u589E\u503C\u670D\u52A1\u4E3B\u56FE */}\n <div className={cn('cart-perks-section-image shrink-0', classNames.image)}>\n <Picture\n source={perk.image.src}\n alt={perk.image.alt ?? ''}\n className=\"h-15 tablet:w-[232px] tablet:h-[176px] w-20 \"\n imgClassName=\"object-contain\"\n />\n </div>\n {/* \u589E\u503C\u670D\u52A1\u5185\u5BB9 */}\n <div\n className={cn(\n 'cart-perks-section-content tablet:flex-row flex flex-1 flex-col gap-4',\n classNames.content\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u6807\u9898\u53CA\u63CF\u8FF0 */}\n <div\n className={cn(\n 'cart-perks-section-info tablet:flex-[2] tablet:gap-2 flex flex-1 flex-col justify-start',\n classNames.info\n )}\n >\n <Heading\n size={2}\n className={cn('cart-perks-section-name text-info-primary font-bold', classNames.name)}\n html={perk.title}\n />\n <Text\n className={cn(\n 'cart-perks-section-description tablet:text-base text-info-tertiary text-sm leading-normal',\n classNames.description\n )}\n html={perk.description}\n />\n {perk?.learnMoreLink && (\n <LocalizedLink href={perk.learnMoreLink}>\n <div\n className={cn(\n 'tablet:flex tablet:w-max text-brand-0 tablet:justify-start tablet:text-base hidden p-0 text-sm font-bold',\n classNames.learnMore\n )}\n >\n {perk.learnMoreText ?? learnMoreText}\n </div>\n </LocalizedLink>\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:block tablet:text-base text-info-primary hidden text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n <div\n className={cn(\n 'cart-perks-section-price-wrap tablet:flex-1 tablet:items-end flex flex-col items-start gap-2',\n classNames.priceWrap\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u4EF7\u683C */}\n <div\n className={cn(\n 'cart-perks-section-price-row tablet:w-auto flex w-full items-center justify-between',\n classNames.priceRow\n )}\n >\n <div className=\"flex items-center gap-1\">\n <Text\n className={cn(\n 'cart-perks-section-price text-info-primary tablet:text-2xl text-xl font-bold',\n classNames.price\n )}\n html={perk.price}\n />\n {perk.originalPrice && (\n <Text\n className={cn(\n 'cart-perks-section-original-price tablet:text-2xl text-info-tertiary text-xl font-bold line-through',\n classNames.originalPrice\n )}\n html={perk.originalPrice}\n />\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:hidden tablet:text-base text-info-primary text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n </div>\n {/* \u589E\u503C\u670D\u52A1\u6309\u94AE */}\n {perk.onAdd && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={perk.onAdd}\n className={cn('cart-perks-section-action tablet:text-base text-brand-0 p-0', classNames.action)}\n >\n {addText}\n </Button>\n )}\n </div>\n </div>\n </div>\n\n {perk.learnMoreLink && (\n <LocalizedLink\n href={perk.learnMoreLink}\n className={cn(\n 'rounded-box-small tablet:hidden tablet:text-base flex items-center bg-white px-4 py-3 text-sm font-bold',\n classNames.learnMore\n )}\n >\n <div className=\"flex flex-1 items-center gap-1\">\n <LearnMoreIcon className=\"size-5\" />\n <Text className=\"cart-perks-section-learn-more text-info-tertiary\">\n {perk.learnMoreText ?? learnMoreText}\n </Text>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52864 3.52827C5.78899 3.26792 6.211 3.26792 6.47134 3.52827L10.4713 7.52827C10.7317 7.78862 10.7317 8.21063 10.4713 8.47098L6.47134 12.471C6.211 12.7313 5.78899 12.7313 5.52864 12.471C5.26829 12.2106 5.26829 11.7886 5.52864 11.5283L9.05728 7.99962L5.52864 4.47098C5.26829 4.21063 5.26829 3.78862 5.52864 3.52827Z\"\n fill=\"#4A4C56\"\n />\n </svg>\n </LocalizedLink>\n )}\n </div>\n ))}\n </div>\n )\n }\n)\n\nCartPerksSection.displayName = 'CartPerksSection'\n\nexport default CartPerksSection\n"],
|
|
5
|
-
"mappings": "aAmBM,cAAAA,EAKE,QAAAC,MALF,oBAjBN,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,4BACnB,OAAS,UAAAC,EAAQ,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,+BAE/C,OAAS,qBAAAC,MAAyB,cAClC,OAAS,iBAAAC,MAAqB,mCAE9B,MAAMC,EAAgB,CAAC,CAAE,UAAAC,CAAU,IAE/BV,EAAC,OACC,MAAM,6BACN,UAAWU,EACX,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,UAAAX,EAAC,QACC,EAAE,wnBACF,KAAK,gCACP,EACAA,EAAC,QACC,SAAAC,EAAC,kBACC,GAAG,0BACH,GAAG,eACH,GAAG,eACH,GAAG,UACH,GAAG,UACH,cAAc,iBAEd,UAAAD,EAAC,QAAK,UAAU,UAAU,EAC1BA,EAAC,QAAK,OAAO,IAAI,UAAU,UAAU,GACvC,EACF,GACF,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Heading, Picture, Text } from '../../../components/index.js'\nimport type { CartPerksSectionCopy } from '../types.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport { LocalizedLink } from '../../../shared/LocalizedLink.js'\n\nconst LearnMoreIcon = ({ className }: { className?: string }) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n width=\"17\"\n height=\"15\"\n viewBox=\"0 0 17 15\"\n fill=\"none\"\n >\n <path\n d=\"M12.0945 0C12.6087 0 13.09 0.26113 13.3797 0.698242L16.3963 5.25195C16.8137 5.88217 16.7407 6.72832 16.2225 7.27344L9.91291 13.9062C9.05444 14.8082 7.64375 14.809 6.784 13.9082L0.445134 7.26758C-0.0683205 6.72952 -0.146289 5.89553 0.256657 5.26562L3.16388 0.719727C3.4516 0.270119 3.94061 0 4.46369 0H12.0945ZM12.5037 5.31738C12.2188 5.0332 11.7569 5.03363 11.4725 5.31836L8.34748 8.44727L5.21174 5.31738C4.92672 5.03315 4.46491 5.03346 4.18049 5.31836C3.89625 5.60337 3.89754 6.06518 4.18244 6.34961L7.80842 9.96973C8.10764 10.2681 8.59181 10.2677 8.89045 9.96875L12.5047 6.34863C12.7889 6.06369 12.7884 5.60183 12.5037 5.31738Z\"\n fill=\"url(#paint0_linear_6135_9275)\"\n />\n <defs>\n <linearGradient\n id=\"paint0_linear_6135_9275\"\n x1=\"-1.69612e-07\"\n y1=\"-5.81363e-06\"\n x2=\"12.6513\"\n y2=\"8.69315\"\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stopColor=\"#F1EADB\" />\n <stop offset=\"1\" stopColor=\"#D9A66A\" />\n </linearGradient>\n </defs>\n </svg>\n )\n}\n\nexport interface CartPerk {\n /** \u5546\u54C1\u552F\u4E00\u6807\u8BC6\uFF08SKU\uFF09 */\n sku: string\n /** \u5546\u54C1\u56FE\u7247 */\n image: { src: string; alt?: string }\n /** \u5546\u54C1\u6807\u9898 */\n title: string\n /** \u5546\u54C1\u63CF\u8FF0 */\n description: string\n /** \u5F53\u524D\u4EF7\u683C */\n price: string\n /** \u539F\u4EF7\uFF08\u5C55\u793A\u5220\u9664\u7EBF\uFF09 */\n originalPrice?: string\n /** \u6570\u91CF\u6587\u6848 */\n quantity?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u94FE\u63A5 */\n learnMoreLink?: string\n /** \u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAdd?: () => void\n // /** \u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n // onLearnMore?: () => void\n}\n\nexport interface CartPerksSectionProps {\n title?: string\n perks: CartPerk[]\n copy?: CartPerksSectionCopy\n className?: string\n classNames?: Partial<\n Record<\n | 'root'\n | 'title'\n | 'item'\n | 'image'\n | 'content'\n | 'info'\n | 'name'\n | 'description'\n | 'priceWrap'\n | 'priceRow'\n | 'price'\n | 'originalPrice'\n | 'quantity'\n | 'action'\n | 'learnMore',\n string\n >\n >\n}\n\nconst CartPerksSection = React.forwardRef<HTMLDivElement, CartPerksSectionProps>(\n ({ title, perks, copy, className, classNames = {}, ...props }, ref) => {\n const addText = copy?.addButton ?? DEFAULT_CART_COPY.addButton\n const learnMoreText = copy?.learnMoreButton ?? DEFAULT_CART_COPY.learnMoreButton\n return (\n <div ref={ref} className={cn('flex flex-col gap-4', className, classNames.root)} {...props}>\n {title && (\n <Heading size={2} className={cn('text-info-primary font-bold', classNames.title)}>\n {title}\n </Heading>\n )}\n {perks.map(perk => (\n <div\n key={perk.sku}\n className={cn(\n 'cart-perks-section-item bg-container-secondary rounded-box tablet:p-8 flex flex-col gap-2 p-2',\n classNames.item\n )}\n >\n <div className=\"tablet:p-0 tablet:items-center tablet:gap-4 flex w-full gap-2 p-2\">\n {/* \u589E\u503C\u670D\u52A1\u4E3B\u56FE */}\n <div className={cn('cart-perks-section-image shrink-0', classNames.image)}>\n <Picture\n source={perk.image.src}\n alt={perk.image.alt ?? ''}\n className=\"h-15 tablet:w-[232px] tablet:h-[176px] w-20 \"\n imgClassName=\"object-contain h-full\"\n />\n </div>\n {/* \u589E\u503C\u670D\u52A1\u5185\u5BB9 */}\n <div\n className={cn(\n 'cart-perks-section-content tablet:flex-row flex flex-1 flex-col gap-4',\n classNames.content\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u6807\u9898\u53CA\u63CF\u8FF0 */}\n <div\n className={cn(\n 'cart-perks-section-info tablet:flex-[2] tablet:gap-2 flex flex-1 flex-col justify-start',\n classNames.info\n )}\n >\n <Heading\n size={2}\n className={cn('cart-perks-section-name text-info-primary font-bold', classNames.name)}\n html={perk.title}\n />\n <Text\n className={cn(\n 'cart-perks-section-description tablet:text-base text-info-tertiary text-sm leading-normal',\n classNames.description\n )}\n html={perk.description}\n />\n {perk?.learnMoreLink && learnMoreText && (\n <LocalizedLink href={perk.learnMoreLink}>\n <div\n className={cn(\n 'tablet:flex tablet:w-max text-brand-0 tablet:justify-start tablet:text-base hidden p-0 text-sm font-bold',\n classNames.learnMore\n )}\n >\n {learnMoreText}\n </div>\n </LocalizedLink>\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:block tablet:text-base text-info-primary hidden text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n <div\n className={cn(\n 'cart-perks-section-price-wrap tablet:flex-1 tablet:items-end flex flex-col items-start gap-2',\n classNames.priceWrap\n )}\n >\n {/* \u589E\u503C\u670D\u52A1\u4EF7\u683C */}\n <div\n className={cn(\n 'cart-perks-section-price-row tablet:w-auto flex w-full items-center justify-between',\n classNames.priceRow\n )}\n >\n <div className=\"flex items-center gap-1\">\n <Text\n className={cn(\n 'cart-perks-section-price text-info-primary tablet:text-2xl text-xl font-bold',\n classNames.price\n )}\n html={perk.price}\n />\n {perk.originalPrice && (\n <Text\n className={cn(\n 'cart-perks-section-original-price tablet:text-2xl text-info-tertiary text-xl font-bold line-through',\n classNames.originalPrice\n )}\n html={perk.originalPrice}\n />\n )}\n </div>\n {perk.quantity && (\n <Text\n className={cn(\n 'cart-perks-section-quantity tablet:hidden tablet:text-base text-info-primary text-sm font-bold',\n classNames.quantity\n )}\n >\n X{perk.quantity}\n </Text>\n )}\n </div>\n {/* \u589E\u503C\u670D\u52A1\u6309\u94AE */}\n {perk.onAdd && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={perk.onAdd}\n className={cn('cart-perks-section-action tablet:text-base text-brand-0 !p-0', classNames.action)}\n >\n {addText}\n </Button>\n )}\n </div>\n </div>\n </div>\n\n {perk?.learnMoreLink && learnMoreText && (\n <LocalizedLink\n href={perk.learnMoreLink}\n className={cn(\n 'rounded-box-small tablet:hidden tablet:text-base flex items-center bg-white px-4 py-3 text-sm font-bold',\n classNames.learnMore\n )}\n >\n <div className=\"flex flex-1 items-center gap-1\">\n <LearnMoreIcon className=\"size-5\" />\n <Text className=\"cart-perks-section-learn-more text-info-tertiary\">{learnMoreText}</Text>\n </div>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52864 3.52827C5.78899 3.26792 6.211 3.26792 6.47134 3.52827L10.4713 7.52827C10.7317 7.78862 10.7317 8.21063 10.4713 8.47098L6.47134 12.471C6.211 12.7313 5.78899 12.7313 5.52864 12.471C5.26829 12.2106 5.26829 11.7886 5.52864 11.5283L9.05728 7.99962L5.52864 4.47098C5.26829 4.21063 5.26829 3.78862 5.52864 3.52827Z\"\n fill=\"#4A4C56\"\n />\n </svg>\n </LocalizedLink>\n )}\n </div>\n ))}\n </div>\n )\n }\n)\n\nCartPerksSection.displayName = 'CartPerksSection'\n\nexport default CartPerksSection\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "cn", "Button", "Heading", "Picture", "Text", "DEFAULT_CART_COPY", "LocalizedLink", "LearnMoreIcon", "className", "CartPerksSection", "title", "perks", "copy", "classNames", "props", "ref", "addText", "learnMoreText", "perk", "CartPerksSection_default"]
|
|
7
7
|
}
|
|
@@ -11,6 +11,8 @@ export interface CartPriceSummaryProps {
|
|
|
11
11
|
appliedCoupons?: string[];
|
|
12
12
|
/** 移除折扣码回调,参数为折扣码 */
|
|
13
13
|
onCouponRemove?: (code: string) => void;
|
|
14
|
+
/** 折扣码应用按钮 loading 状态 */
|
|
15
|
+
couponLoading?: boolean;
|
|
14
16
|
/** 小计金额(格式化字符串,含货币符号) */
|
|
15
17
|
subtotal?: string;
|
|
16
18
|
/** 运费文案 */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import*as
|
|
1
|
+
"use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import*as N from"react";import{cn as a}from"../../../helpers/index.js";import{Button as C,Input as M,InputSlot as A}from"../../../components/index.js";import{DEFAULT_CART_COPY as D}from"../index.js";const E=({className:o})=>t("svg",{xmlns:"http://www.w3.org/2000/svg",className:a("shrink-0",o),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:t("path",{fill:"currentColor",d:"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z"})}),O=({className:o})=>n("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:a("shrink-0",o),children:[t("circle",{cx:"10",cy:"10",r:"7.5",stroke:"currentColor",strokeWidth:"1.5"}),t("path",{d:"M7 7L13 13M13 7L7 13",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),x=({className:o})=>n("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:a("shrink-0",o),children:[t("circle",{cx:"10",cy:"10",r:"7.5",stroke:"currentColor",strokeWidth:"1.5"}),t("path",{d:"M10 9V14M10 6V6.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),L=N.forwardRef(({couponInputValue:o,onCouponInputChange:f,onCouponApply:b,appliedCoupons:s,onCouponRemove:T,couponLoading:z=!1,subtotal:g,shipping:w,taxes:y,productDiscount:p,orderDiscount:d,discountTotal:l,total:c,onCheckout:v,showCashReduction:h,showInstallment:k,installmentIcons:u,copy:V,className:j,classNames:e={},...P},S)=>{const i={...D,...V},R=f!==void 0||b!==void 0||s&&s.length>0,[m,B]=N.useState(!1),I=p!==void 0||d!==void 0;return t("div",{ref:S,className:a("cart-price-summary-root","tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ","",j,e.root),...P,children:n("div",{className:"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end tablet:p-0 flex flex-col gap-2 p-4",children:[R&&n("button",{type:"button",className:a("cart-price-summary-coupon-toggle","group flex w-full cursor-pointer items-center justify-between",e.couponToggle),onClick:()=>B(r=>!r),children:[t("span",{className:"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.couponTitle||"Have a discount code?"}),n("span",{className:a("cart-price-summary-coupon-link","text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]",e.couponLink),children:[i.couponLink||"Apply/Check",t(E,{className:a("text-brand-primary tablet:size-5 size-4 transition-transform duration-200",m&&"rotate-180")})]})]}),m&&n("div",{className:"tablet:max-w-[404px] flex flex-col items-end gap-2",children:[t(M,{size:"lg",type:"text",value:o,onChange:r=>f?.(r.target.value),placeholder:i.couponPlaceholder||"Enter Code",className:a("cart-price-summary-coupon-input","border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent",e.couponInput),inputClassName:"text-sm tablet:text-base font-bold w-[315px]",children:t(A,{children:t("div",{className:"border-lines-primary flex items-center border-l pl-2 pr-4",children:t(C,{variant:"ghost",size:"lg",loading:z,className:"hover:!text-info-primary text-info-primary tablet:text-base cursor-pointer !p-0 text-sm font-bold leading-[1.4] tracking-[-0.02em] underline hover:!bg-transparent",onClick:()=>b?.(o||""),children:i.couponApply||"Apply"})})})}),s&&s.length>0&&t("div",{className:a("cart-price-summary-coupon-tags","tablet:gap-2 flex flex-wrap gap-1",e.couponTags),children:s.map(r=>n("span",{className:a("cart-price-summary-coupon-tag","bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1",e.couponTag),children:[t("span",{className:a("cart-price-summary-coupon-tag-text","text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.couponTagText),children:r}),t("button",{type:"button",className:a("cart-price-summary-coupon-tag-remove","text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center",e.couponTagRemove),onClick:()=>T?.(r),children:t(O,{})})]},r))})]}),n("div",{className:a("tablet:gap-4 flex w-full flex-col gap-2",!m&&R&&"tablet:flex hidden"),children:[g!==void 0&&n("div",{className:a("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[t("span",{className:e.priceRowLabel,children:i.subtotalLabel||"Subtotal:"}),t("span",{className:e.priceRowValue,children:g})]}),w!==void 0&&n("div",{className:a("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[t("span",{className:e.priceRowLabel,children:i.shippingLabel||"Shipping:"}),t("span",{className:e.priceRowValue,children:w})]}),y!==void 0&&n("div",{className:a("cart-price-summary-price-row","text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.priceRow),children:[t("span",{className:e.priceRowLabel,children:i.taxesLabel||"Taxes:"}),t("span",{className:e.priceRowValue,children:y})]}),I&&n("div",{className:a("cart-price-summary-discount-box","bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2",e.discountBox),children:[p!==void 0&&n("div",{className:a("cart-price-summary-discount-row","text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.discountRow),children:[t("span",{className:e.priceRowLabel,children:i.productDiscountsLabel||"Product discounts:"}),t("span",{className:a("text-marketing-1",e.discountRowValue),children:p})]}),d!==void 0&&n("div",{className:a("cart-price-summary-discount-row","text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",e.discountRow),children:[t("span",{className:e.priceRowLabel,children:i.orderDiscountLabel||"Order discount:"}),t("span",{className:a("text-marketing-1",e.discountRowValue),children:d})]})]})]}),(l!==void 0||c!==void 0)&&n("div",{className:"flex w-full flex-col gap-4",children:[l!==void 0&&n("div",{className:a("cart-price-summary-discount-total-row","flex w-full items-center justify-between whitespace-nowrap",e.discountTotalRow),children:[t("span",{className:"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.discountTotalLabel||"Discount total:"}),t("span",{className:a("cart-price-summary-discount-total-value","text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]",e.discountTotalValue),children:l})]}),l!==void 0&&c!==void 0&&t("div",{className:a("cart-price-summary-divider","border-lines-primary w-full border-t",e.divider)}),c!==void 0&&n("div",{className:a("cart-price-summary-total-row","flex w-full items-center justify-between whitespace-nowrap",e.totalRow),children:[t("span",{className:"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]",children:i.totalLabel||"Total:"}),t("span",{className:a("cart-price-summary-total-value","text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]",e.totalValue),children:c})]})]}),h&&i.cashReductionText&&n("div",{className:a("cart-price-summary-cash-reduction-mobile","tablet:hidden flex items-start gap-1",e.cashReduction),children:[t("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.cashReductionText}),t(x,{className:"text-info-quaternary tablet:size-5 size-4"})]}),n("div",{className:a("tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4",!k&&"justify-end"),children:[v&&t(C,{variant:"primary",size:"lg",className:a("cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0",e.checkoutButton),onClick:v,children:i.checkOut||"Check Out"}),h&&i.cashReductionText&&n("div",{className:a("cart-price-summary-cash-reduction","tablet:flex hidden items-start gap-1",e.cashReduction),children:[t("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.cashReductionText}),t(x,{className:"text-info-quaternary tablet:size-5 size-4"})]}),k&&i.installmentText&&n("div",{className:a("cart-price-summary-installment","tablet:flex-row order-1 flex flex-col items-start gap-0.5",e.installment),children:[u&&u.length>0&&t("span",{className:"flex shrink-0 items-center",children:u.map((r,q)=>t("img",{src:r.src,alt:r.alt||"",className:"tablet:size-5 -mr-1 size-4 object-cover"},q))}),n("div",{className:"flex gap-1",children:[t("span",{className:"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]",children:i.installmentText}),t(x,{className:"text-info-quaternary tablet:size-5 size-4"})]})]})]})]})})});L.displayName="CartPriceSummary";var F=L;export{F as default};
|
|
2
2
|
//# sourceMappingURL=CartPriceSummary.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/biz-components/CartDetail/CartPriceSummary/CartPriceSummary.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Input, InputSlot } from '../../../components/index.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport type { CartPriceSummaryCopy } from '../types.js'\n\n// \u2500\u2500 Icon: Chevron right \u2500\u2500\nconst DownIcon = ({ className }: { className?: string }) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill=\"currentColor\"\n d=\"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z\"\n />\n </svg>\n)\n\n// \u2500\u2500 Icon: Close (used in coupon tag remove button) \u2500\u2500\nconst CloseIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\n// \u2500\u2500 Icon: Info \u2500\u2500\nconst InfoIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M10 9V14M10 6V6.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\nexport interface CartPriceSummaryProps {\n /** \u6298\u6263\u7801\u8F93\u5165\u6846\u7684\u503C */\n couponInputValue?: string\n /** \u6298\u6263\u7801\u8F93\u5165\u53D8\u5316\u56DE\u8C03 */\n onCouponInputChange?: (value: string) => void\n /** \u70B9\u51FB\u5E94\u7528\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u8F93\u5165\u6846\u4E2D\u7684\u6298\u6263\u7801 */\n onCouponApply?: (code: string) => void\n /** \u5DF2\u5E94\u7528\u7684\u6298\u6263\u7801\u5217\u8868 */\n appliedCoupons?: string[]\n /** \u79FB\u9664\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u6298\u6263\u7801 */\n onCouponRemove?: (code: string) => void\n\n /** \u5C0F\u8BA1\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n subtotal?: string\n /** \u8FD0\u8D39\u6587\u6848 */\n shipping?: string\n /** \u7A0E\u8D39\u6587\u6848 */\n taxes?: string\n\n /** \u4EA7\u54C1\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n productDiscount?: string\n /** \u8BA2\u5355\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n orderDiscount?: string\n\n /** \u6298\u6263\u603B\u8BA1\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n discountTotal?: string\n /** \u6700\u7EC8\u603B\u4EF7\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n total?: string\n\n /** \u7ED3\u8D26\u6309\u94AE\u70B9\u51FB\u56DE\u8C03 */\n onCheckout?: () => void\n\n /** \u662F\u5426\u663E\u793A\u73B0\u91D1\u51CF\u514D\u63D0\u793A */\n showCashReduction?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */\n showInstallment?: boolean\n /** \u5206\u671F\u4ED8\u6B3E\u652F\u4ED8\u65B9\u5F0F\u56FE\u6807\u5217\u8868 */\n installmentIcons?: { src: string; alt?: string }[]\n\n /** \u6587\u6848\u8986\u76D6\uFF0C\u7528\u4E8E\u56FD\u9645\u5316 */\n copy?: CartPriceSummaryCopy\n /** \u6839\u5BB9\u5668 className */\n className?: string\n /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n classNames?: Partial<\n Record<\n | 'root'\n | 'couponToggle'\n | 'couponLink'\n | 'couponInput'\n | 'couponTags'\n | 'couponTag'\n | 'couponTagText'\n | 'couponTagRemove'\n | 'priceRow'\n | 'priceRowLabel'\n | 'priceRowValue'\n | 'discountBox'\n | 'discountRow'\n | 'discountRowValue'\n | 'discountTotalRow'\n | 'discountTotalValue'\n | 'divider'\n | 'totalRow'\n | 'totalValue'\n | 'checkoutButton'\n | 'cashReduction'\n | 'installment',\n string\n >\n >\n}\n\nconst CartPriceSummary = React.forwardRef<HTMLDivElement, CartPriceSummaryProps>(\n (\n {\n couponInputValue,\n onCouponInputChange,\n onCouponApply,\n appliedCoupons,\n onCouponRemove,\n\n subtotal,\n shipping,\n taxes,\n\n productDiscount,\n orderDiscount,\n\n discountTotal,\n total,\n\n onCheckout,\n\n showCashReduction,\n showInstallment,\n installmentIcons,\n\n copy,\n className,\n classNames = {},\n ...props\n },\n ref\n ) => {\n const c = { ...DEFAULT_CART_COPY, ...copy }\n\n const hasCouponSection =\n onCouponInputChange !== undefined || onCouponApply !== undefined || (appliedCoupons && appliedCoupons.length > 0)\n\n const [couponExpanded, setCouponExpanded] = React.useState(false)\n\n const hasDiscounts = productDiscount !== undefined || orderDiscount !== undefined\n\n return (\n <div\n ref={ref}\n className={cn(\n 'cart-price-summary-root',\n 'tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ',\n '',\n className,\n classNames.root\n )}\n {...props}\n >\n <div className=\"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end flex flex-col gap-2 p-4\">\n {/* \u6298\u6263\u7801\u5165\u53E3 */}\n {hasCouponSection && (\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-toggle',\n 'group flex w-full cursor-pointer items-center justify-between',\n classNames.couponToggle\n )}\n onClick={() => setCouponExpanded(prev => !prev)}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.couponTitle || 'Have a discount code?'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-coupon-link',\n 'text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.couponLink\n )}\n >\n {c.couponLink || 'Apply/Check'}\n <DownIcon\n className={cn(\n 'text-brand-primary tablet:size-5 size-4 transition-transform duration-200',\n couponExpanded && 'rotate-180'\n )}\n />\n </span>\n </button>\n )}\n\n {/* \u6298\u6263\u7801\u8F93\u5165\u4E0E\u6807\u7B7E */}\n {couponExpanded && (\n <div className=\"flex flex-col items-end gap-2\">\n {/* \u8F93\u5165\u6846 + \u5E94\u7528\u6309\u94AE */}\n <Input\n size=\"lg\"\n type=\"text\"\n value={couponInputValue}\n onChange={e => onCouponInputChange?.(e.target.value)}\n placeholder={c.couponPlaceholder || 'Enter Code'}\n className={cn(\n 'cart-price-summary-coupon-input',\n 'border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent',\n classNames.couponInput\n )}\n inputClassName=\"text-sm tablet:text-base font-bold w-[315px]\"\n >\n <InputSlot>\n <div className=\"border-lines-primary flex items-center border-l pl-2 pr-4\">\n <button\n type=\"button\"\n className=\"text-info-primary tablet:text-base cursor-pointer text-sm font-bold leading-[1.4] tracking-[-0.02em] underline\"\n onClick={() => onCouponApply?.(couponInputValue || '')}\n >\n {c.couponApply || 'Apply'}\n </button>\n </div>\n </InputSlot>\n </Input>\n\n {/* \u5DF2\u5E94\u7528\u6298\u6263\u7801\u6807\u7B7E */}\n {appliedCoupons && appliedCoupons.length > 0 && (\n <div\n className={cn(\n 'cart-price-summary-coupon-tags',\n 'tablet:gap-2 flex flex-wrap gap-1',\n classNames.couponTags\n )}\n >\n {appliedCoupons.map(code => (\n <span\n key={code}\n className={cn(\n 'cart-price-summary-coupon-tag',\n 'bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1',\n classNames.couponTag\n )}\n >\n <span\n className={cn(\n 'cart-price-summary-coupon-tag-text',\n 'text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.couponTagText\n )}\n >\n {code}\n </span>\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-tag-remove',\n 'text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center',\n classNames.couponTagRemove\n )}\n onClick={() => onCouponRemove?.(code)}\n >\n <CloseIcon />\n </button>\n </span>\n ))}\n </div>\n )}\n </div>\n )}\n\n {/* \u5C0F\u8BA1 */}\n {subtotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.subtotalLabel || 'Subtotal:'}</span>\n <span className={classNames.priceRowValue}>{subtotal}</span>\n </div>\n )}\n\n {/* \u8FD0\u8D39 */}\n {shipping !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.shippingLabel || 'Shipping:'}</span>\n <span className={classNames.priceRowValue}>{shipping}</span>\n </div>\n )}\n\n {/* \u7A0E\u8D39 */}\n {taxes !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.taxesLabel || 'Taxes:'}</span>\n <span className={classNames.priceRowValue}>{taxes}</span>\n </div>\n )}\n\n {/* \u6298\u6263\u6C47\u603B */}\n {hasDiscounts && (\n <div\n className={cn(\n 'cart-price-summary-discount-box',\n 'bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2',\n classNames.discountBox\n )}\n >\n {productDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.productDiscountsLabel || 'Product discounts:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{productDiscount}</span>\n </div>\n )}\n {orderDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.orderDiscountLabel || 'Order discount:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{orderDiscount}</span>\n </div>\n )}\n </div>\n )}\n\n {/* \u6298\u6263\u603B\u8BA1\u4E0E\u6700\u7EC8\u603B\u4EF7 */}\n {(discountTotal !== undefined || total !== undefined) && (\n <div className=\"flex w-full flex-col gap-4\">\n {discountTotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.discountTotalRow\n )}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.discountTotalLabel || 'Discount total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-discount-total-value',\n 'text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.discountTotalValue\n )}\n >\n {discountTotal}\n </span>\n </div>\n )}\n\n {discountTotal !== undefined && total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-divider',\n 'border-lines-primary w-full border-t',\n classNames.divider\n )}\n />\n )}\n\n {total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.totalRow\n )}\n >\n <span className=\"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]\">\n {c.totalLabel || 'Total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-total-value',\n 'text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.totalValue\n )}\n >\n {total}\n </span>\n </div>\n )}\n </div>\n )}\n {/* \u79FB\u52A8\u7AEF\u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction-mobile',\n 'tablet:hidden flex items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n <div\n className={cn(\n 'tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4',\n !showInstallment && 'justify-end'\n )}\n >\n {/* \u7ED3\u8D26\u6309\u94AE */}\n {onCheckout && (\n <Button\n variant=\"primary\"\n size=\"lg\"\n className={cn(\n 'cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0',\n classNames.checkoutButton\n )}\n onClick={onCheckout}\n >\n {c.checkOut || 'Check Out'}\n </Button>\n )}\n\n {/* \u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction',\n 'tablet:flex hidden items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n\n {/* \u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */}\n {showInstallment && c.installmentText && (\n <div\n className={cn(\n 'cart-price-summary-installment',\n 'tablet:flex-row order-1 flex flex-col items-start gap-0.5',\n classNames.installment\n )}\n >\n {installmentIcons && installmentIcons.length > 0 && (\n <span className=\"flex shrink-0 items-center\">\n {installmentIcons.map((icon, index) => (\n <img\n key={index}\n src={icon.src}\n alt={icon.alt || ''}\n className=\"tablet:size-5 -mr-1 size-4 object-cover\"\n />\n ))}\n </span>\n )}\n <div className=\"flex gap-1\">\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.installmentText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n }\n)\n\nCartPriceSummary.displayName = 'CartPriceSummary'\n\nexport default CartPriceSummary\n"],
|
|
5
|
-
"mappings": "aAkBI,cAAAA,EASF,QAAAC,MATE,oBAhBJ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,4BACnB,OAAS,UAAAC,EAAQ,SAAAC,EAAO,aAAAC,MAAiB,+BACzC,OAAS,qBAAAC,MAAyB,cAIlC,MAAMC,EAAW,CAAC,CAAE,UAAAC,CAAU,IAC5BT,EAAC,OACC,MAAM,6BACN,UAAWG,EAAG,WAAYM,CAAS,EACnC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OAEL,SAAAT,EAAC,QACC,KAAK,eACL,EAAE,4TACJ,EACF,EAIIU,EAAY,CAAC,CAAE,UAAAD,CAAU,IAC7BR,EAAC,OACC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,UAAWE,EAAG,WAAYM,CAAS,EAEnC,UAAAT,EAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,MAAM,OAAO,eAAe,YAAY,MAAM,EACxEA,EAAC,QAAK,EAAE,uBAAuB,OAAO,eAAe,YAAY,MAAM,cAAc,QAAQ,GAC/F,EAIIW,EAAW,CAAC,CAAE,UAAAF,CAAU,IAC5BR,EAAC,OACC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,UAAWE,EAAG,WAAYM,CAAS,EAEnC,UAAAT,EAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,MAAM,OAAO,eAAe,YAAY,MAAM,EACxEA,EAAC,QAAK,EAAE,oBAAoB,OAAO,eAAe,YAAY,MAAM,cAAc,QAAQ,GAC5F,
|
|
6
|
-
"names": ["jsx", "jsxs", "React", "cn", "Button", "Input", "InputSlot", "DEFAULT_CART_COPY", "DownIcon", "className", "CloseIcon", "InfoIcon", "CartPriceSummary", "couponInputValue", "onCouponInputChange", "onCouponApply", "appliedCoupons", "onCouponRemove", "subtotal", "shipping", "taxes", "productDiscount", "orderDiscount", "discountTotal", "total", "onCheckout", "showCashReduction", "showInstallment", "installmentIcons", "copy", "classNames", "props", "ref", "c", "hasCouponSection", "couponExpanded", "setCouponExpanded", "hasDiscounts", "prev", "e", "code", "icon", "index", "CartPriceSummary_default"]
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../../helpers/index.js'\nimport { Button, Input, InputSlot } from '../../../components/index.js'\nimport { DEFAULT_CART_COPY } from '../index.js'\nimport type { CartPriceSummaryCopy } from '../types.js'\n\n// \u2500\u2500 Icon: Chevron right \u2500\u2500\nconst DownIcon = ({ className }: { className?: string }) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill=\"currentColor\"\n d=\"M11.5286 5.52827C11.789 5.26792 12.211 5.26792 12.4713 5.52827C12.7317 5.78862 12.7317 6.21063 12.4713 6.47098L8.47134 10.471C8.211 10.7313 7.78899 10.7313 7.52864 10.471L3.52864 6.47098C3.26829 6.21063 3.26829 5.78862 3.52864 5.52827C3.78899 5.26792 4.211 5.26792 4.47134 5.52827L7.99999 9.05692L11.5286 5.52827Z\"\n />\n </svg>\n)\n\n// \u2500\u2500 Icon: Close (used in coupon tag remove button) \u2500\u2500\nconst CloseIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M7 7L13 13M13 7L7 13\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\n// \u2500\u2500 Icon: Info \u2500\u2500\nconst InfoIcon = ({ className }: { className?: string }) => (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn('shrink-0', className)}\n >\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path d=\"M10 9V14M10 6V6.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n)\n\nexport interface CartPriceSummaryProps {\n /** \u6298\u6263\u7801\u8F93\u5165\u6846\u7684\u503C */\n couponInputValue?: string\n /** \u6298\u6263\u7801\u8F93\u5165\u53D8\u5316\u56DE\u8C03 */\n onCouponInputChange?: (value: string) => void\n /** \u70B9\u51FB\u5E94\u7528\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u8F93\u5165\u6846\u4E2D\u7684\u6298\u6263\u7801 */\n onCouponApply?: (code: string) => void\n /** \u5DF2\u5E94\u7528\u7684\u6298\u6263\u7801\u5217\u8868 */\n appliedCoupons?: string[]\n /** \u79FB\u9664\u6298\u6263\u7801\u56DE\u8C03\uFF0C\u53C2\u6570\u4E3A\u6298\u6263\u7801 */\n onCouponRemove?: (code: string) => void\n /** \u6298\u6263\u7801\u5E94\u7528\u6309\u94AE loading \u72B6\u6001 */\n couponLoading?: boolean\n\n /** \u5C0F\u8BA1\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n subtotal?: string\n /** \u8FD0\u8D39\u6587\u6848 */\n shipping?: string\n /** \u7A0E\u8D39\u6587\u6848 */\n taxes?: string\n\n /** \u4EA7\u54C1\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n productDiscount?: string\n /** \u8BA2\u5355\u6298\u6263\u91D1\u989D\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n orderDiscount?: string\n\n /** \u6298\u6263\u603B\u8BA1\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\u548C\u8D1F\u53F7\uFF09 */\n discountTotal?: string\n /** \u6700\u7EC8\u603B\u4EF7\uFF08\u683C\u5F0F\u5316\u5B57\u7B26\u4E32\uFF0C\u542B\u8D27\u5E01\u7B26\u53F7\uFF09 */\n total?: string\n\n /** \u7ED3\u8D26\u6309\u94AE\u70B9\u51FB\u56DE\u8C03 */\n onCheckout?: () => void\n\n /** \u662F\u5426\u663E\u793A\u73B0\u91D1\u51CF\u514D\u63D0\u793A */\n showCashReduction?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */\n showInstallment?: boolean\n /** \u5206\u671F\u4ED8\u6B3E\u652F\u4ED8\u65B9\u5F0F\u56FE\u6807\u5217\u8868 */\n installmentIcons?: { src: string; alt?: string }[]\n\n /** \u6587\u6848\u8986\u76D6\uFF0C\u7528\u4E8E\u56FD\u9645\u5316 */\n copy?: CartPriceSummaryCopy\n /** \u6839\u5BB9\u5668 className */\n className?: string\n /** \u8BED\u4E49\u5316\u7C7B\u540D\u8986\u76D6 */\n classNames?: Partial<\n Record<\n | 'root'\n | 'couponToggle'\n | 'couponLink'\n | 'couponInput'\n | 'couponTags'\n | 'couponTag'\n | 'couponTagText'\n | 'couponTagRemove'\n | 'priceRow'\n | 'priceRowLabel'\n | 'priceRowValue'\n | 'discountBox'\n | 'discountRow'\n | 'discountRowValue'\n | 'discountTotalRow'\n | 'discountTotalValue'\n | 'divider'\n | 'totalRow'\n | 'totalValue'\n | 'checkoutButton'\n | 'cashReduction'\n | 'installment',\n string\n >\n >\n}\n\nconst CartPriceSummary = React.forwardRef<HTMLDivElement, CartPriceSummaryProps>(\n (\n {\n couponInputValue,\n onCouponInputChange,\n onCouponApply,\n appliedCoupons,\n onCouponRemove,\n couponLoading = false,\n\n subtotal,\n shipping,\n taxes,\n\n productDiscount,\n orderDiscount,\n\n discountTotal,\n total,\n\n onCheckout,\n\n showCashReduction,\n showInstallment,\n installmentIcons,\n\n copy,\n className,\n classNames = {},\n ...props\n },\n ref\n ) => {\n const c = { ...DEFAULT_CART_COPY, ...copy }\n\n const hasCouponSection =\n onCouponInputChange !== undefined || onCouponApply !== undefined || (appliedCoupons && appliedCoupons.length > 0)\n\n const [couponExpanded, setCouponExpanded] = React.useState(false)\n\n const hasDiscounts = productDiscount !== undefined || orderDiscount !== undefined\n\n return (\n <div\n ref={ref}\n className={cn(\n 'cart-price-summary-root',\n 'tablet:static rounded-t-box fixed inset-x-0 bottom-0 z-50 bg-white ',\n '',\n className,\n classNames.root\n )}\n {...props}\n >\n <div className=\"tablet:w-[74.8%] tablet:ml-auto tablet:gap-4 tablet:items-end tablet:p-0 flex flex-col gap-2 p-4\">\n {/* \u6298\u6263\u7801\u5165\u53E3 */}\n {hasCouponSection && (\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-toggle',\n 'group flex w-full cursor-pointer items-center justify-between',\n classNames.couponToggle\n )}\n onClick={() => setCouponExpanded(prev => !prev)}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.couponTitle || 'Have a discount code?'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-coupon-link',\n 'text-brand-primary text-brand-0 tablet:text-base flex items-start gap-1 text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.couponLink\n )}\n >\n {c.couponLink || 'Apply/Check'}\n <DownIcon\n className={cn(\n 'text-brand-primary tablet:size-5 size-4 transition-transform duration-200',\n couponExpanded && 'rotate-180'\n )}\n />\n </span>\n </button>\n )}\n\n {/* \u6298\u6263\u7801\u8F93\u5165\u4E0E\u6807\u7B7E */}\n {couponExpanded && (\n <div className=\"tablet:max-w-[404px] flex flex-col items-end gap-2\">\n {/* \u8F93\u5165\u6846 + \u5E94\u7528\u6309\u94AE */}\n <Input\n size=\"lg\"\n type=\"text\"\n value={couponInputValue}\n onChange={e => onCouponInputChange?.(e.target.value)}\n placeholder={c.couponPlaceholder || 'Enter Code'}\n className={cn(\n 'cart-price-summary-coupon-input',\n 'border-lines-primary tablet:h-[54px] h-[44px] w-full bg-transparent',\n classNames.couponInput\n )}\n inputClassName=\"text-sm tablet:text-base font-bold w-[315px]\"\n >\n <InputSlot>\n <div className=\"border-lines-primary flex items-center border-l pl-2 pr-4\">\n <Button\n variant=\"ghost\"\n size=\"lg\"\n loading={couponLoading}\n className=\"hover:!text-info-primary text-info-primary tablet:text-base cursor-pointer !p-0 text-sm font-bold leading-[1.4] tracking-[-0.02em] underline hover:!bg-transparent\"\n onClick={() => onCouponApply?.(couponInputValue || '')}\n >\n {c.couponApply || 'Apply'}\n </Button>\n </div>\n </InputSlot>\n </Input>\n\n {/* \u5DF2\u5E94\u7528\u6298\u6263\u7801\u6807\u7B7E */}\n {appliedCoupons && appliedCoupons.length > 0 && (\n <div\n className={cn(\n 'cart-price-summary-coupon-tags',\n 'tablet:gap-2 flex flex-wrap gap-1',\n classNames.couponTags\n )}\n >\n {appliedCoupons.map(code => (\n <span\n key={code}\n className={cn(\n 'cart-price-summary-coupon-tag',\n 'bg-container-secondary rounded-box-small flex items-center gap-1 py-1 pl-2 pr-1',\n classNames.couponTag\n )}\n >\n <span\n className={cn(\n 'cart-price-summary-coupon-tag-text',\n 'text-info-tertiary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.couponTagText\n )}\n >\n {code}\n </span>\n <button\n type=\"button\"\n className={cn(\n 'cart-price-summary-coupon-tag-remove',\n 'text-info-tertiary hover:text-info-primary flex size-5 cursor-pointer items-center justify-center',\n classNames.couponTagRemove\n )}\n onClick={() => onCouponRemove?.(code)}\n >\n <CloseIcon />\n </button>\n </span>\n ))}\n </div>\n )}\n </div>\n )}\n\n {/* \u4EF7\u683C\u660E\u7EC6\uFF1A\u79FB\u52A8\u7AEF\u6298\u6263\u7801\u6298\u53E0\u65F6\u9690\u85CF\uFF1B\u5E73\u677F\u53CA\u4EE5\u4E0A\u59CB\u7EC8\u53EF\u89C1 */}\n <div\n className={cn(\n 'tablet:gap-4 flex w-full flex-col gap-2',\n !couponExpanded && hasCouponSection && 'tablet:flex hidden'\n )}\n >\n {/* \u5C0F\u8BA1 */}\n {subtotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.subtotalLabel || 'Subtotal:'}</span>\n <span className={classNames.priceRowValue}>{subtotal}</span>\n </div>\n )}\n\n {/* \u8FD0\u8D39 */}\n {shipping !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.shippingLabel || 'Shipping:'}</span>\n <span className={classNames.priceRowValue}>{shipping}</span>\n </div>\n )}\n\n {/* \u7A0E\u8D39 */}\n {taxes !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-price-row',\n 'text-info-tertiary tablet:text-base flex w-full items-center justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.priceRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.taxesLabel || 'Taxes:'}</span>\n <span className={classNames.priceRowValue}>{taxes}</span>\n </div>\n )}\n\n {/* \u6298\u6263\u6C47\u603B */}\n {hasDiscounts && (\n <div\n className={cn(\n 'cart-price-summary-discount-box',\n 'bg-container-secondary rounded-box-small tablet:p-4 flex w-full flex-col gap-2 p-2',\n classNames.discountBox\n )}\n >\n {productDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.productDiscountsLabel || 'Product discounts:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{productDiscount}</span>\n </div>\n )}\n {orderDiscount !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-row',\n 'text-info-tertiary tablet:text-base flex w-full items-start justify-between whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]',\n classNames.discountRow\n )}\n >\n <span className={classNames.priceRowLabel}>{c.orderDiscountLabel || 'Order discount:'}</span>\n <span className={cn('text-marketing-1', classNames.discountRowValue)}>{orderDiscount}</span>\n </div>\n )}\n </div>\n )}\n </div>\n\n {/* \u6298\u6263\u603B\u8BA1\u4E0E\u6700\u7EC8\u603B\u4EF7 */}\n {(discountTotal !== undefined || total !== undefined) && (\n <div className=\"flex w-full flex-col gap-4\">\n {discountTotal !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-discount-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.discountTotalRow\n )}\n >\n <span className=\"text-info-tertiary tablet:text-base text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.discountTotalLabel || 'Discount total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-discount-total-value',\n 'text-marketing-1 tablet:text-base text-right text-sm font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.discountTotalValue\n )}\n >\n {discountTotal}\n </span>\n </div>\n )}\n\n {discountTotal !== undefined && total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-divider',\n 'border-lines-primary w-full border-t',\n classNames.divider\n )}\n />\n )}\n\n {total !== undefined && (\n <div\n className={cn(\n 'cart-price-summary-total-row',\n 'flex w-full items-center justify-between whitespace-nowrap',\n classNames.totalRow\n )}\n >\n <span className=\"text-info-primary tablet:text-2xl text-xl font-bold leading-[1.2] tracking-[-0.04em]\">\n {c.totalLabel || 'Total:'}\n </span>\n <span\n className={cn(\n 'cart-price-summary-total-value',\n 'text-info-primary tablet:text-2xl text-right text-xl font-bold leading-[1.2] tracking-[-0.04em]',\n classNames.totalValue\n )}\n >\n {total}\n </span>\n </div>\n )}\n </div>\n )}\n {/* \u79FB\u52A8\u7AEF\u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction-mobile',\n 'tablet:hidden flex items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n <div\n className={cn(\n 'tablet:flex-col tablet:gap-2 tablet:items-end flex items-center justify-between gap-4',\n !showInstallment && 'justify-end'\n )}\n >\n {/* \u7ED3\u8D26\u6309\u94AE */}\n {onCheckout && (\n <Button\n variant=\"primary\"\n size=\"lg\"\n className={cn(\n 'cart-price-summary-checkout-button tablet:-order-1 order-2 shrink-0',\n classNames.checkoutButton\n )}\n onClick={onCheckout}\n >\n {c.checkOut || 'Check Out'}\n </Button>\n )}\n\n {/* \u73B0\u91D1\u51CF\u514D\u63D0\u793A */}\n {showCashReduction && c.cashReductionText && (\n <div\n className={cn(\n 'cart-price-summary-cash-reduction',\n 'tablet:flex hidden items-start gap-1',\n classNames.cashReduction\n )}\n >\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.cashReductionText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n )}\n\n {/* \u5206\u671F\u4ED8\u6B3E\u4FE1\u606F */}\n {showInstallment && c.installmentText && (\n <div\n className={cn(\n 'cart-price-summary-installment',\n 'tablet:flex-row order-1 flex flex-col items-start gap-0.5',\n classNames.installment\n )}\n >\n {installmentIcons && installmentIcons.length > 0 && (\n <span className=\"flex shrink-0 items-center\">\n {installmentIcons.map((icon, index) => (\n <img\n key={index}\n src={icon.src}\n alt={icon.alt || ''}\n className=\"tablet:size-5 -mr-1 size-4 object-cover\"\n />\n ))}\n </span>\n )}\n <div className=\"flex gap-1\">\n <span className=\"text-info-quaternary tablet:text-base whitespace-nowrap text-sm font-bold leading-[1.4] tracking-[-0.02em]\">\n {c.installmentText}\n </span>\n <InfoIcon className=\"text-info-quaternary tablet:size-5 size-4\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n }\n)\n\nCartPriceSummary.displayName = 'CartPriceSummary'\n\nexport default CartPriceSummary\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "React", "cn", "Button", "Input", "InputSlot", "DEFAULT_CART_COPY", "DownIcon", "className", "CloseIcon", "InfoIcon", "CartPriceSummary", "couponInputValue", "onCouponInputChange", "onCouponApply", "appliedCoupons", "onCouponRemove", "couponLoading", "subtotal", "shipping", "taxes", "productDiscount", "orderDiscount", "discountTotal", "total", "onCheckout", "showCashReduction", "showInstallment", "installmentIcons", "copy", "classNames", "props", "ref", "c", "hasCouponSection", "couponExpanded", "setCouponExpanded", "hasDiscounts", "prev", "e", "code", "icon", "index", "CartPriceSummary_default"]
|
|
7
7
|
}
|
package/package.json
CHANGED
package/style.css
CHANGED
|
@@ -4627,6 +4627,9 @@ video {
|
|
|
4627
4627
|
.hover\:\!bg-btn-secondary:hover {
|
|
4628
4628
|
background-color: var(--btn-bg-secondary-color) !important;
|
|
4629
4629
|
}
|
|
4630
|
+
.hover\:\!bg-transparent:hover {
|
|
4631
|
+
background-color: transparent !important;
|
|
4632
|
+
}
|
|
4630
4633
|
.hover\:bg-\[\#1D1D1F\]\/90:hover {
|
|
4631
4634
|
background-color: rgb(29 29 31 / 0.9);
|
|
4632
4635
|
}
|
|
@@ -4689,6 +4692,9 @@ video {
|
|
|
4689
4692
|
--tw-text-opacity: 1 !important;
|
|
4690
4693
|
color: rgb(0 0 0 / var(--tw-text-opacity, 1)) !important;
|
|
4691
4694
|
}
|
|
4695
|
+
.hover\:\!text-info-primary:hover {
|
|
4696
|
+
color: var(--info-primary-color) !important;
|
|
4697
|
+
}
|
|
4692
4698
|
.hover\:text-\[\#1f1f1f\]:hover {
|
|
4693
4699
|
--tw-text-opacity: 1;
|
|
4694
4700
|
color: rgb(31 31 31 / var(--tw-text-opacity, 1));
|
|
@@ -5629,6 +5635,9 @@ video {
|
|
|
5629
5635
|
.tablet\:max-w-\[358px\] {
|
|
5630
5636
|
max-width: 358px;
|
|
5631
5637
|
}
|
|
5638
|
+
.tablet\:max-w-\[404px\] {
|
|
5639
|
+
max-width: 404px;
|
|
5640
|
+
}
|
|
5632
5641
|
.tablet\:max-w-\[420px\] {
|
|
5633
5642
|
max-width: 420px;
|
|
5634
5643
|
}
|