@anker-in/campaign-ui 0.2.11-beta.3 → 0.2.11-beta.4

package/dist/cjs/templates/Credits.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/templates/Credits.tsx"],
+  "sourcesContent": ["import { classNames, HeadlessConfig, HeadlessProvider } from '@anker-in/lib'\nimport { RegistrationProvider } from '../components/registration/context/provider'\n\nimport { DTC_TASK_TYPE } from '../components/credits/context/const'\nimport { CreditsProvider } from '../components/credits/context/provider'\nimport { CreditsPageCommon } from '../components/credits/type'\nimport { FunctionMemberPriceConfig } from '../components/credits/context/memberPriceTypes'\n\nimport { CreditsBanner, CreditsBannerCopy } from '../components/credits/creditsBanner'\nimport { CreditsInfoCard, CreditsInfoCardCopy } from '../components/credits/creditsInfoCard'\nimport { CreditsBenefits, CreditsBenefitsCopy } from '../components/credits/creditsBenefits'\nimport { CreditsWaysToGetCredits, CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits'\nimport { CreditsAnkersolixTask, CreditsAnkersolixTaskCopy } from '../components/credits/creditsAnkersolixTask'\nimport { CreditsRedeemList, CreditsRedeemListCopy } from '../components/credits/creditsRedeemList'\nimport { CreditsCash, CreditsCashCopy } from '../components/credits/creditsCash'\nimport { CreditsMemberPrice, CreditsMemberPriceCopy } from '../components/credits/creditsMemberPrice'\nimport { CreditsFaq, CreditsFaqCopy } from '../components/credits/creditsFaq'\nimport { CreditsNavigation, CreditsNavigationCopy } from '../components/credits/creditsNavigation'\nimport { AuthCodeActivateCopy } from 'src/components/registration/authCodeActivate/type'\n\nexport enum ComponentKey {\n  Navigation = 'creditsNavigation',\n  Banner = 'creditsBanner',\n  InfoCard = 'creditsInfoCard',\n  Benefits = 'creditsBenefits',\n  WaysToGetCredits = 'creditsWaysToGetCredits',\n  AnkersolixTask = 'creditsAnkersolixTask',\n  RedeemList = 'creditsRedeemList',\n  SpendCreditsLikeCash = 'creditsCash',\n  MemberPrice = 'creditsMemberPrice',\n  Faqs = 'creditsFaq',\n}\nexport type CreditsTemplateProps = {\n  headlessConfig: HeadlessConfig\n  siteConfig: {\n    registrationsSettings: {\n      authCodeActivate: AuthCodeActivateCopy\n    }\n    taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n    memberPriceDiscount?: FunctionMemberPriceConfig[]\n  }\n  creditsConfig?: {\n    alpcBrand?: string\n  }\n  pageConfig: {\n    order: ComponentKey[]\n    common: CreditsPageCommon\n    components: {\n      [ComponentKey.Navigation]?: CreditsNavigationCopy\n      [ComponentKey.Banner]?: CreditsBannerCopy\n      [ComponentKey.InfoCard]?: CreditsInfoCardCopy\n      [ComponentKey.Benefits]?: CreditsBenefitsCopy\n      [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy\n      [ComponentKey.AnkersolixTask]?: CreditsAnkersolixTaskCopy\n      [ComponentKey.RedeemList]?: CreditsRedeemListCopy\n      [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy\n      [ComponentKey.MemberPrice]?: CreditsMemberPriceCopy\n      [ComponentKey.Faqs]?: CreditsFaqCopy\n    }\n  }\n  userContext: {\n    profile: any\n    removeProfile: () => void\n    isLoadingProfile: boolean\n    creditInfo: any\n    customer: any\n    customerLoading: boolean\n    fetchCreditInfo: () => void\n  }\n  registrationContext: {\n    openSignUpPopup: () => void\n    openSignInPopup: () => void\n  }\n  gtm: {\n    pageGroup: string\n  }\n  cartConfig?: {\n    addToCart: (params: {\n      variantList: Array<{\n        variant: any\n        quantity: number\n        attributes?: Array<{ key: string; value: string }>\n      }>\n      cartAttributes?: Record<string, string>\n      discountCodes?: string[]\n    }) => void | Promise<any>\n  }\n}\n\nexport const CreditsTemplate = ({\n  headlessConfig,\n  siteConfig,\n  creditsConfig,\n  userContext,\n  pageConfig,\n  registrationContext,\n  gtm,\n  cartConfig,\n}: CreditsTemplateProps) => {\n  console.log('siteConfig', siteConfig)\n  return (\n    <HeadlessProvider headlessConfig={headlessConfig}>\n      <RegistrationProvider copy={siteConfig.registrationsSettings} email={userContext?.profile?.email}>\n        <CreditsProvider\n          profile={userContext?.profile}\n          removeProfile={userContext?.removeProfile}\n          isLoadingProfile={userContext?.isLoadingProfile}\n          openSignInPopup={registrationContext.openSignInPopup}\n          openSignUpPopup={registrationContext.openSignUpPopup}\n          creditInfo={userContext?.creditInfo}\n          taskIdToTypeMapping={siteConfig.taskIdToTypeMapping}\n          customer={userContext?.customer}\n          fetchCreditInfo={userContext?.fetchCreditInfo}\n          customerLoading={userContext?.customerLoading}\n          gtm={gtm}\n          pageCommon={pageConfig.common}\n          memberPriceDiscount={siteConfig.memberPriceDiscount}\n          alpcBrand={creditsConfig?.alpcBrand}\n          cartConfig={cartConfig}\n        >\n          {/* \u5BFC\u822A\u7EC4\u4EF6 - \u56FA\u5B9A\u4F4D\u7F6E\uFF0C\u4E0D\u53C2\u4E0E order \u6392\u5E8F */}\n          {pageConfig.components[ComponentKey.Navigation] && (\n            <CreditsNavigation copy={pageConfig.components[ComponentKey.Navigation]} />\n          )}\n          <div className={classNames('bg-[#f5f5f7] leading-[1.2]')}>\n            {pageConfig.order.map(key => {\n              // \u8DF3\u8FC7\u5BFC\u822A\u7EC4\u4EF6\uFF0C\u56E0\u4E3A\u5B83\u5DF2\u7ECF\u56FA\u5B9A\u6E32\u67D3\u5728\u4E0A\u65B9\n              if (key === ComponentKey.Navigation) return null\n              const componentCopy = pageConfig.components?.[key]\n              if (!componentCopy) return null\n              return (\n                <>\n                  {key === ComponentKey.Banner && <CreditsBanner copy={componentCopy as CreditsBannerCopy} id={key} />}\n                  {key === ComponentKey.InfoCard && userContext?.profile && (\n                    <CreditsInfoCard copy={componentCopy as CreditsInfoCardCopy} id={key} />\n                  )}\n                  {key === ComponentKey.Benefits && (\n                    <CreditsBenefits copy={componentCopy as CreditsBenefitsCopy} id={key} />\n                  )}\n                  {key === ComponentKey.WaysToGetCredits && (\n                    <CreditsWaysToGetCredits\n                      copy={componentCopy as CreditsWaysToGetCreditsCopy}\n                      id={key}\n                      classNames={\n                        headlessConfig.brand === 'anker'\n                          ? {\n                              subtitle: 'text-white',\n                              equalCreditsText:\n                                'bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent',\n                            }\n                          : {\n                              subtitle: 'text-[#D1D1D1]',\n                              equalCreditsText: 'text-[#F6EAD0]',\n                            }\n                      }\n                    />\n                  )}\n                  {key === ComponentKey.AnkersolixTask && (\n                    <CreditsAnkersolixTask copy={componentCopy as CreditsAnkersolixTaskCopy} id={key} />\n                  )}\n                  {key === ComponentKey.RedeemList && (\n                    <CreditsRedeemList copy={componentCopy as CreditsRedeemListCopy} id={key} />\n                  )}\n                  {key === ComponentKey.SpendCreditsLikeCash && (\n                    <CreditsCash copy={componentCopy as CreditsCashCopy} id={key} />\n                  )}\n                  {key === ComponentKey.MemberPrice && (\n                    <CreditsMemberPrice copy={componentCopy as CreditsMemberPriceCopy} id={key} />\n                  )}\n                  {key === ComponentKey.Faqs && <CreditsFaq copy={componentCopy as CreditsFaqCopy} id={key} />}\n                  {key !== ComponentKey.Banner && (\n                    <div className=\"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16\" />\n                  )}\n                </>\n              )\n            })}\n          </div>\n        </CreditsProvider>\n      </RegistrationProvider>\n    </HeadlessProvider>\n  )\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,kBAAAE,EAAA,oBAAAC,IAAA,eAAAC,EAAAJ,GA0HY,IAAAK,EAAA,6BA1HZC,EAA6D,yBAC7DC,EAAqC,uDAGrCA,EAAgC,kDAIhCC,EAAiD,+CACjDC,EAAqD,iDACrDC,EAAqD,iDACrDC,EAAqE,yDACrEC,EAAiE,uDACjEC,EAAyD,mDACzDC,EAA6C,6CAC7CC,EAA2D,oDAC3DC,EAA2C,4CAC3CC,EAAyD,mDAG7Cf,OACVA,EAAA,WAAa,oBACbA,EAAA,OAAS,gBACTA,EAAA,SAAW,kBACXA,EAAA,SAAW,kBACXA,EAAA,iBAAmB,0BACnBA,EAAA,eAAiB,wBACjBA,EAAA,WAAa,oBACbA,EAAA,qBAAuB,cACvBA,EAAA,YAAc,qBACdA,EAAA,KAAO,aAVGA,OAAA,IAqEL,MAAMC,EAAkB,CAAC,CAC9B,eAAAe,EACA,WAAAC,EACA,cAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,IAAAC,EACA,WAAAC,CACF,KACE,QAAQ,IAAI,aAAcN,CAAU,KAElC,OAAC,oBAAiB,eAAgBD,EAChC,mBAAC,wBAAqB,KAAMC,EAAW,sBAAuB,MAAOE,GAAa,SAAS,MACzF,oBAAC,mBACC,QAASA,GAAa,QACtB,cAAeA,GAAa,cAC5B,iBAAkBA,GAAa,iBAC/B,gBAAiBE,EAAoB,gBACrC,gBAAiBA,EAAoB,gBACrC,WAAYF,GAAa,WACzB,oBAAqBF,EAAW,oBAChC,SAAUE,GAAa,SACvB,gBAAiBA,GAAa,gBAC9B,gBAAiBA,GAAa,gBAC9B,IAAKG,EACL,WAAYF,EAAW,OACvB,oBAAqBH,EAAW,oBAChC,UAAWC,GAAe,UAC1B,WAAYK,EAGX,UAAAH,EAAW,WAAW,sBACrB,OAAC,qBAAkB,KAAMA,EAAW,WAAW,kBAA0B,KAE3E,OAAC,OAAI,aAAW,cAAW,4BAA4B,EACpD,SAAAA,EAAW,MAAM,IAAII,GAAO,CAE3B,GAAIA,IAAQ,oBAAyB,OAAO,KAC5C,MAAMC,EAAgBL,EAAW,aAAaI,CAAG,EACjD,OAAKC,KAEH,oBACG,UAAAD,IAAQ,oBAAuB,OAAC,iBAAc,KAAMC,EAAoC,GAAID,EAAK,EACjGA,IAAQ,mBAAyBL,GAAa,YAC7C,OAAC,mBAAgB,KAAMM,EAAsC,GAAID,EAAK,EAEvEA,IAAQ,sBACP,OAAC,mBAAgB,KAAMC,EAAsC,GAAID,EAAK,EAEvEA,IAAQ,8BACP,OAAC,2BACC,KAAMC,EACN,GAAID,EACJ,WACER,EAAe,QAAU,QACrB,CACE,SAAU,aACV,iBACE,4EACJ,EACA,CACE,SAAU,iBACV,iBAAkB,gBACpB,EAER,EAEDQ,IAAQ,4BACP,OAAC,yBAAsB,KAAMC,EAA4C,GAAID,EAAK,EAEnFA,IAAQ,wBACP,OAAC,qBAAkB,KAAMC,EAAwC,GAAID,EAAK,EAE3EA,IAAQ,kBACP,OAAC,eAAY,KAAMC,EAAkC,GAAID,EAAK,EAE/DA,IAAQ,yBACP,OAAC,sBAAmB,KAAMC,EAAyC,GAAID,EAAK,EAE7EA,IAAQ,iBAAqB,OAAC,cAAW,KAAMC,EAAiC,GAAID,EAAK,EACzFA,IAAQ,oBACP,OAAC,OAAI,UAAU,qEAAqE,GAExF,EA5CyB,IA8C7B,CAAC,EACH,GACF,EACF,EACF",
+  "names": ["Credits_exports", "__export", "ComponentKey", "CreditsTemplate", "__toCommonJS", "import_jsx_runtime", "import_lib", "import_provider", "import_creditsBanner", "import_creditsInfoCard", "import_creditsBenefits", "import_creditsWaysToGetCredits", "import_creditsAnkersolixTask", "import_creditsRedeemList", "import_creditsCash", "import_creditsMemberPrice", "import_creditsFaq", "import_creditsNavigation", "headlessConfig", "siteConfig", "creditsConfig", "userContext", "pageConfig", "registrationContext", "gtm", "cartConfig", "key", "componentCopy"]
+}

package/dist/esm/components/credits/context/hooks/useFunctionMemberPrice.d.ts

@@ -1,7 +1,7 @@
-import { ProductVariant } from '@anker-in/lib';
+import { NormalizedProductVariant } from '@anker-in/shopify-react';
 import { FunctionMemberPriceResult } from '../memberPriceTypes';
 export declare const useFunctionMemberPrice: ({ variant }: {
-    variant?: ProductVariant;
+    variant?: NormalizedProductVariant;
 }) => FunctionMemberPriceResult | (Partial<FunctionMemberPriceResult> & {
     hasMemberPrice: false;
 });

package/dist/esm/components/credits/context/hooks/useFunctionMemberPrice.js

@@ -1,2 +1,2 @@
-import{getFunctionMemberPrice as c}from"../utils/getFunctionMemberPrice";import{useMemo as i}from"react";import{useCreditsContext as m}from"../provider";import{useHeadlessContext as n}from"@anker-in/lib";const d=({variant:e})=>{const{memberPriceDiscount:r}=m(),{locale:t=""}=n();return i(()=>{const o=c({memberPriceDiscount:r,currencyCode:e?.price.currencyCode,variant:e,locale:t});return o||{hasMemberPrice:!1}},[t,r,e])};export{d as useFunctionMemberPrice};
+import{getFunctionMemberPrice as c}from"../utils/getFunctionMemberPrice";import{useMemo as i}from"react";import{useCreditsContext as m}from"../provider";import{useHeadlessContext as n}from"@anker-in/lib";const p=({variant:e})=>{const{memberPriceDiscount:r}=m(),{locale:t=""}=n();return i(()=>{const o=c({memberPriceDiscount:r,currencyCode:e?.price.currencyCode,variant:e,locale:t});return o||{hasMemberPrice:!1}},[t,r,e])};export{p as useFunctionMemberPrice};
 //# sourceMappingURL=useFunctionMemberPrice.js.map

package/dist/esm/components/credits/context/hooks/useFunctionMemberPrice.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/components/credits/context/hooks/useFunctionMemberPrice.ts"],
-  "sourcesContent": ["import { ProductVariant } from '@anker-in/lib'\nimport { FunctionMemberPriceResult } from '../memberPriceTypes'\nimport { getFunctionMemberPrice } from '../utils/getFunctionMemberPrice'\nimport { useMemo } from 'react'\nimport { useCreditsContext } from '../provider'\nimport { useHeadlessContext } from '@anker-in/lib'\n\n// \u8BA1\u7B97\u5355\u4EF6\u5546\u54C1\u7684\u4F1A\u5458\u4EF7\nexport const useFunctionMemberPrice = ({ variant }: { variant?: ProductVariant }) => {\n  const { memberPriceDiscount } = useCreditsContext()\n  const { locale = '' } = useHeadlessContext()\n\n  const memberPrice:\n    | FunctionMemberPriceResult\n    | (Partial<FunctionMemberPriceResult> & {\n        hasMemberPrice: false\n      }) = useMemo(() => {\n    const result = getFunctionMemberPrice({\n      memberPriceDiscount: memberPriceDiscount,\n      currencyCode: variant?.price.currencyCode,\n      variant,\n      locale,\n    })\n\n    if (result) {\n      return result as FunctionMemberPriceResult\n    }\n\n    return { hasMemberPrice: false }\n  }, [locale, memberPriceDiscount, variant])\n\n  return memberPrice\n}\n"],
-  "mappings": "AAEA,OAAS,0BAAAA,MAA8B,kCACvC,OAAS,WAAAC,MAAe,QACxB,OAAS,qBAAAC,MAAyB,cAClC,OAAS,sBAAAC,MAA0B,gBAG5B,MAAMC,EAAyB,CAAC,CAAE,QAAAC,CAAQ,IAAoC,CACnF,KAAM,CAAE,oBAAAC,CAAoB,EAAIJ,EAAkB,EAC5C,CAAE,OAAAK,EAAS,EAAG,EAAIJ,EAAmB,EAqB3C,OAfSF,EAAQ,IAAM,CACrB,MAAMO,EAASR,EAAuB,CACpC,oBAAqBM,EACrB,aAAcD,GAAS,MAAM,aAC7B,QAAAA,EACA,OAAAE,CACF,CAAC,EAED,OAAIC,GAIG,CAAE,eAAgB,EAAM,CACjC,EAAG,CAACD,EAAQD,EAAqBD,CAAO,CAAC,CAG3C",
+  "sourcesContent": ["import { NormalizedProductVariant } from '@anker-in/shopify-react'\nimport { FunctionMemberPriceResult } from '../memberPriceTypes'\nimport { getFunctionMemberPrice } from '../utils/getFunctionMemberPrice'\nimport { useMemo } from 'react'\nimport { useCreditsContext } from '../provider'\nimport { useHeadlessContext } from '@anker-in/lib'\n\n// \u8BA1\u7B97\u5355\u4EF6\u5546\u54C1\u7684\u4F1A\u5458\u4EF7\nexport const useFunctionMemberPrice = ({ variant }: { variant?: NormalizedProductVariant }) => {\n  const { memberPriceDiscount } = useCreditsContext()\n  const { locale = '' } = useHeadlessContext()\n\n  const memberPrice:\n    | FunctionMemberPriceResult\n    | (Partial<FunctionMemberPriceResult> & {\n        hasMemberPrice: false\n      }) = useMemo(() => {\n    const result = getFunctionMemberPrice({\n      memberPriceDiscount: memberPriceDiscount,\n      currencyCode: variant?.price.currencyCode,\n      variant,\n      locale,\n    })\n\n    if (result) {\n      return result as FunctionMemberPriceResult\n    }\n\n    return { hasMemberPrice: false }\n  }, [locale, memberPriceDiscount, variant])\n\n  return memberPrice\n}\n"],
+  "mappings": "AAEA,OAAS,0BAAAA,MAA8B,kCACvC,OAAS,WAAAC,MAAe,QACxB,OAAS,qBAAAC,MAAyB,cAClC,OAAS,sBAAAC,MAA0B,gBAG5B,MAAMC,EAAyB,CAAC,CAAE,QAAAC,CAAQ,IAA8C,CAC7F,KAAM,CAAE,oBAAAC,CAAoB,EAAIJ,EAAkB,EAC5C,CAAE,OAAAK,EAAS,EAAG,EAAIJ,EAAmB,EAqB3C,OAfSF,EAAQ,IAAM,CACrB,MAAMO,EAASR,EAAuB,CACpC,oBAAqBM,EACrB,aAAcD,GAAS,MAAM,aAC7B,QAAAA,EACA,OAAAE,CACF,CAAC,EAED,OAAIC,GAIG,CAAE,eAAgB,EAAM,CACjC,EAAG,CAACD,EAAQD,EAAqBD,CAAO,CAAC,CAG3C",
   "names": ["getFunctionMemberPrice", "useMemo", "useCreditsContext", "useHeadlessContext", "useFunctionMemberPrice", "variant", "memberPriceDiscount", "locale", "result"]
 }

package/dist/esm/components/credits/context/memberPriceConst.d.ts

@@ -3,8 +3,3 @@ export declare enum FunctionDiscountType {
     FixedAmount = 2,
     FixedPrice = 3
 }
-export declare enum RoundSelected {
-    RoundHighest = "round_highest",
-    RoundLowest = "round_lowest",
-    RoundNearest = "round_nearest"
-}

package/dist/esm/components/credits/context/memberPriceConst.js

@@ -1,2 +1,2 @@
-var x=(r=>(r[r.Percentage=1]="Percentage",r[r.FixedAmount=2]="FixedAmount",r[r.FixedPrice=3]="FixedPrice",r))(x||{}),a=(r=>(r.RoundHighest="round_highest",r.RoundLowest="round_lowest",r.RoundNearest="round_nearest",r))(a||{});export{x as FunctionDiscountType,a as RoundSelected};
+var x=(r=>(r[r.Percentage=1]="Percentage",r[r.FixedAmount=2]="FixedAmount",r[r.FixedPrice=3]="FixedPrice",r))(x||{});export{x as FunctionDiscountType};
 //# sourceMappingURL=memberPriceConst.js.map

package/dist/esm/components/credits/context/memberPriceConst.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/context/memberPriceConst.ts"],
-  "sourcesContent": ["// Function \u6298\u6263\u7C7B\u578B\nexport enum FunctionDiscountType {\n  Percentage = 1,\n  FixedAmount,\n  FixedPrice,\n}\n\n// \u5C0F\u6570\u4F4D\u53D6\u820D\u65B9\u5F0F\nexport enum RoundSelected {\n  RoundHighest = 'round_highest',\n  RoundLowest = 'round_lowest',\n  RoundNearest = 'round_nearest',\n}\n"],
-  "mappings": "AACO,IAAKA,OACVA,IAAA,WAAa,GAAb,aACAA,IAAA,6BACAA,IAAA,2BAHUA,OAAA,IAOAC,OACVA,EAAA,aAAe,gBACfA,EAAA,YAAc,eACdA,EAAA,aAAe,gBAHLA,OAAA",
-  "names": ["FunctionDiscountType", "RoundSelected"]
+  "sourcesContent": ["// Function \u6298\u6263\u7C7B\u578B\nexport enum FunctionDiscountType {\n  Percentage = 1,\n  FixedAmount,\n  FixedPrice,\n}\n"],
+  "mappings": "AACO,IAAKA,OACVA,IAAA,WAAa,GAAb,aACAA,IAAA,6BACAA,IAAA,2BAHUA,OAAA",
+  "names": ["FunctionDiscountType"]
 }

package/dist/esm/components/credits/context/memberPriceTypes.d.ts

@@ -1,14 +1,7 @@
-import { FunctionDiscountType, RoundSelected } from './memberPriceConst';
-export type PriceEndingConf = {
-    apply_price_ending: boolean;
-    one_decimal_place: string;
-    two_decimal_place: string;
-    round_selected: RoundSelected;
-};
+import { FunctionDiscountType } from './memberPriceConst';
 export type DiscountConfig = {
     discount_type: FunctionDiscountType;
     discount_value: number;
-    price_ending_conf?: PriceEndingConf;
 };
 export type FunctionMemberPriceConfig = {
     rule_id: string;
@@ -30,17 +23,3 @@ export type FunctionMemberPriceConfig = {
         other_product_discounts: boolean;
     };
 };
-export type FunctionMemberPriceResult = {
-    hasMemberPrice: boolean;
-    useCoupon: boolean;
-    originalPrice: number;
-    originalPriceWithCurrency: string;
-    salePrice: number;
-    salePriceWithCurrency: string;
-    salePriceWithoutCoupon: number;
-    salePriceWithoutCouponWithCurrency: string;
-    savePrice: number;
-    savePriceWithCurrency: string;
-    savePriceWithoutCoupon: number;
-    savePriceWithoutCouponWithCurrency: string;
-};

package/dist/esm/components/credits/context/provider.d.ts

@@ -20,8 +20,22 @@ type Context = {
     pageCommon: CreditsPageCommon;
     memberPriceDiscount?: FunctionMemberPriceConfig[];
     alpcBrand?: string;
+    cartConfig?: {
+        addToCart: (params: {
+            variantList: Array<{
+                variant: any;
+                quantity: number;
+                attributes?: Array<{
+                    key: string;
+                    value: string;
+                }>;
+            }>;
+            cartAttributes?: Record<string, string>;
+            discountCodes?: string[];
+        }) => void | Promise<any>;
+    };
 };
 export declare const CreditsContext: import("react").Context<Context>;
-export declare function CreditsProvider({ children, profile, removeProfile, isLoadingProfile, openSignInPopup, openSignUpPopup, taskIdToTypeMapping, creditInfo, customer, customerLoading, fetchCreditInfo, gtm, pageCommon, memberPriceDiscount, alpcBrand, }: PropsWithChildren<Context>): import("react/jsx-runtime").JSX.Element;
+export declare function CreditsProvider({ children, profile, removeProfile, isLoadingProfile, openSignInPopup, openSignUpPopup, taskIdToTypeMapping, creditInfo, customer, customerLoading, fetchCreditInfo, gtm, pageCommon, memberPriceDiscount, alpcBrand, cartConfig, }: PropsWithChildren<Context>): import("react/jsx-runtime").JSX.Element;
 export declare function useCreditsContext(): Context;
 export {};

package/dist/esm/components/credits/context/provider.js

@@ -1,2 +1,2 @@
-import{jsx as x}from"react/jsx-runtime";import{createContext as P,useContext as l}from"react";const o=P({profile:null,isLoadingProfile:!1,taskIdToTypeMapping:{},removeProfile:()=>{},openSignInPopup:()=>{},openSignUpPopup:()=>{},creditInfo:void 0,customerLoading:!1,fetchCreditInfo:e=>{},gtm:{pageGroup:""},pageCommon:{},memberPriceDiscount:void 0,alpcBrand:void 0});function S({children:e,profile:r,removeProfile:n,isLoadingProfile:t,openSignInPopup:i,openSignUpPopup:p,taskIdToTypeMapping:d,creditInfo:s,customer:m,customerLoading:C,fetchCreditInfo:f,gtm:u,pageCommon:a,memberPriceDiscount:g,alpcBrand:c}){return x(o.Provider,{value:{profile:r,isLoadingProfile:t,removeProfile:n,openSignInPopup:i,openSignUpPopup:p,taskIdToTypeMapping:d,creditInfo:s,fetchCreditInfo:f,customer:m,customerLoading:C,gtm:u,pageCommon:a,memberPriceDiscount:g,alpcBrand:c},children:e})}function _(){const e=l(o);if(!e)throw new Error("useCreditsContext must be used within a CreditsProvider");return e}export{o as CreditsContext,S as CreditsProvider,_ as useCreditsContext};
+import{jsx as y}from"react/jsx-runtime";import{createContext as l,useContext as v}from"react";const o=l({profile:null,isLoadingProfile:!1,taskIdToTypeMapping:{},removeProfile:()=>{},openSignInPopup:()=>{},openSignUpPopup:()=>{},creditInfo:void 0,customerLoading:!1,fetchCreditInfo:e=>{},gtm:{pageGroup:""},pageCommon:{},memberPriceDiscount:void 0,alpcBrand:void 0,cartConfig:void 0});function _({children:e,profile:r,removeProfile:t,isLoadingProfile:n,openSignInPopup:i,openSignUpPopup:s,taskIdToTypeMapping:d,creditInfo:p,customer:a,customerLoading:u,fetchCreditInfo:C,gtm:m,pageCommon:f,memberPriceDiscount:g,alpcBrand:c,cartConfig:P}){return y(o.Provider,{value:{profile:r,isLoadingProfile:n,removeProfile:t,openSignInPopup:i,openSignUpPopup:s,taskIdToTypeMapping:d,creditInfo:p,fetchCreditInfo:C,customer:a,customerLoading:u,gtm:m,pageCommon:f,memberPriceDiscount:g,alpcBrand:c,cartConfig:P},children:e})}function A(){const e=v(o);if(!e)throw new Error("useCreditsContext must be used within a CreditsProvider");return e}export{o as CreditsContext,_ as CreditsProvider,A as useCreditsContext};
 //# sourceMappingURL=provider.js.map

package/dist/esm/components/credits/context/provider.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/context/provider.tsx"],
-  "sourcesContent": ["import { createContext, PropsWithChildren, useContext } from 'react'\nimport type { DTC_TASK_TYPE } from './const'\nimport type { CreditInfoResponse } from './response'\nimport { CreditsPageCommon } from '../type'\nimport { FunctionMemberPriceConfig } from './memberPriceTypes'\n\ntype Context = {\n  profile: any\n  isLoadingProfile: boolean\n  removeProfile: () => void\n  taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n  openSignInPopup: () => void\n  openSignUpPopup: () => void\n  creditInfo?: CreditInfoResponse\n  customer?: any\n  customerLoading: boolean\n  fetchCreditInfo: (user_id: string) => void\n  gtm: {\n    pageGroup: string\n  }\n  pageCommon: CreditsPageCommon\n  memberPriceDiscount?: FunctionMemberPriceConfig[]\n  alpcBrand?: string\n}\n\nexport const CreditsContext = createContext<Context>({\n  profile: null,\n  isLoadingProfile: false,\n  taskIdToTypeMapping: {},\n  removeProfile: () => {},\n  openSignInPopup: () => {},\n  openSignUpPopup: () => {},\n  creditInfo: undefined,\n  customerLoading: false,\n  fetchCreditInfo: (user_id: string) => {},\n  gtm: {\n    pageGroup: '',\n  },\n  pageCommon: {},\n  memberPriceDiscount: undefined,\n  alpcBrand: undefined,\n})\n\nexport function CreditsProvider({\n  children,\n  profile,\n  removeProfile,\n  isLoadingProfile,\n  openSignInPopup,\n  openSignUpPopup,\n  taskIdToTypeMapping,\n  creditInfo,\n  customer,\n  customerLoading,\n  fetchCreditInfo,\n  gtm,\n  pageCommon,\n  memberPriceDiscount,\n  alpcBrand,\n}: PropsWithChildren<Context>) {\n  return (\n    <CreditsContext.Provider\n      value={{\n        profile,\n        isLoadingProfile,\n        removeProfile,\n        openSignInPopup,\n        openSignUpPopup,\n        taskIdToTypeMapping,\n        creditInfo,\n        fetchCreditInfo,\n        customer,\n        customerLoading,\n        gtm,\n        pageCommon,\n        memberPriceDiscount,\n        alpcBrand,\n      }}\n    >\n      {children}\n    </CreditsContext.Provider>\n  )\n}\n\nexport function useCreditsContext() {\n  const context = useContext(CreditsContext)\n  if (!context) {\n    throw new Error('useCreditsContext must be used within a CreditsProvider')\n  }\n  return context\n}\n"],
-  "mappings": "AA6DI,cAAAA,MAAA,oBA7DJ,OAAS,iBAAAC,EAAkC,cAAAC,MAAkB,QAyBtD,MAAMC,EAAiBF,EAAuB,CACnD,QAAS,KACT,iBAAkB,GAClB,oBAAqB,CAAC,EACtB,cAAe,IAAM,CAAC,EACtB,gBAAiB,IAAM,CAAC,EACxB,gBAAiB,IAAM,CAAC,EACxB,WAAY,OACZ,gBAAiB,GACjB,gBAAkBG,GAAoB,CAAC,EACvC,IAAK,CACH,UAAW,EACb,EACA,WAAY,CAAC,EACb,oBAAqB,OACrB,UAAW,MACb,CAAC,EAEM,SAASC,EAAgB,CAC9B,SAAAC,EACA,QAAAC,EACA,cAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,IAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,UAAAC,CACF,EAA+B,CAC7B,OACEpB,EAACG,EAAe,SAAf,CACC,MAAO,CACL,QAAAI,EACA,iBAAAE,EACA,cAAAD,EACA,gBAAAE,EACA,gBAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,gBAAAG,EACA,SAAAF,EACA,gBAAAC,EACA,IAAAE,EACA,WAAAC,EACA,oBAAAC,EACA,UAAAC,CACF,EAEC,SAAAd,EACH,CAEJ,CAEO,SAASe,GAAoB,CAClC,MAAMC,EAAUpB,EAAWC,CAAc,EACzC,GAAI,CAACmB,EACH,MAAM,IAAI,MAAM,yDAAyD,EAE3E,OAAOA,CACT",
-  "names": ["jsx", "createContext", "useContext", "CreditsContext", "user_id", "CreditsProvider", "children", "profile", "removeProfile", "isLoadingProfile", "openSignInPopup", "openSignUpPopup", "taskIdToTypeMapping", "creditInfo", "customer", "customerLoading", "fetchCreditInfo", "gtm", "pageCommon", "memberPriceDiscount", "alpcBrand", "useCreditsContext", "context"]
+  "sourcesContent": ["import { createContext, PropsWithChildren, useContext } from 'react'\nimport type { DTC_TASK_TYPE } from './const'\nimport type { CreditInfoResponse } from './response'\nimport { CreditsPageCommon } from '../type'\nimport { FunctionMemberPriceConfig } from './memberPriceTypes'\n\ntype Context = {\n  profile: any\n  isLoadingProfile: boolean\n  removeProfile: () => void\n  taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n  openSignInPopup: () => void\n  openSignUpPopup: () => void\n  creditInfo?: CreditInfoResponse\n  customer?: any\n  customerLoading: boolean\n  fetchCreditInfo: (user_id: string) => void\n  gtm: {\n    pageGroup: string\n  }\n  pageCommon: CreditsPageCommon\n  memberPriceDiscount?: FunctionMemberPriceConfig[]\n  alpcBrand?: string\n  cartConfig?: {\n    addToCart: (params: {\n      variantList: Array<{\n        variant: any\n        quantity: number\n        attributes?: Array<{ key: string; value: string }>\n      }>\n      cartAttributes?: Record<string, string>\n      discountCodes?: string[]\n    }) => void | Promise<any>\n  }\n}\n\nexport const CreditsContext = createContext<Context>({\n  profile: null,\n  isLoadingProfile: false,\n  taskIdToTypeMapping: {},\n  removeProfile: () => {},\n  openSignInPopup: () => {},\n  openSignUpPopup: () => {},\n  creditInfo: undefined,\n  customerLoading: false,\n  fetchCreditInfo: (user_id: string) => {},\n  gtm: {\n    pageGroup: '',\n  },\n  pageCommon: {},\n  memberPriceDiscount: undefined,\n  alpcBrand: undefined,\n  cartConfig: undefined,\n})\n\nexport function CreditsProvider({\n  children,\n  profile,\n  removeProfile,\n  isLoadingProfile,\n  openSignInPopup,\n  openSignUpPopup,\n  taskIdToTypeMapping,\n  creditInfo,\n  customer,\n  customerLoading,\n  fetchCreditInfo,\n  gtm,\n  pageCommon,\n  memberPriceDiscount,\n  alpcBrand,\n  cartConfig,\n}: PropsWithChildren<Context>) {\n  return (\n    <CreditsContext.Provider\n      value={{\n        profile,\n        isLoadingProfile,\n        removeProfile,\n        openSignInPopup,\n        openSignUpPopup,\n        taskIdToTypeMapping,\n        creditInfo,\n        fetchCreditInfo,\n        customer,\n        customerLoading,\n        gtm,\n        pageCommon,\n        memberPriceDiscount,\n        alpcBrand,\n        cartConfig,\n      }}\n    >\n      {children}\n    </CreditsContext.Provider>\n  )\n}\n\nexport function useCreditsContext() {\n  const context = useContext(CreditsContext)\n  if (!context) {\n    throw new Error('useCreditsContext must be used within a CreditsProvider')\n  }\n  return context\n}\n"],
+  "mappings": "AA0EI,cAAAA,MAAA,oBA1EJ,OAAS,iBAAAC,EAAkC,cAAAC,MAAkB,QAoCtD,MAAMC,EAAiBF,EAAuB,CACnD,QAAS,KACT,iBAAkB,GAClB,oBAAqB,CAAC,EACtB,cAAe,IAAM,CAAC,EACtB,gBAAiB,IAAM,CAAC,EACxB,gBAAiB,IAAM,CAAC,EACxB,WAAY,OACZ,gBAAiB,GACjB,gBAAkBG,GAAoB,CAAC,EACvC,IAAK,CACH,UAAW,EACb,EACA,WAAY,CAAC,EACb,oBAAqB,OACrB,UAAW,OACX,WAAY,MACd,CAAC,EAEM,SAASC,EAAgB,CAC9B,SAAAC,EACA,QAAAC,EACA,cAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,IAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,UAAAC,EACA,WAAAC,CACF,EAA+B,CAC7B,OACErB,EAACG,EAAe,SAAf,CACC,MAAO,CACL,QAAAI,EACA,iBAAAE,EACA,cAAAD,EACA,gBAAAE,EACA,gBAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,gBAAAG,EACA,SAAAF,EACA,gBAAAC,EACA,IAAAE,EACA,WAAAC,EACA,oBAAAC,EACA,UAAAC,EACA,WAAAC,CACF,EAEC,SAAAf,EACH,CAEJ,CAEO,SAASgB,GAAoB,CAClC,MAAMC,EAAUrB,EAAWC,CAAc,EACzC,GAAI,CAACoB,EACH,MAAM,IAAI,MAAM,yDAAyD,EAE3E,OAAOA,CACT",
+  "names": ["jsx", "createContext", "useContext", "CreditsContext", "user_id", "CreditsProvider", "children", "profile", "removeProfile", "isLoadingProfile", "openSignInPopup", "openSignUpPopup", "taskIdToTypeMapping", "creditInfo", "customer", "customerLoading", "fetchCreditInfo", "gtm", "pageCommon", "memberPriceDiscount", "alpcBrand", "cartConfig", "useCreditsContext", "context"]
 }

package/dist/esm/components/credits/context/utils/getFunctionMemberPrice.d.ts

@@ -1,8 +1,8 @@
 import { FunctionMemberPriceConfig, FunctionMemberPriceResult } from '../memberPriceTypes';
-import { ProductVariant } from '@anker-in/lib';
+import { NormalizedProductVariant } from '@anker-in/shopify-react';
 export declare const getFunctionMemberPrice: ({ memberPriceDiscount, currencyCode, variant, locale, }: {
     memberPriceDiscount?: FunctionMemberPriceConfig[];
     currencyCode?: string;
-    variant?: ProductVariant;
+    variant?: NormalizedProductVariant;
     locale: string;
 }) => false | FunctionMemberPriceResult;

package/dist/esm/components/credits/context/utils/getFunctionMemberPrice.js

@@ -1,2 +1,2 @@
-import{formatPrice as o}from"../utils";import{functionDiscountCalculate as b}from"./functionDiscountCalculate";import n from"decimal.js";import{getFunctionMemberPriceDiscountConfig as D}from"./getFunctionMemberPriceDiscountConfig";import d from"./variantGetCoupon";const V=({memberPriceDiscount:l,currencyCode:r,variant:e,locale:i})=>{const m=d({variant:e}),{memberPriceDiscountConfig:c,activeMemberPriceConfig:y}=D({config:l,variant:e}),s=!!y?.discount_combinations.other_product_discounts;if(!c)return!1;const u={amount:e?.price.amount||0,priceWithCurrency:o({amount:e?.price.amount||0,currencyCode:r||"USD",locale:i})},t=c?b({config:c,price:e?.price.amount||0}):e?.price.amount||0,a={amount:t,priceWithCurrency:o({amount:t,currencyCode:r||"USD",locale:i})};let p=t;if(m?.variant_price4wscode&&e&&s)if(s){const P=new n(e.price.amount).minus(m.variant_price4wscode);p=new n(t).minus(P).toNumber()}else{const P=new n(e.price.amount).minus(m.variant_price4wscode);if(t>P.toNumber())return!1}const C={amount:p,priceWithCurrency:o({amount:p,currencyCode:r||"USD",locale:i})},h=new n(u.amount).minus(C.amount).toNumber(),f={amount:h,priceWithCurrency:o({amount:h,currencyCode:r||"USD",locale:i,maximumFractionDigits:2})},W=new n(u.amount).minus(a.amount).toNumber(),g={amount:W,priceWithCurrency:o({amount:W,currencyCode:r||"USD",locale:i,maximumFractionDigits:2})};return{hasMemberPrice:!!c,useCoupon:s,originalPrice:u.amount,originalPriceWithCurrency:u.priceWithCurrency,salePrice:C.amount,salePriceWithCurrency:C.priceWithCurrency,salePriceWithoutCoupon:a.amount,salePriceWithoutCouponWithCurrency:a.priceWithCurrency,savePrice:f.amount,savePriceWithCurrency:f.priceWithCurrency,savePriceWithoutCoupon:g.amount,savePriceWithoutCouponWithCurrency:g.priceWithCurrency}};export{V as getFunctionMemberPrice};
+import{formatPrice as t}from"../utils";import{functionDiscountCalculate as b}from"./functionDiscountCalculate";import n from"decimal.js";import{getFunctionMemberPriceDiscountConfig as D}from"./getFunctionMemberPriceDiscountConfig";import d from"./variantGetCoupon";const R=({memberPriceDiscount:g,currencyCode:r,variant:e,locale:i})=>{const m=d({variant:e}),{memberPriceDiscountConfig:c,activeMemberPriceConfig:y}=D({config:g,variant:e}),s=!!y?.discount_combinations.other_product_discounts;if(!c)return!1;const u={amount:e?.price.amount||0,priceWithCurrency:t({amount:e?.price.amount||0,currencyCode:r||"USD",locale:i})},o=c?b({config:c,price:e?.price.amount||0}):e?.price.amount||0,a={amount:o,priceWithCurrency:t({amount:o,currencyCode:r||"USD",locale:i})};let p=o;if(m?.variant_price4wscode&&e&&s)if(s){const P=new n(e.price.amount).minus(m.variant_price4wscode);p=new n(o).minus(P).toNumber()}else{const P=new n(e.price.amount).minus(m.variant_price4wscode);if(o>P.toNumber())return!1}const C={amount:p,priceWithCurrency:t({amount:p,currencyCode:r||"USD",locale:i})},h=new n(u.amount).minus(C.amount).toNumber(),f={amount:h,priceWithCurrency:t({amount:h,currencyCode:r||"USD",locale:i,maximumFractionDigits:2})},W=new n(u.amount).minus(a.amount).toNumber(),l={amount:W,priceWithCurrency:t({amount:W,currencyCode:r||"USD",locale:i,maximumFractionDigits:2})};return{hasMemberPrice:!!c,useCoupon:s,originalPrice:u.amount,originalPriceWithCurrency:u.priceWithCurrency,salePrice:C.amount,salePriceWithCurrency:C.priceWithCurrency,salePriceWithoutCoupon:a.amount,salePriceWithoutCouponWithCurrency:a.priceWithCurrency,savePrice:f.amount,savePriceWithCurrency:f.priceWithCurrency,savePriceWithoutCoupon:l.amount,savePriceWithoutCouponWithCurrency:l.priceWithCurrency}};export{R as getFunctionMemberPrice};
 //# sourceMappingURL=getFunctionMemberPrice.js.map

package/dist/esm/components/credits/context/utils/getFunctionMemberPrice.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/components/credits/context/utils/getFunctionMemberPrice.ts"],
-  "sourcesContent": ["import { formatPrice } from '../utils'\nimport { FunctionMemberPriceConfig, FunctionMemberPriceResult } from '../memberPriceTypes'\nimport { ProductVariant } from '@anker-in/lib'\nimport { functionDiscountCalculate } from './functionDiscountCalculate'\nimport Decimal from 'decimal.js'\nimport { getFunctionMemberPriceDiscountConfig } from './getFunctionMemberPriceDiscountConfig'\nimport variantGetCoupon from './variantGetCoupon'\n\n// \u8BA1\u7B97\u5355\u4EF6\u5546\u54C1\u7684\u4F1A\u5458\u4EF7\nexport const getFunctionMemberPrice = ({\n  memberPriceDiscount,\n  currencyCode,\n  variant,\n  locale,\n}: {\n  memberPriceDiscount?: FunctionMemberPriceConfig[]\n  currencyCode?: string\n  variant?: ProductVariant\n  locale: string\n}) => {\n  const couponData = variantGetCoupon({ variant })\n\n  // variant\u5BF9\u5E94\u7684\u4F1A\u5458\u4EF7\u6298\u6263\u914D\u7F6E\n  const { memberPriceDiscountConfig, activeMemberPriceConfig } = getFunctionMemberPriceDiscountConfig({\n    config: memberPriceDiscount,\n    variant,\n  })\n\n  const useCoupon = !!activeMemberPriceConfig?.discount_combinations.other_product_discounts\n\n  if (!memberPriceDiscountConfig) {\n    return false as false\n  }\n\n  const originalPrice = {\n    amount: variant?.price.amount || 0,\n    priceWithCurrency: formatPrice({\n      amount: variant?.price.amount || 0,\n      currencyCode: currencyCode || 'USD',\n      locale,\n    }),\n  }\n\n  const salePriceWithoutCouponAmount = memberPriceDiscountConfig\n    ? functionDiscountCalculate({\n        config: memberPriceDiscountConfig,\n        price: variant?.price.amount || 0,\n      })\n    : variant?.price.amount || 0\n  const salePriceWithoutCoupon = {\n    amount: salePriceWithoutCouponAmount,\n    priceWithCurrency: formatPrice({\n      amount: salePriceWithoutCouponAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n    }),\n  }\n\n  // function \u4F1A\u5458\u4EF7\u662F\u5728\u539F\u4EF7\u7684\u57FA\u7840\u4E0A\u8FDB\u884C\u8BA1\u7B97\uFF0C\u6682\u4E0D\u652F\u6301\u6298\u540E\u4EF7\n  let salePriceAmount = salePriceWithoutCouponAmount\n\n  // \u51CF\u53BBcode\u7684\u4F18\u60E0\n  if (couponData?.variant_price4wscode && variant && useCoupon) {\n    if (useCoupon) {\n      // code\u7684\u4F18\u60E0\u91D1\u989D\n      const codeSaveAmountDecimal = new Decimal(variant.price.amount).minus(couponData.variant_price4wscode)\n      salePriceAmount = new Decimal(salePriceWithoutCouponAmount).minus(codeSaveAmountDecimal).toNumber()\n    } else {\n      // \u4E0D\u80FD\u4E0E code \u540C\u65F6\u4F7F\u7528\uFF0C\u9700\u8981\u5224\u65AD\u4F1A\u5458\u4EF7\u662F\u5426\u5C0F\u4E8E code \u7684\u4F18\u60E0\u91D1\u989D\uFF0C\u5982\u679C\u5C0F\u4E8E\u5219\u5F53\u505A\u6CA1\u6709\u4F1A\u5458\u4EF7\n      const codeSaveAmountDecimal = new Decimal(variant.price.amount).minus(couponData.variant_price4wscode)\n      if (salePriceWithoutCouponAmount > codeSaveAmountDecimal.toNumber()) {\n        return false as false\n      }\n    }\n  }\n\n  const salePrice = {\n    amount: salePriceAmount,\n    priceWithCurrency: formatPrice({\n      amount: salePriceAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n    }),\n  }\n\n  const savePriceAmount = new Decimal(originalPrice.amount).minus(salePrice.amount).toNumber()\n  const savePrice = {\n    amount: savePriceAmount,\n    priceWithCurrency: formatPrice({\n      amount: savePriceAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    }),\n  }\n\n  const savePriceWithoutCouponAmount = new Decimal(originalPrice.amount)\n    .minus(salePriceWithoutCoupon.amount)\n    .toNumber()\n  const savePriceWithoutCoupon = {\n    amount: savePriceWithoutCouponAmount,\n    priceWithCurrency: formatPrice({\n      amount: savePriceWithoutCouponAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    }),\n  }\n\n  const result: FunctionMemberPriceResult = {\n    // \u662F\u5426\u5B58\u5728\u4F1A\u5458\u4EF7\n    hasMemberPrice: !!memberPriceDiscountConfig,\n    useCoupon,\n    // \u539F\u4EF7\n    originalPrice: originalPrice.amount,\n    originalPriceWithCurrency: originalPrice.priceWithCurrency as string,\n    // \u4F7F\u7528\u5238\u540E\u7684\u6298\u540E\u4EF7\n    salePrice: salePrice.amount,\n    salePriceWithCurrency: salePrice.priceWithCurrency as string,\n\n    // \u4E0D\u4F7F\u7528\u5238\u7684\u6298\u540E\u4EF7\n    salePriceWithoutCoupon: salePriceWithoutCoupon.amount,\n    salePriceWithoutCouponWithCurrency: salePriceWithoutCoupon.priceWithCurrency as string,\n\n    // \u5305\u542B\u4F7F\u7528\u5238\u7684\u8282\u7701\u91D1\u989D\n    savePrice: savePrice.amount,\n    savePriceWithCurrency: savePrice.priceWithCurrency as string,\n\n    // \u4E0D\u4F7F\u7528\u5238\u7684\u8282\u7701\u91D1\u989D\n    savePriceWithoutCoupon: savePriceWithoutCoupon.amount,\n    savePriceWithoutCouponWithCurrency: savePriceWithoutCoupon.priceWithCurrency as string,\n  }\n\n  return result\n}\n"],
+  "sourcesContent": ["import { formatPrice } from '../utils'\nimport { FunctionMemberPriceConfig, FunctionMemberPriceResult } from '../memberPriceTypes'\nimport { NormalizedProductVariant } from '@anker-in/shopify-react'\nimport { functionDiscountCalculate } from './functionDiscountCalculate'\nimport Decimal from 'decimal.js'\nimport { getFunctionMemberPriceDiscountConfig } from './getFunctionMemberPriceDiscountConfig'\nimport variantGetCoupon from './variantGetCoupon'\n\n// \u8BA1\u7B97\u5355\u4EF6\u5546\u54C1\u7684\u4F1A\u5458\u4EF7\nexport const getFunctionMemberPrice = ({\n  memberPriceDiscount,\n  currencyCode,\n  variant,\n  locale,\n}: {\n  memberPriceDiscount?: FunctionMemberPriceConfig[]\n  currencyCode?: string\n  variant?: NormalizedProductVariant\n  locale: string\n}) => {\n  const couponData = variantGetCoupon({ variant })\n\n  // variant\u5BF9\u5E94\u7684\u4F1A\u5458\u4EF7\u6298\u6263\u914D\u7F6E\n  const { memberPriceDiscountConfig, activeMemberPriceConfig } = getFunctionMemberPriceDiscountConfig({\n    config: memberPriceDiscount,\n    variant,\n  })\n\n  const useCoupon = !!activeMemberPriceConfig?.discount_combinations.other_product_discounts\n\n  if (!memberPriceDiscountConfig) {\n    return false as false\n  }\n\n  const originalPrice = {\n    amount: variant?.price.amount || 0,\n    priceWithCurrency: formatPrice({\n      amount: variant?.price.amount || 0,\n      currencyCode: currencyCode || 'USD',\n      locale,\n    }),\n  }\n\n  const salePriceWithoutCouponAmount = memberPriceDiscountConfig\n    ? functionDiscountCalculate({\n        config: memberPriceDiscountConfig,\n        price: variant?.price.amount || 0,\n      })\n    : variant?.price.amount || 0\n  const salePriceWithoutCoupon = {\n    amount: salePriceWithoutCouponAmount,\n    priceWithCurrency: formatPrice({\n      amount: salePriceWithoutCouponAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n    }),\n  }\n\n  // function \u4F1A\u5458\u4EF7\u662F\u5728\u539F\u4EF7\u7684\u57FA\u7840\u4E0A\u8FDB\u884C\u8BA1\u7B97\uFF0C\u6682\u4E0D\u652F\u6301\u6298\u540E\u4EF7\n  let salePriceAmount = salePriceWithoutCouponAmount\n\n  // \u51CF\u53BBcode\u7684\u4F18\u60E0\n  if (couponData?.variant_price4wscode && variant && useCoupon) {\n    if (useCoupon) {\n      // code\u7684\u4F18\u60E0\u91D1\u989D\n      const codeSaveAmountDecimal = new Decimal(variant.price.amount).minus(couponData.variant_price4wscode)\n      salePriceAmount = new Decimal(salePriceWithoutCouponAmount).minus(codeSaveAmountDecimal).toNumber()\n    } else {\n      // \u4E0D\u80FD\u4E0E code \u540C\u65F6\u4F7F\u7528\uFF0C\u9700\u8981\u5224\u65AD\u4F1A\u5458\u4EF7\u662F\u5426\u5C0F\u4E8E code \u7684\u4F18\u60E0\u91D1\u989D\uFF0C\u5982\u679C\u5C0F\u4E8E\u5219\u5F53\u505A\u6CA1\u6709\u4F1A\u5458\u4EF7\n      const codeSaveAmountDecimal = new Decimal(variant.price.amount).minus(couponData.variant_price4wscode)\n      if (salePriceWithoutCouponAmount > codeSaveAmountDecimal.toNumber()) {\n        return false as false\n      }\n    }\n  }\n\n  const salePrice = {\n    amount: salePriceAmount,\n    priceWithCurrency: formatPrice({\n      amount: salePriceAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n    }),\n  }\n\n  const savePriceAmount = new Decimal(originalPrice.amount).minus(salePrice.amount).toNumber()\n  const savePrice = {\n    amount: savePriceAmount,\n    priceWithCurrency: formatPrice({\n      amount: savePriceAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    }),\n  }\n\n  const savePriceWithoutCouponAmount = new Decimal(originalPrice.amount)\n    .minus(salePriceWithoutCoupon.amount)\n    .toNumber()\n  const savePriceWithoutCoupon = {\n    amount: savePriceWithoutCouponAmount,\n    priceWithCurrency: formatPrice({\n      amount: savePriceWithoutCouponAmount,\n      currencyCode: currencyCode || 'USD',\n      locale,\n      maximumFractionDigits: 2,\n    }),\n  }\n\n  const result: FunctionMemberPriceResult = {\n    // \u662F\u5426\u5B58\u5728\u4F1A\u5458\u4EF7\n    hasMemberPrice: !!memberPriceDiscountConfig,\n    useCoupon,\n    // \u539F\u4EF7\n    originalPrice: originalPrice.amount,\n    originalPriceWithCurrency: originalPrice.priceWithCurrency as string,\n    // \u4F7F\u7528\u5238\u540E\u7684\u6298\u540E\u4EF7\n    salePrice: salePrice.amount,\n    salePriceWithCurrency: salePrice.priceWithCurrency as string,\n\n    // \u4E0D\u4F7F\u7528\u5238\u7684\u6298\u540E\u4EF7\n    salePriceWithoutCoupon: salePriceWithoutCoupon.amount,\n    salePriceWithoutCouponWithCurrency: salePriceWithoutCoupon.priceWithCurrency as string,\n\n    // \u5305\u542B\u4F7F\u7528\u5238\u7684\u8282\u7701\u91D1\u989D\n    savePrice: savePrice.amount,\n    savePriceWithCurrency: savePrice.priceWithCurrency as string,\n\n    // \u4E0D\u4F7F\u7528\u5238\u7684\u8282\u7701\u91D1\u989D\n    savePriceWithoutCoupon: savePriceWithoutCoupon.amount,\n    savePriceWithoutCouponWithCurrency: savePriceWithoutCoupon.priceWithCurrency as string,\n  }\n\n  return result\n}\n"],
   "mappings": "AAAA,OAAS,eAAAA,MAAmB,WAG5B,OAAS,6BAAAC,MAAiC,8BAC1C,OAAOC,MAAa,aACpB,OAAS,wCAAAC,MAA4C,yCACrD,OAAOC,MAAsB,qBAGtB,MAAMC,EAAyB,CAAC,CACrC,oBAAAC,EACA,aAAAC,EACA,QAAAC,EACA,OAAAC,CACF,IAKM,CACJ,MAAMC,EAAaN,EAAiB,CAAE,QAAAI,CAAQ,CAAC,EAGzC,CAAE,0BAAAG,EAA2B,wBAAAC,CAAwB,EAAIT,EAAqC,CAClG,OAAQG,EACR,QAAAE,CACF,CAAC,EAEKK,EAAY,CAAC,CAACD,GAAyB,sBAAsB,wBAEnE,GAAI,CAACD,EACH,MAAO,GAGT,MAAMG,EAAgB,CACpB,OAAQN,GAAS,MAAM,QAAU,EACjC,kBAAmBR,EAAY,CAC7B,OAAQQ,GAAS,MAAM,QAAU,EACjC,aAAcD,GAAgB,MAC9B,OAAAE,CACF,CAAC,CACH,EAEMM,EAA+BJ,EACjCV,EAA0B,CACxB,OAAQU,EACR,MAAOH,GAAS,MAAM,QAAU,CAClC,CAAC,EACDA,GAAS,MAAM,QAAU,EACvBQ,EAAyB,CAC7B,OAAQD,EACR,kBAAmBf,EAAY,CAC7B,OAAQe,EACR,aAAcR,GAAgB,MAC9B,OAAAE,CACF,CAAC,CACH,EAGA,IAAIQ,EAAkBF,EAGtB,GAAIL,GAAY,sBAAwBF,GAAWK,EACjD,GAAIA,EAAW,CAEb,MAAMK,EAAwB,IAAIhB,EAAQM,EAAQ,MAAM,MAAM,EAAE,MAAME,EAAW,oBAAoB,EACrGO,EAAkB,IAAIf,EAAQa,CAA4B,EAAE,MAAMG,CAAqB,EAAE,SAAS,CACpG,KAAO,CAEL,MAAMA,EAAwB,IAAIhB,EAAQM,EAAQ,MAAM,MAAM,EAAE,MAAME,EAAW,oBAAoB,EACrG,GAAIK,EAA+BG,EAAsB,SAAS,EAChE,MAAO,EAEX,CAGF,MAAMC,EAAY,CAChB,OAAQF,EACR,kBAAmBjB,EAAY,CAC7B,OAAQiB,EACR,aAAcV,GAAgB,MAC9B,OAAAE,CACF,CAAC,CACH,EAEMW,EAAkB,IAAIlB,EAAQY,EAAc,MAAM,EAAE,MAAMK,EAAU,MAAM,EAAE,SAAS,EACrFE,EAAY,CAChB,OAAQD,EACR,kBAAmBpB,EAAY,CAC7B,OAAQoB,EACR,aAAcb,GAAgB,MAC9B,OAAAE,EACA,sBAAuB,CACzB,CAAC,CACH,EAEMa,EAA+B,IAAIpB,EAAQY,EAAc,MAAM,EAClE,MAAME,EAAuB,MAAM,EACnC,SAAS,EACNO,EAAyB,CAC7B,OAAQD,EACR,kBAAmBtB,EAAY,CAC7B,OAAQsB,EACR,aAAcf,GAAgB,MAC9B,OAAAE,EACA,sBAAuB,CACzB,CAAC,CACH,EA0BA,MAxB0C,CAExC,eAAgB,CAAC,CAACE,EAClB,UAAAE,EAEA,cAAeC,EAAc,OAC7B,0BAA2BA,EAAc,kBAEzC,UAAWK,EAAU,OACrB,sBAAuBA,EAAU,kBAGjC,uBAAwBH,EAAuB,OAC/C,mCAAoCA,EAAuB,kBAG3D,UAAWK,EAAU,OACrB,sBAAuBA,EAAU,kBAGjC,uBAAwBE,EAAuB,OAC/C,mCAAoCA,EAAuB,iBAC7D,CAGF",
   "names": ["formatPrice", "functionDiscountCalculate", "Decimal", "getFunctionMemberPriceDiscountConfig", "variantGetCoupon", "getFunctionMemberPrice", "memberPriceDiscount", "currencyCode", "variant", "locale", "couponData", "memberPriceDiscountConfig", "activeMemberPriceConfig", "useCoupon", "originalPrice", "salePriceWithoutCouponAmount", "salePriceWithoutCoupon", "salePriceAmount", "codeSaveAmountDecimal", "salePrice", "savePriceAmount", "savePrice", "savePriceWithoutCouponAmount", "savePriceWithoutCoupon"]
 }

package/dist/esm/components/credits/context/utils/getFunctionMemberPriceDiscountConfig.d.ts

@@ -1,8 +1,8 @@
 import { DiscountConfig, FunctionMemberPriceConfig } from '../memberPriceTypes';
-import { ProductVariant } from '@anker-in/lib';
+import { NormalizedProductVariant } from '@anker-in/shopify-react';
 export declare const getFunctionMemberPriceDiscountConfig: ({ config, variant, }: {
     config?: FunctionMemberPriceConfig[];
-    variant?: ProductVariant;
+    variant?: NormalizedProductVariant;
 }) => {
     memberPriceDiscountConfig: DiscountConfig | undefined;
     activeMemberPriceConfig: FunctionMemberPriceConfig | undefined;

package/dist/esm/components/credits/context/utils/getFunctionMemberPriceDiscountConfig.js

@@ -1,2 +1,2 @@
-import{atobID as f}from"./atobID";const b=({config:e,variant:t})=>{let i,r;if(!e||!t)return{memberPriceDiscountConfig:i,activeMemberPriceConfig:r};for(const o of e)if(i=o.result_detail.member_discounts?.find(n=>n.main_products.all_store_variant?n:n.main_products.variants.find(c=>String(c.variant_id)===f(t.id)))?.discount_conf,i){r=o;break}return i?{memberPriceDiscountConfig:i,activeMemberPriceConfig:r}:{memberPriceDiscountConfig:i,activeMemberPriceConfig:r}};export{b as getFunctionMemberPriceDiscountConfig};
+import{atobID as f}from"./atobID";const b=({config:e,variant:o})=>{let i,r;if(!e||!o)return{memberPriceDiscountConfig:i,activeMemberPriceConfig:r};for(const t of e)if(i=t.result_detail.member_discounts?.find(n=>n.main_products.all_store_variant?n:n.main_products.variants.find(c=>String(c.variant_id)===f(o.id)))?.discount_conf,i){r=t;break}return i?{memberPriceDiscountConfig:i,activeMemberPriceConfig:r}:{memberPriceDiscountConfig:i,activeMemberPriceConfig:r}};export{b as getFunctionMemberPriceDiscountConfig};
 //# sourceMappingURL=getFunctionMemberPriceDiscountConfig.js.map

package/dist/esm/components/credits/context/utils/getFunctionMemberPriceDiscountConfig.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/components/credits/context/utils/getFunctionMemberPriceDiscountConfig.ts"],
-  "sourcesContent": ["import { DiscountConfig, FunctionMemberPriceConfig } from '../memberPriceTypes'\nimport { ProductVariant } from '@anker-in/lib'\nimport { atobID } from './atobID'\n\n// \u83B7\u53D6\u4F1A\u5458\u4EF7\u6298\u6263\u914D\u7F6E\nexport const getFunctionMemberPriceDiscountConfig = ({\n  config,\n  variant,\n}: {\n  config?: FunctionMemberPriceConfig[]\n  variant?: ProductVariant\n}) => {\n  let memberPriceDiscountConfig: DiscountConfig | undefined\n  let activeMemberPriceConfig: FunctionMemberPriceConfig | undefined\n\n  if (!config || !variant) {\n    return {\n      memberPriceDiscountConfig,\n      activeMemberPriceConfig,\n    }\n  }\n\n  for (const configItem of config) {\n    memberPriceDiscountConfig = configItem.result_detail.member_discounts?.find(discountItem => {\n      if (discountItem.main_products.all_store_variant) {\n        return discountItem\n      }\n\n      return discountItem.main_products.variants.find(\n        variantConfig => String(variantConfig.variant_id) === atobID(variant.id as string)\n      )\n    })?.discount_conf\n\n    if (memberPriceDiscountConfig) {\n      activeMemberPriceConfig = configItem\n      break\n    }\n  }\n\n  if (!memberPriceDiscountConfig) {\n    return {\n      memberPriceDiscountConfig,\n      activeMemberPriceConfig,\n    }\n  }\n\n  return {\n    memberPriceDiscountConfig,\n    activeMemberPriceConfig,\n  }\n}\n"],
+  "sourcesContent": ["import { DiscountConfig, FunctionMemberPriceConfig } from '../memberPriceTypes'\nimport { NormalizedProductVariant } from '@anker-in/shopify-react'\nimport { atobID } from './atobID'\n\n// \u83B7\u53D6\u4F1A\u5458\u4EF7\u6298\u6263\u914D\u7F6E\nexport const getFunctionMemberPriceDiscountConfig = ({\n  config,\n  variant,\n}: {\n  config?: FunctionMemberPriceConfig[]\n  variant?: NormalizedProductVariant\n}) => {\n  let memberPriceDiscountConfig: DiscountConfig | undefined\n  let activeMemberPriceConfig: FunctionMemberPriceConfig | undefined\n\n  if (!config || !variant) {\n    return {\n      memberPriceDiscountConfig,\n      activeMemberPriceConfig,\n    }\n  }\n\n  for (const configItem of config) {\n    memberPriceDiscountConfig = configItem.result_detail.member_discounts?.find(discountItem => {\n      if (discountItem.main_products.all_store_variant) {\n        return discountItem\n      }\n\n      return discountItem.main_products.variants.find(\n        variantConfig => String(variantConfig.variant_id) === atobID(variant.id as string)\n      )\n    })?.discount_conf\n\n    if (memberPriceDiscountConfig) {\n      activeMemberPriceConfig = configItem\n      break\n    }\n  }\n\n  if (!memberPriceDiscountConfig) {\n    return {\n      memberPriceDiscountConfig,\n      activeMemberPriceConfig,\n    }\n  }\n\n  return {\n    memberPriceDiscountConfig,\n    activeMemberPriceConfig,\n  }\n}\n"],
   "mappings": "AAEA,OAAS,UAAAA,MAAc,WAGhB,MAAMC,EAAuC,CAAC,CACnD,OAAAC,EACA,QAAAC,CACF,IAGM,CACJ,IAAIC,EACAC,EAEJ,GAAI,CAACH,GAAU,CAACC,EACd,MAAO,CACL,0BAAAC,EACA,wBAAAC,CACF,EAGF,UAAWC,KAAcJ,EAWvB,GAVAE,EAA4BE,EAAW,cAAc,kBAAkB,KAAKC,GACtEA,EAAa,cAAc,kBACtBA,EAGFA,EAAa,cAAc,SAAS,KACzCC,GAAiB,OAAOA,EAAc,UAAU,IAAMR,EAAOG,EAAQ,EAAY,CACnF,CACD,GAAG,cAEAC,EAA2B,CAC7BC,EAA0BC,EAC1B,KACF,CAGF,OAAKF,EAOE,CACL,0BAAAA,EACA,wBAAAC,CACF,EATS,CACL,0BAAAD,EACA,wBAAAC,CACF,CAOJ",
   "names": ["atobID", "getFunctionMemberPriceDiscountConfig", "config", "variant", "memberPriceDiscountConfig", "activeMemberPriceConfig", "configItem", "discountItem", "variantConfig"]
 }

package/dist/esm/components/credits/context/utils/variantGetCoupon.d.ts

@@ -1,6 +1,6 @@
-import { ProductVariant } from '@anker-in/lib';
+import { NormalizedProductVariant } from '@anker-in/shopify-react';
 declare const variantGetCoupon: ({ variant, channel, }: {
-    variant?: ProductVariant;
+    variant?: NormalizedProductVariant;
     channel?: string;
 }) => any;
 export default variantGetCoupon;

package/dist/esm/components/credits/context/utils/variantGetCoupon.js

@@ -1,2 +1,2 @@
-import{atobID as a}from"./atobID";const r=({variant:e,channel:i=""})=>{if(!e)return;const s="wsch";return(e?.metafields?.discountCodeApp||[])?.filter(t=>{const n=a(e.id);return(!t?.ends_at||new Date(t?.ends_at).getTime()>new Date().getTime())&&new Date(t?.starts_at).getTime()<=new Date().getTime()&&t.variant_shopify_id===+(n||"")&&(i?t?.title?.toLocaleLowerCase().includes(i):!t?.title?.toLocaleLowerCase().includes(s))})?.[0]};var f=r;export{f as default};
+import{atobID as n}from"./atobID";const r=({variant:e,channel:i=""})=>{if(!e)return;const s="wsch";return(e?.metafields?.discountCodeApp||[])?.filter(t=>{const a=n(e.id);return(!t?.ends_at||new Date(t?.ends_at).getTime()>new Date().getTime())&&new Date(t?.starts_at).getTime()<=new Date().getTime()&&t.variant_shopify_id===+(a||"")&&(i?t?.title?.toLocaleLowerCase().includes(i):!t?.title?.toLocaleLowerCase().includes(s))})?.[0]};var f=r;export{f as default};
 //# sourceMappingURL=variantGetCoupon.js.map

package/dist/esm/components/credits/context/utils/variantGetCoupon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/components/credits/context/utils/variantGetCoupon.ts"],
-  "sourcesContent": ["import { ProductVariant } from '@anker-in/lib'\nimport { atobID } from './atobID'\n\nconst variantGetCoupon = ({\n  variant,\n  channel = '',\n}: {\n  variant?: ProductVariant\n  channel?: string\n}) => {\n  if (!variant) return undefined\n\n  const hideChannel = 'wsch'\n  const discountCodeApp = variant?.metafields?.discountCodeApp || []\n\n  const results = discountCodeApp?.filter((coupon: any) => {\n    const variantId = atobID(variant.id as string)\n    const isActive =\n      (!coupon?.ends_at || new Date(coupon?.ends_at).getTime() > new Date().getTime()) &&\n      new Date(coupon?.starts_at).getTime() <= new Date().getTime() &&\n      coupon.variant_shopify_id === +(variantId || '')\n\n    return (\n      isActive &&\n      (channel\n        ? coupon?.title?.toLocaleLowerCase().includes(channel)\n        : !coupon?.title?.toLocaleLowerCase().includes(hideChannel))\n    )\n  })\n\n  return results?.[0]\n}\n\nexport default variantGetCoupon\n"],
+  "sourcesContent": ["import { NormalizedProductVariant } from '@anker-in/shopify-react'\nimport { atobID } from './atobID'\n\nconst variantGetCoupon = ({\n  variant,\n  channel = '',\n}: {\n  variant?: NormalizedProductVariant\n  channel?: string\n}) => {\n  if (!variant) return undefined\n\n  const hideChannel = 'wsch'\n  const discountCodeApp = variant?.metafields?.discountCodeApp || []\n\n  const results = discountCodeApp?.filter((coupon: any) => {\n    const variantId = atobID(variant.id as string)\n    const isActive =\n      (!coupon?.ends_at || new Date(coupon?.ends_at).getTime() > new Date().getTime()) &&\n      new Date(coupon?.starts_at).getTime() <= new Date().getTime() &&\n      coupon.variant_shopify_id === +(variantId || '')\n\n    return (\n      isActive &&\n      (channel\n        ? coupon?.title?.toLocaleLowerCase().includes(channel)\n        : !coupon?.title?.toLocaleLowerCase().includes(hideChannel))\n    )\n  })\n\n  return results?.[0]\n}\n\nexport default variantGetCoupon\n"],
   "mappings": "AACA,OAAS,UAAAA,MAAc,WAEvB,MAAMC,EAAmB,CAAC,CACxB,QAAAC,EACA,QAAAC,EAAU,EACZ,IAGM,CACJ,GAAI,CAACD,EAAS,OAEd,MAAME,EAAc,OAkBpB,OAjBwBF,GAAS,YAAY,iBAAmB,CAAC,IAEhC,OAAQG,GAAgB,CACvD,MAAMC,EAAYN,EAAOE,EAAQ,EAAY,EAM7C,OAJG,CAACG,GAAQ,SAAW,IAAI,KAAKA,GAAQ,OAAO,EAAE,QAAQ,EAAI,IAAI,KAAK,EAAE,QAAQ,IAC9E,IAAI,KAAKA,GAAQ,SAAS,EAAE,QAAQ,GAAK,IAAI,KAAK,EAAE,QAAQ,GAC5DA,EAAO,qBAAuB,EAAEC,GAAa,MAI5CH,EACGE,GAAQ,OAAO,kBAAkB,EAAE,SAASF,CAAO,EACnD,CAACE,GAAQ,OAAO,kBAAkB,EAAE,SAASD,CAAW,EAEhE,CAAC,IAEgB,CAAC,CACpB,EAEA,IAAOG,EAAQN",
   "names": ["atobID", "variantGetCoupon", "variant", "channel", "hideChannel", "coupon", "variantId", "variantGetCoupon_default"]
 }

package/dist/esm/components/credits/creditsAnkersolixTask/CreditsAnkersolixTask.js

@@ -1,2 +1,2 @@
-import{Fragment as M,jsx as e,jsxs as i}from"react/jsx-runtime";import{Button as I,Container as j,Heading as y,Picture as z,Text as A}from"@anker-in/headless-ui";import{ChevronDownIcon as _,ChevronUpIcon as E}from"@heroicons/react/24/outline";import{motion as H}from"framer-motion";import{useMemo as q,useState as d}from"react";import{TaskType as b}from"./type";import{useActions as V}from"../creditsWaysToGetCredits/useActions";import{useCreditsContext as G}from"../context/provider";import{classNames as h,useHeadlessContext as J}from"@anker-in/lib";import{useRegistration as K}from"../../registration";import{CreditsUploadReceiptModal as Q}from"../modal/creditsUploadReceiptModal";import{CreditsSubscribeModal as W}from"../modal/subscribeModal";import{ROUNDED_BRANDS as X}from"../../../constants";const ce=({copy:s,classNames:Y,id:g})=>{const[l,v]=d(!1),{profile:R}=G(),{authCodeActivate:L}=K(),{brand:T}=J(),p=X.includes(T),x=!!R,[U,k]=d(!1),[O,u]=d(!1),[C,B]=d(!1),[F,D]=d(!1),{actions:m}=V({copy:s,subscribe:{openSubscribePopup:()=>u(!0),isSuccess:C},uploadReceipt:{openUploadReceiptPopup:()=>k(!0),isSuccess:F}}),N=q(()=>{const t=s.list.map(n=>{if(!m[n.id])return;const{finished:a,notLogin:w,notFinished:f,completed:P}=m[n.id];let r="",c,S;return x?a?(r=P.buttonLabel,c=void 0):(r=f.buttonLabel,c=f.handleClick,S=f.link):(r=w.buttonLabel,c=w.handleClick),{...n,buttonLabel:r,handleClick:c,finished:a,link:S}}).filter(Boolean);return x?t.sort((n,a)=>n?.finished&&!a?.finished?1:!n?.finished&&a?.finished?-1:0):t},[m,s.list,x]),o=N.length>3;return i(j,{id:g,className:"bg-[#F5F5F7]",children:[e(y,{as:"h2",size:"4",html:s.title}),i("div",{className:h("mt-[24px] p-[32px] md-l:p-[32px] md:p-[16px] relative overflow-hidden",p?"rounded-[8px]":"",!p&&"l:rounded-none"),style:{background:"linear-gradient(180deg, rgba(255, 241, 214, 0) 39.51%, #F4CA81 119.53%)"},children:[e("div",{className:"absolute inset-0 pointer-events-none -z-10",style:{background:"radial-gradient(ellipse 130% 205% at 45% -20%, #FFF6EA 0%, #FFFFFF 73%, #FFF1D6 100%)"}}),i("div",{className:"flex items-center justify-between xl-xxl:h-[448px] l-xl:h-[336px] h-[560px] l:h-auto md:flex-col md:items-start l:h-auto l:mb-[16px] l:flex-col-reverse l:items-start",children:[i("div",{className:"flex flex-col gap-[8px] l:mt-[8px]",children:[e(y,{as:"h3",size:4,html:s?.subtitle,className:"text-[32px] font-bold text-[#080a0f] tracking-[-1.28px] leading-[1.2] xl:text-[24px]"}),e("div",{className:"flex items-center gap-[8px]",children:e("p",{className:"text-[48px] font-bold tracking-[-1.92px] leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-43% to-[#00db84] bg-clip-text text-transparent xl-xxl:text-[40px] l-xl:text-[32px] l:text-[24px]",dangerouslySetInnerHTML:{__html:s.equalCredits}})})]}),s.mainImage?.url&&e(z,{className:"h-full object-contain l:mx-auto md:h-auto md:w-full md-l:h-[302px]",imgClassName:"!h-full !object-contain",source:s.mainImage.url})]}),i("div",{className:"relative mt-[24px]",children:[i(H.div,{className:h("grid grid-cols-3 gap-[16px] overflow-hidden md:grid-cols-1 md-l:grid-cols-2 min-md:!h-auto"),initial:{height:o?512:"auto"},animate:{height:l||!o?"auto":512},transition:{duration:.3},onAnimationComplete:()=>{if(!l&&o&&window.screen.width<768){const t=document.getElementById(g||"ankersolix-task");t&&t.scrollIntoView({behavior:"smooth",block:"end"})}},children:[N.map(t=>i("div",{className:h("flex min-h-[241px] xl-xxl:min-h-[192px] l:min-h-[160px] l-xl:min-h-[170px] flex-col justify-between bg-white p-[32px] xl:p-[16px]",p?"rounded-[16px]":""),children:[i("div",{children:[e(A,{as:"p",html:t.title,size:2,className:"text-pretty text-[24px] font-bold xxl:text-[20px]"}),i("div",{className:"mt-[8px] l:mt-[4px] flex items-center",children:[e(z,{className:"size-[24px] xxl:size-[18px] [&_path]:size-full",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450"}),e(A,{as:"p",html:t.credits,size:2,className:"ml-[4px] mt-[6px] text-[18px] xxl:text-[14px]"})]})]}),t.handleClick&&!(t.id===b.UploadReceipt&&F)&&!(t.id===b.Activate&&L.isActivateSuccess)&&!(t.id===b.Subscribe&&C)?e(I,{as:t.link?"a":"button",...t.link&&{href:t.link},...t.handleClick&&{onClick:t.handleClick},variant:"primary",size:"lg",className:"mt-[24px] w-fit bg-[#080a0f] text-white text-[16px] font-bold tracking-[-0.64px] leading-[1.2]",children:t.buttonLabel}):e(I,{variant:"primary",size:"lg",className:"mt-[24px] w-fit bg-[#080a0f] text-white text-[16px] font-bold tracking-[-0.64px] leading-[1.2]",disabled:!0,children:t.buttonLabel})]},t.id)),!l&&o&&e("div",{className:"absolute inset-0 pointer-events-none min-md:hidden",style:{background:"linear-gradient(180deg, rgba(244, 202, 129, 0) 66.37%, #f4ca81 100%)"}})]}),o&&e(M,{children:l?e("button",{className:"mx-auto mt-[12px] block w-fit min-md:hidden",onClick:()=>{v(!1)},children:e(E,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})}):e(M,{children:e("div",{className:"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden",children:e("button",{className:"w-fit",onClick:()=>v(!l),children:e(_,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})})})})})]})]}),s.receipt&&e(Q,{isOpen:U,onClose:()=>{k(!1)},copy:s.receipt,onSuccess:()=>{D(!0)}}),s.subscribe&&e(W,{copy:s.subscribe,onSuccess:()=>{B(!0),setTimeout(()=>{u(!1)},3e3)},isOpen:O,onClose:()=>{u(!1)}})]})};export{ce as CreditsAnkersolixTask};
+import{Fragment as R,jsx as e,jsxs as l}from"react/jsx-runtime";import{Button as w,Container as j,Heading as I,Picture as y,Text as z}from"@anker-in/headless-ui";import{ChevronDownIcon as E,ChevronUpIcon as _}from"@heroicons/react/24/outline";import{useMemo as H,useState as r,useEffect as q}from"react";import{TaskType as h}from"./type";import{useActions as V}from"../creditsWaysToGetCredits/useActions";import{useCreditsContext as G}from"../context/provider";import{classNames as g,useHeadlessContext as J}from"@anker-in/lib";import{useRegistration as K}from"../../registration";import{CreditsUploadReceiptModal as Q}from"../modal/creditsUploadReceiptModal";import{CreditsSubscribeModal as W}from"../modal/subscribeModal";import{ROUNDED_BRANDS as X}from"../../../constants";const ce=({copy:s,classNames:Y,id:p})=>{const[n,v]=r(!1),{profile:T}=G(),{authCodeActivate:M}=K(),{brand:A}=J(),u=X.includes(A),x=!!T,[L,k]=r(!1),[U,m]=r(!1),[C,O]=r(!1),[F,B]=r(!1),{actions:f}=V({copy:s,subscribe:{openSubscribePopup:()=>m(!0),isSuccess:C},uploadReceipt:{openUploadReceiptPopup:()=>k(!0),isSuccess:F}}),o=(s?.list||[]).length>3;q(()=>{if(!n&&o&&window.screen.width<768){const t=setTimeout(()=>{const i=document.getElementById(p||"ankersolix-task");i&&i.scrollIntoView({behavior:"smooth",block:"end"})},300);return()=>clearTimeout(t)}},[n,o,p]);const D=H(()=>{const t=s.list.map(i=>{if(!f[i.id])return;const{finished:a,notLogin:N,notFinished:b,completed:P}=f[i.id];let d="",c,S;return x?a?(d=P.buttonLabel,c=void 0):(d=b.buttonLabel,c=b.handleClick,S=b.link):(d=N.buttonLabel,c=N.handleClick),{...i,buttonLabel:d,handleClick:c,finished:a,link:S}}).filter(Boolean);return x?t.sort((i,a)=>i?.finished&&!a?.finished?1:!i?.finished&&a?.finished?-1:0):t},[f,s.list,x]);return l(j,{id:p,className:"bg-[#F5F5F7]",children:[e(I,{as:"h2",size:"4",html:s.title}),l("div",{className:g("mt-[24px] p-[32px] md-l:p-[32px] md:p-[16px] relative overflow-hidden",u?"rounded-[8px]":"",!u&&"l:rounded-none"),style:{background:"linear-gradient(180deg, rgba(255, 241, 214, 0) 39.51%, #F4CA81 119.53%)"},children:[e("div",{className:"absolute inset-0 pointer-events-none -z-10",style:{background:"radial-gradient(ellipse 130% 205% at 45% -20%, #FFF6EA 0%, #FFFFFF 73%, #FFF1D6 100%)"}}),l("div",{className:"flex items-center justify-between xl-xxl:h-[448px] l-xl:h-[336px] h-[560px] l:h-auto md:flex-col md:items-start l:h-auto l:mb-[16px] l:flex-col-reverse l:items-start",children:[l("div",{className:"flex flex-col gap-[8px] l:mt-[8px]",children:[e(I,{as:"h3",size:4,html:s?.subtitle,className:"text-[32px] font-bold text-[#080a0f] tracking-[-1.28px] leading-[1.2] xl:text-[24px]"}),e("div",{className:"flex items-center gap-[8px]",children:e("p",{className:"text-[48px] font-bold tracking-[-1.92px] leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-43% to-[#00db84] bg-clip-text text-transparent xl-xxl:text-[40px] l-xl:text-[32px] l:text-[24px]",dangerouslySetInnerHTML:{__html:s.equalCredits}})})]}),s.mainImage?.url&&e(y,{className:"h-full object-contain l:mx-auto md:h-auto md:w-full md-l:h-[302px]",imgClassName:"!h-full !object-contain",source:s.mainImage.url})]}),l("div",{className:"relative mt-[24px]",children:[l("div",{className:g("grid grid-cols-3 gap-[16px] overflow-hidden md:grid-cols-1 md-l:grid-cols-2 min-md:!h-auto transition-all duration-300 ease-in-out"),style:{height:n||!o?"auto":"512px"},children:[D.map(t=>l("div",{className:g("flex min-h-[241px] xl-xxl:min-h-[192px] l:min-h-[160px] l-xl:min-h-[170px] flex-col justify-between bg-white p-[32px] xl:p-[16px]",u?"rounded-[16px]":""),children:[l("div",{children:[e(z,{as:"p",html:t.title,size:2,className:"text-pretty text-[24px] font-bold xxl:text-[20px]"}),l("div",{className:"mt-[8px] l:mt-[4px] flex items-center",children:[e(y,{className:"size-[24px] xxl:size-[18px] [&_path]:size-full",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450"}),e(z,{as:"p",html:t.credits,size:2,className:"ml-[4px] mt-[6px] text-[18px] xxl:text-[14px]"})]})]}),t.handleClick&&!(t.id===h.UploadReceipt&&F)&&!(t.id===h.Activate&&M.isActivateSuccess)&&!(t.id===h.Subscribe&&C)?e(w,{as:t.link?"a":"button",...t.link&&{href:t.link},...t.handleClick&&{onClick:t.handleClick},variant:"primary",size:"lg",className:"mt-[24px] w-fit",children:t.buttonLabel}):e(w,{variant:"primary",size:"lg",className:"mt-[24px] w-fit",disabled:!0,children:t.buttonLabel})]},t.id)),!n&&o&&e("div",{className:"absolute inset-0 pointer-events-none min-md:hidden",style:{background:"linear-gradient(180deg, rgba(244, 202, 129, 0) 66.37%, #f4ca81 100%)"}})]}),o&&e(R,{children:n?e("button",{className:"mx-auto mt-[12px] block w-fit min-md:hidden",onClick:()=>{v(!1)},children:e(_,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})}):e(R,{children:e("div",{className:"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden",children:e("button",{className:"w-fit",onClick:()=>v(!n),children:e(E,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})})})})})]})]}),s.receipt&&e(Q,{isOpen:L,onClose:()=>{k(!1)},copy:s.receipt,onSuccess:()=>{B(!0)}}),s.subscribe&&e(W,{copy:s.subscribe,onSuccess:()=>{O(!0),setTimeout(()=>{m(!1)},3e3)},isOpen:U,onClose:()=>{m(!1)}})]})};export{ce as CreditsAnkersolixTask};
 //# sourceMappingURL=CreditsAnkersolixTask.js.map

package/dist/esm/components/credits/creditsAnkersolixTask/CreditsAnkersolixTask.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsAnkersolixTask/CreditsAnkersolixTask.tsx"],
-  "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline'\nimport { motion } from 'framer-motion'\nimport { useMemo, useState } from 'react'\n\nimport { TaskType, type CreditsAnkersolixTaskProps } from './type'\nimport { useActions } from '../creditsWaysToGetCredits/useActions'\nimport { useCreditsContext } from '../context/provider'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useRegistration } from '../../registration'\nimport { CreditsUploadReceiptModal } from '../modal/creditsUploadReceiptModal'\nimport { CreditsSubscribeModal } from '../modal/subscribeModal'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport const CreditsAnkersolixTask = ({ copy, classNames, id }: CreditsAnkersolixTaskProps & { id?: string }) => {\n  const [showMore, setShowMore] = useState(false)\n  const { profile } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const isLogin = !!profile\n\n  const [isUploadReceiptModalOpen, setIsUploadReceiptModalOpen] = useState(false)\n  const [isSubscribeModalOpen, setIsSubscribeModalOpen] = useState(false)\n  const [isSubscribeSuccess, setIsSubscribeSuccess] = useState(false)\n  const [isUploadReceiptSuccess, setIsUploadReceiptSuccess] = useState(false)\n\n  const { actions } = useActions({\n    copy,\n    subscribe: {\n      openSubscribePopup: () => setIsSubscribeModalOpen(true),\n      isSuccess: isSubscribeSuccess,\n    },\n    uploadReceipt: {\n      openUploadReceiptPopup: () => setIsUploadReceiptModalOpen(true),\n      isSuccess: isUploadReceiptSuccess,\n    },\n  })\n  const list = useMemo(() => {\n    const list = copy.list\n      .map(item => {\n        if (!actions[item.id as keyof typeof actions]) {\n          return undefined\n        }\n        const { finished, notLogin, notFinished, completed } = actions[item.id as keyof typeof actions]\n        let buttonLabel = ''\n        let handleClick = undefined\n        let link = undefined\n        if (!isLogin) {\n          buttonLabel = notLogin.buttonLabel\n          handleClick = notLogin.handleClick\n        } else if (finished) {\n          buttonLabel = completed.buttonLabel\n          handleClick = undefined\n        } else {\n          buttonLabel = notFinished.buttonLabel\n          handleClick = notFinished.handleClick\n          link = (notFinished as { link: string }).link\n        }\n        return {\n          ...item,\n          buttonLabel,\n          handleClick,\n          finished,\n          link,\n        }\n      })\n      .filter(Boolean) as {\n      title: string\n      credits: string\n      id: TaskType\n      buttonLabel: string\n      finished: boolean\n      link: string\n      handleClick: (() => void) | undefined\n    }[]\n\n    // \u767B\u5F55\u540E\uFF0C\u4FDD\u7559\u539F\u987A\u5E8F\uFF0C\u5C06\u5DF2\u5B8C\u6210\u7684\u4EFB\u52A1\u653E\u5728\u6700\u540E\n    if (isLogin) {\n      return list.sort((a, b) => {\n        if (a?.finished && !b?.finished) {\n          return 1 // a\u5DF2\u5B8C\u6210\uFF0Cb\u672A\u5B8C\u6210\uFF0Ca\u6392\u5728\u540E\u9762\n        }\n        if (!a?.finished && b?.finished) {\n          return -1 // a\u672A\u5B8C\u6210\uFF0Cb\u5DF2\u5B8C\u6210\uFF0Ca\u6392\u5728\u524D\u9762\n        }\n        return 0 // \u90FD\u5DF2\u5B8C\u6210\u6216\u90FD\u672A\u5B8C\u6210\uFF0C\u4FDD\u6301\u539F\u987A\u5E8F\n      })\n    } else {\n      return list\n    }\n  }, [actions, copy.list, isLogin])\n\n  // \u53EA\u6709\u5927\u4E8E3\u4E2A\u4EFB\u52A1\u65F6\u624D\u663E\u793A\u8499\u5C42\n  const shouldShowMask = list.length > 3\n\n  return (\n    <Container id={id} className=\"bg-[#F5F5F7]\">\n      <Heading as=\"h2\" size=\"4\" html={copy.title} />\n      <div\n        className={cn(\n          'mt-[24px] p-[32px] md-l:p-[32px] md:p-[16px] relative overflow-hidden',\n          rounded ? 'rounded-[8px]' : '',\n          !rounded && 'l:rounded-none'\n        )}\n        style={{\n          background: 'linear-gradient(180deg, rgba(255, 241, 214, 0) 39.51%, #F4CA81 119.53%)',\n        }}\n      >\n        {/* \u5F84\u5411\u6E10\u53D8\u80CC\u666F\u5C42 - \u4F7F\u7528\u4F2A\u5143\u7D20\u6A21\u62DF */}\n        <div\n          className=\"absolute inset-0 pointer-events-none -z-10\"\n          style={{\n            background: 'radial-gradient(ellipse 130% 205% at 45% -20%, #FFF6EA 0%, #FFFFFF 73%, #FFF1D6 100%)',\n          }}\n        />\n        {/* \u526F\u6807\u9898\u548C\u88C5\u9970\u56FE\u90E8\u5206 */}\n        <div className=\"flex items-center justify-between xl-xxl:h-[448px] l-xl:h-[336px] h-[560px] l:h-auto md:flex-col md:items-start l:h-auto l:mb-[16px] l:flex-col-reverse l:items-start\">\n          <div className=\"flex flex-col gap-[8px] l:mt-[8px]\">\n            <Heading\n              as=\"h3\"\n              size={4}\n              html={copy?.subtitle}\n              className=\"text-[32px] font-bold text-[#080a0f] tracking-[-1.28px] leading-[1.2] xl:text-[24px]\"\n            />\n            <div className=\"flex items-center gap-[8px]\">\n              <p\n                className=\"text-[48px] font-bold tracking-[-1.92px] leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-43% to-[#00db84] bg-clip-text text-transparent xl-xxl:text-[40px] l-xl:text-[32px] l:text-[24px]\"\n                dangerouslySetInnerHTML={{ __html: copy.equalCredits }}\n              />\n            </div>\n          </div>\n          {copy.mainImage?.url && (\n            <Picture\n              className=\"h-full object-contain l:mx-auto md:h-auto md:w-full md-l:h-[302px]\"\n              imgClassName=\"!h-full !object-contain\"\n              source={copy.mainImage.url}\n            />\n          )}\n        </div>\n\n        {/* \u5361\u7247\u5217\u8868 */}\n        <div className=\"relative mt-[24px]\">\n          <motion.div\n            className={cn('grid grid-cols-3 gap-[16px] overflow-hidden md:grid-cols-1 md-l:grid-cols-2 min-md:!h-auto')}\n            initial={{ height: shouldShowMask ? 512 : 'auto' }}\n            animate={{ height: showMore || !shouldShowMask ? 'auto' : 512 }}\n            transition={{ duration: 0.3 }}\n            onAnimationComplete={() => {\n              if (!showMore && shouldShowMask && window.screen.width < 768) {\n                const section = document.getElementById(id || 'ankersolix-task')\n                if (section) {\n                  section.scrollIntoView({ behavior: 'smooth', block: 'end' })\n                }\n              }\n            }}\n          >\n            {list.map(item => (\n              <div\n                key={item.id}\n                className={cn(\n                  'flex min-h-[241px] xl-xxl:min-h-[192px] l:min-h-[160px] l-xl:min-h-[170px] flex-col justify-between bg-white p-[32px] xl:p-[16px]',\n                  rounded ? 'rounded-[16px]' : ''\n                )}\n              >\n                <div>\n                  <Text\n                    as=\"p\"\n                    html={item.title}\n                    size={2}\n                    className=\"text-pretty text-[24px] font-bold xxl:text-[20px]\"\n                  />\n                  <div className=\"mt-[8px] l:mt-[4px] flex items-center\">\n                    <Picture\n                      className=\"size-[24px] xxl:size-[18px] [&_path]:size-full\"\n                      source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450\"\n                    />\n                    <Text\n                      as=\"p\"\n                      html={item.credits}\n                      size={2}\n                      className=\"ml-[4px] mt-[6px] text-[18px] xxl:text-[14px]\"\n                    />\n                  </div>\n                </div>\n\n                {item.handleClick &&\n                !(item.id === TaskType.UploadReceipt && isUploadReceiptSuccess) &&\n                !(item.id === TaskType.Activate && authCodeActivate.isActivateSuccess) &&\n                !(item.id === TaskType.Subscribe && isSubscribeSuccess) ? (\n                  <Button\n                    as={item.link ? 'a' : 'button'}\n                    {...(item.link && { href: item.link })}\n                    {...(item.handleClick && { onClick: item.handleClick })}\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"mt-[24px] w-fit bg-[#080a0f] text-white text-[16px] font-bold tracking-[-0.64px] leading-[1.2]\"\n                  >\n                    {item.buttonLabel}\n                  </Button>\n                ) : (\n                  <Button\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"mt-[24px] w-fit bg-[#080a0f] text-white text-[16px] font-bold tracking-[-0.64px] leading-[1.2]\"\n                    disabled\n                  >\n                    {item.buttonLabel}\n                  </Button>\n                )}\n              </div>\n            ))}\n            {!showMore && shouldShowMask && (\n              <div\n                className=\"absolute inset-0 pointer-events-none min-md:hidden\"\n                style={{ background: 'linear-gradient(180deg, rgba(244, 202, 129, 0) 66.37%, #f4ca81 100%)' }}\n              ></div>\n            )}\n          </motion.div>\n          {shouldShowMask && (\n            <>\n              {showMore ? (\n                <button\n                  className=\"mx-auto mt-[12px] block w-fit min-md:hidden\"\n                  onClick={() => {\n                    setShowMore(false)\n                  }}\n                >\n                  <ChevronUpIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronUpIcon>\n                </button>\n              ) : (\n                <>\n                  <div className=\"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden\">\n                    <button className=\"w-fit\" onClick={() => setShowMore(!showMore)}>\n                      <ChevronDownIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronDownIcon>\n                    </button>\n                  </div>\n                </>\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      {copy.receipt && (\n        <CreditsUploadReceiptModal\n          isOpen={isUploadReceiptModalOpen}\n          onClose={() => {\n            setIsUploadReceiptModalOpen(false)\n          }}\n          copy={copy.receipt}\n          onSuccess={() => {\n            setIsUploadReceiptSuccess(true)\n          }}\n        />\n      )}\n      {copy.subscribe && (\n        <CreditsSubscribeModal\n          copy={copy.subscribe}\n          onSuccess={() => {\n            setIsSubscribeSuccess(true)\n            setTimeout(() => {\n              setIsSubscribeModalOpen(false)\n            }, 3000)\n          }}\n          isOpen={isSubscribeModalOpen}\n          onClose={() => {\n            setIsSubscribeModalOpen(false)\n          }}\n        />\n      )}\n    </Container>\n  )\n}\n"],
-  "mappings": "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",
-  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "ChevronDownIcon", "ChevronUpIcon", "motion", "useMemo", "useState", "TaskType", "useActions", "useCreditsContext", "cn", "useHeadlessContext", "useRegistration", "CreditsUploadReceiptModal", "CreditsSubscribeModal", "ROUNDED_BRANDS", "CreditsAnkersolixTask", "copy", "classNames", "id", "showMore", "setShowMore", "profile", "authCodeActivate", "brand", "rounded", "isLogin", "isUploadReceiptModalOpen", "setIsUploadReceiptModalOpen", "isSubscribeModalOpen", "setIsSubscribeModalOpen", "isSubscribeSuccess", "setIsSubscribeSuccess", "isUploadReceiptSuccess", "setIsUploadReceiptSuccess", "actions", "list", "item", "finished", "notLogin", "notFinished", "completed", "buttonLabel", "handleClick", "link", "a", "b", "shouldShowMask", "section"]
+  "sourcesContent": ["import { Button, Container, Heading, Picture, Text } from '@anker-in/headless-ui'\nimport { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline'\nimport { useMemo, useState, useRef, useEffect } from 'react'\n\nimport { TaskType, type CreditsAnkersolixTaskProps } from './type'\nimport { useActions } from '../creditsWaysToGetCredits/useActions'\nimport { useCreditsContext } from '../context/provider'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useRegistration } from '../../registration'\nimport { CreditsUploadReceiptModal } from '../modal/creditsUploadReceiptModal'\nimport { CreditsSubscribeModal } from '../modal/subscribeModal'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport const CreditsAnkersolixTask = ({ copy, classNames, id }: CreditsAnkersolixTaskProps & { id?: string }) => {\n  const [showMore, setShowMore] = useState(false)\n  const { profile } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const isLogin = !!profile\n\n  const [isUploadReceiptModalOpen, setIsUploadReceiptModalOpen] = useState(false)\n  const [isSubscribeModalOpen, setIsSubscribeModalOpen] = useState(false)\n  const [isSubscribeSuccess, setIsSubscribeSuccess] = useState(false)\n  const [isUploadReceiptSuccess, setIsUploadReceiptSuccess] = useState(false)\n\n  const { actions } = useActions({\n    copy,\n    subscribe: {\n      openSubscribePopup: () => setIsSubscribeModalOpen(true),\n      isSuccess: isSubscribeSuccess,\n    },\n    uploadReceipt: {\n      openUploadReceiptPopup: () => setIsUploadReceiptModalOpen(true),\n      isSuccess: isUploadReceiptSuccess,\n    },\n  })\n\n  const shouldShowMask = (copy?.list || []).length > 3\n\n  // Handle scroll after collapse animation\n  useEffect(() => {\n    if (!showMore && shouldShowMask && window.screen.width < 768) {\n      const timer = setTimeout(() => {\n        const section = document.getElementById(id || 'ankersolix-task')\n        if (section) {\n          section.scrollIntoView({ behavior: 'smooth', block: 'end' })\n        }\n      }, 300) // Match transition duration\n      return () => clearTimeout(timer)\n    }\n  }, [showMore, shouldShowMask, id])\n  const list = useMemo(() => {\n    const list = copy.list\n      .map(item => {\n        if (!actions[item.id as keyof typeof actions]) {\n          return undefined\n        }\n        const { finished, notLogin, notFinished, completed } = actions[item.id as keyof typeof actions]\n        let buttonLabel = ''\n        let handleClick = undefined\n        let link = undefined\n        if (!isLogin) {\n          buttonLabel = notLogin.buttonLabel\n          handleClick = notLogin.handleClick\n        } else if (finished) {\n          buttonLabel = completed.buttonLabel\n          handleClick = undefined\n        } else {\n          buttonLabel = notFinished.buttonLabel\n          handleClick = notFinished.handleClick\n          link = (notFinished as { link: string }).link\n        }\n        return {\n          ...item,\n          buttonLabel,\n          handleClick,\n          finished,\n          link,\n        }\n      })\n      .filter(Boolean) as {\n      title: string\n      credits: string\n      id: TaskType\n      buttonLabel: string\n      finished: boolean\n      link: string\n      handleClick: (() => void) | undefined\n    }[]\n\n    // \u767B\u5F55\u540E\uFF0C\u4FDD\u7559\u539F\u987A\u5E8F\uFF0C\u5C06\u5DF2\u5B8C\u6210\u7684\u4EFB\u52A1\u653E\u5728\u6700\u540E\n    if (isLogin) {\n      return list.sort((a, b) => {\n        if (a?.finished && !b?.finished) {\n          return 1 // a\u5DF2\u5B8C\u6210\uFF0Cb\u672A\u5B8C\u6210\uFF0Ca\u6392\u5728\u540E\u9762\n        }\n        if (!a?.finished && b?.finished) {\n          return -1 // a\u672A\u5B8C\u6210\uFF0Cb\u5DF2\u5B8C\u6210\uFF0Ca\u6392\u5728\u524D\u9762\n        }\n        return 0 // \u90FD\u5DF2\u5B8C\u6210\u6216\u90FD\u672A\u5B8C\u6210\uFF0C\u4FDD\u6301\u539F\u987A\u5E8F\n      })\n    } else {\n      return list\n    }\n  }, [actions, copy.list, isLogin])\n\n  return (\n    <Container id={id} className=\"bg-[#F5F5F7]\">\n      <Heading as=\"h2\" size=\"4\" html={copy.title} />\n      <div\n        className={cn(\n          'mt-[24px] p-[32px] md-l:p-[32px] md:p-[16px] relative overflow-hidden',\n          rounded ? 'rounded-[8px]' : '',\n          !rounded && 'l:rounded-none'\n        )}\n        style={{\n          background: 'linear-gradient(180deg, rgba(255, 241, 214, 0) 39.51%, #F4CA81 119.53%)',\n        }}\n      >\n        {/* \u5F84\u5411\u6E10\u53D8\u80CC\u666F\u5C42 - \u4F7F\u7528\u4F2A\u5143\u7D20\u6A21\u62DF */}\n        <div\n          className=\"absolute inset-0 pointer-events-none -z-10\"\n          style={{\n            background: 'radial-gradient(ellipse 130% 205% at 45% -20%, #FFF6EA 0%, #FFFFFF 73%, #FFF1D6 100%)',\n          }}\n        />\n        {/* \u526F\u6807\u9898\u548C\u88C5\u9970\u56FE\u90E8\u5206 */}\n        <div className=\"flex items-center justify-between xl-xxl:h-[448px] l-xl:h-[336px] h-[560px] l:h-auto md:flex-col md:items-start l:h-auto l:mb-[16px] l:flex-col-reverse l:items-start\">\n          <div className=\"flex flex-col gap-[8px] l:mt-[8px]\">\n            <Heading\n              as=\"h3\"\n              size={4}\n              html={copy?.subtitle}\n              className=\"text-[32px] font-bold text-[#080a0f] tracking-[-1.28px] leading-[1.2] xl:text-[24px]\"\n            />\n            <div className=\"flex items-center gap-[8px]\">\n              <p\n                className=\"text-[48px] font-bold tracking-[-1.92px] leading-none bg-gradient-to-r from-[#2c7ed0] via-[#00a9e1] via-43% to-[#00db84] bg-clip-text text-transparent xl-xxl:text-[40px] l-xl:text-[32px] l:text-[24px]\"\n                dangerouslySetInnerHTML={{ __html: copy.equalCredits }}\n              />\n            </div>\n          </div>\n          {copy.mainImage?.url && (\n            <Picture\n              className=\"h-full object-contain l:mx-auto md:h-auto md:w-full md-l:h-[302px]\"\n              imgClassName=\"!h-full !object-contain\"\n              source={copy.mainImage.url}\n            />\n          )}\n        </div>\n\n        {/* \u5361\u7247\u5217\u8868 */}\n        <div className=\"relative mt-[24px]\">\n          <div\n            className={cn(\n              'grid grid-cols-3 gap-[16px] overflow-hidden md:grid-cols-1 md-l:grid-cols-2 min-md:!h-auto transition-all duration-300 ease-in-out'\n            )}\n            style={{\n              height: showMore || !shouldShowMask ? 'auto' : '512px',\n            }}\n          >\n            {list.map(item => (\n              <div\n                key={item.id}\n                className={cn(\n                  'flex min-h-[241px] xl-xxl:min-h-[192px] l:min-h-[160px] l-xl:min-h-[170px] flex-col justify-between bg-white p-[32px] xl:p-[16px]',\n                  rounded ? 'rounded-[16px]' : ''\n                )}\n              >\n                <div>\n                  <Text\n                    as=\"p\"\n                    html={item.title}\n                    size={2}\n                    className=\"text-pretty text-[24px] font-bold xxl:text-[20px]\"\n                  />\n                  <div className=\"mt-[8px] l:mt-[4px] flex items-center\">\n                    <Picture\n                      className=\"size-[24px] xxl:size-[18px] [&_path]:size-full\"\n                      source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450\"\n                    />\n                    <Text\n                      as=\"p\"\n                      html={item.credits}\n                      size={2}\n                      className=\"ml-[4px] mt-[6px] text-[18px] xxl:text-[14px]\"\n                    />\n                  </div>\n                </div>\n\n                {item.handleClick &&\n                !(item.id === TaskType.UploadReceipt && isUploadReceiptSuccess) &&\n                !(item.id === TaskType.Activate && authCodeActivate.isActivateSuccess) &&\n                !(item.id === TaskType.Subscribe && isSubscribeSuccess) ? (\n                  <Button\n                    as={item.link ? 'a' : 'button'}\n                    {...(item.link && { href: item.link })}\n                    {...(item.handleClick && { onClick: item.handleClick })}\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"mt-[24px] w-fit\"\n                  >\n                    {item.buttonLabel}\n                  </Button>\n                ) : (\n                  <Button variant=\"primary\" size=\"lg\" className=\"mt-[24px] w-fit\" disabled>\n                    {item.buttonLabel}\n                  </Button>\n                )}\n              </div>\n            ))}\n            {!showMore && shouldShowMask && (\n              <div\n                className=\"absolute inset-0 pointer-events-none min-md:hidden\"\n                style={{ background: 'linear-gradient(180deg, rgba(244, 202, 129, 0) 66.37%, #f4ca81 100%)' }}\n              ></div>\n            )}\n          </div>\n          {shouldShowMask && (\n            <>\n              {showMore ? (\n                <button\n                  className=\"mx-auto mt-[12px] block w-fit min-md:hidden\"\n                  onClick={() => {\n                    setShowMore(false)\n                  }}\n                >\n                  <ChevronUpIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronUpIcon>\n                </button>\n              ) : (\n                <>\n                  <div className=\"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden\">\n                    <button className=\"w-fit\" onClick={() => setShowMore(!showMore)}>\n                      <ChevronDownIcon className=\"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]\"></ChevronDownIcon>\n                    </button>\n                  </div>\n                </>\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      {copy.receipt && (\n        <CreditsUploadReceiptModal\n          isOpen={isUploadReceiptModalOpen}\n          onClose={() => {\n            setIsUploadReceiptModalOpen(false)\n          }}\n          copy={copy.receipt}\n          onSuccess={() => {\n            setIsUploadReceiptSuccess(true)\n          }}\n        />\n      )}\n      {copy.subscribe && (\n        <CreditsSubscribeModal\n          copy={copy.subscribe}\n          onSuccess={() => {\n            setIsSubscribeSuccess(true)\n            setTimeout(() => {\n              setIsSubscribeModalOpen(false)\n            }, 3000)\n          }}\n          isOpen={isSubscribeModalOpen}\n          onClose={() => {\n            setIsSubscribeModalOpen(false)\n          }}\n        />\n      )}\n    </Container>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "ChevronDownIcon", "ChevronUpIcon", "useMemo", "useState", "useEffect", "TaskType", "useActions", "useCreditsContext", "cn", "useHeadlessContext", "useRegistration", "CreditsUploadReceiptModal", "CreditsSubscribeModal", "ROUNDED_BRANDS", "CreditsAnkersolixTask", "copy", "classNames", "id", "showMore", "setShowMore", "profile", "authCodeActivate", "brand", "rounded", "isLogin", "isUploadReceiptModalOpen", "setIsUploadReceiptModalOpen", "isSubscribeModalOpen", "setIsSubscribeModalOpen", "isSubscribeSuccess", "setIsSubscribeSuccess", "isUploadReceiptSuccess", "setIsUploadReceiptSuccess", "actions", "shouldShowMask", "timer", "section", "list", "item", "finished", "notLogin", "notFinished", "completed", "buttonLabel", "handleClick", "link", "a", "b"]
 }

package/dist/esm/components/credits/creditsBanner/index.d.ts

@@ -1,6 +1,8 @@
 type Img = {
     url: string;
     alt: string;
+    width?: number;
+    height?: number;
 };
 export type CreditsBannerCopy = {
     pcImg: Img;

package/dist/esm/components/credits/creditsBanner/index.js

@@ -1,2 +1,13 @@
-import{Fragment as h,jsx as i,jsxs as l}from"react/jsx-runtime";import{Button as s,Container as d,Heading as c,Picture as u,Text as x}from"@anker-in/headless-ui";import f from"classnames";import{useCreditsContext as I}from"../context/provider";function w({copy:t,id:r}){const{profile:e,openSignInPopup:o,openSignUpPopup:g}=I(),n=e?Object.keys(e).length!==0:!1,m=e?.first_name?e?.first_name+" "+e?.last_name:e?.email?.split("@")[0],a=p=>{p==="primary"?g():o()};return i(h,{children:l("div",{id:r,className:" relative w-full",children:[i(u,{className:"aspect-h-[804] aspect-w-[1920] md:aspect-h-[660] md:aspect-w-[390] md-l:aspect-h-[660] md-l:aspect-w-[768]",source:`${t.pcImg?.url}, ${t.laptopImg?.url} 1024, ${t.mobileImg?.url} 768`,alt:t.pcImg?.alt,loading:"eager"}),n&&i("div",{className:"absolute inset-0 ",style:{background:"linear-gradient(180deg, rgba(245, 245, 247, 0) 70.31%, #F5F5F7 100%)"}}),i(d,{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-[64px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]",children:[i(c,{as:"h1",size:"5",html:n?t.login.title?.replace("$name",m||""):t.unLogin.title}),i(x,{size:"3",className:"l:mt-[4px] l-xxl:text-[14px] mt-[16px]",html:n?t.login.description:t.unLogin.description}),!n&&l("div",{className:f("mt-[32px] grid w-fit grid-flow-col gap-[12px] l:mt-[24px]",n&&"hidden"),children:[i(s,{variant:"secondary",size:"lg",onClick:()=>{a("primary")},children:t.joinNow}),i(s,{variant:"primary",size:"lg",onClick:()=>{a("secondary")},children:t.loginIn})]})]})})})]})})}export{w as CreditsBanner};
+import{Fragment as v,jsx as i,jsxs as l}from"react/jsx-runtime";import{Button as s,Container as u,Heading as x,Picture as I,Text as f}from"@anker-in/headless-ui";import b from"classnames";import{useCreditsContext as w}from"../context/provider";function B({copy:t,id:r}){const{profile:e,openSignInPopup:m,openSignUpPopup:g}=w(),a=e?Object.keys(e).length!==0:!1,o=e?.first_name?e?.first_name+" "+e?.last_name:e?.email?.split("@")[0],n=h=>{h==="primary"?g():m()},d=t.pcImg?.width&&t.pcImg?.height?`${t.pcImg.width} / ${t.pcImg.height}`:"1920 / 804",p=t.laptopImg?.width&&t.laptopImg?.height?`${t.laptopImg.width} / ${t.laptopImg.height}`:"768 / 660",c=t.mobileImg?.width&&t.mobileImg?.height?`${t.mobileImg.width} / ${t.mobileImg.height}`:"390 / 660";return i(v,{children:l("div",{id:r,className:" relative w-full",children:[i(I,{className:"credits-banner-image w-full",style:{aspectRatio:d},imgClassName:"object-cover w-full h-full",source:`${t.pcImg?.url}, ${t.laptopImg?.url} 1024, ${t.mobileImg?.url} 768`,alt:t.pcImg?.alt,loading:"eager"}),i("style",{children:`
+            @media (max-width: 1024px) and (min-width: 768px) {
+              .credits-banner-image {
+                aspect-ratio: ${p} !important;
+              }
+            }
+            @media (max-width: 767px) {
+              .credits-banner-image {
+                aspect-ratio: ${c} !important;
+              }
+            }
+          `}),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",size:"5",className:"text-[48px] 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};
 //# sourceMappingURL=index.js.map

package/dist/esm/components/credits/creditsBanner/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsBanner/index.tsx"],
-  "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}\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  return (\n    <>\n      <div id={id} className=\" relative w-full\">\n        <Picture\n          className=\"aspect-h-[804] aspect-w-[1920] md:aspect-h-[660] md:aspect-w-[390] md-l:aspect-h-[660] md-l:aspect-w-[768]\"\n          source={`${copy.pcImg?.url}, ${copy.laptopImg?.url} 1024, ${copy.mobileImg?.url} 768`}\n          alt={copy.pcImg?.alt}\n          loading=\"eager\"\n        ></Picture>\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-[64px] col-span-5 flex h-full flex-col justify-center text-[#1F2021]\">\n              <Heading\n                as=\"h1\"\n                size=\"5\"\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"],
-  "mappings": "AAqCI,mBAAAA,EAEI,OAAAC,EA+BQ,QAAAC,MAjCZ,oBArCJ,OAAS,UAAAC,EAAQ,aAAAC,EAAW,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,wBAC1D,OAAOC,MAAgB,aACvB,OAAS,qBAAAC,MAAyB,sBAsB3B,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,EAEA,OACEb,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,GAAIU,EAAI,UAAU,mBACrB,UAAAX,EAACK,EAAA,CACC,UAAU,6GACV,OAAQ,GAAGK,EAAK,OAAO,GAAG,KAAKA,EAAK,WAAW,GAAG,UAAUA,EAAK,WAAW,GAAG,OAC/E,IAAKA,EAAK,OAAO,IACjB,QAAQ,QACT,EACAK,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,KAAK,IACL,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",
-  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "classNames", "useCreditsContext", "CreditsBanner", "copy", "id", "profile", "openSignInPopup", "openSignUpPopup", "isLogin", "displayName", "handleButtonClick", "buttonType"]
+  "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                size=\"5\"\n                className=\"text-[48px] 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"],
+  "mappings": "AA+CI,mBAAAA,EAEI,OAAAC,EAkDQ,QAAAC,MApDZ,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,KAAK,IACL,UAAU,+CACV,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",
+  "names": ["Fragment", "jsx", "jsxs", "Button", "Container", "Heading", "Picture", "Text", "classNames", "useCreditsContext", "CreditsBanner", "copy", "id", "profile", "openSignInPopup", "openSignUpPopup", "isLogin", "displayName", "handleButtonClick", "buttonType", "pcAspectRatio", "laptopAspectRatio", "mobileAspectRatio"]
 }

package/dist/esm/components/credits/creditsBenefits/BenefitItem.js

@@ -0,0 +1,2 @@
+import{jsx as t,jsxs as l}from"react/jsx-runtime";import{Heading as v,Picture as F,Text as a}from"@anker-in/headless-ui";import{classNames as o,useHeadlessContext as N}from"@anker-in/lib";import h from"./IconInfo";import{ROUNDED_BRANDS as D}from"../../../constants";const k=({item:e,handleClick:x,isNoteActive:m,index:p,bigIcon:c,cardBgColor:i,cardBorderColor:r})=>{const{brand:b,locale:f}=N(),s=D.includes(b),u=["de","eu-de","fr","eu-fr"].includes(f),g=c?"mb-[16px] size-[64px] xl-xxl:size-[56px] xl:size-[48px] md:absolute md:bottom-[16px] md:right-[16px] md:mb-0":"mb-[16px] size-[31px] md:absolute md:bottom-[16px] md:right-[16px] md:mb-0";console.log("cardBgColor in BenefitItem",i);const n={};return i?n.background=i:n.background="linear-gradient(119.61deg, #FAFAFA 38.58%, #FFFFFF 63.73%, #F9FCFF 89.37%)",r&&(n.borderColor=r),t("div",{className:o("relative flex-1 flex flex-col rounded-[16px] border border-white px-[24px] pb-[26px] pt-[24px] md:min-h-[180px] md:p-[16px]",!s&&"rounded-none"),style:n,children:l("div",{className:"flex flex-col",children:[t(F,{className:g,alt:e.icon?.alt,source:e.icon?.url}),l("div",{className:"flex items-center",children:[t(v,{html:e.text,size:"2",className:o("md-l:line-clamp-3",u&&"break-words")}),e.note&&l("div",{role:"button",tabIndex:0,onKeyDown:d=>{(d.key==="Enter"||d.key===" ")&&d.preventDefault()},className:"relative mb-1 ml-[4px]",onClick:()=>x({item:e,index:p}),children:[t(h,{}),t("div",{className:o("absolute -bottom-[12px] left-[32px] z-10 w-[356px] -translate-x-full translate-y-full md:w-[276px]",m?"block":"hidden"),children:l("div",{className:o("relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow",!s&&"rounded-none"),children:[t(a,{as:"p",size:"2",html:e.note,className:"desktop:text-[18px]"}),t("div",{className:o("absolute -top-[10px] right-[9px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]",!s&&"rounded-none")})]})})]})]}),e.tag&&t(a,{as:"div",html:e.tag,className:"mt-[2px] text-[16px] font-bold text-[#6D6D6F]"})]})})};var w=k;export{w as default};
+//# sourceMappingURL=BenefitItem.js.map

package/dist/esm/components/credits/creditsBenefits/BenefitItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/credits/creditsBenefits/BenefitItem.tsx"],
+  "sourcesContent": ["import { Heading, Picture, Text } from '@anker-in/headless-ui'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport IconInfo from './IconInfo'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport interface BenefitItemCopy {\n  icon: {\n    alt: string\n    url: string\n  }\n  text: string\n  note?: string\n  tag?: string\n}\nconst BenefitItem = ({\n  item,\n  handleClick,\n  isNoteActive,\n  index,\n  bigIcon,\n  cardBgColor,\n  cardBorderColor,\n}: {\n  item: BenefitItemCopy\n  handleClick: ({ item, index }: { item: BenefitItemCopy; index: number }) => void\n  isNoteActive: boolean\n  index: number\n  bigIcon?: boolean\n  cardBgColor?: string\n  cardBorderColor?: string\n}) => {\n  const { brand, locale } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  // \u5FB7\u8BED\u548C\u6CD5\u8BED\u9700\u8981\u6298\u884C\n  const shouldBreakWords = ['de', 'eu-de', 'fr', 'eu-fr'].includes(locale)\n\n  // \u6839\u636E bigIcon \u8BBE\u7F6E\u4E0D\u540C\u5C4F\u5E55\u4E0B\u7684\u56FE\u6807\u5927\u5C0F\n  // \u5C3A\u5BF8\uFF1A\u22651921px=64px, 1441-1920px=56px, 1025-1440px=20px, \u22641024px=48px\n  const iconSizeClass = bigIcon\n    ? 'mb-[16px] size-[64px] xl-xxl:size-[56px] xl:size-[48px] md:absolute md:bottom-[16px] md:right-[16px] md:mb-0'\n    : 'mb-[16px] size-[31px] md:absolute md:bottom-[16px] md:right-[16px] md:mb-0'\n\n  console.log('cardBgColor in BenefitItem', cardBgColor)\n  // \u80CC\u666F\u8272\u548C\u8FB9\u6846\u8272\u5904\u7406\n  const cardStyle: React.CSSProperties = {}\n  if (cardBgColor) {\n    cardStyle.background = cardBgColor\n  } else {\n    cardStyle.background = 'linear-gradient(119.61deg, #FAFAFA 38.58%, #FFFFFF 63.73%, #F9FCFF 89.37%)'\n  }\n  if (cardBorderColor) {\n    cardStyle.borderColor = cardBorderColor\n  }\n\n  return (\n    <div\n      className={cn(\n        'relative flex-1 flex flex-col rounded-[16px] border border-white px-[24px] pb-[26px] pt-[24px] md:min-h-[180px] md:p-[16px]',\n        !rounded && 'rounded-none'\n      )}\n      style={cardStyle}\n    >\n      <div className=\"flex flex-col\">\n        <Picture className={iconSizeClass} alt={item.icon?.alt} source={item.icon?.url} />\n        <div className=\"flex items-center\">\n          <Heading\n            html={item.text}\n            size=\"2\"\n            className={cn('md-l:line-clamp-3', shouldBreakWords && 'break-words')}\n          />\n          {item.note && (\n            <div\n              role=\"button\"\n              tabIndex={0}\n              onKeyDown={e => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault()\n                }\n              }}\n              className=\"relative mb-1 ml-[4px]\"\n              onClick={() => handleClick({ item, index })}\n            >\n              <IconInfo />\n              <div\n                className={cn(\n                  'absolute -bottom-[12px] left-[32px] z-10 w-[356px] -translate-x-full translate-y-full md:w-[276px]',\n                  isNoteActive ? 'block' : 'hidden'\n                )}\n              >\n                <div\n                  className={cn(\n                    'relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow',\n                    !rounded && 'rounded-none'\n                  )}\n                >\n                  <Text as=\"p\" size=\"2\" html={item.note} className=\"desktop:text-[18px]\" />\n                  <div\n                    className={cn(\n                      'absolute -top-[10px] right-[9px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]',\n                      !rounded && 'rounded-none'\n                    )}\n                  />\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n        {item.tag && <Text as=\"div\" html={item.tag} className=\"mt-[2px] text-[16px] font-bold text-[#6D6D6F]\" />}\n      </div>\n    </div>\n  )\n}\n\nexport default BenefitItem\n"],
+  "mappings": "AAgEQ,cAAAA,EA0BQ,QAAAC,MA1BR,oBAhER,OAAS,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,wBACvC,OAAS,cAAcC,EAAI,sBAAAC,MAA0B,gBACrD,OAAOC,MAAc,aACrB,OAAS,kBAAAC,MAAsB,qBAW/B,MAAMC,EAAc,CAAC,CACnB,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EACA,QAAAC,EACA,YAAAC,EACA,gBAAAC,CACF,IAQM,CACJ,KAAM,CAAE,MAAAC,EAAO,OAAAC,CAAO,EAAIZ,EAAmB,EACvCa,EAAUX,EAAe,SAASS,CAAK,EAGvCG,EAAmB,CAAC,KAAM,QAAS,KAAM,OAAO,EAAE,SAASF,CAAM,EAIjEG,EAAgBP,EAClB,+GACA,6EAEJ,QAAQ,IAAI,6BAA8BC,CAAW,EAErD,MAAMO,EAAiC,CAAC,EACxC,OAAIP,EACFO,EAAU,WAAaP,EAEvBO,EAAU,WAAa,6EAErBN,IACFM,EAAU,YAAcN,GAIxBhB,EAAC,OACC,UAAWK,EACT,8HACA,CAACc,GAAW,cACd,EACA,MAAOG,EAEP,SAAArB,EAAC,OAAI,UAAU,gBACb,UAAAD,EAACG,EAAA,CAAQ,UAAWkB,EAAe,IAAKX,EAAK,MAAM,IAAK,OAAQA,EAAK,MAAM,IAAK,EAChFT,EAAC,OAAI,UAAU,oBACb,UAAAD,EAACE,EAAA,CACC,KAAMQ,EAAK,KACX,KAAK,IACL,UAAWL,EAAG,oBAAqBe,GAAoB,aAAa,EACtE,EACCV,EAAK,MACJT,EAAC,OACC,KAAK,SACL,SAAU,EACV,UAAWsB,GAAK,EACVA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MACjCA,EAAE,eAAe,CAErB,EACA,UAAU,yBACV,QAAS,IAAMZ,EAAY,CAAE,KAAAD,EAAM,MAAAG,CAAM,CAAC,EAE1C,UAAAb,EAACO,EAAA,EAAS,EACVP,EAAC,OACC,UAAWK,EACT,qGACAO,EAAe,QAAU,QAC3B,EAEA,SAAAX,EAAC,OACC,UAAWI,EACT,0FACA,CAACc,GAAW,cACd,EAEA,UAAAnB,EAACI,EAAA,CAAK,GAAG,IAAI,KAAK,IAAI,KAAMM,EAAK,KAAM,UAAU,sBAAsB,EACvEV,EAAC,OACC,UAAWK,EACT,mHACA,CAACc,GAAW,cACd,EACF,GACF,EACF,GACF,GAEJ,EACCT,EAAK,KAAOV,EAACI,EAAA,CAAK,GAAG,MAAM,KAAMM,EAAK,IAAK,UAAU,gDAAgD,GACxG,EACF,CAEJ,EAEA,IAAOc,EAAQf",
+  "names": ["jsx", "jsxs", "Heading", "Picture", "Text", "cn", "useHeadlessContext", "IconInfo", "ROUNDED_BRANDS", "BenefitItem", "item", "handleClick", "isNoteActive", "index", "bigIcon", "cardBgColor", "cardBorderColor", "brand", "locale", "rounded", "shouldBreakWords", "iconSizeClass", "cardStyle", "e", "BenefitItem_default"]
+}