@anker-in/campaign-ui 0.2.11-beta.13 → 0.2.11-beta.15

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.
@@ -9,5 +9,5 @@
9
9
  aspect-ratio: ${x} !important;
10
10
  }
11
11
  }
12
- `}),s&&(0,i.jsx)("div",{className:"absolute inset-0 ",style:{background:"linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)"}}),(0,i.jsx)(l.Container,{className:"l:h-auto !absolute inset-0 mx-auto grid h-full",asChild:!0,children:(0,i.jsx)("div",{className:"grid grid-cols-12",children:(0,i.jsxs)("div",{className:"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]",children:[(0,i.jsx)(l.Heading,{as:"h1",className:"text-[48px] font-semibold xl-xxl:text-[40px] l:text-[32px]",html:s?t.login.title?.replace("$name",c||""):t.unLogin.title}),(0,i.jsx)(l.Text,{size:"3",className:"l:mt-[4px] l-xxl:text-[14px] mt-[16px]",html:s?t.login.description:t.unLogin.description}),!s&&(0,i.jsxs)("div",{className:(0,d.default)("mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]",s&&"hidden"),children:[(0,i.jsx)(l.Button,{variant:"secondary",size:"lg",onClick:()=>{g("primary")},children:t.joinNow}),(0,i.jsx)(l.Button,{variant:"primary",size:"lg",onClick:()=>{g("secondary")},children:t.loginIn})]})]})})})]})})}
12
+ `}),s&&(0,i.jsx)("div",{className:"absolute inset-0 ",style:{background:"linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)"}}),(0,i.jsx)(l.Container,{className:"l:h-auto !absolute inset-0 mx-auto grid h-full",asChild:!0,children:(0,i.jsx)("div",{className:"grid grid-cols-12",children:(0,i.jsxs)("div",{className:"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]",children:[(0,i.jsx)(l.Heading,{as:"h1",className:"text-[48px] font-bold xl-xxl:text-[40px] l:text-[32px]",html:s?t.login.title?.replace("$name",c||""):t.unLogin.title}),(0,i.jsx)(l.Text,{size:"3",className:"l:mt-[4px] l-xxl:text-[14px] mt-[16px]",html:s?t.login.description:t.unLogin.description}),!s&&(0,i.jsxs)("div",{className:(0,d.default)("mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]",s&&"hidden"),children:[(0,i.jsx)(l.Button,{variant:"secondary",size:"lg",onClick:()=>{g("primary")},children:t.joinNow}),(0,i.jsx)(l.Button,{variant:"primary",size:"lg",onClick:()=>{g("secondary")},children:t.loginIn})]})]})})})]})})}
13
13
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/components/credits/creditsBanner/index.tsx"],
4
- "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport classNames from 'classnames'\nimport { useCreditsContext } from '../context/provider'\n\ntype Img = {\n url: string\n alt: string\n width?: number\n height?: number\n}\nexport type CreditsBannerCopy = {\n pcImg: Img\n laptopImg: Img\n mobileImg: Img\n joinNow: string\n loginIn: string\n login: {\n title: string\n description: string\n }\n unLogin: {\n title: string\n description: string\n }\n}\n\nexport function CreditsBanner({ copy, id }: { copy: CreditsBannerCopy; id?: string }) {\n const { profile, openSignInPopup, openSignUpPopup } = useCreditsContext()\n const isLogin = profile ? Object.keys(profile).length !== 0 : false\n\n const displayName = profile?.first_name\n ? profile?.first_name + ' ' + profile?.last_name\n : profile?.email?.split('@')[0]\n\n const handleButtonClick = (buttonType: 'primary' | 'secondary') => {\n buttonType === 'primary' ? openSignUpPopup() : openSignInPopup()\n }\n\n // \u8BA1\u7B97\u56FE\u7247\u6BD4\u4F8B\uFF0C\u5982\u679C\u6CA1\u6709\u914D\u7F6E\u5219\u4F7F\u7528\u9ED8\u8BA4\u503C\n const pcAspectRatio =\n copy.pcImg?.width && copy.pcImg?.height ? `${copy.pcImg.width} / ${copy.pcImg.height}` : '1920 / 804'\n const laptopAspectRatio =\n copy.laptopImg?.width && copy.laptopImg?.height ? `${copy.laptopImg.width} / ${copy.laptopImg.height}` : '768 / 660'\n const mobileAspectRatio =\n copy.mobileImg?.width && copy.mobileImg?.height ? `${copy.mobileImg.width} / ${copy.mobileImg.height}` : '390 / 660'\n\n return (\n <>\n <div id={id} className=\" relative w-full\">\n <Picture\n className=\"credits-banner-image w-full\"\n style={{\n aspectRatio: pcAspectRatio,\n }}\n imgClassName=\"object-cover w-full h-full\"\n source={`${copy.pcImg?.url}, ${copy.laptopImg?.url} 1024, ${copy.mobileImg?.url} 768`}\n alt={copy.pcImg?.alt}\n loading=\"eager\"\n ></Picture>\n <style>\n {`\n @media (max-width: 1024px) and (min-width: 768px) {\n .credits-banner-image {\n aspect-ratio: ${laptopAspectRatio} !important;\n }\n }\n @media (max-width: 767px) {\n .credits-banner-image {\n aspect-ratio: ${mobileAspectRatio} !important;\n }\n }\n `}\n </style>\n {isLogin && (\n <div\n className=\"absolute inset-0 \"\n style={{\n background: 'linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)',\n }}\n ></div>\n )}\n\n <Container className=\"l:h-auto !absolute inset-0 mx-auto grid h-full\" asChild>\n <div className=\"grid grid-cols-12\">\n <div className=\"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]\">\n <Heading\n as=\"h1\"\n className=\"text-[48px] font-semibold xl-xxl:text-[40px] l:text-[32px]\"\n html={isLogin ? copy.login.title?.replace('$name', displayName || '') : copy.unLogin.title}\n ></Heading>\n\n <Text\n size=\"3\"\n className=\"l:mt-[4px] l-xxl:text-[14px] mt-[16px]\"\n html={isLogin ? copy.login.description : copy.unLogin.description}\n ></Text>\n\n {!isLogin && (\n <div\n className={classNames(\n 'mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]',\n isLogin && 'hidden'\n )}\n >\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('primary')\n }}\n >\n {copy.joinNow}\n </Button>\n <Button\n variant=\"primary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('secondary')\n }}\n >\n {copy.loginIn}\n </Button>\n </div>\n )}\n </div>\n </div>\n </Container>\n </div>\n </>\n )\n}\n"],
5
- "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,IAAA,eAAAC,EAAAH,GA+CI,IAAAI,EAAA,6BA/CJC,EAA0D,iCAC1DC,EAAuB,yBACvBC,EAAkC,+BAwB3B,SAASL,EAAc,CAAE,KAAAM,EAAM,GAAAC,CAAG,EAA6C,CACpF,KAAM,CAAE,QAAAC,EAAS,gBAAAC,EAAiB,gBAAAC,CAAgB,KAAI,qBAAkB,EAClEC,EAAUH,EAAU,OAAO,KAAKA,CAAO,EAAE,SAAW,EAAI,GAExDI,EAAcJ,GAAS,WACzBA,GAAS,WAAa,IAAMA,GAAS,UACrCA,GAAS,OAAO,MAAM,GAAG,EAAE,CAAC,EAE1BK,EAAqBC,GAAwC,CACjEA,IAAe,UAAYJ,EAAgB,EAAID,EAAgB,CACjE,EAGMM,EACJT,EAAK,OAAO,OAASA,EAAK,OAAO,OAAS,GAAGA,EAAK,MAAM,KAAK,MAAMA,EAAK,MAAM,MAAM,GAAK,aACrFU,EACJV,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YACrGW,EACJX,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YAE3G,SACE,mBACE,oBAAC,OAAI,GAAIC,EAAI,UAAU,mBACrB,oBAAC,WACC,UAAU,8BACV,MAAO,CACL,YAAaQ,CACf,EACA,aAAa,6BACb,OAAQ,GAAGT,EAAK,OAAO,GAAG,KAAKA,EAAK,WAAW,GAAG,UAAUA,EAAK,WAAW,GAAG,OAC/E,IAAKA,EAAK,OAAO,IACjB,QAAQ,QACT,KACD,OAAC,SACE;AAAA;AAAA;AAAA,gCAGqBU,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,gCAKjBC,CAAiB;AAAA;AAAA;AAAA,YAIzC,EACCN,MACC,OAAC,OACC,UAAU,oBACV,MAAO,CACL,WAAY,sEACd,EACD,KAGH,OAAC,aAAU,UAAU,iDAAiD,QAAO,GAC3E,mBAAC,OAAI,UAAU,oBACb,oBAAC,OAAI,UAAU,qHACb,oBAAC,WACC,GAAG,KACH,UAAU,6DACV,KAAMA,EAAUL,EAAK,MAAM,OAAO,QAAQ,QAASM,GAAe,EAAE,EAAIN,EAAK,QAAQ,MACtF,KAED,OAAC,QACC,KAAK,IACL,UAAU,yCACV,KAAMK,EAAUL,EAAK,MAAM,YAAcA,EAAK,QAAQ,YACvD,EAEA,CAACK,MACA,QAAC,OACC,aAAW,EAAAO,SACT,4DACAP,GAAW,QACb,EAEA,oBAAC,UACC,QAAQ,YACR,KAAK,KACL,QAAS,IAAM,CACbE,EAAkB,SAAS,CAC7B,EAEC,SAAAP,EAAK,QACR,KACA,OAAC,UACC,QAAQ,UACR,KAAK,KACL,QAAS,IAAM,CACbO,EAAkB,WAAW,CAC/B,EAEC,SAAAP,EAAK,QACR,GACF,GAEJ,EACF,EACF,GACF,EACF,CAEJ",
4
+ "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport classNames from 'classnames'\nimport { useCreditsContext } from '../context/provider'\n\ntype Img = {\n url: string\n alt: string\n width?: number\n height?: number\n}\nexport type CreditsBannerCopy = {\n pcImg: Img\n laptopImg: Img\n mobileImg: Img\n joinNow: string\n loginIn: string\n login: {\n title: string\n description: string\n }\n unLogin: {\n title: string\n description: string\n }\n}\n\nexport function CreditsBanner({ copy, id }: { copy: CreditsBannerCopy; id?: string }) {\n const { profile, openSignInPopup, openSignUpPopup } = useCreditsContext()\n const isLogin = profile ? Object.keys(profile).length !== 0 : false\n\n const displayName = profile?.first_name\n ? profile?.first_name + ' ' + profile?.last_name\n : profile?.email?.split('@')[0]\n\n const handleButtonClick = (buttonType: 'primary' | 'secondary') => {\n buttonType === 'primary' ? openSignUpPopup() : openSignInPopup()\n }\n\n // \u8BA1\u7B97\u56FE\u7247\u6BD4\u4F8B\uFF0C\u5982\u679C\u6CA1\u6709\u914D\u7F6E\u5219\u4F7F\u7528\u9ED8\u8BA4\u503C\n const pcAspectRatio =\n copy.pcImg?.width && copy.pcImg?.height ? `${copy.pcImg.width} / ${copy.pcImg.height}` : '1920 / 804'\n const laptopAspectRatio =\n copy.laptopImg?.width && copy.laptopImg?.height ? `${copy.laptopImg.width} / ${copy.laptopImg.height}` : '768 / 660'\n const mobileAspectRatio =\n copy.mobileImg?.width && copy.mobileImg?.height ? `${copy.mobileImg.width} / ${copy.mobileImg.height}` : '390 / 660'\n\n return (\n <>\n <div id={id} className=\" relative w-full\">\n <Picture\n className=\"credits-banner-image w-full\"\n style={{\n aspectRatio: pcAspectRatio,\n }}\n imgClassName=\"object-cover w-full h-full\"\n source={`${copy.pcImg?.url}, ${copy.laptopImg?.url} 1024, ${copy.mobileImg?.url} 768`}\n alt={copy.pcImg?.alt}\n loading=\"eager\"\n ></Picture>\n <style>\n {`\n @media (max-width: 1024px) and (min-width: 768px) {\n .credits-banner-image {\n aspect-ratio: ${laptopAspectRatio} !important;\n }\n }\n @media (max-width: 767px) {\n .credits-banner-image {\n aspect-ratio: ${mobileAspectRatio} !important;\n }\n }\n `}\n </style>\n {isLogin && (\n <div\n className=\"absolute inset-0 \"\n style={{\n background: 'linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)',\n }}\n ></div>\n )}\n\n <Container className=\"l:h-auto !absolute inset-0 mx-auto grid h-full\" asChild>\n <div className=\"grid grid-cols-12\">\n <div className=\"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]\">\n <Heading\n as=\"h1\"\n className=\"text-[48px] font-bold xl-xxl:text-[40px] l:text-[32px]\"\n html={isLogin ? copy.login.title?.replace('$name', displayName || '') : copy.unLogin.title}\n ></Heading>\n\n <Text\n size=\"3\"\n className=\"l:mt-[4px] l-xxl:text-[14px] mt-[16px]\"\n html={isLogin ? copy.login.description : copy.unLogin.description}\n ></Text>\n\n {!isLogin && (\n <div\n className={classNames(\n 'mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]',\n isLogin && 'hidden'\n )}\n >\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('primary')\n }}\n >\n {copy.joinNow}\n </Button>\n <Button\n variant=\"primary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('secondary')\n }}\n >\n {copy.loginIn}\n </Button>\n </div>\n )}\n </div>\n </div>\n </Container>\n </div>\n </>\n )\n}\n"],
5
+ "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,IAAA,eAAAC,EAAAH,GA+CI,IAAAI,EAAA,6BA/CJC,EAA0D,iCAC1DC,EAAuB,yBACvBC,EAAkC,+BAwB3B,SAASL,EAAc,CAAE,KAAAM,EAAM,GAAAC,CAAG,EAA6C,CACpF,KAAM,CAAE,QAAAC,EAAS,gBAAAC,EAAiB,gBAAAC,CAAgB,KAAI,qBAAkB,EAClEC,EAAUH,EAAU,OAAO,KAAKA,CAAO,EAAE,SAAW,EAAI,GAExDI,EAAcJ,GAAS,WACzBA,GAAS,WAAa,IAAMA,GAAS,UACrCA,GAAS,OAAO,MAAM,GAAG,EAAE,CAAC,EAE1BK,EAAqBC,GAAwC,CACjEA,IAAe,UAAYJ,EAAgB,EAAID,EAAgB,CACjE,EAGMM,EACJT,EAAK,OAAO,OAASA,EAAK,OAAO,OAAS,GAAGA,EAAK,MAAM,KAAK,MAAMA,EAAK,MAAM,MAAM,GAAK,aACrFU,EACJV,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YACrGW,EACJX,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YAE3G,SACE,mBACE,oBAAC,OAAI,GAAIC,EAAI,UAAU,mBACrB,oBAAC,WACC,UAAU,8BACV,MAAO,CACL,YAAaQ,CACf,EACA,aAAa,6BACb,OAAQ,GAAGT,EAAK,OAAO,GAAG,KAAKA,EAAK,WAAW,GAAG,UAAUA,EAAK,WAAW,GAAG,OAC/E,IAAKA,EAAK,OAAO,IACjB,QAAQ,QACT,KACD,OAAC,SACE;AAAA;AAAA;AAAA,gCAGqBU,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,gCAKjBC,CAAiB;AAAA;AAAA;AAAA,YAIzC,EACCN,MACC,OAAC,OACC,UAAU,oBACV,MAAO,CACL,WAAY,sEACd,EACD,KAGH,OAAC,aAAU,UAAU,iDAAiD,QAAO,GAC3E,mBAAC,OAAI,UAAU,oBACb,oBAAC,OAAI,UAAU,qHACb,oBAAC,WACC,GAAG,KACH,UAAU,yDACV,KAAMA,EAAUL,EAAK,MAAM,OAAO,QAAQ,QAASM,GAAe,EAAE,EAAIN,EAAK,QAAQ,MACtF,KAED,OAAC,QACC,KAAK,IACL,UAAU,yCACV,KAAMK,EAAUL,EAAK,MAAM,YAAcA,EAAK,QAAQ,YACvD,EAEA,CAACK,MACA,QAAC,OACC,aAAW,EAAAO,SACT,4DACAP,GAAW,QACb,EAEA,oBAAC,UACC,QAAQ,YACR,KAAK,KACL,QAAS,IAAM,CACbE,EAAkB,SAAS,CAC7B,EAEC,SAAAP,EAAK,QACR,KACA,OAAC,UACC,QAAQ,UACR,KAAK,KACL,QAAS,IAAM,CACbO,EAAkB,WAAW,CAC/B,EAEC,SAAAP,EAAK,QACR,GACF,GAEJ,EACF,EACF,GACF,EACF,CAEJ",
6
6
  "names": ["creditsBanner_exports", "__export", "CreditsBanner", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_classnames", "import_provider", "copy", "id", "profile", "openSignInPopup", "openSignUpPopup", "isLogin", "displayName", "handleButtonClick", "buttonType", "pcAspectRatio", "laptopAspectRatio", "mobileAspectRatio", "classNames"]
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";var g=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var L=Object.prototype.hasOwnProperty;var z=(e,t)=>{for(var d in t)g(e,d,{get:t[d],enumerable:!0})},E=(e,t,d,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of M(t))!L.call(e,o)&&o!==d&&g(e,o,{get:()=>t[o],enumerable:!(p=I(t,o))||p.enumerable});return e};var F=e=>E(g({},"__esModule",{value:!0}),e);var q={};z(q,{default:()=>U});module.exports=F(q);var r=require("react/jsx-runtime"),n=require("@anker-in/headless-ui"),s=require("react"),c=require("../context/utils"),l=require("@anker-in/lib"),w=require("../context/provider"),P=require("../../../constants");function O({itemData:e,copy:t,className:d}){const{brand:p,locale:o}=(0,l.useHeadlessContext)(),{profile:u,openSignUpPopup:_,cartConfig:m}=(0,w.useCreditsContext)(),T=P.ROUNDED_BRANDS.includes(p),{trigger:V,isMutating:b}=(0,l.useBuyNow)({},{throwOnError:!0}),[v,C]=(0,s.useState)(!1),y=(0,s.useMemo)(()=>e.productVariant?.availableForSale,[e.productVariant?.availableForSale]),k=(0,s.useMemo)(()=>!!u,[u]),i=(0,s.useMemo)(()=>{try{const a=e.productVariant?.metafields?.__discountCodeApp?.data;if(!a)return;const f=a;if(!Array.isArray(f)||f.length===0)return;const h=new Date;return f.find(x=>{const N=x.starts_at?new Date(x.starts_at):null,A=x.ends_at?new Date(x.ends_at):null;return!(N&&N>h||A&&A<h)})?.title}catch(a){console.error("Failed to get discount code:",a);return}},[e.productVariant?.metafields]),S=async()=>{if(!m?.addToCart){console.warn("cartConfig.addToCart is required");return}try{C(!0);const a=[];i&&a.push({key:"_member_price",value:JSON.stringify({code:i})}),await m.addToCart({variantList:[{variant:e.productVariant,quantity:1,attributes:a.length>0?a:void 0}],cartAttributes:{_member_type:String(u?.memberType||0)},discountCodes:i?[i]:void 0})}catch(a){console.error("Add to cart failed:",a)}finally{C(!1)}},B=()=>{if(!k){_();return}const a=[];i&&a.push({key:"_member_price",value:JSON.stringify({code:i})}),V({customAttributes:[{key:"_member_type",value:String(u?.memberType||0)}],lineItems:[{variant:e.productVariant,quantity:1,attributes:a.length>0?a:void 0}],discountCodes:i?[i]:void 0})};return(0,r.jsxs)("div",{className:(0,l.classNames)("relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]",!T&&"rounded-none md:rounded-none",t.badgeLabel?"pt-[48px] l:pt-[44px]":"pt-[24px] md-xl:pt-[16px] l:pt-[8px]",d),children:[t.badgeLabel&&(0,r.jsx)(n.Badge,{className:"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10",size:"lg",variant:"promotional",promotionalType:"regular-member",children:t.badgeLabel}),(0,r.jsx)("a",{href:(0,c.extractVariantId)(e.productVariant?.id)?`/products/${e.product.handle}?variant=${(0,c.extractVariantId)(e.productVariant?.id)}`:`/products/${e.product.handle}`,className:(0,l.classNames)("relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]"),children:(0,r.jsx)(n.Picture,{className:"mx-auto size-full",imgClassName:"object-contain",source:e?.productVariant?.metafields?.global?.transparentImg||e?.config?.image?.url||e?.productVariant?.image?.url})}),(0,r.jsxs)("div",{className:(0,l.classNames)("mt-[10px] xl:mt-[8px] w-full"),children:[(0,r.jsx)(n.Text,{html:e?.product?.title,title:e?.product?.title,className:"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]"}),(0,r.jsxs)("div",{className:"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0",children:[(0,r.jsx)(n.Text,{html:t.memberPriceLabel,className:(0,l.classNames)("text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]",p==="ankersolix"&&"leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent"),as:"p"}),(0,r.jsxs)("div",{className:"flex items-center gap-[4px]",children:[(0,r.jsx)(n.Text,{html:(0,c.formatPrice)({amount:e.memberPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:o}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]",as:"span"}),(0,r.jsx)(n.Text,{html:(0,c.formatPrice)({amount:e.originalPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:o}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through",as:"span"})]}),(0,r.jsxs)("div",{className:"flex w-full mt-[8px] gap-[8px] l:flex-col",children:[(0,r.jsx)(n.Button,{variant:"secondary",className:"flex-1 md:w-full",size:"lg",onClick:S,disabled:!y||!m?.addToCart||v,loading:v,children:t.addToCart}),(0,r.jsx)(n.Button,{variant:"primary",className:"flex-1 md:w-full",size:"lg",onClick:B,disabled:!y||b,loading:b,children:t.shopNowText})]})]})]})]})}var U=O;
1
+ "use strict";var g=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var L=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var d in t)g(e,d,{get:t[d],enumerable:!0})},F=(e,t,d,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of M(t))!L.call(e,o)&&o!==d&&g(e,o,{get:()=>t[o],enumerable:!(p=I(t,o))||p.enumerable});return e};var z=e=>F(g({},"__esModule",{value:!0}),e);var q={};E(q,{default:()=>U});module.exports=z(q);var r=require("react/jsx-runtime"),n=require("@anker-in/headless-ui"),s=require("react"),c=require("../context/utils"),l=require("@anker-in/lib"),w=require("../context/provider"),P=require("../../../constants");function O({itemData:e,copy:t,className:d}){const{brand:p,locale:o}=(0,l.useHeadlessContext)(),{profile:u,openSignUpPopup:_,cartConfig:m}=(0,w.useCreditsContext)(),T=P.ROUNDED_BRANDS.includes(p),{trigger:V,isMutating:b}=(0,l.useBuyNow)({},{throwOnError:!0}),[v,C]=(0,s.useState)(!1),y=(0,s.useMemo)(()=>e.productVariant?.availableForSale,[e.productVariant?.availableForSale]),k=(0,s.useMemo)(()=>!!u,[u]),i=(0,s.useMemo)(()=>{try{const a=e.productVariant?.metafields?.__discountCodeApp?.data;if(!a)return;const f=a;if(!Array.isArray(f)||f.length===0)return;const h=new Date;return f.find(x=>{const N=x.starts_at?new Date(x.starts_at):null,A=x.ends_at?new Date(x.ends_at):null;return!(N&&N>h||A&&A<h)})?.title}catch(a){console.error("Failed to get discount code:",a);return}},[e.productVariant?.metafields]),S=async()=>{if(!m?.addToCart){console.warn("cartConfig.addToCart is required");return}try{C(!0);const a=[];i&&a.push({key:"_member_price",value:JSON.stringify({code:i})}),await m.addToCart({variantList:[{variant:e.productVariant,quantity:1,attributes:a.length>0?a:void 0}],cartAttributes:{_member_type:String(u?.memberType||0)},discountCodes:i?[i]:void 0})}catch(a){console.error("Add to cart failed:",a)}finally{C(!1)}},B=()=>{if(!k){_();return}const a=[];i&&a.push({key:"_member_price",value:JSON.stringify({code:i})}),V({customAttributes:[{key:"_member_type",value:String(u?.memberType||0)}],lineItems:[{variant:e.productVariant,quantity:1,attributes:a.length>0?a:void 0}],discountCodes:i?[i]:void 0})};return(0,r.jsxs)("div",{className:(0,l.classNames)("relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]",!T&&"rounded-none md:rounded-none",t.badgeLabel?"pt-[48px] l:pt-[44px]":"pt-[24px] md-xl:pt-[16px] l:pt-[8px]",d),children:[t.badgeLabel&&(0,r.jsx)(n.Badge,{className:"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10",size:"lg",variant:"promotional",promotionalType:"regular-member",children:t.badgeLabel}),(0,r.jsx)("a",{href:(0,c.extractVariantId)(e.productVariant?.id)?`/products/${e.product.handle}?variant=${(0,c.extractVariantId)(e.productVariant?.id)}`:`/products/${e.product.handle}`,className:(0,l.classNames)("relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]"),children:(0,r.jsx)(n.Picture,{className:"mx-auto h-full w-auto",imgClassName:"h-full object-contain",source:e?.productVariant?.metafields?.global?.transparentImg||e?.config?.image?.url||e?.productVariant?.image?.url})}),(0,r.jsxs)("div",{className:(0,l.classNames)("mt-[10px] xl:mt-[8px] w-full"),children:[(0,r.jsx)(n.Text,{html:e?.product?.title,title:e?.product?.title,className:"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]"}),(0,r.jsxs)("div",{className:"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0",children:[(0,r.jsx)(n.Text,{html:t.memberPriceLabel,className:(0,l.classNames)("text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]",p==="ankersolix"&&"leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent"),as:"p"}),(0,r.jsxs)("div",{className:"flex items-center gap-[4px]",children:[(0,r.jsx)(n.Text,{html:(0,c.formatPrice)({amount:e.memberPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:o}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]",as:"span"}),(0,r.jsx)(n.Text,{html:(0,c.formatPrice)({amount:e.originalPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:o}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through",as:"span"})]}),(0,r.jsxs)("div",{className:"flex w-full mt-[8px] gap-[8px] l:flex-col",children:[(0,r.jsx)(n.Button,{variant:"secondary",className:"flex-1 md:w-full",size:"lg",onClick:S,disabled:!y||!m?.addToCart||v,loading:v,children:t.addToCart}),(0,r.jsx)(n.Button,{variant:"primary",className:"flex-1 md:w-full",size:"lg",onClick:B,disabled:!y||b,loading:b,children:t.shopNowText})]})]})]})]})}var U=O;
2
2
  //# sourceMappingURL=MemberPriceItem.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/components/credits/creditsMemberPrice/MemberPriceItem.tsx"],
4
- "sourcesContent": ["import { Button, Text, Picture, Badge } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsMemberPriceCopy, MemberPriceProduct } from './type'\nimport { formatPrice, extractVariantId } from '../context/utils'\nimport { classNames as cn, useHeadlessContext, useBuyNow } from '@anker-in/lib'\nimport { useCreditsContext } from '../context/provider'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction MemberPriceItem({\n itemData,\n copy,\n className,\n}: {\n itemData: MemberPriceProduct\n copy: CreditsMemberPriceCopy['memberPriceTab']\n className?: string\n}) {\n const { brand, locale } = useHeadlessContext()\n const { profile, openSignUpPopup, cartConfig } = useCreditsContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n // \u4F7F\u7528 buyNow hook \u6765\u5904\u7406\u7ED3\u7B97\n const { trigger: buyNow, isMutating: isBuying } = useBuyNow({}, { throwOnError: true })\n\n // \u672C\u5730 loading \u72B6\u6001\uFF0C\u907F\u514D\u5168\u5C40 loading \u5F71\u54CD\u6240\u6709\u5361\u7247\n const [isAddingToCart, setIsAddingToCart] = useState(false)\n\n const isAvailable = useMemo(() => {\n return itemData.productVariant?.availableForSale\n }, [itemData.productVariant?.availableForSale])\n\n const isLogin = useMemo(() => {\n return !!profile\n }, [profile])\n\n // \u4ECE variant metafields \u4E2D\u83B7\u53D6 coupon code\n const getCouponCode = useMemo(() => {\n try {\n const discountData = itemData.productVariant?.metafields?.__discountCodeApp?.data\n if (!discountData) return undefined\n\n // discountData \u5DF2\u7ECF\u662F\u5BF9\u8C61\uFF0C\u4E0D\u9700\u8981 JSON.parse\n const discounts = discountData\n if (!Array.isArray(discounts) || discounts.length === 0) return undefined\n\n // \u83B7\u53D6\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 coupon\uFF08\u68C0\u67E5\u65F6\u95F4\u8303\u56F4\uFF09\n const now = new Date()\n const validDiscount = discounts.find((discount: any) => {\n const startsAt = discount.starts_at ? new Date(discount.starts_at) : null\n const endsAt = discount.ends_at ? new Date(discount.ends_at) : null\n\n // \u68C0\u67E5 coupon \u662F\u5426\u5728\u6709\u6548\u671F\u5185\n if (startsAt && startsAt > now) return false\n if (endsAt && endsAt < now) return false\n\n return true\n })\n\n return validDiscount?.title\n } catch (error) {\n console.error('Failed to get discount code:', error)\n return undefined\n }\n }, [itemData.productVariant?.metafields])\n\n // Add to Cart \u6309\u94AE\u70B9\u51FB - \u8C03\u7528\u52A0\u8D2D\u65B9\u6CD5\n const handleAddToCart = async () => {\n if (!cartConfig?.addToCart) {\n console.warn('cartConfig.addToCart is required')\n return\n }\n\n try {\n setIsAddingToCart(true)\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n await cartConfig.addToCart({\n variantList: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n cartAttributes: {\n _member_type: String(profile?.memberType || 0),\n },\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n } catch (error) {\n console.error('Add to cart failed:', error)\n } finally {\n setIsAddingToCart(false)\n }\n }\n\n // Shop Now \u6309\u94AE\u70B9\u51FB - \u68C0\u67E5\u767B\u5F55\u72B6\u6001\u540E\u4F7F\u7528 buyNow \u8FDB\u884C\u7ED3\u7B97\n const handleShopNow = () => {\n // \u5982\u679C\u672A\u767B\u5F55\uFF0C\u5F39\u51FA\u767B\u5F55\u5F39\u7A97\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n // \u5DF2\u767B\u5F55\uFF0C\u6267\u884C\u8D2D\u4E70\n buyNow({\n customAttributes: [\n {\n key: '_member_type',\n value: String(profile?.memberType || 0),\n },\n ],\n lineItems: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n }\n\n return (\n <div\n className={cn(\n 'relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]',\n !rounded && 'rounded-none md:rounded-none',\n copy.badgeLabel ? 'pt-[48px] l:pt-[44px]' : 'pt-[24px] md-xl:pt-[16px] l:pt-[8px]',\n className\n )}\n >\n {/* Member \u6807\u7B7E Badge */}\n {copy.badgeLabel && (\n <Badge\n className=\"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10\"\n size=\"lg\"\n variant=\"promotional\"\n promotionalType=\"regular-member\"\n >\n {copy.badgeLabel}\n </Badge>\n )}\n\n {/* \u4EA7\u54C1\u56FE\u7247 - \u4F18\u5148\u4F7F\u7528\u4EA7\u54C1\u7684 metafields \u900F\u660E\u56FE */}\n <a\n href={\n extractVariantId(itemData.productVariant?.id)\n ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n : `/products/${itemData.product.handle}`\n }\n className={cn('relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]')}\n >\n <Picture\n className=\"mx-auto size-full\"\n imgClassName=\"object-contain\"\n source={\n itemData?.productVariant?.metafields?.global?.transparentImg ||\n itemData?.config?.image?.url ||\n itemData?.productVariant?.image?.url\n }\n ></Picture>\n </a>\n\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className={cn('mt-[10px] xl:mt-[8px] w-full')}>\n {/* \u4EA7\u54C1\u6807\u9898 - \u4F7F\u7528\u4EA7\u54C1\u7684\u771F\u5B9E\u6807\u9898 */}\n <Text\n html={itemData?.product?.title}\n title={itemData?.product?.title}\n className=\"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n />\n\n {/* \u4EF7\u683C\u4FE1\u606F */}\n <div className=\"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0\">\n {/* Member Price \u6807\u7B7E - \u4F7F\u7528 text-brand-color-1 */}\n <Text\n html={copy.memberPriceLabel}\n className={cn(\n 'text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]',\n brand === 'ankersolix' &&\n 'leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n )}\n as=\"p\"\n />\n\n {/* \u4F1A\u5458\u4EF7\u548C\u539F\u4EF7\u5728\u540C\u4E00\u884C */}\n <div className=\"flex items-center gap-[4px]\">\n <Text\n html={formatPrice({\n amount: itemData.memberPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n as=\"span\"\n />\n <Text\n html={formatPrice({\n amount: itemData.originalPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n as=\"span\"\n />\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex w-full mt-[8px] gap-[8px] l:flex-col\">\n {/* Add to Cart \u6309\u94AE */}\n <Button\n variant=\"secondary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleAddToCart}\n disabled={!isAvailable || !cartConfig?.addToCart || isAddingToCart}\n loading={isAddingToCart}\n >\n {copy.addToCart}\n </Button>\n\n {/* Shop Now \u6309\u94AE */}\n <Button\n variant=\"primary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleShopNow}\n disabled={!isAvailable || isBuying}\n loading={isBuying}\n >\n {copy.shopNowText}\n </Button>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default MemberPriceItem\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { Button, Text, Picture, Badge } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsMemberPriceCopy, MemberPriceProduct } from './type'\nimport { formatPrice, extractVariantId } from '../context/utils'\nimport { classNames as cn, useHeadlessContext, useBuyNow } from '@anker-in/lib'\nimport { useCreditsContext } from '../context/provider'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction MemberPriceItem({\n itemData,\n copy,\n className,\n}: {\n itemData: MemberPriceProduct\n copy: CreditsMemberPriceCopy['memberPriceTab']\n className?: string\n}) {\n const { brand, locale } = useHeadlessContext()\n const { profile, openSignUpPopup, cartConfig } = useCreditsContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n // \u4F7F\u7528 buyNow hook \u6765\u5904\u7406\u7ED3\u7B97\n const { trigger: buyNow, isMutating: isBuying } = useBuyNow({}, { throwOnError: true })\n\n // \u672C\u5730 loading \u72B6\u6001\uFF0C\u907F\u514D\u5168\u5C40 loading \u5F71\u54CD\u6240\u6709\u5361\u7247\n const [isAddingToCart, setIsAddingToCart] = useState(false)\n\n const isAvailable = useMemo(() => {\n return itemData.productVariant?.availableForSale\n }, [itemData.productVariant?.availableForSale])\n\n const isLogin = useMemo(() => {\n return !!profile\n }, [profile])\n\n // \u4ECE variant metafields \u4E2D\u83B7\u53D6 coupon code\n const getCouponCode = useMemo(() => {\n try {\n const discountData = itemData.productVariant?.metafields?.__discountCodeApp?.data\n if (!discountData) return undefined\n\n // discountData \u5DF2\u7ECF\u662F\u5BF9\u8C61\uFF0C\u4E0D\u9700\u8981 JSON.parse\n const discounts = discountData\n if (!Array.isArray(discounts) || discounts.length === 0) return undefined\n\n // \u83B7\u53D6\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 coupon\uFF08\u68C0\u67E5\u65F6\u95F4\u8303\u56F4\uFF09\n const now = new Date()\n const validDiscount = discounts.find((discount: any) => {\n const startsAt = discount.starts_at ? new Date(discount.starts_at) : null\n const endsAt = discount.ends_at ? new Date(discount.ends_at) : null\n\n // \u68C0\u67E5 coupon \u662F\u5426\u5728\u6709\u6548\u671F\u5185\n if (startsAt && startsAt > now) return false\n if (endsAt && endsAt < now) return false\n\n return true\n })\n\n return validDiscount?.title\n } catch (error) {\n console.error('Failed to get discount code:', error)\n return undefined\n }\n }, [itemData.productVariant?.metafields])\n\n // Add to Cart \u6309\u94AE\u70B9\u51FB - \u8C03\u7528\u52A0\u8D2D\u65B9\u6CD5\n const handleAddToCart = async () => {\n if (!cartConfig?.addToCart) {\n console.warn('cartConfig.addToCart is required')\n return\n }\n\n try {\n setIsAddingToCart(true)\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n await cartConfig.addToCart({\n variantList: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n cartAttributes: {\n _member_type: String(profile?.memberType || 0),\n },\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n } catch (error) {\n console.error('Add to cart failed:', error)\n } finally {\n setIsAddingToCart(false)\n }\n }\n\n // Shop Now \u6309\u94AE\u70B9\u51FB - \u68C0\u67E5\u767B\u5F55\u72B6\u6001\u540E\u4F7F\u7528 buyNow \u8FDB\u884C\u7ED3\u7B97\n const handleShopNow = () => {\n // \u5982\u679C\u672A\u767B\u5F55\uFF0C\u5F39\u51FA\u767B\u5F55\u5F39\u7A97\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n // \u5DF2\u767B\u5F55\uFF0C\u6267\u884C\u8D2D\u4E70\n buyNow({\n customAttributes: [\n {\n key: '_member_type',\n value: String(profile?.memberType || 0),\n },\n ],\n lineItems: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n }\n\n return (\n <div\n className={cn(\n 'relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]',\n !rounded && 'rounded-none md:rounded-none',\n copy.badgeLabel ? 'pt-[48px] l:pt-[44px]' : 'pt-[24px] md-xl:pt-[16px] l:pt-[8px]',\n className\n )}\n >\n {/* Member \u6807\u7B7E Badge */}\n {copy.badgeLabel && (\n <Badge\n className=\"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10\"\n size=\"lg\"\n variant=\"promotional\"\n promotionalType=\"regular-member\"\n >\n {copy.badgeLabel}\n </Badge>\n )}\n\n {/* \u4EA7\u54C1\u56FE\u7247 - \u4F18\u5148\u4F7F\u7528\u4EA7\u54C1\u7684 metafields \u900F\u660E\u56FE */}\n <a\n href={\n extractVariantId(itemData.productVariant?.id)\n ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n : `/products/${itemData.product.handle}`\n }\n className={cn('relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]')}\n >\n <Picture\n className=\"mx-auto h-full w-auto\"\n imgClassName=\"h-full object-contain\"\n source={\n itemData?.productVariant?.metafields?.global?.transparentImg ||\n itemData?.config?.image?.url ||\n itemData?.productVariant?.image?.url\n }\n ></Picture>\n </a>\n\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className={cn('mt-[10px] xl:mt-[8px] w-full')}>\n {/* \u4EA7\u54C1\u6807\u9898 - \u4F7F\u7528\u4EA7\u54C1\u7684\u771F\u5B9E\u6807\u9898 */}\n <Text\n html={itemData?.product?.title}\n title={itemData?.product?.title}\n className=\"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n />\n\n {/* \u4EF7\u683C\u4FE1\u606F */}\n <div className=\"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0\">\n {/* Member Price \u6807\u7B7E - \u4F7F\u7528 text-brand-color-1 */}\n <Text\n html={copy.memberPriceLabel}\n className={cn(\n 'text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]',\n brand === 'ankersolix' &&\n 'leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n )}\n as=\"p\"\n />\n\n {/* \u4F1A\u5458\u4EF7\u548C\u539F\u4EF7\u5728\u540C\u4E00\u884C */}\n <div className=\"flex items-center gap-[4px]\">\n <Text\n html={formatPrice({\n amount: itemData.memberPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n as=\"span\"\n />\n <Text\n html={formatPrice({\n amount: itemData.originalPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n as=\"span\"\n />\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex w-full mt-[8px] gap-[8px] l:flex-col\">\n {/* Add to Cart \u6309\u94AE */}\n <Button\n variant=\"secondary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleAddToCart}\n disabled={!isAvailable || !cartConfig?.addToCart || isAddingToCart}\n loading={isAddingToCart}\n >\n {copy.addToCart}\n </Button>\n\n {/* Shop Now \u6309\u94AE */}\n <Button\n variant=\"primary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleShopNow}\n disabled={!isAvailable || isBuying}\n loading={isBuying}\n >\n {copy.shopNowText}\n </Button>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default MemberPriceItem\n"],
5
+ "mappings": "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",
6
6
  "names": ["MemberPriceItem_exports", "__export", "MemberPriceItem_default", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_react", "import_utils", "import_lib", "import_provider", "import_constants", "MemberPriceItem", "itemData", "copy", "className", "brand", "locale", "profile", "openSignUpPopup", "cartConfig", "rounded", "buyNow", "isBuying", "isAddingToCart", "setIsAddingToCart", "isAvailable", "isLogin", "getCouponCode", "discountData", "discounts", "now", "discount", "startsAt", "endsAt", "error", "handleAddToCart", "lineItemAttributes", "handleShopNow", "cn"]
7
7
  }
@@ -9,5 +9,5 @@ import{Fragment as v,jsx as i,jsxs as l}from"react/jsx-runtime";import{Button as
9
9
  aspect-ratio: ${c} !important;
10
10
  }
11
11
  }
12
- `}),a&&i("div",{className:"absolute inset-0 ",style:{background:"linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)"}}),i(u,{className:"l:h-auto !absolute inset-0 mx-auto grid h-full",asChild:!0,children:i("div",{className:"grid grid-cols-12",children:l("div",{className:"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]",children:[i(x,{as:"h1",className:"text-[48px] font-semibold xl-xxl:text-[40px] l:text-[32px]",html:a?t.login.title?.replace("$name",o||""):t.unLogin.title}),i(f,{size:"3",className:"l:mt-[4px] l-xxl:text-[14px] mt-[16px]",html:a?t.login.description:t.unLogin.description}),!a&&l("div",{className:b("mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]",a&&"hidden"),children:[i(s,{variant:"secondary",size:"lg",onClick:()=>{n("primary")},children:t.joinNow}),i(s,{variant:"primary",size:"lg",onClick:()=>{n("secondary")},children:t.loginIn})]})]})})})]})})}export{B as CreditsBanner};
12
+ `}),a&&i("div",{className:"absolute inset-0 ",style:{background:"linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)"}}),i(u,{className:"l:h-auto !absolute inset-0 mx-auto grid h-full",asChild:!0,children:i("div",{className:"grid grid-cols-12",children:l("div",{className:"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]",children:[i(x,{as:"h1",className:"text-[48px] font-bold xl-xxl:text-[40px] l:text-[32px]",html:a?t.login.title?.replace("$name",o||""):t.unLogin.title}),i(f,{size:"3",className:"l:mt-[4px] l-xxl:text-[14px] mt-[16px]",html:a?t.login.description:t.unLogin.description}),!a&&l("div",{className:b("mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]",a&&"hidden"),children:[i(s,{variant:"secondary",size:"lg",onClick:()=>{n("primary")},children:t.joinNow}),i(s,{variant:"primary",size:"lg",onClick:()=>{n("secondary")},children:t.loginIn})]})]})})})]})})}export{B as CreditsBanner};
13
13
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/components/credits/creditsBanner/index.tsx"],
4
- "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport classNames from 'classnames'\nimport { useCreditsContext } from '../context/provider'\n\ntype Img = {\n url: string\n alt: string\n width?: number\n height?: number\n}\nexport type CreditsBannerCopy = {\n pcImg: Img\n laptopImg: Img\n mobileImg: Img\n joinNow: string\n loginIn: string\n login: {\n title: string\n description: string\n }\n unLogin: {\n title: string\n description: string\n }\n}\n\nexport function CreditsBanner({ copy, id }: { copy: CreditsBannerCopy; id?: string }) {\n const { profile, openSignInPopup, openSignUpPopup } = useCreditsContext()\n const isLogin = profile ? Object.keys(profile).length !== 0 : false\n\n const displayName = profile?.first_name\n ? profile?.first_name + ' ' + profile?.last_name\n : profile?.email?.split('@')[0]\n\n const handleButtonClick = (buttonType: 'primary' | 'secondary') => {\n buttonType === 'primary' ? openSignUpPopup() : openSignInPopup()\n }\n\n // \u8BA1\u7B97\u56FE\u7247\u6BD4\u4F8B\uFF0C\u5982\u679C\u6CA1\u6709\u914D\u7F6E\u5219\u4F7F\u7528\u9ED8\u8BA4\u503C\n const pcAspectRatio =\n copy.pcImg?.width && copy.pcImg?.height ? `${copy.pcImg.width} / ${copy.pcImg.height}` : '1920 / 804'\n const laptopAspectRatio =\n copy.laptopImg?.width && copy.laptopImg?.height ? `${copy.laptopImg.width} / ${copy.laptopImg.height}` : '768 / 660'\n const mobileAspectRatio =\n copy.mobileImg?.width && copy.mobileImg?.height ? `${copy.mobileImg.width} / ${copy.mobileImg.height}` : '390 / 660'\n\n return (\n <>\n <div id={id} className=\" relative w-full\">\n <Picture\n className=\"credits-banner-image w-full\"\n style={{\n aspectRatio: pcAspectRatio,\n }}\n imgClassName=\"object-cover w-full h-full\"\n source={`${copy.pcImg?.url}, ${copy.laptopImg?.url} 1024, ${copy.mobileImg?.url} 768`}\n alt={copy.pcImg?.alt}\n loading=\"eager\"\n ></Picture>\n <style>\n {`\n @media (max-width: 1024px) and (min-width: 768px) {\n .credits-banner-image {\n aspect-ratio: ${laptopAspectRatio} !important;\n }\n }\n @media (max-width: 767px) {\n .credits-banner-image {\n aspect-ratio: ${mobileAspectRatio} !important;\n }\n }\n `}\n </style>\n {isLogin && (\n <div\n className=\"absolute inset-0 \"\n style={{\n background: 'linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)',\n }}\n ></div>\n )}\n\n <Container className=\"l:h-auto !absolute inset-0 mx-auto grid h-full\" asChild>\n <div className=\"grid grid-cols-12\">\n <div className=\"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]\">\n <Heading\n as=\"h1\"\n className=\"text-[48px] font-semibold xl-xxl:text-[40px] l:text-[32px]\"\n html={isLogin ? copy.login.title?.replace('$name', displayName || '') : copy.unLogin.title}\n ></Heading>\n\n <Text\n size=\"3\"\n className=\"l:mt-[4px] l-xxl:text-[14px] mt-[16px]\"\n html={isLogin ? copy.login.description : copy.unLogin.description}\n ></Text>\n\n {!isLogin && (\n <div\n className={classNames(\n 'mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]',\n isLogin && 'hidden'\n )}\n >\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('primary')\n }}\n >\n {copy.joinNow}\n </Button>\n <Button\n variant=\"primary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('secondary')\n }}\n >\n {copy.loginIn}\n </Button>\n </div>\n )}\n </div>\n </div>\n </Container>\n </div>\n </>\n )\n}\n"],
5
- "mappings": "AA+CI,mBAAAA,EAEI,OAAAC,EAiDQ,QAAAC,MAnDZ,oBA/CJ,OAAS,UAAAC,EAAQ,aAAAC,EAAW,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,wBAC1D,OAAOC,MAAgB,aACvB,OAAS,qBAAAC,MAAyB,sBAwB3B,SAASC,EAAc,CAAE,KAAAC,EAAM,GAAAC,CAAG,EAA6C,CACpF,KAAM,CAAE,QAAAC,EAAS,gBAAAC,EAAiB,gBAAAC,CAAgB,EAAIN,EAAkB,EAClEO,EAAUH,EAAU,OAAO,KAAKA,CAAO,EAAE,SAAW,EAAI,GAExDI,EAAcJ,GAAS,WACzBA,GAAS,WAAa,IAAMA,GAAS,UACrCA,GAAS,OAAO,MAAM,GAAG,EAAE,CAAC,EAE1BK,EAAqBC,GAAwC,CACjEA,IAAe,UAAYJ,EAAgB,EAAID,EAAgB,CACjE,EAGMM,EACJT,EAAK,OAAO,OAASA,EAAK,OAAO,OAAS,GAAGA,EAAK,MAAM,KAAK,MAAMA,EAAK,MAAM,MAAM,GAAK,aACrFU,EACJV,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YACrGW,EACJX,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YAE3G,OACEV,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,GAAIU,EAAI,UAAU,mBACrB,UAAAX,EAACK,EAAA,CACC,UAAU,8BACV,MAAO,CACL,YAAac,CACf,EACA,aAAa,6BACb,OAAQ,GAAGT,EAAK,OAAO,GAAG,KAAKA,EAAK,WAAW,GAAG,UAAUA,EAAK,WAAW,GAAG,OAC/E,IAAKA,EAAK,OAAO,IACjB,QAAQ,QACT,EACDV,EAAC,SACE;AAAA;AAAA;AAAA,gCAGqBoB,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,gCAKjBC,CAAiB;AAAA;AAAA;AAAA,YAIzC,EACCN,GACCf,EAAC,OACC,UAAU,oBACV,MAAO,CACL,WAAY,sEACd,EACD,EAGHA,EAACG,EAAA,CAAU,UAAU,iDAAiD,QAAO,GAC3E,SAAAH,EAAC,OAAI,UAAU,oBACb,SAAAC,EAAC,OAAI,UAAU,qHACb,UAAAD,EAACI,EAAA,CACC,GAAG,KACH,UAAU,6DACV,KAAMW,EAAUL,EAAK,MAAM,OAAO,QAAQ,QAASM,GAAe,EAAE,EAAIN,EAAK,QAAQ,MACtF,EAEDV,EAACM,EAAA,CACC,KAAK,IACL,UAAU,yCACV,KAAMS,EAAUL,EAAK,MAAM,YAAcA,EAAK,QAAQ,YACvD,EAEA,CAACK,GACAd,EAAC,OACC,UAAWM,EACT,4DACAQ,GAAW,QACb,EAEA,UAAAf,EAACE,EAAA,CACC,QAAQ,YACR,KAAK,KACL,QAAS,IAAM,CACbe,EAAkB,SAAS,CAC7B,EAEC,SAAAP,EAAK,QACR,EACAV,EAACE,EAAA,CACC,QAAQ,UACR,KAAK,KACL,QAAS,IAAM,CACbe,EAAkB,WAAW,CAC/B,EAEC,SAAAP,EAAK,QACR,GACF,GAEJ,EACF,EACF,GACF,EACF,CAEJ",
4
+ "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport classNames from 'classnames'\nimport { useCreditsContext } from '../context/provider'\n\ntype Img = {\n url: string\n alt: string\n width?: number\n height?: number\n}\nexport type CreditsBannerCopy = {\n pcImg: Img\n laptopImg: Img\n mobileImg: Img\n joinNow: string\n loginIn: string\n login: {\n title: string\n description: string\n }\n unLogin: {\n title: string\n description: string\n }\n}\n\nexport function CreditsBanner({ copy, id }: { copy: CreditsBannerCopy; id?: string }) {\n const { profile, openSignInPopup, openSignUpPopup } = useCreditsContext()\n const isLogin = profile ? Object.keys(profile).length !== 0 : false\n\n const displayName = profile?.first_name\n ? profile?.first_name + ' ' + profile?.last_name\n : profile?.email?.split('@')[0]\n\n const handleButtonClick = (buttonType: 'primary' | 'secondary') => {\n buttonType === 'primary' ? openSignUpPopup() : openSignInPopup()\n }\n\n // \u8BA1\u7B97\u56FE\u7247\u6BD4\u4F8B\uFF0C\u5982\u679C\u6CA1\u6709\u914D\u7F6E\u5219\u4F7F\u7528\u9ED8\u8BA4\u503C\n const pcAspectRatio =\n copy.pcImg?.width && copy.pcImg?.height ? `${copy.pcImg.width} / ${copy.pcImg.height}` : '1920 / 804'\n const laptopAspectRatio =\n copy.laptopImg?.width && copy.laptopImg?.height ? `${copy.laptopImg.width} / ${copy.laptopImg.height}` : '768 / 660'\n const mobileAspectRatio =\n copy.mobileImg?.width && copy.mobileImg?.height ? `${copy.mobileImg.width} / ${copy.mobileImg.height}` : '390 / 660'\n\n return (\n <>\n <div id={id} className=\" relative w-full\">\n <Picture\n className=\"credits-banner-image w-full\"\n style={{\n aspectRatio: pcAspectRatio,\n }}\n imgClassName=\"object-cover w-full h-full\"\n source={`${copy.pcImg?.url}, ${copy.laptopImg?.url} 1024, ${copy.mobileImg?.url} 768`}\n alt={copy.pcImg?.alt}\n loading=\"eager\"\n ></Picture>\n <style>\n {`\n @media (max-width: 1024px) and (min-width: 768px) {\n .credits-banner-image {\n aspect-ratio: ${laptopAspectRatio} !important;\n }\n }\n @media (max-width: 767px) {\n .credits-banner-image {\n aspect-ratio: ${mobileAspectRatio} !important;\n }\n }\n `}\n </style>\n {isLogin && (\n <div\n className=\"absolute inset-0 \"\n style={{\n background: 'linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)',\n }}\n ></div>\n )}\n\n <Container className=\"l:h-auto !absolute inset-0 mx-auto grid h-full\" asChild>\n <div className=\"grid grid-cols-12\">\n <div className=\"l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]\">\n <Heading\n as=\"h1\"\n className=\"text-[48px] font-bold xl-xxl:text-[40px] l:text-[32px]\"\n html={isLogin ? copy.login.title?.replace('$name', displayName || '') : copy.unLogin.title}\n ></Heading>\n\n <Text\n size=\"3\"\n className=\"l:mt-[4px] l-xxl:text-[14px] mt-[16px]\"\n html={isLogin ? copy.login.description : copy.unLogin.description}\n ></Text>\n\n {!isLogin && (\n <div\n className={classNames(\n 'mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]',\n isLogin && 'hidden'\n )}\n >\n <Button\n variant=\"secondary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('primary')\n }}\n >\n {copy.joinNow}\n </Button>\n <Button\n variant=\"primary\"\n size=\"lg\"\n onClick={() => {\n handleButtonClick('secondary')\n }}\n >\n {copy.loginIn}\n </Button>\n </div>\n )}\n </div>\n </div>\n </Container>\n </div>\n </>\n )\n}\n"],
5
+ "mappings": "AA+CI,mBAAAA,EAEI,OAAAC,EAiDQ,QAAAC,MAnDZ,oBA/CJ,OAAS,UAAAC,EAAQ,aAAAC,EAAW,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,wBAC1D,OAAOC,MAAgB,aACvB,OAAS,qBAAAC,MAAyB,sBAwB3B,SAASC,EAAc,CAAE,KAAAC,EAAM,GAAAC,CAAG,EAA6C,CACpF,KAAM,CAAE,QAAAC,EAAS,gBAAAC,EAAiB,gBAAAC,CAAgB,EAAIN,EAAkB,EAClEO,EAAUH,EAAU,OAAO,KAAKA,CAAO,EAAE,SAAW,EAAI,GAExDI,EAAcJ,GAAS,WACzBA,GAAS,WAAa,IAAMA,GAAS,UACrCA,GAAS,OAAO,MAAM,GAAG,EAAE,CAAC,EAE1BK,EAAqBC,GAAwC,CACjEA,IAAe,UAAYJ,EAAgB,EAAID,EAAgB,CACjE,EAGMM,EACJT,EAAK,OAAO,OAASA,EAAK,OAAO,OAAS,GAAGA,EAAK,MAAM,KAAK,MAAMA,EAAK,MAAM,MAAM,GAAK,aACrFU,EACJV,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YACrGW,EACJX,EAAK,WAAW,OAASA,EAAK,WAAW,OAAS,GAAGA,EAAK,UAAU,KAAK,MAAMA,EAAK,UAAU,MAAM,GAAK,YAE3G,OACEV,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,GAAIU,EAAI,UAAU,mBACrB,UAAAX,EAACK,EAAA,CACC,UAAU,8BACV,MAAO,CACL,YAAac,CACf,EACA,aAAa,6BACb,OAAQ,GAAGT,EAAK,OAAO,GAAG,KAAKA,EAAK,WAAW,GAAG,UAAUA,EAAK,WAAW,GAAG,OAC/E,IAAKA,EAAK,OAAO,IACjB,QAAQ,QACT,EACDV,EAAC,SACE;AAAA;AAAA;AAAA,gCAGqBoB,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,gCAKjBC,CAAiB;AAAA;AAAA;AAAA,YAIzC,EACCN,GACCf,EAAC,OACC,UAAU,oBACV,MAAO,CACL,WAAY,sEACd,EACD,EAGHA,EAACG,EAAA,CAAU,UAAU,iDAAiD,QAAO,GAC3E,SAAAH,EAAC,OAAI,UAAU,oBACb,SAAAC,EAAC,OAAI,UAAU,qHACb,UAAAD,EAACI,EAAA,CACC,GAAG,KACH,UAAU,yDACV,KAAMW,EAAUL,EAAK,MAAM,OAAO,QAAQ,QAASM,GAAe,EAAE,EAAIN,EAAK,QAAQ,MACtF,EAEDV,EAACM,EAAA,CACC,KAAK,IACL,UAAU,yCACV,KAAMS,EAAUL,EAAK,MAAM,YAAcA,EAAK,QAAQ,YACvD,EAEA,CAACK,GACAd,EAAC,OACC,UAAWM,EACT,4DACAQ,GAAW,QACb,EAEA,UAAAf,EAACE,EAAA,CACC,QAAQ,YACR,KAAK,KACL,QAAS,IAAM,CACbe,EAAkB,SAAS,CAC7B,EAEC,SAAAP,EAAK,QACR,EACAV,EAACE,EAAA,CACC,QAAQ,UACR,KAAK,KACL,QAAS,IAAM,CACbe,EAAkB,WAAW,CAC/B,EAEC,SAAAP,EAAK,QACR,GACF,GAEJ,EACF,EACF,GACF,EACF,CAEJ",
6
6
  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "classNames", "useCreditsContext", "CreditsBanner", "copy", "id", "profile", "openSignInPopup", "openSignUpPopup", "isLogin", "displayName", "handleButtonClick", "buttonType", "pcAspectRatio", "laptopAspectRatio", "mobileAspectRatio"]
7
7
  }
@@ -1,2 +1,2 @@
1
- import{jsx as r,jsxs as l}from"react/jsx-runtime";import{Button as N,Text as d,Picture as I,Badge as M}from"@anker-in/headless-ui";import{useMemo as u,useState as L}from"react";import{formatPrice as A,extractVariantId as w}from"../context/utils";import{classNames as s,useHeadlessContext as z,useBuyNow as E}from"@anker-in/lib";import{useCreditsContext as F}from"../context/provider";import{ROUNDED_BRANDS as O}from"../../../constants";function U({itemData:e,copy:n,className:P}){const{brand:x,locale:m}=z(),{profile:o,openSignUpPopup:_,cartConfig:c}=F(),T=O.includes(x),{trigger:V,isMutating:f}=E({},{throwOnError:!0}),[g,b]=L(!1),v=u(()=>e.productVariant?.availableForSale,[e.productVariant?.availableForSale]),k=u(()=>!!o,[o]),a=u(()=>{try{const t=e.productVariant?.metafields?.__discountCodeApp?.data;if(!t)return;const p=t;if(!Array.isArray(p)||p.length===0)return;const C=new Date;return p.find(i=>{const y=i.starts_at?new Date(i.starts_at):null,h=i.ends_at?new Date(i.ends_at):null;return!(y&&y>C||h&&h<C)})?.title}catch(t){console.error("Failed to get discount code:",t);return}},[e.productVariant?.metafields]),S=async()=>{if(!c?.addToCart){console.warn("cartConfig.addToCart is required");return}try{b(!0);const t=[];a&&t.push({key:"_member_price",value:JSON.stringify({code:a})}),await c.addToCart({variantList:[{variant:e.productVariant,quantity:1,attributes:t.length>0?t:void 0}],cartAttributes:{_member_type:String(o?.memberType||0)},discountCodes:a?[a]:void 0})}catch(t){console.error("Add to cart failed:",t)}finally{b(!1)}},B=()=>{if(!k){_();return}const t=[];a&&t.push({key:"_member_price",value:JSON.stringify({code:a})}),V({customAttributes:[{key:"_member_type",value:String(o?.memberType||0)}],lineItems:[{variant:e.productVariant,quantity:1,attributes:t.length>0?t:void 0}],discountCodes:a?[a]:void 0})};return l("div",{className:s("relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]",!T&&"rounded-none md:rounded-none",n.badgeLabel?"pt-[48px] l:pt-[44px]":"pt-[24px] md-xl:pt-[16px] l:pt-[8px]",P),children:[n.badgeLabel&&r(M,{className:"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10",size:"lg",variant:"promotional",promotionalType:"regular-member",children:n.badgeLabel}),r("a",{href:w(e.productVariant?.id)?`/products/${e.product.handle}?variant=${w(e.productVariant?.id)}`:`/products/${e.product.handle}`,className:s("relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]"),children:r(I,{className:"mx-auto size-full",imgClassName:"object-contain",source:e?.productVariant?.metafields?.global?.transparentImg||e?.config?.image?.url||e?.productVariant?.image?.url})}),l("div",{className:s("mt-[10px] xl:mt-[8px] w-full"),children:[r(d,{html:e?.product?.title,title:e?.product?.title,className:"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]"}),l("div",{className:"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0",children:[r(d,{html:n.memberPriceLabel,className:s("text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]",x==="ankersolix"&&"leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent"),as:"p"}),l("div",{className:"flex items-center gap-[4px]",children:[r(d,{html:A({amount:e.memberPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:m}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]",as:"span"}),r(d,{html:A({amount:e.originalPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:m}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through",as:"span"})]}),l("div",{className:"flex w-full mt-[8px] gap-[8px] l:flex-col",children:[r(N,{variant:"secondary",className:"flex-1 md:w-full",size:"lg",onClick:S,disabled:!v||!c?.addToCart||g,loading:g,children:n.addToCart}),r(N,{variant:"primary",className:"flex-1 md:w-full",size:"lg",onClick:B,disabled:!v||f,loading:f,children:n.shopNowText})]})]})]})]})}var X=U;export{X as default};
1
+ import{jsx as r,jsxs as l}from"react/jsx-runtime";import{Button as N,Text as d,Picture as I,Badge as M}from"@anker-in/headless-ui";import{useMemo as u,useState as L}from"react";import{formatPrice as A,extractVariantId as w}from"../context/utils";import{classNames as s,useHeadlessContext as E,useBuyNow as F}from"@anker-in/lib";import{useCreditsContext as z}from"../context/provider";import{ROUNDED_BRANDS as O}from"../../../constants";function U({itemData:e,copy:n,className:P}){const{brand:x,locale:m}=E(),{profile:o,openSignUpPopup:_,cartConfig:c}=z(),T=O.includes(x),{trigger:V,isMutating:f}=F({},{throwOnError:!0}),[g,b]=L(!1),v=u(()=>e.productVariant?.availableForSale,[e.productVariant?.availableForSale]),k=u(()=>!!o,[o]),a=u(()=>{try{const t=e.productVariant?.metafields?.__discountCodeApp?.data;if(!t)return;const p=t;if(!Array.isArray(p)||p.length===0)return;const C=new Date;return p.find(i=>{const y=i.starts_at?new Date(i.starts_at):null,h=i.ends_at?new Date(i.ends_at):null;return!(y&&y>C||h&&h<C)})?.title}catch(t){console.error("Failed to get discount code:",t);return}},[e.productVariant?.metafields]),S=async()=>{if(!c?.addToCart){console.warn("cartConfig.addToCart is required");return}try{b(!0);const t=[];a&&t.push({key:"_member_price",value:JSON.stringify({code:a})}),await c.addToCart({variantList:[{variant:e.productVariant,quantity:1,attributes:t.length>0?t:void 0}],cartAttributes:{_member_type:String(o?.memberType||0)},discountCodes:a?[a]:void 0})}catch(t){console.error("Add to cart failed:",t)}finally{b(!1)}},B=()=>{if(!k){_();return}const t=[];a&&t.push({key:"_member_price",value:JSON.stringify({code:a})}),V({customAttributes:[{key:"_member_type",value:String(o?.memberType||0)}],lineItems:[{variant:e.productVariant,quantity:1,attributes:t.length>0?t:void 0}],discountCodes:a?[a]:void 0})};return l("div",{className:s("relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]",!T&&"rounded-none md:rounded-none",n.badgeLabel?"pt-[48px] l:pt-[44px]":"pt-[24px] md-xl:pt-[16px] l:pt-[8px]",P),children:[n.badgeLabel&&r(M,{className:"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10",size:"lg",variant:"promotional",promotionalType:"regular-member",children:n.badgeLabel}),r("a",{href:w(e.productVariant?.id)?`/products/${e.product.handle}?variant=${w(e.productVariant?.id)}`:`/products/${e.product.handle}`,className:s("relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]"),children:r(I,{className:"mx-auto h-full w-auto",imgClassName:"h-full object-contain",source:e?.productVariant?.metafields?.global?.transparentImg||e?.config?.image?.url||e?.productVariant?.image?.url})}),l("div",{className:s("mt-[10px] xl:mt-[8px] w-full"),children:[r(d,{html:e?.product?.title,title:e?.product?.title,className:"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]"}),l("div",{className:"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0",children:[r(d,{html:n.memberPriceLabel,className:s("text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]",x==="ankersolix"&&"leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent"),as:"p"}),l("div",{className:"flex items-center gap-[4px]",children:[r(d,{html:A({amount:e.memberPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:m}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]",as:"span"}),r(d,{html:A({amount:e.originalPrice,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:m}),className:"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through",as:"span"})]}),l("div",{className:"flex w-full mt-[8px] gap-[8px] l:flex-col",children:[r(N,{variant:"secondary",className:"flex-1 md:w-full",size:"lg",onClick:S,disabled:!v||!c?.addToCart||g,loading:g,children:n.addToCart}),r(N,{variant:"primary",className:"flex-1 md:w-full",size:"lg",onClick:B,disabled:!v||f,loading:f,children:n.shopNowText})]})]})]})]})}var X=U;export{X as default};
2
2
  //# sourceMappingURL=MemberPriceItem.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/components/credits/creditsMemberPrice/MemberPriceItem.tsx"],
4
- "sourcesContent": ["import { Button, Text, Picture, Badge } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsMemberPriceCopy, MemberPriceProduct } from './type'\nimport { formatPrice, extractVariantId } from '../context/utils'\nimport { classNames as cn, useHeadlessContext, useBuyNow } from '@anker-in/lib'\nimport { useCreditsContext } from '../context/provider'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction MemberPriceItem({\n itemData,\n copy,\n className,\n}: {\n itemData: MemberPriceProduct\n copy: CreditsMemberPriceCopy['memberPriceTab']\n className?: string\n}) {\n const { brand, locale } = useHeadlessContext()\n const { profile, openSignUpPopup, cartConfig } = useCreditsContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n // \u4F7F\u7528 buyNow hook \u6765\u5904\u7406\u7ED3\u7B97\n const { trigger: buyNow, isMutating: isBuying } = useBuyNow({}, { throwOnError: true })\n\n // \u672C\u5730 loading \u72B6\u6001\uFF0C\u907F\u514D\u5168\u5C40 loading \u5F71\u54CD\u6240\u6709\u5361\u7247\n const [isAddingToCart, setIsAddingToCart] = useState(false)\n\n const isAvailable = useMemo(() => {\n return itemData.productVariant?.availableForSale\n }, [itemData.productVariant?.availableForSale])\n\n const isLogin = useMemo(() => {\n return !!profile\n }, [profile])\n\n // \u4ECE variant metafields \u4E2D\u83B7\u53D6 coupon code\n const getCouponCode = useMemo(() => {\n try {\n const discountData = itemData.productVariant?.metafields?.__discountCodeApp?.data\n if (!discountData) return undefined\n\n // discountData \u5DF2\u7ECF\u662F\u5BF9\u8C61\uFF0C\u4E0D\u9700\u8981 JSON.parse\n const discounts = discountData\n if (!Array.isArray(discounts) || discounts.length === 0) return undefined\n\n // \u83B7\u53D6\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 coupon\uFF08\u68C0\u67E5\u65F6\u95F4\u8303\u56F4\uFF09\n const now = new Date()\n const validDiscount = discounts.find((discount: any) => {\n const startsAt = discount.starts_at ? new Date(discount.starts_at) : null\n const endsAt = discount.ends_at ? new Date(discount.ends_at) : null\n\n // \u68C0\u67E5 coupon \u662F\u5426\u5728\u6709\u6548\u671F\u5185\n if (startsAt && startsAt > now) return false\n if (endsAt && endsAt < now) return false\n\n return true\n })\n\n return validDiscount?.title\n } catch (error) {\n console.error('Failed to get discount code:', error)\n return undefined\n }\n }, [itemData.productVariant?.metafields])\n\n // Add to Cart \u6309\u94AE\u70B9\u51FB - \u8C03\u7528\u52A0\u8D2D\u65B9\u6CD5\n const handleAddToCart = async () => {\n if (!cartConfig?.addToCart) {\n console.warn('cartConfig.addToCart is required')\n return\n }\n\n try {\n setIsAddingToCart(true)\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n await cartConfig.addToCart({\n variantList: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n cartAttributes: {\n _member_type: String(profile?.memberType || 0),\n },\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n } catch (error) {\n console.error('Add to cart failed:', error)\n } finally {\n setIsAddingToCart(false)\n }\n }\n\n // Shop Now \u6309\u94AE\u70B9\u51FB - \u68C0\u67E5\u767B\u5F55\u72B6\u6001\u540E\u4F7F\u7528 buyNow \u8FDB\u884C\u7ED3\u7B97\n const handleShopNow = () => {\n // \u5982\u679C\u672A\u767B\u5F55\uFF0C\u5F39\u51FA\u767B\u5F55\u5F39\u7A97\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n // \u5DF2\u767B\u5F55\uFF0C\u6267\u884C\u8D2D\u4E70\n buyNow({\n customAttributes: [\n {\n key: '_member_type',\n value: String(profile?.memberType || 0),\n },\n ],\n lineItems: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n }\n\n return (\n <div\n className={cn(\n 'relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]',\n !rounded && 'rounded-none md:rounded-none',\n copy.badgeLabel ? 'pt-[48px] l:pt-[44px]' : 'pt-[24px] md-xl:pt-[16px] l:pt-[8px]',\n className\n )}\n >\n {/* Member \u6807\u7B7E Badge */}\n {copy.badgeLabel && (\n <Badge\n className=\"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10\"\n size=\"lg\"\n variant=\"promotional\"\n promotionalType=\"regular-member\"\n >\n {copy.badgeLabel}\n </Badge>\n )}\n\n {/* \u4EA7\u54C1\u56FE\u7247 - \u4F18\u5148\u4F7F\u7528\u4EA7\u54C1\u7684 metafields \u900F\u660E\u56FE */}\n <a\n href={\n extractVariantId(itemData.productVariant?.id)\n ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n : `/products/${itemData.product.handle}`\n }\n className={cn('relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]')}\n >\n <Picture\n className=\"mx-auto size-full\"\n imgClassName=\"object-contain\"\n source={\n itemData?.productVariant?.metafields?.global?.transparentImg ||\n itemData?.config?.image?.url ||\n itemData?.productVariant?.image?.url\n }\n ></Picture>\n </a>\n\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className={cn('mt-[10px] xl:mt-[8px] w-full')}>\n {/* \u4EA7\u54C1\u6807\u9898 - \u4F7F\u7528\u4EA7\u54C1\u7684\u771F\u5B9E\u6807\u9898 */}\n <Text\n html={itemData?.product?.title}\n title={itemData?.product?.title}\n className=\"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n />\n\n {/* \u4EF7\u683C\u4FE1\u606F */}\n <div className=\"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0\">\n {/* Member Price \u6807\u7B7E - \u4F7F\u7528 text-brand-color-1 */}\n <Text\n html={copy.memberPriceLabel}\n className={cn(\n 'text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]',\n brand === 'ankersolix' &&\n 'leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n )}\n as=\"p\"\n />\n\n {/* \u4F1A\u5458\u4EF7\u548C\u539F\u4EF7\u5728\u540C\u4E00\u884C */}\n <div className=\"flex items-center gap-[4px]\">\n <Text\n html={formatPrice({\n amount: itemData.memberPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n as=\"span\"\n />\n <Text\n html={formatPrice({\n amount: itemData.originalPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n as=\"span\"\n />\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex w-full mt-[8px] gap-[8px] l:flex-col\">\n {/* Add to Cart \u6309\u94AE */}\n <Button\n variant=\"secondary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleAddToCart}\n disabled={!isAvailable || !cartConfig?.addToCart || isAddingToCart}\n loading={isAddingToCart}\n >\n {copy.addToCart}\n </Button>\n\n {/* Shop Now \u6309\u94AE */}\n <Button\n variant=\"primary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleShopNow}\n disabled={!isAvailable || isBuying}\n loading={isBuying}\n >\n {copy.shopNowText}\n </Button>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default MemberPriceItem\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { Button, Text, Picture, Badge } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsMemberPriceCopy, MemberPriceProduct } from './type'\nimport { formatPrice, extractVariantId } from '../context/utils'\nimport { classNames as cn, useHeadlessContext, useBuyNow } from '@anker-in/lib'\nimport { useCreditsContext } from '../context/provider'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction MemberPriceItem({\n itemData,\n copy,\n className,\n}: {\n itemData: MemberPriceProduct\n copy: CreditsMemberPriceCopy['memberPriceTab']\n className?: string\n}) {\n const { brand, locale } = useHeadlessContext()\n const { profile, openSignUpPopup, cartConfig } = useCreditsContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n // \u4F7F\u7528 buyNow hook \u6765\u5904\u7406\u7ED3\u7B97\n const { trigger: buyNow, isMutating: isBuying } = useBuyNow({}, { throwOnError: true })\n\n // \u672C\u5730 loading \u72B6\u6001\uFF0C\u907F\u514D\u5168\u5C40 loading \u5F71\u54CD\u6240\u6709\u5361\u7247\n const [isAddingToCart, setIsAddingToCart] = useState(false)\n\n const isAvailable = useMemo(() => {\n return itemData.productVariant?.availableForSale\n }, [itemData.productVariant?.availableForSale])\n\n const isLogin = useMemo(() => {\n return !!profile\n }, [profile])\n\n // \u4ECE variant metafields \u4E2D\u83B7\u53D6 coupon code\n const getCouponCode = useMemo(() => {\n try {\n const discountData = itemData.productVariant?.metafields?.__discountCodeApp?.data\n if (!discountData) return undefined\n\n // discountData \u5DF2\u7ECF\u662F\u5BF9\u8C61\uFF0C\u4E0D\u9700\u8981 JSON.parse\n const discounts = discountData\n if (!Array.isArray(discounts) || discounts.length === 0) return undefined\n\n // \u83B7\u53D6\u7B2C\u4E00\u4E2A\u6709\u6548\u7684 coupon\uFF08\u68C0\u67E5\u65F6\u95F4\u8303\u56F4\uFF09\n const now = new Date()\n const validDiscount = discounts.find((discount: any) => {\n const startsAt = discount.starts_at ? new Date(discount.starts_at) : null\n const endsAt = discount.ends_at ? new Date(discount.ends_at) : null\n\n // \u68C0\u67E5 coupon \u662F\u5426\u5728\u6709\u6548\u671F\u5185\n if (startsAt && startsAt > now) return false\n if (endsAt && endsAt < now) return false\n\n return true\n })\n\n return validDiscount?.title\n } catch (error) {\n console.error('Failed to get discount code:', error)\n return undefined\n }\n }, [itemData.productVariant?.metafields])\n\n // Add to Cart \u6309\u94AE\u70B9\u51FB - \u8C03\u7528\u52A0\u8D2D\u65B9\u6CD5\n const handleAddToCart = async () => {\n if (!cartConfig?.addToCart) {\n console.warn('cartConfig.addToCart is required')\n return\n }\n\n try {\n setIsAddingToCart(true)\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n await cartConfig.addToCart({\n variantList: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n cartAttributes: {\n _member_type: String(profile?.memberType || 0),\n },\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n } catch (error) {\n console.error('Add to cart failed:', error)\n } finally {\n setIsAddingToCart(false)\n }\n }\n\n // Shop Now \u6309\u94AE\u70B9\u51FB - \u68C0\u67E5\u767B\u5F55\u72B6\u6001\u540E\u4F7F\u7528 buyNow \u8FDB\u884C\u7ED3\u7B97\n const handleShopNow = () => {\n // \u5982\u679C\u672A\u767B\u5F55\uFF0C\u5F39\u51FA\u767B\u5F55\u5F39\u7A97\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n\n // \u6784\u5EFA lineItem attributes\n const lineItemAttributes: Array<{ key: string; value: string }> = []\n if (getCouponCode) {\n lineItemAttributes.push({\n key: '_member_price',\n value: JSON.stringify({ code: getCouponCode }),\n })\n }\n\n // \u5DF2\u767B\u5F55\uFF0C\u6267\u884C\u8D2D\u4E70\n buyNow({\n customAttributes: [\n {\n key: '_member_type',\n value: String(profile?.memberType || 0),\n },\n ],\n lineItems: [\n {\n variant: itemData.productVariant,\n quantity: 1,\n attributes: lineItemAttributes.length > 0 ? lineItemAttributes : undefined,\n },\n ],\n discountCodes: getCouponCode ? [getCouponCode] : undefined,\n })\n }\n\n return (\n <div\n className={cn(\n 'relative flex flex-col items-center bg-[#EAEAEC] px-[24px] pb-[24px] l:px-[8px] l:pb-[8px] rounded-[16px] md-xl:px-[16px] md-xl:pb-[16px] md:rounded-[12px]',\n !rounded && 'rounded-none md:rounded-none',\n copy.badgeLabel ? 'pt-[48px] l:pt-[44px]' : 'pt-[24px] md-xl:pt-[16px] l:pt-[8px]',\n className\n )}\n >\n {/* Member \u6807\u7B7E Badge */}\n {copy.badgeLabel && (\n <Badge\n className=\"absolute left-[24px] !bg-gradient-brand l:left-[16px] top-[16px] z-10\"\n size=\"lg\"\n variant=\"promotional\"\n promotionalType=\"regular-member\"\n >\n {copy.badgeLabel}\n </Badge>\n )}\n\n {/* \u4EA7\u54C1\u56FE\u7247 - \u4F18\u5148\u4F7F\u7528\u4EA7\u54C1\u7684 metafields \u900F\u660E\u56FE */}\n <a\n href={\n extractVariantId(itemData.productVariant?.id)\n ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n : `/products/${itemData.product.handle}`\n }\n className={cn('relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]')}\n >\n <Picture\n className=\"mx-auto h-full w-auto\"\n imgClassName=\"h-full object-contain\"\n source={\n itemData?.productVariant?.metafields?.global?.transparentImg ||\n itemData?.config?.image?.url ||\n itemData?.productVariant?.image?.url\n }\n ></Picture>\n </a>\n\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className={cn('mt-[10px] xl:mt-[8px] w-full')}>\n {/* \u4EA7\u54C1\u6807\u9898 - \u4F7F\u7528\u4EA7\u54C1\u7684\u771F\u5B9E\u6807\u9898 */}\n <Text\n html={itemData?.product?.title}\n title={itemData?.product?.title}\n className=\"line-clamp-2 text-[24px] min-h-[58px] l-xxl:min-h-[48px] l:min-h-[38px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n />\n\n {/* \u4EF7\u683C\u4FE1\u606F */}\n <div className=\"mt-[24px] l:mt-[12px] flex flex-col gap-[8px] l:gap-0\">\n {/* Member Price \u6807\u7B7E - \u4F7F\u7528 text-brand-color-1 */}\n <Text\n html={copy.memberPriceLabel}\n className={cn(\n 'text-brand-color-0 text-[16px] l-xl:text-[14px] l:text-[12px] w-fit font-bold leading-[1.4] tracking-[-0.28px]',\n brand === 'ankersolix' &&\n 'leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-[43%] to-[#00db84] bg-clip-text text-transparent'\n )}\n as=\"p\"\n />\n\n {/* \u4F1A\u5458\u4EF7\u548C\u539F\u4EF7\u5728\u540C\u4E00\u884C */}\n <div className=\"flex items-center gap-[4px]\">\n <Text\n html={formatPrice({\n amount: itemData.memberPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#080A0F]\"\n as=\"span\"\n />\n <Text\n html={formatPrice({\n amount: itemData.originalPrice,\n currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n locale: locale,\n })}\n className=\"text-[24px] l-xxl:text-[20px] l:text-[16px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n as=\"span\"\n />\n </div>\n\n {/* \u6309\u94AE\u7EC4 */}\n <div className=\"flex w-full mt-[8px] gap-[8px] l:flex-col\">\n {/* Add to Cart \u6309\u94AE */}\n <Button\n variant=\"secondary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleAddToCart}\n disabled={!isAvailable || !cartConfig?.addToCart || isAddingToCart}\n loading={isAddingToCart}\n >\n {copy.addToCart}\n </Button>\n\n {/* Shop Now \u6309\u94AE */}\n <Button\n variant=\"primary\"\n className=\"flex-1 md:w-full\"\n size=\"lg\"\n onClick={handleShopNow}\n disabled={!isAvailable || isBuying}\n loading={isBuying}\n >\n {copy.shopNowText}\n </Button>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default MemberPriceItem\n"],
5
+ "mappings": "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",
6
6
  "names": ["jsx", "jsxs", "Button", "Text", "Picture", "Badge", "useMemo", "useState", "formatPrice", "extractVariantId", "cn", "useHeadlessContext", "useBuyNow", "useCreditsContext", "ROUNDED_BRANDS", "MemberPriceItem", "itemData", "copy", "className", "brand", "locale", "profile", "openSignUpPopup", "cartConfig", "rounded", "buyNow", "isBuying", "isAddingToCart", "setIsAddingToCart", "isAvailable", "isLogin", "getCouponCode", "discountData", "discounts", "now", "discount", "startsAt", "endsAt", "error", "handleAddToCart", "lineItemAttributes", "handleShopNow", "MemberPriceItem_default"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/campaign-ui",
3
- "version": "0.2.11-beta.13",
3
+ "version": "0.2.11-beta.15",
4
4
  "description": "Campaign UI components and utilities for Anker projects",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",
@@ -85,7 +85,7 @@ export function CreditsBanner({ copy, id }: { copy: CreditsBannerCopy; id?: stri
85
85
  <div className="l:col-span-12 l:justify-start l:truncate l:pt-[32px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]">
86
86
  <Heading
87
87
  as="h1"
88
- className="text-[48px] font-semibold xl-xxl:text-[40px] l:text-[32px]"
88
+ className="text-[48px] font-bold xl-xxl:text-[40px] l:text-[32px]"
89
89
  html={isLogin ? copy.login.title?.replace('$name', displayName || '') : copy.unLogin.title}
90
90
  ></Heading>
91
91
 
@@ -170,8 +170,8 @@ function MemberPriceItem({
170
170
  className={cn('relative mx-auto h-[196px] w-fit md:h-[120px] md-xxl:h-[138px]')}
171
171
  >
172
172
  <Picture
173
- className="mx-auto size-full"
174
- imgClassName="object-contain"
173
+ className="mx-auto h-full w-auto"
174
+ imgClassName="h-full object-contain"
175
175
  source={
176
176
  itemData?.productVariant?.metafields?.global?.transparentImg ||
177
177
  itemData?.config?.image?.url ||