npm - @anker-in/campaign-ui - Versions diffs - 0.2.11-beta.2 → 0.2.11-beta.3 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (216) hide show

package/dist/cjs/components/credits/context/hooks/useSendEmailValidation.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare function useSendEmailValidation(): import("swr/mutation").SWRMutationResponse<any, any, "send-email-validation", never>;

package/dist/cjs/components/credits/context/hooks/useSendEmailValidation.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";var c=Object.create;var i=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var x=(e,t)=>{for(var o in t)i(e,o,{get:t[o],enumerable:!0})},r=(e,t,o,n)=>{if(t&&typeof t=="object"\|\|typeof t=="function")for(let a of f(t))!v.call(e,a)&&a!==o&&i(e,a,{get:()=>t[a],enumerable:!(n=d(t,a))\|\|n.enumerable});return e};var m=(e,t,o)=>(o=e!=null?c(h(e)):{},r(t\|\|!e\|\|!e.__esModule?i(o,"default",{value:e,enumerable:!0}):o,e)),C=e=>r(i({},"__esModule",{value:!0}),e);var y={};x(y,{useSendEmailValidation:()=>S});module.exports=C(y);var s=m(require("../../../../helpers/fetcher")),l=m(require("swr/mutation")),p=require("../provider"),u=require("@anker-in/lib");function S(){const{profile:e}=(0,p.useCreditsContext)(),{appName:t,locale:o}=(0,u.useHeadlessContext)();return(0,l.default)("send-email-validation",()=>(0,s.default)({locale:o,url:"/api/multipass/account/users/send_validation_email",method:"POST",body:{email:e?.email,app:t},needRecaptcha:!0,action:"verifyAccount"}))}
2	+ //# sourceMappingURL=useSendEmailValidation.js.map

package/dist/cjs/components/credits/context/hooks/useSendEmailValidation.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/credits/context/hooks/useSendEmailValidation.ts"],
+  "sourcesContent": ["import fetcher from '../../../../helpers/fetcher'\nimport useSWRMutation from 'swr/mutation'\nimport { useCreditsContext } from '../provider'\nimport { useHeadlessContext } from '@anker-in/lib'\n\nexport function useSendEmailValidation() {\n  const { profile } = useCreditsContext()\n  const { appName, locale } = useHeadlessContext()\n\n  return useSWRMutation('send-email-validation', () =>\n    fetcher({\n      locale,\n      url: '/api/multipass/account/users/send_validation_email',\n      method: 'POST',\n      body: { email: profile?.email, app: appName },\n      needRecaptcha: true,\n      action: 'verifyAccount',\n    })\n  )\n}\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,4BAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAoB,0CACpBC,EAA2B,2BAC3BC,EAAkC,uBAClCC,EAAmC,yBAE5B,SAASL,GAAyB,CACvC,KAAM,CAAE,QAAAM,CAAQ,KAAI,qBAAkB,EAChC,CAAE,QAAAC,EAAS,OAAAC,CAAO,KAAI,sBAAmB,EAE/C,SAAO,EAAAC,SAAe,wBAAyB,OAC7C,EAAAC,SAAQ,CACN,OAAAF,EACA,IAAK,qDACL,OAAQ,OACR,KAAM,CAAE,MAAOF,GAAS,MAAO,IAAKC,CAAQ,EAC5C,cAAe,GACf,OAAQ,eACV,CAAC,CACH,CACF",
+  "names": ["useSendEmailValidation_exports", "__export", "useSendEmailValidation", "__toCommonJS", "import_fetcher", "import_mutation", "import_provider", "import_lib", "profile", "appName", "locale", "useSWRMutation", "fetcher"]
+}

package/dist/cjs/components/credits/context/hooks/useSubscriptions.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import { SWRResponse } from 'swr';
+import type { Subscription } from '../../type';
+export type SubscriptionApiResponse = {
+    data: Subscription;
+};
+export type FetchSubscriptionResponse = SWRResponse<Subscription>;
+export declare function useSubscriptions({ email }: {
+    email?: string;
+}): FetchSubscriptionResponse;

package/dist/cjs/components/credits/context/hooks/useSubscriptions.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";var b=Object.create;var i=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var d=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty;var y=(s,t)=>{for(var e in t)i(s,e,{get:t[e],enumerable:!0})},n=(s,t,e,p)=>{if(t&&typeof t=="object"\|\|typeof t=="function")for(let o of R(t))!l.call(s,o)&&o!==e&&i(s,o,{get:()=>t[o],enumerable:!(p=m(t,o))\|\|p.enumerable});return s};var r=(s,t,e)=>(e=s!=null?b(d(s)):{},n(t\|\|!s\|\|!s.__esModule?i(e,"default",{value:s,enumerable:!0}):e,s)),f=s=>n(i({},"__esModule",{value:!0}),s);var x={};y(x,{useSubscriptions:()=>h});module.exports=f(x);var c=r(require("swr")),u=r(require("../../../../helpers/fetcher")),a=require("@anker-in/lib");function h({email:s}){const{locale:t}=(0,a.useHeadlessContext)(),{data:e,...p}=(0,c.default)(s?["/api/multipass/account/subscriptions",s]:null,async([o,S])=>(0,u.default)({method:"GET",url:o,body:{email:S},action:"login",locale:t,headers:{},type:""}));return{data:e?.data,...p}}
2	+ //# sourceMappingURL=useSubscriptions.js.map

package/dist/cjs/components/credits/context/hooks/useSubscriptions.js.map ADDED Viewed

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/credits/context/hooks/useSubscriptions.ts"],
+  "sourcesContent": ["import useSWR, { SWRResponse } from 'swr'\nimport type { Subscription } from '../../type'\nimport fetcher from '../../../../helpers/fetcher'\nimport { useHeadlessContext } from '@anker-in/lib'\n\nexport type SubscriptionApiResponse = { data: Subscription }\nexport type FetchSubscriptionResponse = SWRResponse<Subscription>\n\nexport function useSubscriptions({ email }: { email?: string }): FetchSubscriptionResponse {\n  const { locale } = useHeadlessContext()\n\n  const { data, ...rest } = useSWR<SubscriptionApiResponse>(\n    email ? ['/api/multipass/account/subscriptions', email] : null,\n    async ([url, email]) =>\n      fetcher({\n        method: 'GET',\n        url,\n        body: {\n          email,\n        },\n        action: 'login',\n        locale,\n        headers: {},\n        type: '',\n      })\n  )\n\n  return { data: data?.data, ...rest } as unknown as FetchSubscriptionResponse\n}\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,sBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAoC,kBAEpCC,EAAoB,0CACpBC,EAAmC,yBAK5B,SAASJ,EAAiB,CAAE,MAAAK,CAAM,EAAkD,CACzF,KAAM,CAAE,OAAAC,CAAO,KAAI,sBAAmB,EAEhC,CAAE,KAAAC,EAAM,GAAGC,CAAK,KAAI,EAAAC,SACxBJ,EAAQ,CAAC,uCAAwCA,CAAK,EAAI,KAC1D,MAAO,CAACK,EAAKL,CAAK,OAChB,EAAAM,SAAQ,CACN,OAAQ,MACR,IAAAD,EACA,KAAM,CACJ,MAAAL,CACF,EACA,OAAQ,QACR,OAAAC,EACA,QAAS,CAAC,EACV,KAAM,EACR,CAAC,CACL,EAEA,MAAO,CAAE,KAAMC,GAAM,KAAM,GAAGC,CAAK,CACrC",
+  "names": ["useSubscriptions_exports", "__export", "useSubscriptions", "__toCommonJS", "import_swr", "import_fetcher", "import_lib", "email", "locale", "data", "rest", "useSWR", "url", "fetcher"]
+}

package/dist/cjs/components/credits/context/utils.d.ts CHANGED Viewed

@@ -23,3 +23,7 @@ export declare function formatVariantPrice({ amount, baseAmount, currencyCode, l
     basePrice: string | undefined;
     discount: string | null;
 };
+/**
+ * 提取 variant id，去掉 gid://shopify/ProductVariant/ 前缀
+ */
+export declare function extractVariantId(id: string | number | undefined): string | null;

package/dist/cjs/components/credits/context/utils.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var k=Object.create;var o=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var $=(e,n)=>{for(var r in n)o(e,r,{get:n[r],enumerable:!0})},p=(e,n,r,t)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of E(n))!P.call(e,i)&&i!==r&&o(e,i,{get:()=>n[i],enumerable:!(t=C(n,i))||t.enumerable});return e};var F=(e,n,r)=>(r=e!=null?k(I(e)):{},p(n||!e||!e.__esModule?o(r,"default",{value:e,enumerable:!0}):r,e)),x=e=>p(o({},"__esModule",{value:!0}),e);var z={};$(z,{emailValidate:()=>U,formatPrice:()=>m,formatVariantPrice:()=>v,getAlpcPath:()=>D,languageTerritory:()=>f,numberFormat:()=>S});module.exports=x(z);var l=F(require("js-cookie")),s=require("./const");function D(e=""){let n=!1;const r=l.default.get("alpcEU");return r===void 0||r===""?["de","eu-de","eu","eu-en","uk","fr","fra"].includes(e)&&(n=!0):Number(r)&&(n=!0),n?"/api/multipass/alpc-eu":"/api/multipass/alpc"}function S(e=0){return typeof Intl>"u"?e:new Intl.NumberFormat().format(e)}const U=e=>/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(e),f=e=>({us:"en-us",uk:"en-gb",ca:"en-ca",au:"en-au",nz:"en-nz",eu:"en-eu",pl:"pl-pl",fr:"fr-fr",de:"de-de",vn:"vi-vn",sg:"en-sg","ae-en":"en-ae",plus:"en-us",cl:"es-cl",es:"es-es",se:"en-se",dk:"en-dk",is:"en-is",no:"en-no",fi:"en-fi"})[e]||"";function m({amount:e,currencyCode:n,locale:r,maximumFractionDigits:t,minimumFractionDigits:i,removeTrailingZeros:a=!1}){let u=new Intl.NumberFormat(f(r)||r,{style:"currency",currency:n||"USD",minimumFractionDigits:t===0?0:i,maximumFractionDigits:t}).format(e);return["eu-de","eu-en","de","eu"].includes(r)&&(u=u?.toString()?.replace(/[\s]/g,"")),a&&(u=u.replace(/(\.\d*?[1-9])0+\b/,"$1").replace(/\.0+\b/,"").replace(/(\,\d*?[1-9])0+\b/,"$1").replace(/\,0+\b/,"")),u}function v({amount:e,baseAmount:n,currencyCode:r,locale:t,maximumFractionDigits:i,minimumFractionDigits:a,removeTrailingZeros:c}){if(typeof Intl>"u")return{price:`${s.PRICE_SYMBOL[t]}${e}`,basePrice:`${s.PRICE_SYMBOL[t]}${n}`,discount:`${s.PRICE_SYMBOL[t]}${n-e||0}`};const u=n>e,d=new Intl.NumberFormat(f(t),{style:"percent"}),g=u?d.format((n-e)/n):null,b=m({amount:e,currencyCode:r,locale:t,removeTrailingZeros:c}),y=u?m({amount:n,currencyCode:r,locale:t,maximumFractionDigits:i,minimumFractionDigits:a,removeTrailingZeros:c}):void 0;return{price:b,basePrice:y,discount:g}}
+"use strict";var I=Object.create;var o=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var E=(e,n)=>{for(var r in n)o(e,r,{get:n[r],enumerable:!0})},p=(e,n,r,t)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of k(n))!C.call(e,i)&&i!==r&&o(e,i,{get:()=>n[i],enumerable:!(t=P(n,i))||t.enumerable});return e};var S=(e,n,r)=>(r=e!=null?I(x(e)):{},p(n||!e||!e.__esModule?o(r,"default",{value:e,enumerable:!0}):r,e)),$=e=>p(o({},"__esModule",{value:!0}),e);var z={};E(z,{emailValidate:()=>U,extractVariantId:()=>v,formatPrice:()=>m,formatVariantPrice:()=>V,getAlpcPath:()=>F,languageTerritory:()=>f,numberFormat:()=>D});module.exports=$(z);var l=S(require("js-cookie")),s=require("./const");function F(e=""){let n=!1;const r=l.default.get("alpcEU");return r===void 0||r===""?["de","eu-de","eu","eu-en","uk","fr","fra"].includes(e)&&(n=!0):Number(r)&&(n=!0),n?"/api/multipass/alpc-eu":"/api/multipass/alpc"}function D(e=0){return typeof Intl>"u"?e:new Intl.NumberFormat().format(e)}const U=e=>/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(e),f=e=>({us:"en-us",uk:"en-gb",ca:"en-ca",au:"en-au",nz:"en-nz",eu:"en-eu",pl:"pl-pl",fr:"fr-fr",de:"de-de",vn:"vi-vn",sg:"en-sg","ae-en":"en-ae",plus:"en-us",cl:"es-cl",es:"es-es",se:"en-se",dk:"en-dk",is:"en-is",no:"en-no",fi:"en-fi"})[e]||"";function m({amount:e,currencyCode:n,locale:r,maximumFractionDigits:t,minimumFractionDigits:i,removeTrailingZeros:a=!1}){let u=new Intl.NumberFormat(f(r)||r,{style:"currency",currency:n||"USD",minimumFractionDigits:t===0?0:i,maximumFractionDigits:t}).format(e);return["eu-de","eu-en","de","eu"].includes(r)&&(u=u?.toString()?.replace(/[\s]/g,"")),a&&(u=u.replace(/(\.\d*?[1-9])0+\b/,"$1").replace(/\.0+\b/,"").replace(/(\,\d*?[1-9])0+\b/,"$1").replace(/\,0+\b/,"")),u}function V({amount:e,baseAmount:n,currencyCode:r,locale:t,maximumFractionDigits:i,minimumFractionDigits:a,removeTrailingZeros:c}){if(typeof Intl>"u")return{price:`${s.PRICE_SYMBOL[t]}${e}`,basePrice:`${s.PRICE_SYMBOL[t]}${n}`,discount:`${s.PRICE_SYMBOL[t]}${n-e||0}`};const u=n>e,d=new Intl.NumberFormat(f(t),{style:"percent"}),g=u?d.format((n-e)/n):null,b=m({amount:e,currencyCode:r,locale:t,removeTrailingZeros:c}),y=u?m({amount:n,currencyCode:r,locale:t,maximumFractionDigits:i,minimumFractionDigits:a,removeTrailingZeros:c}):void 0;return{price:b,basePrice:y,discount:g}}function v(e){return e?(typeof e=="number"?e.toString():e).replace("gid://shopify/ProductVariant/",""):null}
 //# sourceMappingURL=utils.js.map

package/dist/cjs/components/credits/context/utils.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/context/utils.ts"],
-  "sourcesContent": ["import Cookies from 'js-cookie'\nimport { PRICE_SYMBOL } from './const'\n\nexport function getAlpcPath(locale = '') {\n  let isEU = false\n  const alpcEUCookie = Cookies.get('alpcEU')\n  if (alpcEUCookie === undefined || alpcEUCookie === '') {\n    if (['de', 'eu-de', 'eu', 'eu-en', 'uk', 'fr', 'fra'].includes(locale)) {\n      isEU = true\n    }\n  } else {\n    let alpcEU = Number(alpcEUCookie)\n    if (alpcEU) {\n      isEU = true\n    }\n  }\n\n  if (isEU) {\n    return '/api/multipass/alpc-eu'\n  }\n\n  return '/api/multipass/alpc'\n}\n\nexport function numberFormat(num: number = 0) {\n  if (typeof Intl === 'undefined') {\n    return num\n  }\n\n  return new Intl.NumberFormat().format(num)\n}\n\nexport const emailValidate = (email: any) => {\n  return /^(([^<>()\\[\\]\\\\.,;:\\s@\"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/.test(\n    email\n  )\n}\n\nexport const languageTerritory = (locale: string) =>\n  // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n  ({\n    us: 'en-us',\n    uk: 'en-gb',\n    ca: 'en-ca',\n    au: 'en-au',\n    nz: 'en-nz',\n    eu: 'en-eu',\n    pl: 'pl-pl',\n    fr: 'fr-fr',\n    de: 'de-de',\n    vn: 'vi-vn',\n    sg: 'en-sg',\n    'ae-en': 'en-ae',\n    plus: 'en-us',\n    cl: 'es-cl',\n    es: 'es-es',\n    // Nordic countries\n    se: 'en-se',\n    dk: 'en-dk',\n    is: 'en-is',\n    no: 'en-no',\n    fi: 'en-fi',\n  })[locale] || ''\n\nexport function formatPrice({\n  amount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros = false,\n}: {\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  const formatCurrency = new Intl.NumberFormat(languageTerritory(locale) || locale, {\n    style: 'currency',\n    currency: currencyCode || 'USD',\n    minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n    maximumFractionDigits,\n  })\n\n  let formattedValue = formatCurrency.format(amount)\n\n  if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n    formattedValue = formattedValue?.toString()?.replace(/[\\s]/g, '')\n  }\n\n  if (removeTrailingZeros) {\n    // Adjust the regex to match comma as decimal separator\n    formattedValue = formattedValue\n      .replace(/(\\.\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\.0+\\b/, '')\n      .replace(/(\\,\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\,0+\\b/, '')\n  }\n\n  return formattedValue\n}\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  const formatDiscount = new Intl.NumberFormat(languageTerritory(locale), {\n    style: 'percent',\n  })\n  const discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n\n  const price = formatPrice({ amount, currencyCode, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount }\n}\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,gBAAAC,EAAA,sBAAAC,EAAA,iBAAAC,IAAA,eAAAC,EAAAR,GAAA,IAAAS,EAAoB,wBACpBC,EAA6B,mBAEtB,SAASL,EAAYM,EAAS,GAAI,CACvC,IAAIC,EAAO,GACX,MAAMC,EAAe,EAAAC,QAAQ,IAAI,QAAQ,EAYzC,OAXID,IAAiB,QAAaA,IAAiB,GAC7C,CAAC,KAAM,QAAS,KAAM,QAAS,KAAM,KAAM,KAAK,EAAE,SAASF,CAAM,IACnEC,EAAO,IAGI,OAAOC,CAAY,IAE9BD,EAAO,IAIPA,EACK,yBAGF,qBACT,CAEO,SAASL,EAAaQ,EAAc,EAAG,CAC5C,OAAI,OAAO,KAAS,IACXA,EAGF,IAAI,KAAK,aAAa,EAAE,OAAOA,CAAG,CAC3C,CAEO,MAAMb,EAAiBc,GACrB,yJAAyJ,KAC9JA,CACF,EAGWV,EAAqBK,IAE/B,CACC,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,QAAS,QACT,KAAM,QACN,GAAI,QACJ,GAAI,QAEJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,OACN,GAAGA,CAAM,GAAK,GAET,SAASR,EAAY,CAC1B,OAAAc,EACA,aAAAC,EACA,OAAAP,EACA,sBAAAQ,EACA,sBAAAC,EACA,oBAAAC,EAAsB,EACxB,EAOG,CAQD,IAAIC,EAPmB,IAAI,KAAK,aAAahB,EAAkBK,CAAM,GAAKA,EAAQ,CAChF,MAAO,WACP,SAAUO,GAAgB,MAC1B,sBAAuBC,IAA0B,EAAI,EAAIC,EACzD,sBAAAD,CACF,CAAC,EAEmC,OAAOF,CAAM,EAEjD,MAAI,CAAC,QAAS,QAAS,KAAM,IAAI,EAAE,SAASN,CAAM,IAChDW,EAAiBA,GAAgB,SAAS,GAAG,QAAQ,QAAS,EAAE,GAG9DD,IAEFC,EAAiBA,EACd,QAAQ,oBAAqB,IAAI,EACjC,QAAQ,SAAU,EAAE,EACpB,QAAQ,oBAAqB,IAAI,EACjC,QAAQ,SAAU,EAAE,GAGlBA,CACT,CAEO,SAASlB,EAAmB,CACjC,OAAAa,EACA,WAAAM,EACA,aAAAL,EACA,OAAAP,EACA,sBAAAQ,EACA,sBAAAC,EACA,oBAAAC,CACF,EAQG,CACD,GAAI,OAAO,KAAS,IAClB,MAAO,CACL,MAAO,GAAG,eAAaV,CAAmC,CAAC,GAAGM,CAAM,GACpE,UAAW,GAAG,eAAaN,CAAmC,CAAC,GAAGY,CAAU,GAC5E,SAAU,GAAG,eAAaZ,CAAmC,CAAC,GAAGY,EAAaN,GAAU,CAAC,EAC3F,EAGF,MAAMO,EAAcD,EAAaN,EAC3BQ,EAAiB,IAAI,KAAK,aAAanB,EAAkBK,CAAM,EAAG,CACtE,MAAO,SACT,CAAC,EACKe,EAAWF,EAAcC,EAAe,QAAQF,EAAaN,GAAUM,CAAU,EAAI,KAErFI,EAAQxB,EAAY,CAAE,OAAAc,EAAQ,aAAAC,EAAc,OAAAP,EAAQ,oBAAAU,CAAoB,CAAC,EACzEO,EAAYJ,EACdrB,EAAY,CACV,OAAQoB,EACR,aAAAL,EACA,OAAAP,EACA,sBAAAQ,EACA,sBAAAC,EACA,oBAAAC,CACF,CAAC,EACD,OAEJ,MAAO,CAAE,MAAAM,EAAO,UAAAC,EAAW,SAAAF,CAAS,CACtC",
-  "names": ["utils_exports", "__export", "emailValidate", "formatPrice", "formatVariantPrice", "getAlpcPath", "languageTerritory", "numberFormat", "__toCommonJS", "import_js_cookie", "import_const", "locale", "isEU", "alpcEUCookie", "Cookies", "num", "email", "amount", "currencyCode", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "formattedValue", "baseAmount", "hasDiscount", "formatDiscount", "discount", "price", "basePrice"]
+  "sourcesContent": ["import Cookies from 'js-cookie'\nimport { PRICE_SYMBOL } from './const'\n\nexport function getAlpcPath(locale = '') {\n  let isEU = false\n  const alpcEUCookie = Cookies.get('alpcEU')\n  if (alpcEUCookie === undefined || alpcEUCookie === '') {\n    if (['de', 'eu-de', 'eu', 'eu-en', 'uk', 'fr', 'fra'].includes(locale)) {\n      isEU = true\n    }\n  } else {\n    let alpcEU = Number(alpcEUCookie)\n    if (alpcEU) {\n      isEU = true\n    }\n  }\n\n  if (isEU) {\n    return '/api/multipass/alpc-eu'\n  }\n\n  return '/api/multipass/alpc'\n}\n\nexport function numberFormat(num: number = 0) {\n  if (typeof Intl === 'undefined') {\n    return num\n  }\n\n  return new Intl.NumberFormat().format(num)\n}\n\nexport const emailValidate = (email: any) => {\n  return /^(([^<>()\\[\\]\\\\.,;:\\s@\"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/.test(\n    email\n  )\n}\n\nexport const languageTerritory = (locale: string) =>\n  // https://unicode-org.github.io/cldr-staging/charts/37/supplemental/language_territory_information.html\n  ({\n    us: 'en-us',\n    uk: 'en-gb',\n    ca: 'en-ca',\n    au: 'en-au',\n    nz: 'en-nz',\n    eu: 'en-eu',\n    pl: 'pl-pl',\n    fr: 'fr-fr',\n    de: 'de-de',\n    vn: 'vi-vn',\n    sg: 'en-sg',\n    'ae-en': 'en-ae',\n    plus: 'en-us',\n    cl: 'es-cl',\n    es: 'es-es',\n    // Nordic countries\n    se: 'en-se',\n    dk: 'en-dk',\n    is: 'en-is',\n    no: 'en-no',\n    fi: 'en-fi',\n  })[locale] || ''\n\nexport function formatPrice({\n  amount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros = false,\n}: {\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  const formatCurrency = new Intl.NumberFormat(languageTerritory(locale) || locale, {\n    style: 'currency',\n    currency: currencyCode || 'USD',\n    minimumFractionDigits: maximumFractionDigits === 0 ? 0 : minimumFractionDigits,\n    maximumFractionDigits,\n  })\n\n  let formattedValue = formatCurrency.format(amount)\n\n  if (['eu-de', 'eu-en', 'de', 'eu'].includes(locale)) {\n    formattedValue = formattedValue?.toString()?.replace(/[\\s]/g, '')\n  }\n\n  if (removeTrailingZeros) {\n    // Adjust the regex to match comma as decimal separator\n    formattedValue = formattedValue\n      .replace(/(\\.\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\.0+\\b/, '')\n      .replace(/(\\,\\d*?[1-9])0+\\b/, '$1')\n      .replace(/\\,0+\\b/, '')\n  }\n\n  return formattedValue\n}\n\nexport function formatVariantPrice({\n  amount,\n  baseAmount,\n  currencyCode,\n  locale,\n  maximumFractionDigits,\n  minimumFractionDigits,\n  removeTrailingZeros,\n}: {\n  baseAmount: number\n  amount: number\n  currencyCode: string\n  locale: string\n  maximumFractionDigits?: number\n  minimumFractionDigits?: number\n  removeTrailingZeros?: boolean\n}) {\n  if (typeof Intl === 'undefined') {\n    return {\n      price: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${amount}`,\n      basePrice: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${baseAmount}`,\n      discount: `${PRICE_SYMBOL[locale as keyof typeof PRICE_SYMBOL]}${baseAmount - amount || 0}`,\n    }\n  }\n\n  const hasDiscount = baseAmount > amount\n  const formatDiscount = new Intl.NumberFormat(languageTerritory(locale), {\n    style: 'percent',\n  })\n  const discount = hasDiscount ? formatDiscount.format((baseAmount - amount) / baseAmount) : null\n\n  const price = formatPrice({ amount, currencyCode, locale, removeTrailingZeros })\n  const basePrice = hasDiscount\n    ? formatPrice({\n        amount: baseAmount,\n        currencyCode,\n        locale,\n        maximumFractionDigits,\n        minimumFractionDigits,\n        removeTrailingZeros,\n      })\n    : undefined\n\n  return { price, basePrice, discount }\n}\n\n/**\n * \u63D0\u53D6 variant id\uFF0C\u53BB\u6389 gid://shopify/ProductVariant/ \u524D\u7F00\n */\nexport function extractVariantId(id: string | number | undefined): string | null {\n  if (!id) return null\n  const idStr = typeof id === 'number' ? id.toString() : id\n  return idStr.replace('gid://shopify/ProductVariant/', '')\n}\n"],
+  "mappings": "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",
+  "names": ["utils_exports", "__export", "emailValidate", "extractVariantId", "formatPrice", "formatVariantPrice", "getAlpcPath", "languageTerritory", "numberFormat", "__toCommonJS", "import_js_cookie", "import_const", "locale", "isEU", "alpcEUCookie", "Cookies", "num", "email", "amount", "currencyCode", "maximumFractionDigits", "minimumFractionDigits", "removeTrailingZeros", "formattedValue", "baseAmount", "hasDiscount", "formatDiscount", "discount", "price", "basePrice", "id"]
 }

package/dist/cjs/components/credits/creditsAnkersolixTask/CreditsAnkersolixTask.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var F=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var G=Object.prototype.hasOwnProperty;var J=(t,n)=>{for(var r in n)F(t,r,{get:n[r],enumerable:!0})},K=(t,n,r,l)=>{if(n&&typeof n=="object"||typeof n=="function")for(let a of V(n))!G.call(t,a)&&a!==r&&F(t,a,{get:()=>n[a],enumerable:!(l=q(n,a))||l.enumerable});return t};var Q=t=>K(F({},"__esModule",{value:!0}),t);var X={};J(X,{CreditsAnkersolixTask:()=>W});module.exports=Q(X);var e=require("react/jsx-runtime"),i=require("@anker-in/headless-ui"),b=require("@heroicons/react/24/outline"),A=require("framer-motion"),o=require("react"),f=require("./type"),M=require("../creditsWaysToGetCredits/useActions"),R=require("../context/provider"),d=require("@anker-in/lib"),L=require("../../registration"),T=require("../modal/creditsUploadReceiptModal"),U=require("../modal/subscribeModal");const W=({copy:t,classNames:n,id:r})=>{const[l,a]=(0,o.useState)(!1),{profile:O}=(0,R.useCreditsContext)(),{authCodeActivate:B}=(0,L.useRegistration)(),{brand:D}=(0,d.useHeadlessContext)(),g=d.ROUNDED_BRANDS.includes(D),h=!!O,[P,N]=(0,o.useState)(!1),[_,v]=(0,o.useState)(!1),[w,E]=(0,o.useState)(!1),[S,H]=(0,o.useState)(!1),{actions:k}=(0,M.useActions)({copy:t,subscribe:{openSubscribePopup:()=>v(!0),isSuccess:w},uploadReceipt:{openUploadReceiptPopup:()=>N(!0),isSuccess:S}}),I=(0,o.useMemo)(()=>{const s=t.list.map(c=>{if(!k[c.id])return;const{finished:m,notLogin:y,notFinished:C,completed:j}=k[c.id];let x="",u,z;return h?m?(x=j.buttonLabel,u=void 0):(x=C.buttonLabel,u=C.handleClick,z=C.link):(x=y.buttonLabel,u=y.handleClick),{...c,buttonLabel:x,handleClick:u,finished:m,link:z}}).filter(Boolean);return h?s.sort((c,m)=>c?.finished&&!m?.finished?1:!c?.finished&&m?.finished?-1:0):s},[k,t.list,h]),p=I.length>3;return(0,e.jsxs)(i.Container,{id:r,className:"[&>div]:l:!px-0 bg-[#F5F5F7]",children:[(0,e.jsx)(i.Heading,{as:"h2",size:"4",html:t.title,className:"md:px-[16px]"}),(0,e.jsxs)("div",{className:(0,d.classNames)("mt-[24px] p-[32px] md-l:p-[32px] md:p-[16px] relative overflow-hidden",g?"rounded-[8px]":"",!g&&"l:rounded-none"),style:{background:"linear-gradient(180deg, rgba(255, 241, 214, 0) 39.51%, #F4CA81 119.53%)"},children:[(0,e.jsx)("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%)"}}),(0,e.jsxs)("div",{className:"flex items-center justify-between h-[560px] md:h-auto md:flex-col md:items-start l:h-auto l:mb-[16px] l:flex-col-reverse l:items-start",children:[(0,e.jsxs)("div",{className:"flex flex-col gap-[8px]",children:[(0,e.jsx)(i.Heading,{as:"h3",size:4,html:t?.subtitle,className:"text-[32px] font-bold text-[#080a0f] tracking-[-1.28px] leading-[1.2] xl:text-[24px]"}),(0,e.jsx)("div",{className:"flex items-center gap-[8px]",children:(0,e.jsx)("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:t.equalCredits}})})]}),t.mainImage?.url&&(0,e.jsx)(i.Picture,{className:"w-full max-w-[50%] md:max-w-full md:mt-[24px] l:max-w-full l:mt-[24px]",source:t.mainImage.url})]}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)(A.motion.div,{className:(0,d.classNames)("grid grid-cols-3 gap-[16px] overflow-hidden md:grid-cols-1 md-l:grid-cols-2 min-md:!h-auto"),initial:{height:p?512:"auto"},animate:{height:l||!p?"auto":512},transition:{duration:.3},onAnimationComplete:()=>{if(!l&&p&&window.screen.width<768){const s=document.getElementById(r||"ankersolix-task");s&&s.scrollIntoView({behavior:"smooth",block:"end"})}},children:[I.map(s=>(0,e.jsxs)("div",{className:(0,d.classNames)("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] md:p-[16px] l:p-[24px]",""),children:[(0,e.jsxs)("div",{children:[(0,e.jsx)(i.Heading,{as:"h4",html:s.title,size:2,className:"text-[24px] font-bold text-[#080a0f] tracking-[-0.96px] leading-[1.2] text-pretty md:text-[18px] l:text-[20px]"}),(0,e.jsxs)("div",{className:"mt-[8px] flex items-center gap-[4px]",children:[(0,e.jsx)(i.Picture,{className:"size-[24px] [&_path]:size-full",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/20250902-153351.png?v=1756798450"}),(0,e.jsx)(i.Text,{as:"p",html:s.credits,size:2,className:"text-[18px] font-bold text-[#080a0f] tracking-[-0.36px] leading-[1.4] md:text-[16px]"})]})]}),s.handleClick&&!(s.id===f.TaskType.UploadReceipt&&S)&&!(s.id===f.TaskType.Activate&&B.isActivateSuccess)&&!(s.id===f.TaskType.Subscribe&&w)?(0,e.jsx)(i.Button,{as:s.link?"a":"button",...s.link&&{href:s.link},...s.handleClick&&{onClick:s.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:s.buttonLabel}):(0,e.jsx)(i.Button,{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:s.buttonLabel})]},s.id)),!l&&p&&(0,e.jsx)("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%)"}})]}),p&&(0,e.jsx)(e.Fragment,{children:l?(0,e.jsx)("button",{className:"mx-auto mt-[12px] block w-fit min-md:hidden",onClick:()=>{a(!1)},children:(0,e.jsx)(b.ChevronUpIcon,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})}):(0,e.jsx)(e.Fragment,{children:(0,e.jsx)("div",{className:"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden",children:(0,e.jsx)("button",{className:"w-fit",onClick:()=>a(!l),children:(0,e.jsx)(b.ChevronDownIcon,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})})})})})]})]}),t.receipt&&(0,e.jsx)(T.CreditsUploadReceiptModal,{isOpen:P,onClose:()=>{N(!1)},copy:t.receipt,onSuccess:()=>{H(!0)}}),t.subscribe&&(0,e.jsx)(U.CreditsSubscribeModal,{copy:t.subscribe,onSuccess:()=>{E(!0),setTimeout(()=>{v(!1)},3e3)},isOpen:_,onClose:()=>{v(!1)}})]})};
+"use strict";var F=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var J=Object.prototype.hasOwnProperty;var K=(t,n)=>{for(var d in n)F(t,d,{get:n[d],enumerable:!0})},Q=(t,n,d,l)=>{if(n&&typeof n=="object"||typeof n=="function")for(let o of G(n))!J.call(t,o)&&o!==d&&F(t,o,{get:()=>n[o],enumerable:!(l=V(n,o))||l.enumerable});return t};var W=t=>Q(F({},"__esModule",{value:!0}),t);var Y={};K(Y,{CreditsAnkersolixTask:()=>X});module.exports=W(Y);var e=require("react/jsx-runtime"),i=require("@anker-in/headless-ui"),b=require("@heroicons/react/24/outline"),A=require("framer-motion"),a=require("react"),f=require("./type"),M=require("../creditsWaysToGetCredits/useActions"),R=require("../context/provider"),c=require("@anker-in/lib"),L=require("../../registration"),T=require("../modal/creditsUploadReceiptModal"),U=require("../modal/subscribeModal"),O=require("../../../constants");const X=({copy:t,classNames:n,id:d})=>{const[l,o]=(0,a.useState)(!1),{profile:B}=(0,R.useCreditsContext)(),{authCodeActivate:D}=(0,L.useRegistration)(),{brand:P}=(0,c.useHeadlessContext)(),h=O.ROUNDED_BRANDS.includes(P),g=!!B,[j,N]=(0,a.useState)(!1),[_,v]=(0,a.useState)(!1),[w,E]=(0,a.useState)(!1),[S,H]=(0,a.useState)(!1),{actions:k}=(0,M.useActions)({copy:t,subscribe:{openSubscribePopup:()=>v(!0),isSuccess:w},uploadReceipt:{openUploadReceiptPopup:()=>N(!0),isSuccess:S}}),I=(0,a.useMemo)(()=>{const s=t.list.map(r=>{if(!k[r.id])return;const{finished:x,notLogin:y,notFinished:C,completed:q}=k[r.id];let u="",m,z;return g?x?(u=q.buttonLabel,m=void 0):(u=C.buttonLabel,m=C.handleClick,z=C.link):(u=y.buttonLabel,m=y.handleClick),{...r,buttonLabel:u,handleClick:m,finished:x,link:z}}).filter(Boolean);return g?s.sort((r,x)=>r?.finished&&!x?.finished?1:!r?.finished&&x?.finished?-1:0):s},[k,t.list,g]),p=I.length>3;return(0,e.jsxs)(i.Container,{id:d,className:"bg-[#F5F5F7]",children:[(0,e.jsx)(i.Heading,{as:"h2",size:"4",html:t.title}),(0,e.jsxs)("div",{className:(0,c.classNames)("mt-[24px] p-[32px] md-l:p-[32px] md:p-[16px] relative overflow-hidden",h?"rounded-[8px]":"",!h&&"l:rounded-none"),style:{background:"linear-gradient(180deg, rgba(255, 241, 214, 0) 39.51%, #F4CA81 119.53%)"},children:[(0,e.jsx)("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%)"}}),(0,e.jsxs)("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:[(0,e.jsxs)("div",{className:"flex flex-col gap-[8px] l:mt-[8px]",children:[(0,e.jsx)(i.Heading,{as:"h3",size:4,html:t?.subtitle,className:"text-[32px] font-bold text-[#080a0f] tracking-[-1.28px] leading-[1.2] xl:text-[24px]"}),(0,e.jsx)("div",{className:"flex items-center gap-[8px]",children:(0,e.jsx)("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:t.equalCredits}})})]}),t.mainImage?.url&&(0,e.jsx)(i.Picture,{className:"h-full object-contain l:mx-auto md:h-auto md:w-full md-l:h-[302px]",imgClassName:"!h-full !object-contain",source:t.mainImage.url})]}),(0,e.jsxs)("div",{className:"relative mt-[24px]",children:[(0,e.jsxs)(A.motion.div,{className:(0,c.classNames)("grid grid-cols-3 gap-[16px] overflow-hidden md:grid-cols-1 md-l:grid-cols-2 min-md:!h-auto"),initial:{height:p?512:"auto"},animate:{height:l||!p?"auto":512},transition:{duration:.3},onAnimationComplete:()=>{if(!l&&p&&window.screen.width<768){const s=document.getElementById(d||"ankersolix-task");s&&s.scrollIntoView({behavior:"smooth",block:"end"})}},children:[I.map(s=>(0,e.jsxs)("div",{className:(0,c.classNames)("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]",h?"rounded-[16px]":""),children:[(0,e.jsxs)("div",{children:[(0,e.jsx)(i.Text,{as:"p",html:s.title,size:2,className:"text-pretty text-[24px] font-bold xxl:text-[20px]"}),(0,e.jsxs)("div",{className:"mt-[8px] l:mt-[4px] flex items-center",children:[(0,e.jsx)(i.Picture,{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"}),(0,e.jsx)(i.Text,{as:"p",html:s.credits,size:2,className:"ml-[4px] mt-[6px] text-[18px] xxl:text-[14px]"})]})]}),s.handleClick&&!(s.id===f.TaskType.UploadReceipt&&S)&&!(s.id===f.TaskType.Activate&&D.isActivateSuccess)&&!(s.id===f.TaskType.Subscribe&&w)?(0,e.jsx)(i.Button,{as:s.link?"a":"button",...s.link&&{href:s.link},...s.handleClick&&{onClick:s.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:s.buttonLabel}):(0,e.jsx)(i.Button,{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:s.buttonLabel})]},s.id)),!l&&p&&(0,e.jsx)("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%)"}})]}),p&&(0,e.jsx)(e.Fragment,{children:l?(0,e.jsx)("button",{className:"mx-auto mt-[12px] block w-fit min-md:hidden",onClick:()=>{o(!1)},children:(0,e.jsx)(b.ChevronUpIcon,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})}):(0,e.jsx)(e.Fragment,{children:(0,e.jsx)("div",{className:"absolute bottom-0 flex w-full translate-y-1/2 justify-center min-md:hidden",children:(0,e.jsx)("button",{className:"w-fit",onClick:()=>o(!l),children:(0,e.jsx)(b.ChevronDownIcon,{className:"size-[40px] rounded-full bg-[#FFFFFF33] p-[8px]"})})})})})]})]}),t.receipt&&(0,e.jsx)(T.CreditsUploadReceiptModal,{isOpen:j,onClose:()=>{N(!1)},copy:t.receipt,onSuccess:()=>{H(!0)}}),t.subscribe&&(0,e.jsx)(U.CreditsSubscribeModal,{copy:t.subscribe,onSuccess:()=>{E(!0),setTimeout(()=>{v(!1)},3e3)},isOpen:_,onClose:()=>{v(!1)}})]})};
 //# sourceMappingURL=CreditsAnkersolixTask.js.map

package/dist/cjs/components/credits/creditsAnkersolixTask/CreditsAnkersolixTask.js.map CHANGED Viewed

@@ -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, ROUNDED_BRANDS } from '@anker-in/lib'\nimport { useRegistration } from '../../registration'\nimport { CreditsUploadReceiptModal } from '../modal/creditsUploadReceiptModal'\nimport { CreditsSubscribeModal } from '../modal/subscribeModal'\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=\"[&>div]:l:!px-0 bg-[#F5F5F7]\">\n      <Heading as=\"h2\" size=\"4\" html={copy.title} className='md:px-[16px]'/>\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 h-[560px] md: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]\">\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 className=\"w-full max-w-[50%] md:max-w-full md:mt-[24px] l:max-w-full l:mt-[24px]\" source={copy.mainImage.url} />\n          )}\n        </div>\n\n        {/* \u5361\u7247\u5217\u8868 */}\n        <div className=\"relative\">\n          <motion.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'\n            )}\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] md:p-[16px] l:p-[24px]',\n                  rounded ? '' : ''\n                )}\n              >\n                <div>\n                  <Heading\n                    as=\"h4\"\n                    html={item.title}\n                    size={2}\n                    className=\"text-[24px] font-bold text-[#080a0f] tracking-[-0.96px] leading-[1.2] text-pretty md:text-[18px] l:text-[20px]\"\n                  />\n                  <div className=\"mt-[8px] flex items-center gap-[4px]\">\n                    <Picture\n                      className=\"size-[24px] [&_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=\"text-[18px] font-bold text-[#080a0f] tracking-[-0.36px] leading-[1.4] md:text-[16px]\"\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": ["CreditsAnkersolixTask_exports", "__export", "CreditsAnkersolixTask", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_outline", "import_framer_motion", "import_react", "import_type", "import_useActions", "import_provider", "import_lib", "import_registration", "import_creditsUploadReceiptModal", "import_subscribeModal", "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", "cn", "section"]
+  "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": ["CreditsAnkersolixTask_exports", "__export", "CreditsAnkersolixTask", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_outline", "import_framer_motion", "import_react", "import_type", "import_useActions", "import_provider", "import_lib", "import_registration", "import_creditsUploadReceiptModal", "import_subscribeModal", "import_constants", "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", "cn", "section"]
 }

package/dist/cjs/components/credits/creditsBenefits/benefitItem.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";var F=Object.create;var r=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var D=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var k=(e,o)=>{for(var n in o)r(e,n,{get:o[n],enumerable:!0})},b=(e,o,n,a)=>{if(o&&typeof o=="object"\|\|typeof o=="function")for(let i of h(o))!C.call(e,i)&&i!==n&&r(e,i,{get:()=>o[i],enumerable:!(a=N(o,i))\|\|a.enumerable});return e};var y=(e,o,n)=>(n=e!=null?F(D(e)):{},b(o\|\|!e\|\|!e.__esModule?r(n,"default",{value:e,enumerable:!0}):n,e)),z=e=>b(r({},"__esModule",{value:!0}),e);var B={};k(B,{default:()=>w});module.exports=z(B);var t=require("react/jsx-runtime"),s=require("@anker-in/headless-ui"),l=require("@anker-in/lib"),f=y(require("./IconInfo")),u=require("../../../constants");const I=({item:e,handleClick:o,isNoteActive:n,index:a,bigIcon:i,cardBgColor:x,cardBorderColor:c})=>{const{brand:g}=(0,l.useHeadlessContext)(),m=u.ROUNDED_BRANDS.includes(g),v=i?"mb-[16px] size-[64px] xl-xxl:size-[54px] 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",x);const d={};return x?d.background=x:d.background="linear-gradient(119.61deg, #FAFAFA 38.58%, #FFFFFF 63.73%, #F9FCFF 89.37%)",c&&(d.borderColor=c),(0,t.jsx)("div",{className:(0,l.classNames)("relative flex-1 flex flex-col rounded-[16px] border border-white px-[24px] pb-[26px] pt-[24px] md:min-h-[180px] md:p-[16px]",!m&&"rounded-none"),style:d,children:(0,t.jsxs)("div",{className:"flex flex-col",children:[(0,t.jsx)(s.Picture,{className:v,alt:e.icon?.alt,source:e.icon?.url}),(0,t.jsxs)("div",{className:"flex items-center",children:[(0,t.jsx)(s.Heading,{html:e.text,size:"2",className:"break-all md-l:line-clamp-3"}),e.note&&(0,t.jsxs)("div",{role:"button",tabIndex:0,onKeyDown:p=>{(p.key==="Enter"\|\|p.key===" ")&&p.preventDefault()},className:"relative mb-1 ml-[4px]",onClick:()=>o({item:e,index:a}),children:[(0,t.jsx)(f.default,{}),(0,t.jsx)("div",{className:(0,l.classNames)("absolute -bottom-[12px] left-[32px] z-10 w-[356px] -translate-x-full translate-y-full md:w-[276px]",n?"block":"hidden"),children:(0,t.jsxs)("div",{className:(0,l.classNames)("relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow",!m&&"rounded-none"),children:[(0,t.jsx)(s.Text,{as:"p",size:"2",html:e.note,className:"desktop:text-[18px]"}),(0,t.jsx)("div",{className:(0,l.classNames)("absolute -top-[10px] right-[9px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]",!m&&"rounded-none")})]})})]})]}),e.tag&&(0,t.jsx)(s.Text,{as:"div",html:e.tag,className:"mt-[2px] text-[16px] font-bold text-[#6D6D6F]"})]})})};var w=I;
2	+ //# sourceMappingURL=BenefitItem.js.map

package/dist/cjs/components/credits/creditsBenefits/benefitItem.js.map ADDED Viewed

@@ -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 } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\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=54px, \u22641440px=48px\n  const iconSizeClass = bigIcon\n    ? 'mb-[16px] size-[64px] xl-xxl:size-[54px] 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 html={item.text} size=\"2\" className=\"break-all md-l:line-clamp-3\" />\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": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6DQ,IAAAI,EAAA,6BA7DRC,EAAuC,iCACvCC,EAAqD,yBACrDC,EAAqB,yBACrBC,EAA+B,8BAW/B,MAAMC,EAAc,CAAC,CACnB,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EACA,QAAAC,EACA,YAAAC,EACA,gBAAAC,CACF,IAQM,CACJ,KAAM,CAAE,MAAAC,CAAM,KAAI,sBAAmB,EAC/BC,EAAU,iBAAe,SAASD,CAAK,EAIvCE,EAAgBL,EAClB,+GACA,6EAEJ,QAAQ,IAAI,6BAA8BC,CAAW,EAErD,MAAMK,EAAiC,CAAC,EACxC,OAAIL,EACFK,EAAU,WAAaL,EAEvBK,EAAU,WAAa,6EAErBJ,IACFI,EAAU,YAAcJ,MAIxB,OAAC,OACC,aAAW,EAAAK,YACT,8HACA,CAACH,GAAW,cACd,EACA,MAAOE,EAEP,oBAAC,OAAI,UAAU,gBACb,oBAAC,WAAQ,UAAWD,EAAe,IAAKT,EAAK,MAAM,IAAK,OAAQA,EAAK,MAAM,IAAK,KAChF,QAAC,OAAI,UAAU,oBACb,oBAAC,WAAQ,KAAMA,EAAK,KAAM,KAAK,IAAI,UAAU,8BAA8B,EAC1EA,EAAK,SACJ,QAAC,OACC,KAAK,SACL,SAAU,EACV,UAAWY,GAAK,EACVA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MACjCA,EAAE,eAAe,CAErB,EACA,UAAU,yBACV,QAAS,IAAMX,EAAY,CAAE,KAAAD,EAAM,MAAAG,CAAM,CAAC,EAE1C,oBAAC,EAAAU,QAAA,EAAS,KACV,OAAC,OACC,aAAW,EAAAF,YACT,qGACAT,EAAe,QAAU,QAC3B,EAEA,oBAAC,OACC,aAAW,EAAAS,YACT,0FACA,CAACH,GAAW,cACd,EAEA,oBAAC,QAAK,GAAG,IAAI,KAAK,IAAI,KAAMR,EAAK,KAAM,UAAU,sBAAsB,KACvE,OAAC,OACC,aAAW,EAAAW,YACT,mHACA,CAACH,GAAW,cACd,EACF,GACF,EACF,GACF,GAEJ,EACCR,EAAK,QAAO,OAAC,QAAK,GAAG,MAAM,KAAMA,EAAK,IAAK,UAAU,gDAAgD,GACxG,EACF,CAEJ,EAEA,IAAOR,EAAQO",
+  "names": ["BenefitItem_exports", "__export", "BenefitItem_default", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_lib", "import_IconInfo", "import_constants", "BenefitItem", "item", "handleClick", "isNoteActive", "index", "bigIcon", "cardBgColor", "cardBorderColor", "brand", "rounded", "iconSizeClass", "cardStyle", "cn", "e", "IconInfo"]
+}

package/dist/cjs/components/credits/creditsBenefits/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var B=Object.create;var a=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var N=(e,t)=>{for(var i in t)a(e,i,{get:t[i],enumerable:!0})},f=(e,t,i,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of x(t))!k.call(e,s)&&s!==i&&a(e,s,{get:()=>t[s],enumerable:!(n=w(t,s))||n.enumerable});return e};var h=(e,t,i)=>(i=e!=null?B(I(e)):{},f(t||!e||!e.__esModule?a(i,"default",{value:e,enumerable:!0}):i,e)),_=e=>f(a({},"__esModule",{value:!0}),e);var z={};N(z,{CreditsBenefits:()=>S});module.exports=_(z);var o=require("react/jsx-runtime"),y=require("swiper/css"),D=require("swiper/css/grid"),G=require("swiper/css/pagination"),d=require("@anker-in/headless-ui"),b=require("react"),m=require("swiper/modules"),p=require("swiper/react"),g=h(require("./BenefitItem")),C=require("../context/provider"),c=require("@anker-in/lib");const S=({copy:e,id:t})=>{const[i,n]=(0,b.useState)(null),{profile:s,gtm:v}=(0,C.useCreditsContext)(),u=({item:l,index:r})=>{(0,c.gaTrack)({event:"ga4Event",event_name:"lp_button",member_active_status:s?.activated?"active":"not active",event_parameters:{page_group:v.pageGroup,position:e.title,button_name:l.text,info:""}}),i===r?n(null):(n(r),setTimeout(()=>{n(null)},5e3))};return(0,o.jsxs)(d.Container,{id:t,className:"!z-[30] bg-[#F5F5F7]",children:[(0,o.jsx)(d.Heading,{as:"h2",size:"4",html:e?.title}),(0,o.jsx)("div",{className:"mt-[24px] grid grid-cols-4 xl:grid-cols-3 gap-[16px] l:hidden items-stretch",children:e.benefits.map((l,r)=>(0,o.jsx)(g.default,{item:l,handleClick:u,isNoteActive:i===r,index:r,bigIcon:e.bigIcon,cardBgColor:e.cardBgColor,cardBorderColor:e.cardBorderColor},r))}),(0,o.jsxs)("div",{className:"mt-[24px] hidden l:block",children:[(0,o.jsx)(p.Swiper,{spaceBetween:16,slidesPerView:2,slidesPerGroup:2,grid:{rows:2,fill:"row"},breakpoints:{768:{slidesPerView:3,slidesPerGroup:3}},wrapperClass:"!items-stretch",modules:[m.Grid,m.Pagination],pagination:{clickable:!0,el:"#benefits-pagination",renderBullet(l,r){return`<div class='${r} !flex justify-center size-[8px] rounded-full bg-[#D9D9D9] cursor-pointer items-center'>
-              </div>`}},children:e.benefits.map((l,r)=>(0,o.jsx)(p.SwiperSlide,{className:(0,c.classNames)("!h-auto !flex",i===r&&"!z-[100]"),children:(0,o.jsx)(g.default,{item:l,handleClick:u,isNoteActive:i===r,index:r,bigIcon:e.bigIcon,cardBgColor:e.cardBgColor,cardBorderColor:e.cardBorderColor})},r))}),(0,o.jsx)("div",{id:"benefits-pagination",className:`mx-auto mt-[12px] grid !w-fit grid-flow-col [&_.swiper-pagination-bullet-active>div]:!bg-[#151515]
-          [&_.swiper-pagination-bullet]:cursor-pointer [&_.swiper-pagination-bullet]:rounded-full`})]}),i&&(0,o.jsx)("div",{role:"button",tabIndex:0,className:"fixed inset-0 z-10",onClick:()=>n(null),onKeyDown:l=>l.key==="Escape"&&n(null)})]})};
+"use strict";var B=Object.create;var a=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var N=(e,i)=>{for(var t in i)a(e,t,{get:i[t],enumerable:!0})},f=(e,i,t,n)=>{if(i&&typeof i=="object"||typeof i=="function")for(let s of x(i))!k.call(e,s)&&s!==t&&a(e,s,{get:()=>i[s],enumerable:!(n=w(i,s))||n.enumerable});return e};var h=(e,i,t)=>(t=e!=null?B(I(e)):{},f(i||!e||!e.__esModule?a(t,"default",{value:e,enumerable:!0}):t,e)),_=e=>f(a({},"__esModule",{value:!0}),e);var z={};N(z,{CreditsBenefits:()=>S});module.exports=_(z);var o=require("react/jsx-runtime"),y=require("swiper/css"),D=require("swiper/css/grid"),G=require("swiper/css/pagination"),d=require("@anker-in/headless-ui"),b=require("react"),m=require("swiper/modules"),p=require("swiper/react"),g=h(require("./BenefitItem")),C=require("../context/provider"),c=require("@anker-in/lib");const S=({copy:e,id:i})=>{const[t,n]=(0,b.useState)(null),{profile:s,gtm:v}=(0,C.useCreditsContext)(),u=({item:l,index:r})=>{(0,c.gaTrack)({event:"ga4Event",event_name:"lp_button",member_active_status:s?.activated?"active":"not active",event_parameters:{page_group:v.pageGroup,position:e.title,button_name:l.text,info:""}}),t===r?n(null):(n(r),setTimeout(()=>{n(null)},5e3))};return(0,o.jsxs)(d.Container,{id:i,className:"!z-[30] bg-[#F5F5F7]",children:[(0,o.jsx)(d.Heading,{as:"h2",size:"4",html:e?.title}),(0,o.jsx)("div",{className:"mt-[24px] grid grid-cols-4 gap-[16px] l:hidden items-stretch",children:e.benefits.map((l,r)=>(0,o.jsx)(g.default,{item:l,handleClick:u,isNoteActive:t===r,index:r,bigIcon:e.bigIcon,cardBgColor:e.cardBgColor,cardBorderColor:e.cardBorderColor},r))}),(0,o.jsxs)("div",{className:"mt-[24px] hidden l:block",children:[(0,o.jsx)(p.Swiper,{spaceBetween:16,slidesPerView:2,slidesPerGroup:2,grid:{rows:2,fill:"row"},breakpoints:{768:{slidesPerView:3,slidesPerGroup:3}},wrapperClass:"!items-stretch",modules:[m.Grid,m.Pagination],pagination:{clickable:!0,el:"#benefits-pagination",renderBullet(l,r){return`<div class='${r} !flex justify-center size-[8px] rounded-full bg-[#D9D9D9] cursor-pointer items-center'>
+              </div>`}},children:e.benefits.map((l,r)=>(0,o.jsx)(p.SwiperSlide,{className:(0,c.classNames)("!h-auto !flex",t===r&&"!z-[100]"),children:(0,o.jsx)(g.default,{item:l,handleClick:u,isNoteActive:t===r,index:r,bigIcon:e.bigIcon,cardBgColor:e.cardBgColor,cardBorderColor:e.cardBorderColor})},r))}),(0,o.jsx)("div",{id:"benefits-pagination",className:`mx-auto mt-[12px] grid !w-fit grid-flow-col [&_.swiper-pagination-bullet-active>div]:!bg-[#151515]
+          [&_.swiper-pagination-bullet]:cursor-pointer [&_.swiper-pagination-bullet]:rounded-full`})]}),t&&(0,o.jsx)("div",{role:"button",tabIndex:0,className:"fixed inset-0 z-10",onClick:()=>n(null),onKeyDown:l=>l.key==="Escape"&&n(null)})]})};
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/credits/creditsBenefits/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsBenefits/index.tsx"],
-  "sourcesContent": ["import 'swiper/css'\nimport 'swiper/css/grid'\nimport 'swiper/css/pagination'\n\nimport { Container, Heading } from '@anker-in/headless-ui'\nimport { useState } from 'react'\nimport { Grid, Pagination } from 'swiper/modules'\nimport { Swiper, SwiperSlide } from 'swiper/react'\n\nimport BenefitItem, { type BenefitItemCopy } from './BenefitItem'\nimport { useCreditsContext } from '../context/provider'\nimport { gaTrack, classNames as cn } from '@anker-in/lib'\n\nexport type CreditsBenefitsCopy = {\n  title: string\n  benefits: BenefitItemCopy[]\n  bigIcon?: boolean\n  cardBgColor?: string\n  cardBorderColor?: string\n}\n\nexport const CreditsBenefits = ({ copy, id }: { copy: CreditsBenefitsCopy; id?: string }) => {\n  const [activeNoteIndex, setActiveNoteIndex] = useState<number | null>(null)\n  const { profile, gtm } = useCreditsContext()\n  const handleClick = ({ item, index }: { item: BenefitItemCopy; index: number }) => {\n    gaTrack({\n      event: 'ga4Event',\n      event_name: 'lp_button',\n      member_active_status: profile?.activated ? 'active' : 'not active',\n      event_parameters: {\n        page_group: gtm.pageGroup,\n        position: copy.title,\n        button_name: item.text,\n        info: '',\n      },\n    })\n    if (activeNoteIndex === index) {\n      setActiveNoteIndex(null)\n    } else {\n      setActiveNoteIndex(index)\n      setTimeout(() => {\n        setActiveNoteIndex(null)\n      }, 5000)\n    }\n  }\n\n  return (\n    <Container id={id} className=\"!z-[30] bg-[#F5F5F7]\">\n      <Heading as=\"h2\" size=\"4\" html={copy?.title} />\n      <div className=\"mt-[24px] grid grid-cols-4 xl:grid-cols-3 gap-[16px] l:hidden items-stretch\">\n        {copy.benefits.map((item, index) => (\n          <BenefitItem\n            key={index}\n            item={item}\n            handleClick={handleClick}\n            isNoteActive={activeNoteIndex === index}\n            index={index}\n            bigIcon={copy.bigIcon}\n            cardBgColor={copy.cardBgColor}\n            cardBorderColor={copy.cardBorderColor}\n          />\n        ))}\n      </div>\n      <div className=\"mt-[24px] hidden l:block\">\n        <Swiper\n          spaceBetween={16}\n          slidesPerView={2}\n          slidesPerGroup={2}\n          grid={{\n            rows: 2,\n            fill: 'row',\n          }}\n          breakpoints={{\n            768: {\n              slidesPerView: 3,\n              slidesPerGroup: 3,\n            },\n          }}\n          wrapperClass=\"!items-stretch\"\n          modules={[Grid, Pagination]}\n          pagination={{\n            clickable: true,\n            el: '#benefits-pagination',\n            renderBullet(index, className) {\n              return `<div class='${className} !flex justify-center size-[8px] rounded-full bg-[#D9D9D9] cursor-pointer items-center'>\n              </div>`\n            },\n          }}\n        >\n          {copy.benefits.map((item, index) => (\n            <SwiperSlide key={index} className={cn('!h-auto !flex', activeNoteIndex === index && '!z-[100]')}>\n              <BenefitItem\n                item={item}\n                handleClick={handleClick}\n                isNoteActive={activeNoteIndex === index}\n                index={index}\n                bigIcon={copy.bigIcon}\n                cardBgColor={copy.cardBgColor}\n                cardBorderColor={copy.cardBorderColor}\n              />\n            </SwiperSlide>\n          ))}\n        </Swiper>\n        <div\n          id=\"benefits-pagination\"\n          className=\"mx-auto mt-[12px] grid !w-fit grid-flow-col [&_.swiper-pagination-bullet-active>div]:!bg-[#151515] \n          [&_.swiper-pagination-bullet]:cursor-pointer [&_.swiper-pagination-bullet]:rounded-full\"\n        ></div>\n      </div>\n\n      {activeNoteIndex && (\n        <div\n          role=\"button\"\n          tabIndex={0}\n          className=\"fixed inset-0 z-10\"\n          onClick={() => setActiveNoteIndex(null)}\n          onKeyDown={e => e.key === 'Escape' && setActiveNoteIndex(null)}\n        />\n      )}\n    </Container>\n  )\n}\n"],
-  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,IAAA,eAAAC,EAAAH,GAgDM,IAAAI,EAAA,6BAhDNC,EAAO,sBACPC,EAAO,2BACPC,EAAO,iCAEPC,EAAmC,iCACnCC,EAAyB,iBACzBC,EAAiC,0BACjCD,EAAoC,wBAEpCE,EAAkD,4BAClDC,EAAkC,+BAClCC,EAA0C,yBAUnC,MAAMX,EAAkB,CAAC,CAAE,KAAAY,EAAM,GAAAC,CAAG,IAAkD,CAC3F,KAAM,CAACC,EAAiBC,CAAkB,KAAI,YAAwB,IAAI,EACpE,CAAE,QAAAC,EAAS,IAAAC,CAAI,KAAI,qBAAkB,EACrCC,EAAc,CAAC,CAAE,KAAAC,EAAM,MAAAC,CAAM,IAAgD,IACjF,WAAQ,CACN,MAAO,WACP,WAAY,YACZ,qBAAsBJ,GAAS,UAAY,SAAW,aACtD,iBAAkB,CAChB,WAAYC,EAAI,UAChB,SAAUL,EAAK,MACf,YAAaO,EAAK,KAClB,KAAM,EACR,CACF,CAAC,EACGL,IAAoBM,EACtBL,EAAmB,IAAI,GAEvBA,EAAmBK,CAAK,EACxB,WAAW,IAAM,CACfL,EAAmB,IAAI,CACzB,EAAG,GAAI,EAEX,EAEA,SACE,QAAC,aAAU,GAAIF,EAAI,UAAU,uBAC3B,oBAAC,WAAQ,GAAG,KAAK,KAAK,IAAI,KAAMD,GAAM,MAAO,KAC7C,OAAC,OAAI,UAAU,8EACZ,SAAAA,EAAK,SAAS,IAAI,CAACO,EAAMC,OACxB,OAAC,EAAAC,QAAA,CAEC,KAAMF,EACN,YAAaD,EACb,aAAcJ,IAAoBM,EAClC,MAAOA,EACP,QAASR,EAAK,QACd,YAAaA,EAAK,YAClB,gBAAiBA,EAAK,iBAPjBQ,CAQP,CACD,EACH,KACA,QAAC,OAAI,UAAU,2BACb,oBAAC,UACC,aAAc,GACd,cAAe,EACf,eAAgB,EAChB,KAAM,CACJ,KAAM,EACN,KAAM,KACR,EACA,YAAa,CACX,IAAK,CACH,cAAe,EACf,eAAgB,CAClB,CACF,EACA,aAAa,iBACb,QAAS,CAAC,OAAM,YAAU,EAC1B,WAAY,CACV,UAAW,GACX,GAAI,uBACJ,aAAaA,EAAOE,EAAW,CAC7B,MAAO,eAAeA,CAAS;AAAA,qBAEjC,CACF,EAEC,SAAAV,EAAK,SAAS,IAAI,CAACO,EAAMC,OACxB,OAAC,eAAwB,aAAW,EAAAG,YAAG,gBAAiBT,IAAoBM,GAAS,UAAU,EAC7F,mBAAC,EAAAC,QAAA,CACC,KAAMF,EACN,YAAaD,EACb,aAAcJ,IAAoBM,EAClC,MAAOA,EACP,QAASR,EAAK,QACd,YAAaA,EAAK,YAClB,gBAAiBA,EAAK,gBACxB,GATgBQ,CAUlB,CACD,EACH,KACA,OAAC,OACC,GAAG,sBACH,UAAU;AAAA,mGAEX,GACH,EAECN,MACC,OAAC,OACC,KAAK,SACL,SAAU,EACV,UAAU,qBACV,QAAS,IAAMC,EAAmB,IAAI,EACtC,UAAWS,GAAKA,EAAE,MAAQ,UAAYT,EAAmB,IAAI,EAC/D,GAEJ,CAEJ",
+  "sourcesContent": ["import 'swiper/css'\nimport 'swiper/css/grid'\nimport 'swiper/css/pagination'\n\nimport { Container, Heading } from '@anker-in/headless-ui'\nimport { useState } from 'react'\nimport { Grid, Pagination } from 'swiper/modules'\nimport { Swiper, SwiperSlide } from 'swiper/react'\n\nimport BenefitItem, { type BenefitItemCopy } from './BenefitItem'\nimport { useCreditsContext } from '../context/provider'\nimport { gaTrack, classNames as cn } from '@anker-in/lib'\n\nexport type CreditsBenefitsCopy = {\n  title: string\n  benefits: BenefitItemCopy[]\n  bigIcon?: boolean\n  cardBgColor?: string\n  cardBorderColor?: string\n}\n\nexport const CreditsBenefits = ({ copy, id }: { copy: CreditsBenefitsCopy; id?: string }) => {\n  const [activeNoteIndex, setActiveNoteIndex] = useState<number | null>(null)\n  const { profile, gtm } = useCreditsContext()\n  const handleClick = ({ item, index }: { item: BenefitItemCopy; index: number }) => {\n    gaTrack({\n      event: 'ga4Event',\n      event_name: 'lp_button',\n      member_active_status: profile?.activated ? 'active' : 'not active',\n      event_parameters: {\n        page_group: gtm.pageGroup,\n        position: copy.title,\n        button_name: item.text,\n        info: '',\n      },\n    })\n    if (activeNoteIndex === index) {\n      setActiveNoteIndex(null)\n    } else {\n      setActiveNoteIndex(index)\n      setTimeout(() => {\n        setActiveNoteIndex(null)\n      }, 5000)\n    }\n  }\n\n  return (\n    <Container id={id} className=\"!z-[30] bg-[#F5F5F7]\">\n      <Heading as=\"h2\" size=\"4\" html={copy?.title} />\n      <div className=\"mt-[24px] grid grid-cols-4 gap-[16px] l:hidden items-stretch\">\n        {copy.benefits.map((item, index) => (\n          <BenefitItem\n            key={index}\n            item={item}\n            handleClick={handleClick}\n            isNoteActive={activeNoteIndex === index}\n            index={index}\n            bigIcon={copy.bigIcon}\n            cardBgColor={copy.cardBgColor}\n            cardBorderColor={copy.cardBorderColor}\n          />\n        ))}\n      </div>\n      <div className=\"mt-[24px] hidden l:block\">\n        <Swiper\n          spaceBetween={16}\n          slidesPerView={2}\n          slidesPerGroup={2}\n          grid={{\n            rows: 2,\n            fill: 'row',\n          }}\n          breakpoints={{\n            768: {\n              slidesPerView: 3,\n              slidesPerGroup: 3,\n            },\n          }}\n          wrapperClass=\"!items-stretch\"\n          modules={[Grid, Pagination]}\n          pagination={{\n            clickable: true,\n            el: '#benefits-pagination',\n            renderBullet(index, className) {\n              return `<div class='${className} !flex justify-center size-[8px] rounded-full bg-[#D9D9D9] cursor-pointer items-center'>\n              </div>`\n            },\n          }}\n        >\n          {copy.benefits.map((item, index) => (\n            <SwiperSlide key={index} className={cn('!h-auto !flex', activeNoteIndex === index && '!z-[100]')}>\n              <BenefitItem\n                item={item}\n                handleClick={handleClick}\n                isNoteActive={activeNoteIndex === index}\n                index={index}\n                bigIcon={copy.bigIcon}\n                cardBgColor={copy.cardBgColor}\n                cardBorderColor={copy.cardBorderColor}\n              />\n            </SwiperSlide>\n          ))}\n        </Swiper>\n        <div\n          id=\"benefits-pagination\"\n          className=\"mx-auto mt-[12px] grid !w-fit grid-flow-col [&_.swiper-pagination-bullet-active>div]:!bg-[#151515] \n          [&_.swiper-pagination-bullet]:cursor-pointer [&_.swiper-pagination-bullet]:rounded-full\"\n        ></div>\n      </div>\n\n      {activeNoteIndex && (\n        <div\n          role=\"button\"\n          tabIndex={0}\n          className=\"fixed inset-0 z-10\"\n          onClick={() => setActiveNoteIndex(null)}\n          onKeyDown={e => e.key === 'Escape' && setActiveNoteIndex(null)}\n        />\n      )}\n    </Container>\n  )\n}\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,IAAA,eAAAC,EAAAH,GAgDM,IAAAI,EAAA,6BAhDNC,EAAO,sBACPC,EAAO,2BACPC,EAAO,iCAEPC,EAAmC,iCACnCC,EAAyB,iBACzBC,EAAiC,0BACjCD,EAAoC,wBAEpCE,EAAkD,4BAClDC,EAAkC,+BAClCC,EAA0C,yBAUnC,MAAMX,EAAkB,CAAC,CAAE,KAAAY,EAAM,GAAAC,CAAG,IAAkD,CAC3F,KAAM,CAACC,EAAiBC,CAAkB,KAAI,YAAwB,IAAI,EACpE,CAAE,QAAAC,EAAS,IAAAC,CAAI,KAAI,qBAAkB,EACrCC,EAAc,CAAC,CAAE,KAAAC,EAAM,MAAAC,CAAM,IAAgD,IACjF,WAAQ,CACN,MAAO,WACP,WAAY,YACZ,qBAAsBJ,GAAS,UAAY,SAAW,aACtD,iBAAkB,CAChB,WAAYC,EAAI,UAChB,SAAUL,EAAK,MACf,YAAaO,EAAK,KAClB,KAAM,EACR,CACF,CAAC,EACGL,IAAoBM,EACtBL,EAAmB,IAAI,GAEvBA,EAAmBK,CAAK,EACxB,WAAW,IAAM,CACfL,EAAmB,IAAI,CACzB,EAAG,GAAI,EAEX,EAEA,SACE,QAAC,aAAU,GAAIF,EAAI,UAAU,uBAC3B,oBAAC,WAAQ,GAAG,KAAK,KAAK,IAAI,KAAMD,GAAM,MAAO,KAC7C,OAAC,OAAI,UAAU,+DACZ,SAAAA,EAAK,SAAS,IAAI,CAACO,EAAMC,OACxB,OAAC,EAAAC,QAAA,CAEC,KAAMF,EACN,YAAaD,EACb,aAAcJ,IAAoBM,EAClC,MAAOA,EACP,QAASR,EAAK,QACd,YAAaA,EAAK,YAClB,gBAAiBA,EAAK,iBAPjBQ,CAQP,CACD,EACH,KACA,QAAC,OAAI,UAAU,2BACb,oBAAC,UACC,aAAc,GACd,cAAe,EACf,eAAgB,EAChB,KAAM,CACJ,KAAM,EACN,KAAM,KACR,EACA,YAAa,CACX,IAAK,CACH,cAAe,EACf,eAAgB,CAClB,CACF,EACA,aAAa,iBACb,QAAS,CAAC,OAAM,YAAU,EAC1B,WAAY,CACV,UAAW,GACX,GAAI,uBACJ,aAAaA,EAAOE,EAAW,CAC7B,MAAO,eAAeA,CAAS;AAAA,qBAEjC,CACF,EAEC,SAAAV,EAAK,SAAS,IAAI,CAACO,EAAMC,OACxB,OAAC,eAAwB,aAAW,EAAAG,YAAG,gBAAiBT,IAAoBM,GAAS,UAAU,EAC7F,mBAAC,EAAAC,QAAA,CACC,KAAMF,EACN,YAAaD,EACb,aAAcJ,IAAoBM,EAClC,MAAOA,EACP,QAASR,EAAK,QACd,YAAaA,EAAK,YAClB,gBAAiBA,EAAK,gBACxB,GATgBQ,CAUlB,CACD,EACH,KACA,OAAC,OACC,GAAG,sBACH,UAAU;AAAA,mGAEX,GACH,EAECN,MACC,OAAC,OACC,KAAK,SACL,SAAU,EACV,UAAU,qBACV,QAAS,IAAMC,EAAmB,IAAI,EACtC,UAAWS,GAAKA,EAAE,MAAQ,UAAYT,EAAmB,IAAI,EAC/D,GAEJ,CAEJ",
   "names": ["creditsBenefits_exports", "__export", "CreditsBenefits", "__toCommonJS", "import_jsx_runtime", "import_css", "import_grid", "import_pagination", "import_headless_ui", "import_react", "import_modules", "import_BenefitItem", "import_provider", "import_lib", "copy", "id", "activeNoteIndex", "setActiveNoteIndex", "profile", "gtm", "handleClick", "item", "index", "BenefitItem", "className", "cn", "e"]
 }

package/dist/cjs/components/credits/creditsCash/RedeemableItem.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var v=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var B=Object.prototype.hasOwnProperty;var L=(r,e)=>{for(var s in e)v(r,s,{get:e[s],enumerable:!0})},O=(r,e,s,u)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of A(e))!B.call(r,o)&&o!==s&&v(r,o,{get:()=>e[o],enumerable:!(u=F(e,o))||u.enumerable});return r};var P=r=>O(v({},"__esModule",{value:!0}),r);var $={};L($,{default:()=>T});module.exports=P($);var t=require("react/jsx-runtime"),n=require("@anker-in/headless-ui"),i=require("react"),y=require("../context/provider"),S=require("../context/hooks/useRedeemAndBuy"),c=require("../context/utils"),l=require("@anker-in/lib"),w=require("../../../components/registration");function U({copy:r,itemData:e,setRules:s,className:u}){const{creditInfo:o,profile:a,openSignUpPopup:R,pageCommon:x,gtm:{pageGroup:g}}=(0,y.useCreditsContext)(),{authCodeActivate:b}=(0,w.useRegistration)(),{brand:V,locale:h}=(0,l.useHeadlessContext)(),C=l.ROUNDED_BRANDS.includes(V),[N,_]=(0,i.useState)(null),{trigger:k,isMutating:z}=(0,S.useRedeemAndBuy)({},{onError:d=>{_(d.message)}}),p=(0,i.useMemo)(()=>!!a,[a?.activated]),m=(0,i.useMemo)(()=>p&&a?.activated&&e.alpcData?.consumeCredits>Number(o?.available_credit||0),[p,a?.activated,e.alpcData?.consumeCredits,o?.available_credit]),I=(0,i.useMemo)(()=>!!(e.alpcData?.remainingInventory<=0&&e.alpcData?.isLimited||!e.productVariant?.availableForSale||m),[e.alpcData?.remainingInventory,e.alpcData?.isLimited,e.productVariant?.availableForSale,m]),E=()=>{_(null),p?!a?.activated&&!b.isActivateSuccess?b.open():(k({productVariant:e?.productVariant,redeemId:e?.config?.redeemId}),(0,l.gaTrack)({event:"ga4Event",event_name:"lp_button",member_active_status:a?.activated?"active":"not active",event_parameters:{page_group:g,position:r.title,button_name:f,info:e?.alpcData?.id?.toString()}})):R()},f=(0,i.useMemo)(()=>e.productVariant?.availableForSale?p?r.btnRedeem:r.unlockRewards:r?.soldOut||"Sold Out",[p,e.productVariant?.availableForSale,r.btnRedeem,r.unlockRewards,r?.soldOut]);return(0,t.jsxs)("div",{className:(0,l.classNames)("flex flex-col items-center rounded-[16px] bg-[#EAEAEC] p-[24px] md:rounded-[12px] md:px-[8px] xl:py-[16px] md-xl:px-[16px]",!C&&"rounded-none md:rounded-none",u),children:[(0,t.jsx)("a",{href:`/products/${e.product.handle}`,className:(0,l.classNames)("relative mx-auto h-[224px] w-fit l:h-[120px] l-xxl:h-[138px]"),children:(0,t.jsx)(n.Picture,{className:"mx-auto h-full w-auto",imgClassName:"h-full object-contain",source:e?.config?.image?.url||e?.productVariant?.metafields?.global?.transparentImg||e?.productVariant?.image?.url})}),(0,t.jsxs)("div",{className:(0,l.classNames)("mt-[22px] w-full l:mt-[8px]"),children:[(0,t.jsx)(n.Text,{html:e?.product?.title,title:e.config?.title||e.alpcData?.title||e.product?.title,size:2,className:"line-clamp-2 h-[58px] text-[24px] l-xxl:text-[20px] l:text-[16px] leading-[1.2] l:h-[40px] l-xxl:h-[48px]"}),e?.config?.rules?.split("<br>")?.length>0&&(0,t.jsx)("button",{type:"button",onClick:()=>{s(e?.config?.rules?.split("<br>")),(0,l.gaTrack)({event:"ga4Event",event_name:"lp_button",member_active_status:a?.activated?"active":"not active",event_parameters:{page_group:g,position:r.title,button_name:x?.ruleLabel,info:e?.alpcData?.id?.toString()}})},className:"mt-[8px] text-[16px] font-bold underline xxl:text-[14px]",tabIndex:0,onKeyDown:d=>{(d.key==="Enter"||d.key===" ")&&d.preventDefault()},children:x?.ruleLabel}),(0,t.jsxs)("div",{className:"flex flex-wrap items-center l:mt-[12px] laptop:text-[16px] lg-desktop:text-[18px]",children:[(0,t.jsx)(n.Picture,{className:"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783"}),(0,t.jsx)(n.Text,{html:`${(0,c.numberFormat)(e?.alpcData?.consumeCredits)} + ${(0,c.formatPrice)({amount:Number(e?.config?.price),currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:h})}`,size:2,as:"p",className:"ml-[4px] mt-[4px] font-bold leading-none text-[24px] l-xxl:text-[20px] l:text-[16px]"}),(0,t.jsx)(n.Text,{html:(0,c.formatPrice)({amount:e?.productVariant?.price.amount,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:h}),className:"l-xxl:text-[20px] mt-[4px] l:text-[16px] ml-[4px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through",as:"p"})]}),(0,t.jsxs)("div",{className:"group relative w-full",children:[(0,t.jsx)(n.Button,{disabled:I,variant:"primary",size:"lg",className:"mt-[8px] md:px-[10px] l:w-full",loading:z,onClick:()=>{E()},title:m?x.insufficientCredits:f,children:f}),(0,t.jsx)("div",{className:(0,l.classNames)("absolute -bottom-[20px] left-0 z-10 w-[300px] translate-y-full opacity-0 transition-opacity group-hover:opacity-100 md:-bottom-[14px] md:w-[160px]",m?"block":"hidden"),children:(0,t.jsxs)("div",{className:(0,l.classNames)("relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow md:px-[10px] md:py-[8px]",!C&&"rounded-none"),children:[(0,t.jsx)(n.Text,{as:"p",size:"2",html:x?.insufficientCredits,className:"text-[14px]"}),(0,t.jsx)("div",{className:"absolute -top-[10px] left-[48px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]"})]})})]})]}),N&&(0,t.jsx)("div",{className:"mt-[8px] text-[14px] text-[#FF0000]",children:N})]})}var T=U;
+"use strict";var v=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var L=Object.prototype.hasOwnProperty;var $=(r,e)=>{for(var p in e)v(r,p,{get:e[p],enumerable:!0})},O=(r,e,p,u)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of B(e))!L.call(r,o)&&o!==p&&v(r,o,{get:()=>e[o],enumerable:!(u=A(e,o))||u.enumerable});return r};var P=r=>O(v({},"__esModule",{value:!0}),r);var M={};$(M,{default:()=>T});module.exports=P(M);var t=require("react/jsx-runtime"),l=require("@anker-in/headless-ui"),s=require("react"),y=require("../context/provider"),S=require("../context/hooks/useRedeemAndBuy"),a=require("../context/utils"),n=require("@anker-in/lib"),V=require("../../../components/registration"),w=require("../../../constants");function U({copy:r,itemData:e,setRules:p,className:u}){const{creditInfo:o,profile:i,openSignUpPopup:R,pageCommon:x,gtm:{pageGroup:g}}=(0,y.useCreditsContext)(),{authCodeActivate:b}=(0,V.useRegistration)(),{brand:I,locale:h}=(0,n.useHeadlessContext)(),C=w.ROUNDED_BRANDS.includes(I),[N,_]=(0,s.useState)(null),{trigger:k,isMutating:z}=(0,S.useRedeemAndBuy)({},{onError:c=>{_(c.message)}}),d=(0,s.useMemo)(()=>!!i,[i?.activated]),m=(0,s.useMemo)(()=>d&&i?.activated&&e.alpcData?.consumeCredits>Number(o?.available_credit||0),[d,i?.activated,e.alpcData?.consumeCredits,o?.available_credit]),E=(0,s.useMemo)(()=>!!(e.alpcData?.remainingInventory<=0&&e.alpcData?.isLimited||!e.productVariant?.availableForSale||m),[e.alpcData?.remainingInventory,e.alpcData?.isLimited,e.productVariant?.availableForSale,m]),F=()=>{_(null),d?!i?.activated&&!b.isActivateSuccess?b.open():(k({productVariant:e?.productVariant,redeemId:e?.config?.redeemId}),(0,n.gaTrack)({event:"ga4Event",event_name:"lp_button",member_active_status:i?.activated?"active":"not active",event_parameters:{page_group:g,position:r.title,button_name:f,info:e?.alpcData?.id?.toString()}})):R()},f=(0,s.useMemo)(()=>e.productVariant?.availableForSale?d?r.btnRedeem:r.unlockRewards:r?.soldOut||"Sold Out",[d,e.productVariant?.availableForSale,r.btnRedeem,r.unlockRewards,r?.soldOut]);return(0,t.jsxs)("div",{className:(0,n.classNames)("flex flex-col items-center rounded-[16px] bg-[#EAEAEC] md:rounded-[12px] p-[24px] l:p-[8px] md-xl:p-[16px]",!C&&"rounded-none md:rounded-none",u),children:[(0,t.jsx)("a",{href:(0,a.extractVariantId)(e.productVariant?.id)?`/products/${e.product.handle}?variant=${(0,a.extractVariantId)(e.productVariant?.id)}`:`/products/${e.product.handle}`,className:(0,n.classNames)("relative mx-auto h-[224px] w-fit l:h-[120px] l-xxl:h-[138px]"),children:(0,t.jsx)(l.Picture,{className:"mx-auto h-full w-auto",imgClassName:"h-full object-contain",source:e?.config?.image?.url||e?.productVariant?.metafields?.global?.transparentImg||e?.productVariant?.image?.url})}),(0,t.jsxs)("div",{className:(0,n.classNames)("mt-[22px] w-full l:mt-[8px]"),children:[(0,t.jsx)(l.Text,{html:e?.product?.title,title:e.config?.title||e.alpcData?.title||e.product?.title,size:2,className:"line-clamp-2 h-[58px] text-[24px] l-xxl:text-[20px] l:text-[16px] leading-[1.2] l:h-[40px] l-xxl:h-[48px]"}),e?.config?.rules?.split("<br>")?.length>0&&(0,t.jsx)("button",{type:"button",onClick:()=>{p(e?.config?.rules?.split("<br>")),(0,n.gaTrack)({event:"ga4Event",event_name:"lp_button",member_active_status:i?.activated?"active":"not active",event_parameters:{page_group:g,position:r.title,button_name:x?.ruleLabel,info:e?.alpcData?.id?.toString()}})},className:"mt-[8px] text-[16px] font-bold underline xxl:text-[14px]",tabIndex:0,onKeyDown:c=>{(c.key==="Enter"||c.key===" ")&&c.preventDefault()},children:x?.ruleLabel}),(0,t.jsxs)("div",{className:"flex flex-wrap items-center l:mt-[12px] laptop:text-[16px] lg-desktop:text-[18px]",children:[(0,t.jsx)(l.Picture,{className:"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]",source:"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783"}),(0,t.jsx)(l.Text,{html:`${(0,a.numberFormat)(e?.alpcData?.consumeCredits)} + ${(0,a.formatPrice)({amount:Number(e?.config?.price),currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:h})}`,size:2,as:"p",className:"ml-[4px] mt-[4px] font-bold leading-none text-[24px] l-xxl:text-[20px] l:text-[16px]"}),(0,t.jsx)(l.Text,{html:(0,a.formatPrice)({amount:e?.productVariant?.price.amount,currencyCode:e?.productVariant?.price.currencyCode||"USD",locale:h}),className:"l-xxl:text-[20px] mt-[4px] l:text-[16px] ml-[4px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through",as:"p"})]}),(0,t.jsxs)("div",{className:"group relative w-full",children:[(0,t.jsx)(l.Button,{disabled:E,variant:"primary",size:"lg",className:"mt-[8px] md:px-[10px] l:w-full",loading:z,onClick:()=>{F()},title:m?x.insufficientCredits:f,children:f}),(0,t.jsx)("div",{className:(0,n.classNames)("absolute -bottom-[20px] left-0 z-10 w-[300px] translate-y-full opacity-0 transition-opacity group-hover:opacity-100 md:-bottom-[14px] md:w-[160px]",m?"block":"hidden"),children:(0,t.jsxs)("div",{className:(0,n.classNames)("relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow md:px-[10px] md:py-[8px]",!C&&"rounded-none"),children:[(0,t.jsx)(l.Text,{as:"p",size:"2",html:x?.insufficientCredits,className:"text-[14px]"}),(0,t.jsx)("div",{className:"absolute -top-[10px] left-[48px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]"})]})})]})]}),N&&(0,t.jsx)("div",{className:"mt-[8px] text-[14px] text-[#FF0000]",children:N})]})}var T=U;
 //# sourceMappingURL=RedeemableItem.js.map

package/dist/cjs/components/credits/creditsCash/RedeemableItem.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsCash/RedeemableItem.tsx"],
-  "sourcesContent": ["import { Button, Text, Picture } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsCashCopy, RedeemItem } from './type'\nimport { useCreditsContext } from '../context/provider'\nimport { useRedeemAndBuy } from '../context/hooks/useRedeemAndBuy'\nimport { formatPrice, numberFormat } from '../context/utils'\nimport { gaTrack, classNames as cn, ROUNDED_BRANDS, useHeadlessContext } from '@anker-in/lib'\nimport { useRegistration } from '../../../components/registration'\n\nfunction RedeemableItem({\n  copy,\n  itemData,\n  setRules,\n  className,\n}: {\n  copy: CreditsCashCopy\n  itemData: RedeemItem\n  className?: string\n  setRules: (rules: string[]) => void\n  currencyCode: string\n}) {\n  const {\n    creditInfo,\n    profile,\n    openSignUpPopup,\n    pageCommon,\n    gtm: { pageGroup },\n  } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand, locale } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const [error, setError] = useState<string | null>(null)\n  const { trigger, isMutating } = useRedeemAndBuy(\n    {},\n    {\n      onError: error => {\n        setError(error.message)\n      },\n    }\n  )\n\n  const isLogin = useMemo(() => {\n    return !!profile\n  }, [profile?.activated])\n\n  const inSufficientCredit = useMemo(() => {\n    return (\n      isLogin && profile?.activated && itemData.alpcData?.consumeCredits > Number(creditInfo?.available_credit || 0)\n    )\n  }, [isLogin, profile?.activated, itemData.alpcData?.consumeCredits, creditInfo?.available_credit])\n\n  const isDisabled = useMemo(() => {\n    // \u5151\u6362\u9650\u5236\n    if (itemData.alpcData?.remainingInventory <= 0 && itemData.alpcData?.isLimited) {\n      return true\n    }\n\n    // \u5546\u54C1\u5E93\u5B58\u9650\u5236\n    if (!itemData.productVariant?.availableForSale) {\n      return true\n    }\n\n    // \u79EF\u5206\u4E0D\u8DB3\n    if (inSufficientCredit) {\n      return true\n    }\n    return false\n  }, [\n    itemData.alpcData?.remainingInventory,\n    itemData.alpcData?.isLimited,\n    itemData.productVariant?.availableForSale,\n    inSufficientCredit,\n  ])\n\n  const handleRedeem = () => {\n    setError(null)\n    if (!isLogin) {\n      openSignUpPopup()\n    } else if (!profile?.activated && !authCodeActivate.isActivateSuccess) {\n      authCodeActivate.open()\n    } else {\n      trigger({\n        productVariant: itemData?.productVariant,\n        redeemId: itemData?.config?.redeemId,\n      })\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'lp_button',\n        member_active_status: profile?.activated ? 'active' : 'not active',\n        event_parameters: {\n          page_group: pageGroup,\n          position: copy.title,\n          button_name: redeemButtonText,\n          info: itemData?.alpcData?.id?.toString(),\n        },\n      })\n    }\n  }\n\n  const redeemButtonText = useMemo(() => {\n    // \u7F3A\u8D27\u6587\u6848\n    if (!itemData.productVariant?.availableForSale) {\n      return copy?.soldOut || 'Sold Out'\n    } else if (!isLogin) {\n      return copy.unlockRewards\n    } else {\n      return copy.btnRedeem\n    }\n  }, [isLogin, itemData.productVariant?.availableForSale, copy.btnRedeem, copy.unlockRewards, copy?.soldOut])\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-center rounded-[16px] bg-[#EAEAEC] p-[24px] md:rounded-[12px] md:px-[8px] xl:py-[16px] md-xl:px-[16px]',\n        !rounded && 'rounded-none md:rounded-none',\n        className\n      )}\n    >\n      <a\n        href={`/products/${itemData.product.handle}`}\n        className={cn('relative mx-auto h-[224px] w-fit l:h-[120px] l-xxl:h-[138px]')}\n      >\n        <Picture\n          className=\"mx-auto h-full w-auto\"\n          imgClassName=\"h-full object-contain\"\n          source={\n            itemData?.config?.image?.url ||\n            itemData?.productVariant?.metafields?.global?.transparentImg ||\n            itemData?.productVariant?.image?.url\n          }\n        ></Picture>\n      </a>\n      <div className={cn('mt-[22px] w-full l:mt-[8px]')}>\n        <Text\n          html={itemData?.product?.title}\n          title={itemData.config?.title || itemData.alpcData?.title || itemData.product?.title}\n          size={2}\n          className=\"line-clamp-2 h-[58px] text-[24px] l-xxl:text-[20px] l:text-[16px] leading-[1.2] l:h-[40px] l-xxl:h-[48px]\"\n        />\n        {itemData?.config?.rules?.split('<br>')?.length > 0 && (\n          <button\n            type=\"button\"\n            onClick={() => {\n              setRules(itemData?.config?.rules?.split('<br>'))\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'lp_button',\n                member_active_status: profile?.activated ? 'active' : 'not active',\n                event_parameters: {\n                  page_group: pageGroup,\n                  position: copy.title,\n                  button_name: pageCommon?.ruleLabel,\n                  info: itemData?.alpcData?.id?.toString(),\n                },\n              })\n            }}\n            className=\"mt-[8px] text-[16px] font-bold underline xxl:text-[14px]\"\n            tabIndex={0}\n            onKeyDown={e => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault()\n              }\n            }}\n          >\n            {pageCommon?.ruleLabel}\n          </button>\n        )}\n\n        <div className=\"flex flex-wrap items-center l:mt-[12px] laptop:text-[16px] lg-desktop:text-[18px]\">\n          <Picture\n            className=\"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]\"\n            source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783\"\n          />\n          <Text\n            html={`${numberFormat(itemData?.alpcData?.consumeCredits)} + ${formatPrice({\n              amount: Number(itemData?.config?.price),\n              currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n              locale: locale,\n            })}`}\n            size={2}\n            as=\"p\"\n            className=\"ml-[4px] mt-[4px] font-bold leading-none text-[24px] l-xxl:text-[20px] l:text-[16px]\"\n          />\n          <Text\n            html={formatPrice({\n              amount: itemData?.productVariant?.price.amount,\n              currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n              locale: locale,\n            })}\n            className=\"l-xxl:text-[20px] mt-[4px] l:text-[16px] ml-[4px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n            as=\"p\"\n          />\n        </div>\n\n        <div className=\"group relative w-full\">\n          <Button\n            disabled={isDisabled}\n            variant=\"primary\"\n            size=\"lg\"\n            className=\"mt-[8px] md:px-[10px] l:w-full\"\n            loading={isMutating}\n            onClick={() => {\n              handleRedeem()\n            }}\n            title={inSufficientCredit ? pageCommon.insufficientCredits : redeemButtonText}\n          >\n            {redeemButtonText}\n          </Button>\n          <div\n            className={cn(\n              'absolute -bottom-[20px] left-0 z-10 w-[300px] translate-y-full opacity-0 transition-opacity group-hover:opacity-100 md:-bottom-[14px] md:w-[160px]',\n              inSufficientCredit ? 'block' : 'hidden'\n            )}\n          >\n            <div\n              className={cn(\n                'relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow md:px-[10px] md:py-[8px]',\n                !rounded && 'rounded-none'\n              )}\n            >\n              <Text as=\"p\" size=\"2\" html={pageCommon?.insufficientCredits} className=\"text-[14px]\" />\n              <div className=\"absolute -top-[10px] left-[48px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]\" />\n            </div>\n          </div>\n        </div>\n      </div>\n      {error && <div className=\"mt-[8px] text-[14px] text-[#FF0000]\">{error}</div>}\n    </div>\n  )\n}\n\nexport default RedeemableItem\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA2HQ,IAAAI,EAAA,6BA3HRC,EAAsC,iCACtCC,EAAkC,iBAGlCC,EAAkC,+BAClCC,EAAgC,4CAChCC,EAA0C,4BAC1CC,EAA8E,yBAC9EC,EAAgC,4CAEhC,SAASC,EAAe,CACtB,KAAAC,EACA,SAAAC,EACA,SAAAC,EACA,UAAAC,CACF,EAMG,CACD,KAAM,CACJ,WAAAC,EACA,QAAAC,EACA,gBAAAC,EACA,WAAAC,EACA,IAAK,CAAE,UAAAC,CAAU,CACnB,KAAI,qBAAkB,EAChB,CAAE,iBAAAC,CAAiB,KAAI,mBAAgB,EACvC,CAAE,MAAAC,EAAO,OAAAC,CAAO,KAAI,sBAAmB,EACvCC,EAAU,iBAAe,SAASF,CAAK,EACvC,CAACG,EAAOC,CAAQ,KAAI,YAAwB,IAAI,EAChD,CAAE,QAAAC,EAAS,WAAAC,CAAW,KAAI,mBAC9B,CAAC,EACD,CACE,QAASH,GAAS,CAChBC,EAASD,EAAM,OAAO,CACxB,CACF,CACF,EAEMI,KAAU,WAAQ,IACf,CAAC,CAACZ,EACR,CAACA,GAAS,SAAS,CAAC,EAEjBa,KAAqB,WAAQ,IAE/BD,GAAWZ,GAAS,WAAaJ,EAAS,UAAU,eAAiB,OAAOG,GAAY,kBAAoB,CAAC,EAE9G,CAACa,EAASZ,GAAS,UAAWJ,EAAS,UAAU,eAAgBG,GAAY,gBAAgB,CAAC,EAE3Fe,KAAa,WAAQ,IAErB,GAAAlB,EAAS,UAAU,oBAAsB,GAAKA,EAAS,UAAU,WAKjE,CAACA,EAAS,gBAAgB,kBAK1BiB,GAIH,CACDjB,EAAS,UAAU,mBACnBA,EAAS,UAAU,UACnBA,EAAS,gBAAgB,iBACzBiB,CACF,CAAC,EAEKE,EAAe,IAAM,CACzBN,EAAS,IAAI,EACRG,EAEM,CAACZ,GAAS,WAAa,CAACI,EAAiB,kBAClDA,EAAiB,KAAK,GAEtBM,EAAQ,CACN,eAAgBd,GAAU,eAC1B,SAAUA,GAAU,QAAQ,QAC9B,CAAC,KACD,WAAQ,CACN,MAAO,WACP,WAAY,YACZ,qBAAsBI,GAAS,UAAY,SAAW,aACtD,iBAAkB,CAChB,WAAYG,EACZ,SAAUR,EAAK,MACf,YAAaqB,EACb,KAAMpB,GAAU,UAAU,IAAI,SAAS,CACzC,CACF,CAAC,GAlBDK,EAAgB,CAoBpB,EAEMe,KAAmB,WAAQ,IAE1BpB,EAAS,gBAAgB,iBAElBgB,EAGHjB,EAAK,UAFLA,EAAK,cAFLA,GAAM,SAAW,WAMzB,CAACiB,EAAShB,EAAS,gBAAgB,iBAAkBD,EAAK,UAAWA,EAAK,cAAeA,GAAM,OAAO,CAAC,EAE1G,SACE,QAAC,OACC,aAAW,EAAAsB,YACT,6HACA,CAACV,GAAW,+BACZT,CACF,EAEA,oBAAC,KACC,KAAM,aAAaF,EAAS,QAAQ,MAAM,GAC1C,aAAW,EAAAqB,YAAG,8DAA8D,EAE5E,mBAAC,WACC,UAAU,wBACV,aAAa,wBACb,OACErB,GAAU,QAAQ,OAAO,KACzBA,GAAU,gBAAgB,YAAY,QAAQ,gBAC9CA,GAAU,gBAAgB,OAAO,IAEpC,EACH,KACA,QAAC,OAAI,aAAW,EAAAqB,YAAG,6BAA6B,EAC9C,oBAAC,QACC,KAAMrB,GAAU,SAAS,MACzB,MAAOA,EAAS,QAAQ,OAASA,EAAS,UAAU,OAASA,EAAS,SAAS,MAC/E,KAAM,EACN,UAAU,4GACZ,EACCA,GAAU,QAAQ,OAAO,MAAM,MAAM,GAAG,OAAS,MAChD,OAAC,UACC,KAAK,SACL,QAAS,IAAM,CACbC,EAASD,GAAU,QAAQ,OAAO,MAAM,MAAM,CAAC,KAC/C,WAAQ,CACN,MAAO,WACP,WAAY,YACZ,qBAAsBI,GAAS,UAAY,SAAW,aACtD,iBAAkB,CAChB,WAAYG,EACZ,SAAUR,EAAK,MACf,YAAaO,GAAY,UACzB,KAAMN,GAAU,UAAU,IAAI,SAAS,CACzC,CACF,CAAC,CACH,EACA,UAAU,2DACV,SAAU,EACV,UAAWsB,GAAK,EACVA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MACjCA,EAAE,eAAe,CAErB,EAEC,SAAAhB,GAAY,UACf,KAGF,QAAC,OAAI,UAAU,oFACb,oBAAC,WACC,UAAU,gEACV,OAAO,6FACT,KACA,OAAC,QACC,KAAM,MAAG,gBAAaN,GAAU,UAAU,cAAc,CAAC,SAAM,eAAY,CACzE,OAAQ,OAAOA,GAAU,QAAQ,KAAK,EACtC,aAAcA,GAAU,gBAAgB,MAAM,cAAgB,MAC9D,OAAQU,CACV,CAAC,CAAC,GACF,KAAM,EACN,GAAG,IACH,UAAU,uFACZ,KACA,OAAC,QACC,QAAM,eAAY,CAChB,OAAQV,GAAU,gBAAgB,MAAM,OACxC,aAAcA,GAAU,gBAAgB,MAAM,cAAgB,MAC9D,OAAQU,CACV,CAAC,EACD,UAAU,0HACV,GAAG,IACL,GACF,KAEA,QAAC,OAAI,UAAU,wBACb,oBAAC,UACC,SAAUQ,EACV,QAAQ,UACR,KAAK,KACL,UAAU,iCACV,QAASH,EACT,QAAS,IAAM,CACbI,EAAa,CACf,EACA,MAAOF,EAAqBX,EAAW,oBAAsBc,EAE5D,SAAAA,EACH,KACA,OAAC,OACC,aAAW,EAAAC,YACT,qJACAJ,EAAqB,QAAU,QACjC,EAEA,oBAAC,OACC,aAAW,EAAAI,YACT,mHACA,CAACV,GAAW,cACd,EAEA,oBAAC,QAAK,GAAG,IAAI,KAAK,IAAI,KAAML,GAAY,oBAAqB,UAAU,cAAc,KACrF,OAAC,OAAI,UAAU,mHAAmH,GACpI,EACF,GACF,GACF,EACCM,MAAS,OAAC,OAAI,UAAU,sCAAuC,SAAAA,EAAM,GACxE,CAEJ,CAEA,IAAOxB,EAAQU",
-  "names": ["RedeemableItem_exports", "__export", "RedeemableItem_default", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_react", "import_provider", "import_useRedeemAndBuy", "import_utils", "import_lib", "import_registration", "RedeemableItem", "copy", "itemData", "setRules", "className", "creditInfo", "profile", "openSignUpPopup", "pageCommon", "pageGroup", "authCodeActivate", "brand", "locale", "rounded", "error", "setError", "trigger", "isMutating", "isLogin", "inSufficientCredit", "isDisabled", "handleRedeem", "redeemButtonText", "cn", "e"]
+  "sourcesContent": ["import { Button, Text, Picture } from '@anker-in/headless-ui'\nimport { useMemo, useState } from 'react'\n\nimport { CreditsCashCopy, RedeemItem } from './type'\nimport { useCreditsContext } from '../context/provider'\nimport { useRedeemAndBuy } from '../context/hooks/useRedeemAndBuy'\nimport { formatPrice, numberFormat, extractVariantId } from '../context/utils'\nimport { gaTrack, classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useRegistration } from '../../../components/registration'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nfunction RedeemableItem({\n  copy,\n  itemData,\n  setRules,\n  className,\n}: {\n  copy: CreditsCashCopy\n  itemData: RedeemItem\n  className?: string\n  setRules: (rules: string[]) => void\n  currencyCode: string\n}) {\n  const {\n    creditInfo,\n    profile,\n    openSignUpPopup,\n    pageCommon,\n    gtm: { pageGroup },\n  } = useCreditsContext()\n  const { authCodeActivate } = useRegistration()\n  const { brand, locale } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const [error, setError] = useState<string | null>(null)\n  const { trigger, isMutating } = useRedeemAndBuy(\n    {},\n    {\n      onError: error => {\n        setError(error.message)\n      },\n    }\n  )\n\n  const isLogin = useMemo(() => {\n    return !!profile\n  }, [profile?.activated])\n\n  const inSufficientCredit = useMemo(() => {\n    return (\n      isLogin && profile?.activated && itemData.alpcData?.consumeCredits > Number(creditInfo?.available_credit || 0)\n    )\n  }, [isLogin, profile?.activated, itemData.alpcData?.consumeCredits, creditInfo?.available_credit])\n\n  const isDisabled = useMemo(() => {\n    // \u5151\u6362\u9650\u5236\n    if (itemData.alpcData?.remainingInventory <= 0 && itemData.alpcData?.isLimited) {\n      return true\n    }\n\n    // \u5546\u54C1\u5E93\u5B58\u9650\u5236\n    if (!itemData.productVariant?.availableForSale) {\n      return true\n    }\n\n    // \u79EF\u5206\u4E0D\u8DB3\n    if (inSufficientCredit) {\n      return true\n    }\n    return false\n  }, [\n    itemData.alpcData?.remainingInventory,\n    itemData.alpcData?.isLimited,\n    itemData.productVariant?.availableForSale,\n    inSufficientCredit,\n  ])\n\n  const handleRedeem = () => {\n    setError(null)\n    if (!isLogin) {\n      openSignUpPopup()\n    } else if (!profile?.activated && !authCodeActivate.isActivateSuccess) {\n      authCodeActivate.open()\n    } else {\n      trigger({\n        productVariant: itemData?.productVariant,\n        redeemId: itemData?.config?.redeemId,\n      })\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'lp_button',\n        member_active_status: profile?.activated ? 'active' : 'not active',\n        event_parameters: {\n          page_group: pageGroup,\n          position: copy.title,\n          button_name: redeemButtonText,\n          info: itemData?.alpcData?.id?.toString(),\n        },\n      })\n    }\n  }\n\n  const redeemButtonText = useMemo(() => {\n    // \u7F3A\u8D27\u6587\u6848\n    if (!itemData.productVariant?.availableForSale) {\n      return copy?.soldOut || 'Sold Out'\n    } else if (!isLogin) {\n      return copy.unlockRewards\n    } else {\n      return copy.btnRedeem\n    }\n  }, [isLogin, itemData.productVariant?.availableForSale, copy.btnRedeem, copy.unlockRewards, copy?.soldOut])\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-center rounded-[16px] bg-[#EAEAEC] md:rounded-[12px] p-[24px] l:p-[8px] md-xl:p-[16px]',\n        !rounded && 'rounded-none md:rounded-none',\n        className\n      )}\n    >\n      <a\n        href={\n          extractVariantId(itemData.productVariant?.id)\n            ? `/products/${itemData.product.handle}?variant=${extractVariantId(itemData.productVariant?.id)}`\n            : `/products/${itemData.product.handle}`\n        }\n        className={cn('relative mx-auto h-[224px] w-fit l:h-[120px] l-xxl:h-[138px]')}\n      >\n        <Picture\n          className=\"mx-auto h-full w-auto\"\n          imgClassName=\"h-full object-contain\"\n          source={\n            itemData?.config?.image?.url ||\n            itemData?.productVariant?.metafields?.global?.transparentImg ||\n            itemData?.productVariant?.image?.url\n          }\n        ></Picture>\n      </a>\n      <div className={cn('mt-[22px] w-full l:mt-[8px]')}>\n        <Text\n          html={itemData?.product?.title}\n          title={itemData.config?.title || itemData.alpcData?.title || itemData.product?.title}\n          size={2}\n          className=\"line-clamp-2 h-[58px] text-[24px] l-xxl:text-[20px] l:text-[16px] leading-[1.2] l:h-[40px] l-xxl:h-[48px]\"\n        />\n        {itemData?.config?.rules?.split('<br>')?.length > 0 && (\n          <button\n            type=\"button\"\n            onClick={() => {\n              setRules(itemData?.config?.rules?.split('<br>'))\n              gaTrack({\n                event: 'ga4Event',\n                event_name: 'lp_button',\n                member_active_status: profile?.activated ? 'active' : 'not active',\n                event_parameters: {\n                  page_group: pageGroup,\n                  position: copy.title,\n                  button_name: pageCommon?.ruleLabel,\n                  info: itemData?.alpcData?.id?.toString(),\n                },\n              })\n            }}\n            className=\"mt-[8px] text-[16px] font-bold underline xxl:text-[14px]\"\n            tabIndex={0}\n            onKeyDown={e => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault()\n              }\n            }}\n          >\n            {pageCommon?.ruleLabel}\n          </button>\n        )}\n\n        <div className=\"flex flex-wrap items-center l:mt-[12px] laptop:text-[16px] lg-desktop:text-[18px]\">\n          <Picture\n            className=\"size-[24px] l-xxl:size-[22px] md-l:size-[18px] md:size-[16px]\"\n            source=\"https://cdn.shopify.com/s/files/1/0511/6346/3874/files/icon_hire_purchase.png?v=1757496783\"\n          />\n          <Text\n            html={`${numberFormat(itemData?.alpcData?.consumeCredits)} + ${formatPrice({\n              amount: Number(itemData?.config?.price),\n              currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n              locale: locale,\n            })}`}\n            size={2}\n            as=\"p\"\n            className=\"ml-[4px] mt-[4px] font-bold leading-none text-[24px] l-xxl:text-[20px] l:text-[16px]\"\n          />\n          <Text\n            html={formatPrice({\n              amount: itemData?.productVariant?.price.amount,\n              currencyCode: itemData?.productVariant?.price.currencyCode || 'USD',\n              locale: locale,\n            })}\n            className=\"l-xxl:text-[20px] mt-[4px] l:text-[16px] ml-[4px] font-bold leading-[1.2] tracking-[-0.8px] text-[#4A4C56] line-through\"\n            as=\"p\"\n          />\n        </div>\n\n        <div className=\"group relative w-full\">\n          <Button\n            disabled={isDisabled}\n            variant=\"primary\"\n            size=\"lg\"\n            className=\"mt-[8px] md:px-[10px] l:w-full\"\n            loading={isMutating}\n            onClick={() => {\n              handleRedeem()\n            }}\n            title={inSufficientCredit ? pageCommon.insufficientCredits : redeemButtonText}\n          >\n            {redeemButtonText}\n          </Button>\n          <div\n            className={cn(\n              'absolute -bottom-[20px] left-0 z-10 w-[300px] translate-y-full opacity-0 transition-opacity group-hover:opacity-100 md:-bottom-[14px] md:w-[160px]',\n              inSufficientCredit ? 'block' : 'hidden'\n            )}\n          >\n            <div\n              className={cn(\n                'relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow md:px-[10px] md:py-[8px]',\n                !rounded && 'rounded-none'\n              )}\n            >\n              <Text as=\"p\" size=\"2\" html={pageCommon?.insufficientCredits} className=\"text-[14px]\" />\n              <div className=\"absolute -top-[10px] left-[48px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]\" />\n            </div>\n          </div>\n        </div>\n      </div>\n      {error && <div className=\"mt-[8px] text-[14px] text-[#FF0000]\">{error}</div>}\n    </div>\n  )\n}\n\nexport default RedeemableItem\n"],
+  "mappings": "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",
+  "names": ["RedeemableItem_exports", "__export", "RedeemableItem_default", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_react", "import_provider", "import_useRedeemAndBuy", "import_utils", "import_lib", "import_registration", "import_constants", "RedeemableItem", "copy", "itemData", "setRules", "className", "creditInfo", "profile", "openSignUpPopup", "pageCommon", "pageGroup", "authCodeActivate", "brand", "locale", "rounded", "error", "setError", "trigger", "isMutating", "isLogin", "inSufficientCredit", "isDisabled", "handleRedeem", "redeemButtonText", "cn", "e"]
 }

package/dist/cjs/components/credits/creditsFaq/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var f=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var C=(e,s)=>{for(var l in s)f(e,l,{get:s[l],enumerable:!0})},N=(e,s,l,n)=>{if(s&&typeof s=="object"||typeof s=="function")for(let i of q(s))!v.call(e,i)&&i!==l&&f(e,i,{get:()=>s[i],enumerable:!(n=h(s,i))||n.enumerable});return e};var w=e=>N(f({},"__esModule",{value:!0}),e);var k={};C(k,{CreditsFaq:()=>F});module.exports=w(k);var r=require("react/jsx-runtime"),a=require("@anker-in/headless-ui"),o=require("@anker-in/lib"),m=require("react"),c=require("./faqItem/FaqItem");const F=({copy:e,id:s})=>{const{title:l,items:n,subTitle:i=""}=e||{},{brand:b}=(0,o.useHeadlessContext)(),x=o.ROUNDED_BRANDS.includes(b),g=(0,m.useMemo)(()=>Array.from(new Set(n?.map?.(t=>t.category_name).filter(t=>!!t))),[n]),[d,p]=(0,m.useState)(g[0]?.toString()||""),T=(0,m.useMemo)(()=>n?g.length?n.filter(t=>t?.category_name===d):n:[],[n,g.length,d]);return(0,r.jsxs)(a.Container,{id:s,className:"bg-[#F5F5F7]",children:[l&&(0,r.jsx)(a.Heading,{as:"h2",size:"4",html:e?.title}),i&&(0,r.jsx)("div",{className:"mt-[8px] flex flex-row",children:(0,r.jsx)(a.Text,{size:"4",as:"p",html:i,className:"flex-1"})}),(0,r.jsx)(a.Tabs,{align:"left",shape:x?"rounded":"square",className:"mt-[24px]",value:d.toString(),onValueChange:t=>{p(t)},children:(0,r.jsx)(a.TabsList,{children:g.map((t,u)=>(0,r.jsx)(a.TabsTrigger,{value:t?.toString()||"",children:t},u))})}),(0,r.jsx)("div",{className:(0,o.classNames)("mt-[24px] flex flex-col overflow-auto pt-0"),children:T?.map((t,u)=>(0,r.jsx)(c.FaqItem,{index:u,defaultExpended:n.length===1,question:t.question,answer:t.answer,showDots:!1},u))}),e.learnMore?.link&&e.learnMore?.label&&(0,r.jsx)("a",{href:e.learnMore?.link,target:"_blank",className:"mt-[24px] block w-full text-center text-[18px] font-bold text-brand hover:underline l:text-[16px]",children:e.learnMore?.label})]})};
+"use strict";var f=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var C=Object.prototype.hasOwnProperty;var N=(e,s)=>{for(var l in s)f(e,l,{get:s[l],enumerable:!0})},w=(e,s,l,n)=>{if(s&&typeof s=="object"||typeof s=="function")for(let i of v(s))!C.call(e,i)&&i!==l&&f(e,i,{get:()=>s[i],enumerable:!(n=q(s,i))||n.enumerable});return e};var F=e=>w(f({},"__esModule",{value:!0}),e);var y={};N(y,{CreditsFaq:()=>k});module.exports=F(y);var r=require("react/jsx-runtime"),a=require("@anker-in/headless-ui"),u=require("@anker-in/lib"),o=require("react"),c=require("./faqItem/FaqItem"),b=require("../../../constants");const k=({copy:e,id:s})=>{const{title:l,items:n,subTitle:i=""}=e||{},{brand:p}=(0,u.useHeadlessContext)(),x=b.ROUNDED_BRANDS.includes(p),m=(0,o.useMemo)(()=>Array.from(new Set(n?.map?.(t=>t.category_name).filter(t=>!!t))),[n]),[d,T]=(0,o.useState)(m[0]?.toString()||""),h=(0,o.useMemo)(()=>n?m.length?n.filter(t=>t?.category_name===d):n:[],[n,m.length,d]);return(0,r.jsxs)(a.Container,{id:s,className:"bg-[#F5F5F7]",children:[l&&(0,r.jsx)(a.Heading,{as:"h2",size:"4",html:e?.title}),i&&(0,r.jsx)("div",{className:"mt-[8px] flex flex-row",children:(0,r.jsx)(a.Text,{size:"4",as:"p",html:i,className:"flex-1"})}),(0,r.jsx)(a.Tabs,{align:"left",shape:x?"rounded":"square",className:"mt-[24px]",value:d.toString(),onValueChange:t=>{T(t)},children:(0,r.jsx)(a.TabsList,{children:m.map((t,g)=>(0,r.jsx)(a.TabsTrigger,{value:t?.toString()||"",children:t},g))})}),(0,r.jsx)("div",{className:(0,u.classNames)("mt-[24px] flex flex-col overflow-auto pt-0"),children:h?.map((t,g)=>(0,r.jsx)(c.FaqItem,{index:g,defaultExpended:n.length===1,question:t.question,answer:t.answer,showDots:!1},g))}),e.learnMore?.link&&e.learnMore?.label&&(0,r.jsx)("a",{href:e.learnMore?.link,target:"_blank",className:"mt-[24px] block w-full text-center text-[18px] font-bold text-brand hover:underline l:text-[16px]",children:e.learnMore?.label})]})};
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/credits/creditsFaq/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/creditsFaq/index.tsx"],
-  "sourcesContent": ["import { Container, Heading, Tabs, TabsList, TabsTrigger, Text } from '@anker-in/headless-ui'\nimport { classNames as cn, useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'\nimport { useMemo, useState } from 'react'\n\nimport { FaqItem } from './faqItem/FaqItem'\n\nexport type CreditsFaqCopy = {\n  title: string\n  subTitle: string\n  learnMore: {\n    link: string\n    label: string\n  }\n  items: {\n    category_name: string\n    question: string\n    answer: string\n  }[]\n}\nexport const CreditsFaq = ({ copy, id }: { copy: CreditsFaqCopy; id?: string }) => {\n  const { title, items: faqList, subTitle = '' } = copy || {}\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const categoryList = useMemo(() => {\n    return Array.from(new Set(faqList?.map?.(faq => faq.category_name).filter(item => !!item)))\n  }, [faqList])\n  const [activeTab, setActiveTab] = useState<string>(categoryList[0]?.toString() || '')\n\n  const currentList = useMemo(() => {\n    if (!faqList) return []\n    if (categoryList.length) {\n      return faqList.filter(item => item?.category_name === activeTab)\n    }\n    return faqList\n  }, [faqList, categoryList.length, activeTab])\n\n  return (\n    <Container id={id} className=\"bg-[#F5F5F7]\">\n      {title && <Heading as=\"h2\" size=\"4\" html={copy?.title} />}\n      {subTitle && (\n        <div className=\"mt-[8px] flex flex-row\">\n          <Text size=\"4\" as=\"p\" html={subTitle} className=\"flex-1\" />\n        </div>\n      )}\n      {/* faq-nav */}\n      <Tabs\n        align=\"left\"\n        shape={rounded ? 'rounded' : 'square'}\n        className=\"mt-[24px]\"\n        value={activeTab.toString()}\n        onValueChange={value => {\n          setActiveTab(value)\n        }}\n      >\n        <TabsList>\n          {categoryList.map((item, index) => (\n            <TabsTrigger key={index} value={item?.toString() || ''}>\n              {item}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n      </Tabs>\n      <div className={cn('mt-[24px] flex flex-col overflow-auto pt-0')}>\n        {currentList?.map((item, index) => {\n          return (\n            <FaqItem\n              key={index}\n              index={index}\n              defaultExpended={faqList.length === 1}\n              question={item.question}\n              answer={item.answer}\n              showDots={false}\n            ></FaqItem>\n          )\n        })}\n      </div>\n      {copy.learnMore?.link && copy.learnMore?.label && (\n        <a\n          href={copy.learnMore?.link}\n          target=\"_blank\"\n          className=\"mt-[24px] block w-full text-center text-[18px] font-bold text-brand hover:underline l:text-[16px]\"\n        >\n          {copy.learnMore?.label}\n        </a>\n      )}\n    </Container>\n  )\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,IAAA,eAAAC,EAAAH,GAqCI,IAAAI,EAAA,6BArCJC,EAAsE,iCACtEC,EAAqE,yBACrEC,EAAkC,iBAElCC,EAAwB,6BAejB,MAAMN,EAAa,CAAC,CAAE,KAAAO,EAAM,GAAAC,CAAG,IAA6C,CACjF,KAAM,CAAE,MAAAC,EAAO,MAAOC,EAAS,SAAAC,EAAW,EAAG,EAAIJ,GAAQ,CAAC,EACpD,CAAE,MAAAK,CAAM,KAAI,sBAAmB,EAC/BC,EAAU,iBAAe,SAASD,CAAK,EACvCE,KAAe,WAAQ,IACpB,MAAM,KAAK,IAAI,IAAIJ,GAAS,MAAMK,GAAOA,EAAI,aAAa,EAAE,OAAOC,GAAQ,CAAC,CAACA,CAAI,CAAC,CAAC,EACzF,CAACN,CAAO,CAAC,EACN,CAACO,EAAWC,CAAY,KAAI,YAAiBJ,EAAa,CAAC,GAAG,SAAS,GAAK,EAAE,EAE9EK,KAAc,WAAQ,IACrBT,EACDI,EAAa,OACRJ,EAAQ,OAAOM,GAAQA,GAAM,gBAAkBC,CAAS,EAE1DP,EAJc,CAAC,EAKrB,CAACA,EAASI,EAAa,OAAQG,CAAS,CAAC,EAE5C,SACE,QAAC,aAAU,GAAIT,EAAI,UAAU,eAC1B,UAAAC,MAAS,OAAC,WAAQ,GAAG,KAAK,KAAK,IAAI,KAAMF,GAAM,MAAO,EACtDI,MACC,OAAC,OAAI,UAAU,yBACb,mBAAC,QAAK,KAAK,IAAI,GAAG,IAAI,KAAMA,EAAU,UAAU,SAAS,EAC3D,KAGF,OAAC,QACC,MAAM,OACN,MAAOE,EAAU,UAAY,SAC7B,UAAU,YACV,MAAOI,EAAU,SAAS,EAC1B,cAAeG,GAAS,CACtBF,EAAaE,CAAK,CACpB,EAEA,mBAAC,YACE,SAAAN,EAAa,IAAI,CAACE,EAAMK,OACvB,OAAC,eAAwB,MAAOL,GAAM,SAAS,GAAK,GACjD,SAAAA,GADeK,CAElB,CACD,EACH,EACF,KACA,OAAC,OAAI,aAAW,EAAAC,YAAG,4CAA4C,EAC5D,SAAAH,GAAa,IAAI,CAACH,EAAMK,OAErB,OAAC,WAEC,MAAOA,EACP,gBAAiBX,EAAQ,SAAW,EACpC,SAAUM,EAAK,SACf,OAAQA,EAAK,OACb,SAAU,IALLK,CAMN,CAEJ,EACH,EACCd,EAAK,WAAW,MAAQA,EAAK,WAAW,UACvC,OAAC,KACC,KAAMA,EAAK,WAAW,KACtB,OAAO,SACP,UAAU,oGAET,SAAAA,EAAK,WAAW,MACnB,GAEJ,CAEJ",
-  "names": ["creditsFaq_exports", "__export", "CreditsFaq", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_lib", "import_react", "import_FaqItem", "copy", "id", "title", "faqList", "subTitle", "brand", "rounded", "categoryList", "faq", "item", "activeTab", "setActiveTab", "currentList", "value", "index", "cn"]
+  "sourcesContent": ["import { Container, Heading, Tabs, TabsList, TabsTrigger, Text } from '@anker-in/headless-ui'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useMemo, useState } from 'react'\n\nimport { FaqItem } from './faqItem/FaqItem'\nimport { ROUNDED_BRANDS } from '../../../constants'\n\nexport type CreditsFaqCopy = {\n  title: string\n  subTitle: string\n  learnMore: {\n    link: string\n    label: string\n  }\n  items: {\n    category_name: string\n    question: string\n    answer: string\n  }[]\n}\nexport const CreditsFaq = ({ copy, id }: { copy: CreditsFaqCopy; id?: string }) => {\n  const { title, items: faqList, subTitle = '' } = copy || {}\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const categoryList = useMemo(() => {\n    return Array.from(new Set(faqList?.map?.(faq => faq.category_name).filter(item => !!item)))\n  }, [faqList])\n  const [activeTab, setActiveTab] = useState<string>(categoryList[0]?.toString() || '')\n\n  const currentList = useMemo(() => {\n    if (!faqList) return []\n    if (categoryList.length) {\n      return faqList.filter(item => item?.category_name === activeTab)\n    }\n    return faqList\n  }, [faqList, categoryList.length, activeTab])\n\n  return (\n    <Container id={id} className=\"bg-[#F5F5F7]\">\n      {title && <Heading as=\"h2\" size=\"4\" html={copy?.title} />}\n      {subTitle && (\n        <div className=\"mt-[8px] flex flex-row\">\n          <Text size=\"4\" as=\"p\" html={subTitle} className=\"flex-1\" />\n        </div>\n      )}\n      {/* faq-nav */}\n      <Tabs\n        align=\"left\"\n        shape={rounded ? 'rounded' : 'square'}\n        className=\"mt-[24px]\"\n        value={activeTab.toString()}\n        onValueChange={value => {\n          setActiveTab(value)\n        }}\n      >\n        <TabsList>\n          {categoryList.map((item, index) => (\n            <TabsTrigger key={index} value={item?.toString() || ''}>\n              {item}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n      </Tabs>\n      <div className={cn('mt-[24px] flex flex-col overflow-auto pt-0')}>\n        {currentList?.map((item, index) => {\n          return (\n            <FaqItem\n              key={index}\n              index={index}\n              defaultExpended={faqList.length === 1}\n              question={item.question}\n              answer={item.answer}\n              showDots={false}\n            ></FaqItem>\n          )\n        })}\n      </div>\n      {copy.learnMore?.link && copy.learnMore?.label && (\n        <a\n          href={copy.learnMore?.link}\n          target=\"_blank\"\n          className=\"mt-[24px] block w-full text-center text-[18px] font-bold text-brand hover:underline l:text-[16px]\"\n        >\n          {copy.learnMore?.label}\n        </a>\n      )}\n    </Container>\n  )\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,IAAA,eAAAC,EAAAH,GAsCI,IAAAI,EAAA,6BAtCJC,EAAsE,iCACtEC,EAAqD,yBACrDC,EAAkC,iBAElCC,EAAwB,6BACxBC,EAA+B,8BAexB,MAAMP,EAAa,CAAC,CAAE,KAAAQ,EAAM,GAAAC,CAAG,IAA6C,CACjF,KAAM,CAAE,MAAAC,EAAO,MAAOC,EAAS,SAAAC,EAAW,EAAG,EAAIJ,GAAQ,CAAC,EACpD,CAAE,MAAAK,CAAM,KAAI,sBAAmB,EAC/BC,EAAU,iBAAe,SAASD,CAAK,EACvCE,KAAe,WAAQ,IACpB,MAAM,KAAK,IAAI,IAAIJ,GAAS,MAAMK,GAAOA,EAAI,aAAa,EAAE,OAAOC,GAAQ,CAAC,CAACA,CAAI,CAAC,CAAC,EACzF,CAACN,CAAO,CAAC,EACN,CAACO,EAAWC,CAAY,KAAI,YAAiBJ,EAAa,CAAC,GAAG,SAAS,GAAK,EAAE,EAE9EK,KAAc,WAAQ,IACrBT,EACDI,EAAa,OACRJ,EAAQ,OAAOM,GAAQA,GAAM,gBAAkBC,CAAS,EAE1DP,EAJc,CAAC,EAKrB,CAACA,EAASI,EAAa,OAAQG,CAAS,CAAC,EAE5C,SACE,QAAC,aAAU,GAAIT,EAAI,UAAU,eAC1B,UAAAC,MAAS,OAAC,WAAQ,GAAG,KAAK,KAAK,IAAI,KAAMF,GAAM,MAAO,EACtDI,MACC,OAAC,OAAI,UAAU,yBACb,mBAAC,QAAK,KAAK,IAAI,GAAG,IAAI,KAAMA,EAAU,UAAU,SAAS,EAC3D,KAGF,OAAC,QACC,MAAM,OACN,MAAOE,EAAU,UAAY,SAC7B,UAAU,YACV,MAAOI,EAAU,SAAS,EAC1B,cAAeG,GAAS,CACtBF,EAAaE,CAAK,CACpB,EAEA,mBAAC,YACE,SAAAN,EAAa,IAAI,CAACE,EAAMK,OACvB,OAAC,eAAwB,MAAOL,GAAM,SAAS,GAAK,GACjD,SAAAA,GADeK,CAElB,CACD,EACH,EACF,KACA,OAAC,OAAI,aAAW,EAAAC,YAAG,4CAA4C,EAC5D,SAAAH,GAAa,IAAI,CAACH,EAAMK,OAErB,OAAC,WAEC,MAAOA,EACP,gBAAiBX,EAAQ,SAAW,EACpC,SAAUM,EAAK,SACf,OAAQA,EAAK,OACb,SAAU,IALLK,CAMN,CAEJ,EACH,EACCd,EAAK,WAAW,MAAQA,EAAK,WAAW,UACvC,OAAC,KACC,KAAMA,EAAK,WAAW,KACtB,OAAO,SACP,UAAU,oGAET,SAAAA,EAAK,WAAW,MACnB,GAEJ,CAEJ",
+  "names": ["creditsFaq_exports", "__export", "CreditsFaq", "__toCommonJS", "import_jsx_runtime", "import_headless_ui", "import_lib", "import_react", "import_FaqItem", "import_constants", "copy", "id", "title", "faqList", "subTitle", "brand", "rounded", "categoryList", "faq", "item", "activeTab", "setActiveTab", "currentList", "value", "index", "cn"]
 }

package/dist/cjs/components/credits/creditsInfoCard/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var D=Object.create;var c=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var R=(t,a)=>{for(var s in a)c(t,s,{get:a[s],enumerable:!0})},N=(t,a,s,x)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of B(a))!I.call(t,n)&&n!==s&&c(t,n,{get:()=>a[n],enumerable:!(x=z(a,n))||x.enumerable});return t};var C=(t,a,s)=>(s=t!=null?D(S(t)):{},N(a||!t||!t.__esModule?c(s,"default",{value:t,enumerable:!0}):s,t)),O=t=>N(c({},"__esModule",{value:!0}),t);var _={};R(_,{CreditsInfoCard:()=>T});module.exports=O(_);var e=require("react/jsx-runtime"),o=require("@anker-in/headless-ui"),r=require("react"),w=require("../context/provider"),b=require("../context/utils"),y=C(require("../modal/activitiesModal")),k=C(require("../modal/MyRewardsModal")),i=require("@anker-in/lib");function T({copy:t,id:a}){const[s,x]=(0,r.useState)(!1),[n,u]=(0,r.useState)(!1),[f,p]=(0,r.useState)(!1),{creditInfo:m,pageCommon:d}=(0,w.useCreditsContext)(),{brand:h}=(0,i.useHeadlessContext)(),v=i.ROUNDED_BRANDS.includes(h),M=(0,r.useCallback)(l=>{if((0,i.gaNormalClick)({position:"info_card",label:l.text}),l.type)switch(l.type){case"activities":x(!0);break;case"rewards":u(!0);break}},[]);return(0,e.jsxs)(o.Container,{asChild:!0,id:a,className:"-mb-[86px] -translate-y-[86px] x:-mb-[30px] x:-translate-y-[30px]",children:[(0,e.jsxs)("div",{className:(0,i.classNames)("mx-auto flex justify-between items-center rounded-[12px] border border-white px-[24px] py-[40px]","l:flex-col l:items-start","min-l:px-[48px]","min-xl:px-[100px]",!v&&"rounded-none"),style:{background:"linear-gradient(119.61deg, rgba(250, 250, 250, 0.6) 38.58%, rgba(255, 255, 255, 0.6) 63.73%, rgba(249, 252, 255, 0.6) 89.37%)",backdropFilter:"blur(8px)"},children:[(0,e.jsxs)("div",{className:(0,i.classNames)("grid grid-cols-2 gap-[24px] font-bold l:w-full md:grid-cols-1 md:flex-col md:gap-[16px] min-md:items-center"),children:[(0,e.jsxs)("div",{className:"mr-[80px] md:mr-[0] md:flex-1 md-xl:mr-[64px]",children:[(0,e.jsx)("div",{className:(0,i.classNames)("mb-[24px] text-[14px] font-bold l:mb-[6px] xl:text-[16px] min-md:text-[18px] l-xl:mb-[16px]"),children:t.balanceLabel}),(0,e.jsxs)("div",{className:"flex items-baseline",children:[(0,e.jsx)("div",{className:(0,i.classNames)("mr-[8px] text-[36px] font-extrabold","min-md:text-[44px]","min-xl:text-[56px]"),children:m?(0,b.numberFormat)(m.available_credit):0}),(0,e.jsx)("div",{className:"text-[16px]",children:d?.pointUnit})]})]}),(0,e.jsxs)("div",{className:"w-fit md:flex-1",children:[(0,e.jsxs)("div",{className:(0,i.classNames)("mb-[24px] flex text-[18px] l:mb-[6px] l:text-[14px] l-xl:mb-[16px]"),children:[(0,e.jsx)(o.Text,{className:"text-[14px] font-bold xl:text-[16px] min-md:text-[18px]",html:t.comingSoonLabel}),t.comingSoonTips&&(0,e.jsxs)("div",{className:"group relative ml-[4px] flex cursor-pointer items-start",children:[(0,e.jsx)(o.Text,{as:"div",html:d?.infoIcon,className:"size-[18px] cursor-pointer [&_svg]:size-full",onClick:()=>{f?p(!1):(p(!0),setTimeout(()=>{p(!1)},5e3))}}),(0,e.jsx)("div",{className:(0,i.classNames)("absolute -bottom-[12px] -left-[32px] z-10 w-[356px] translate-y-full md:w-[276px]",f?"block":"hidden"),children:(0,e.jsxs)("div",{className:(0,i.classNames)("relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow",!v&&"rounded-none"),children:[(0,e.jsx)(o.Text,{size:"2",html:t.comingSoonTips,className:"desktop:text-[18px]"}),(0,e.jsx)("div",{className:(0,i.classNames)("absolute -top-[10px] left-[40px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]",!v&&"rounded-none")})]})})]})]}),(0,e.jsxs)("div",{className:"flex items-baseline ",children:[(0,e.jsx)("div",{className:(0,i.classNames)("mr-[8px] text-[36px] font-extrabold","min-l:text-[44px]","min-xl:text-[56px]"),children:m?(0,b.numberFormat)(m.pending_credit):0}),(0,e.jsx)("div",{className:"text-[16px]",children:d?.pointUnit})]})]})]}),(0,e.jsx)("div",{className:(0,i.classNames)("grid w-fit md:w-full l:mt-[32px] l:gap-[12px] min-l:gap-[16px] min-l:pl-[48px] md-l:grid-cols-2"),children:t.buttons?.map((l,g)=>(0,e.jsx)(o.Button,{variant:g===0?"secondary":"primary",size:"lg",className:"min-w-[156px] laptop:min-w-[189px]",onClick:()=>{M(l)},children:l.text},g))}),d?.activitiesModal&&(0,e.jsx)(y.default,{isOpen:s,data:d?.activitiesModal,onClose:()=>{x(!1)}}),d?.rewardsModal&&(0,e.jsx)(k.default,{isOpen:n,data:d?.rewardsModal,onClose:()=>{u(!1)}})]}),f&&(0,e.jsx)("div",{role:"button",tabIndex:0,className:"fixed inset-0 z-10",onClick:()=>p(!1),onKeyDown:l=>l.key==="Escape"&&p(!1)})]})}
+"use strict";var z=Object.create;var c=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var O=(t,a)=>{for(var s in a)c(t,s,{get:a[s],enumerable:!0})},N=(t,a,s,x)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of S(a))!R.call(t,n)&&n!==s&&c(t,n,{get:()=>a[n],enumerable:!(x=B(a,n))||x.enumerable});return t};var C=(t,a,s)=>(s=t!=null?z(I(t)):{},N(a||!t||!t.__esModule?c(s,"default",{value:t,enumerable:!0}):s,t)),T=t=>N(c({},"__esModule",{value:!0}),t);var A={};O(A,{CreditsInfoCard:()=>_});module.exports=T(A);var e=require("react/jsx-runtime"),o=require("@anker-in/headless-ui"),r=require("react"),w=require("../context/provider"),b=require("../context/utils"),y=C(require("../modal/activitiesModal")),k=C(require("../modal/MyRewardsModal")),i=require("@anker-in/lib"),h=require("../../../constants");function _({copy:t,id:a}){const[s,x]=(0,r.useState)(!1),[n,u]=(0,r.useState)(!1),[f,m]=(0,r.useState)(!1),{creditInfo:p,pageCommon:d}=(0,w.useCreditsContext)(),{brand:M}=(0,i.useHeadlessContext)(),v=h.ROUNDED_BRANDS.includes(M),D=(0,r.useCallback)(l=>{if((0,i.gaNormalClick)({position:"info_card",label:l.text}),l.type)switch(l.type){case"activities":x(!0);break;case"rewards":u(!0);break}},[]);return(0,e.jsxs)(o.Container,{asChild:!0,id:a,className:"-mb-[86px] -translate-y-[86px] x:-mb-[30px] x:-translate-y-[30px]",children:[(0,e.jsxs)("div",{className:(0,i.classNames)("mx-auto flex justify-between items-center rounded-[12px] border border-white px-[24px] py-[40px]","l:flex-col l:items-start","min-l:px-[48px]","min-xl:px-[100px]",!v&&"rounded-none"),style:{background:"linear-gradient(119.61deg, rgba(250, 250, 250, 0.6) 38.58%, rgba(255, 255, 255, 0.6) 63.73%, rgba(249, 252, 255, 0.6) 89.37%)",backdropFilter:"blur(8px)"},children:[(0,e.jsxs)("div",{className:(0,i.classNames)("grid grid-cols-2 gap-[24px] font-bold l:w-full md:grid-cols-1 md:flex-col md:gap-[16px] min-md:items-center"),children:[(0,e.jsxs)("div",{className:"mr-[80px] md:mr-[0] md:flex-1 md-xl:mr-[64px]",children:[(0,e.jsx)("div",{className:(0,i.classNames)("mb-[24px] text-[14px] font-bold l:mb-[6px] xl:text-[16px] min-md:text-[18px] l-xl:mb-[16px]"),children:t.balanceLabel}),(0,e.jsxs)("div",{className:"flex items-baseline",children:[(0,e.jsx)("div",{className:(0,i.classNames)("mr-[8px] text-[36px] font-extrabold","min-md:text-[44px]","min-xl:text-[56px]"),children:p?(0,b.numberFormat)(p.available_credit):0}),(0,e.jsx)("div",{className:"text-[16px]",children:d?.pointUnit})]})]}),(0,e.jsxs)("div",{className:"w-fit md:flex-1",children:[(0,e.jsxs)("div",{className:(0,i.classNames)("mb-[24px] flex text-[18px] l:mb-[6px] l:text-[14px] l-xl:mb-[16px]"),children:[(0,e.jsx)(o.Text,{className:"text-[14px] font-bold xl:text-[16px] min-md:text-[18px]",html:t.comingSoonLabel}),t.comingSoonTips&&(0,e.jsxs)("div",{className:"group relative ml-[4px] flex cursor-pointer items-start",children:[(0,e.jsx)(o.Text,{as:"div",html:d?.infoIcon,className:"size-[18px] cursor-pointer [&_svg]:size-full",onClick:()=>{f?m(!1):(m(!0),setTimeout(()=>{m(!1)},5e3))}}),(0,e.jsx)("div",{className:(0,i.classNames)("absolute -bottom-[12px] -left-[32px] z-10 w-[356px] translate-y-full md:w-[276px]",f?"block":"hidden"),children:(0,e.jsxs)("div",{className:(0,i.classNames)("relative rounded-[10px] bg-[#6D6D6F] p-[16px] text-[14px] font-medium text-white shadow",!v&&"rounded-none"),children:[(0,e.jsx)(o.Text,{size:"2",html:t.comingSoonTips,className:"desktop:text-[18px]"}),(0,e.jsx)("div",{className:(0,i.classNames)("absolute -top-[10px] left-[40px] mb-2 size-[16px] origin-top-left rotate-45 transform rounded-[2px] bg-[#6D6D6F]",!v&&"rounded-none")})]})})]})]}),(0,e.jsxs)("div",{className:"flex items-baseline ",children:[(0,e.jsx)("div",{className:(0,i.classNames)("mr-[8px] text-[36px] font-extrabold","min-l:text-[44px]","min-xl:text-[56px]"),children:p?(0,b.numberFormat)(p.pending_credit):0}),(0,e.jsx)("div",{className:"text-[16px]",children:d?.pointUnit})]})]})]}),(0,e.jsx)("div",{className:(0,i.classNames)("grid w-fit md:w-full l:mt-[32px] l:gap-[12px] min-l:gap-[16px] min-l:pl-[48px] md-l:grid-cols-2"),children:t.buttons?.map((l,g)=>(0,e.jsx)(o.Button,{variant:g===0?"secondary":"primary",size:"lg",className:"min-w-[156px] laptop:min-w-[189px]",onClick:()=>{D(l)},children:l.text},g))}),d?.activitiesModal&&(0,e.jsx)(y.default,{isOpen:s,data:d?.activitiesModal,onClose:()=>{x(!1)}}),d?.rewardsModal&&(0,e.jsx)(k.default,{isOpen:n,data:d?.rewardsModal,onClose:()=>{u(!1)}})]}),f&&(0,e.jsx)("div",{role:"button",tabIndex:0,className:"fixed inset-0 z-10",onClick:()=>m(!1),onKeyDown:l=>l.key==="Escape"&&m(!1)})]})}
 //# sourceMappingURL=index.js.map