@anker-in/campaign-ui 0.2.0-beta.1 → 0.2.0-beta.10

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 (156) hide show
  1. package/dist/cjs/components/credits/context/provider.d.ts +2 -2
  2. package/dist/cjs/components/credits/context/provider.js +1 -1
  3. package/dist/cjs/components/credits/context/provider.js.map +3 -3
  4. package/dist/cjs/components/credits/creditsBenefits/benefitItem.js +1 -1
  5. package/dist/cjs/components/credits/creditsBenefits/benefitItem.js.map +3 -3
  6. package/dist/cjs/components/credits/creditsBenefits/index.js +3 -3
  7. package/dist/cjs/components/credits/creditsBenefits/index.js.map +3 -3
  8. package/dist/cjs/components/credits/creditsCash/CreditsCash.js +1 -1
  9. package/dist/cjs/components/credits/creditsCash/CreditsCash.js.map +3 -3
  10. package/dist/cjs/components/credits/creditsFaq/index.js +1 -1
  11. package/dist/cjs/components/credits/creditsFaq/index.js.map +3 -3
  12. package/dist/cjs/components/credits/creditsInfoCard/index.d.ts +0 -2
  13. package/dist/cjs/components/credits/creditsInfoCard/index.js +1 -1
  14. package/dist/cjs/components/credits/creditsInfoCard/index.js.map +3 -3
  15. package/dist/cjs/components/credits/creditsRedeemList/AddressForm/CountrySelect.js +1 -1
  16. package/dist/cjs/components/credits/creditsRedeemList/AddressForm/CountrySelect.js.map +3 -3
  17. package/dist/cjs/components/credits/creditsRedeemList/AddressForm/StateSelect.js +1 -1
  18. package/dist/cjs/components/credits/creditsRedeemList/AddressForm/StateSelect.js.map +3 -3
  19. package/dist/cjs/components/credits/creditsRedeemList/AddressForm/index.js +1 -1
  20. package/dist/cjs/components/credits/creditsRedeemList/AddressForm/index.js.map +2 -2
  21. package/dist/cjs/components/credits/creditsRedeemList/CreditsRedeemList.js +1 -1
  22. package/dist/cjs/components/credits/creditsRedeemList/CreditsRedeemList.js.map +2 -2
  23. package/dist/cjs/components/credits/creditsRedeemList/RedeemProductModal/Address.js +1 -1
  24. package/dist/cjs/components/credits/creditsRedeemList/RedeemProductModal/Address.js.map +3 -3
  25. package/dist/cjs/components/credits/creditsRedeemList/RedeemProductModal/ProductInfo.js +1 -1
  26. package/dist/cjs/components/credits/creditsRedeemList/RedeemProductModal/ProductInfo.js.map +2 -2
  27. package/dist/cjs/components/credits/creditsRedeemList/RedeemProductModal/Success.js +1 -1
  28. package/dist/cjs/components/credits/creditsRedeemList/RedeemProductModal/Success.js.map +3 -3
  29. package/dist/cjs/components/credits/creditsRedeemList/RedeemableItem.js +1 -1
  30. package/dist/cjs/components/credits/creditsRedeemList/RedeemableItem.js.map +2 -2
  31. package/dist/cjs/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.js +1 -1
  32. package/dist/cjs/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.js.map +3 -3
  33. package/dist/cjs/components/credits/creditsWaysToGetCredits/useActions.js +1 -1
  34. package/dist/cjs/components/credits/creditsWaysToGetCredits/useActions.js.map +2 -2
  35. package/dist/cjs/components/credits/modal/MyRewardsModal.js +1 -1
  36. package/dist/cjs/components/credits/modal/MyRewardsModal.js.map +2 -2
  37. package/dist/cjs/components/credits/modal/activitiesModal.js +1 -1
  38. package/dist/cjs/components/credits/modal/activitiesModal.js.map +2 -2
  39. package/dist/cjs/components/credits/modal/creditsUploadReceiptModal.js +1 -1
  40. package/dist/cjs/components/credits/modal/creditsUploadReceiptModal.js.map +3 -3
  41. package/dist/cjs/components/credits/modal/modalContainer.js +1 -1
  42. package/dist/cjs/components/credits/modal/modalContainer.js.map +3 -3
  43. package/dist/cjs/components/credits/modal/subscribeModal.js +1 -1
  44. package/dist/cjs/components/credits/modal/subscribeModal.js.map +3 -3
  45. package/dist/cjs/components/credits/modal/tip.js +1 -1
  46. package/dist/cjs/components/credits/modal/tip.js.map +3 -3
  47. package/dist/cjs/components/credits/type.d.ts +3 -2
  48. package/dist/cjs/components/credits/type.js +1 -1
  49. package/dist/cjs/components/credits/type.js.map +1 -1
  50. package/dist/cjs/components/registration/authCodeActivate/Message.js +1 -1
  51. package/dist/cjs/components/registration/authCodeActivate/Message.js.map +2 -2
  52. package/dist/cjs/components/registration/authCodeActivate/index.js +1 -1
  53. package/dist/cjs/components/registration/authCodeActivate/index.js.map +3 -3
  54. package/dist/cjs/components/registration/authCodeActivate/type.d.ts +0 -1
  55. package/dist/cjs/components/registration/authCodeActivate/type.js.map +1 -1
  56. package/dist/cjs/components/registration/context/provider.d.ts +2 -0
  57. package/dist/cjs/components/registration/context/provider.js +1 -1
  58. package/dist/cjs/components/registration/context/provider.js.map +3 -3
  59. package/dist/cjs/components/registration/modalContainer.d.ts +1 -2
  60. package/dist/cjs/components/registration/modalContainer.js +1 -1
  61. package/dist/cjs/components/registration/modalContainer.js.map +3 -3
  62. package/dist/cjs/templates/credits.d.ts +9 -8
  63. package/dist/cjs/templates/credits.js +1 -1
  64. package/dist/cjs/templates/credits.js.map +3 -3
  65. package/dist/esm/components/credits/context/provider.d.ts +2 -2
  66. package/dist/esm/components/credits/context/provider.js +1 -1
  67. package/dist/esm/components/credits/context/provider.js.map +3 -3
  68. package/dist/esm/components/credits/creditsBenefits/benefitItem.js +1 -1
  69. package/dist/esm/components/credits/creditsBenefits/benefitItem.js.map +3 -3
  70. package/dist/esm/components/credits/creditsBenefits/index.js +3 -3
  71. package/dist/esm/components/credits/creditsBenefits/index.js.map +3 -3
  72. package/dist/esm/components/credits/creditsCash/CreditsCash.js +1 -1
  73. package/dist/esm/components/credits/creditsCash/CreditsCash.js.map +3 -3
  74. package/dist/esm/components/credits/creditsFaq/index.js +1 -1
  75. package/dist/esm/components/credits/creditsFaq/index.js.map +3 -3
  76. package/dist/esm/components/credits/creditsInfoCard/index.d.ts +0 -2
  77. package/dist/esm/components/credits/creditsInfoCard/index.js +1 -1
  78. package/dist/esm/components/credits/creditsInfoCard/index.js.map +3 -3
  79. package/dist/esm/components/credits/creditsRedeemList/AddressForm/CountrySelect.js +1 -1
  80. package/dist/esm/components/credits/creditsRedeemList/AddressForm/CountrySelect.js.map +3 -3
  81. package/dist/esm/components/credits/creditsRedeemList/AddressForm/StateSelect.js +1 -1
  82. package/dist/esm/components/credits/creditsRedeemList/AddressForm/StateSelect.js.map +3 -3
  83. package/dist/esm/components/credits/creditsRedeemList/AddressForm/index.js +1 -1
  84. package/dist/esm/components/credits/creditsRedeemList/AddressForm/index.js.map +3 -3
  85. package/dist/esm/components/credits/creditsRedeemList/CreditsRedeemList.js +1 -1
  86. package/dist/esm/components/credits/creditsRedeemList/CreditsRedeemList.js.map +3 -3
  87. package/dist/esm/components/credits/creditsRedeemList/RedeemProductModal/Address.js +1 -1
  88. package/dist/esm/components/credits/creditsRedeemList/RedeemProductModal/Address.js.map +3 -3
  89. package/dist/esm/components/credits/creditsRedeemList/RedeemProductModal/ProductInfo.js +1 -1
  90. package/dist/esm/components/credits/creditsRedeemList/RedeemProductModal/ProductInfo.js.map +3 -3
  91. package/dist/esm/components/credits/creditsRedeemList/RedeemProductModal/Success.js +1 -1
  92. package/dist/esm/components/credits/creditsRedeemList/RedeemProductModal/Success.js.map +3 -3
  93. package/dist/esm/components/credits/creditsRedeemList/RedeemableItem.js +1 -1
  94. package/dist/esm/components/credits/creditsRedeemList/RedeemableItem.js.map +3 -3
  95. package/dist/esm/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.js +1 -1
  96. package/dist/esm/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.js.map +3 -3
  97. package/dist/esm/components/credits/creditsWaysToGetCredits/useActions.js +1 -1
  98. package/dist/esm/components/credits/creditsWaysToGetCredits/useActions.js.map +2 -2
  99. package/dist/esm/components/credits/modal/MyRewardsModal.js +1 -1
  100. package/dist/esm/components/credits/modal/MyRewardsModal.js.map +3 -3
  101. package/dist/esm/components/credits/modal/activitiesModal.js +1 -1
  102. package/dist/esm/components/credits/modal/activitiesModal.js.map +3 -3
  103. package/dist/esm/components/credits/modal/creditsUploadReceiptModal.js +1 -1
  104. package/dist/esm/components/credits/modal/creditsUploadReceiptModal.js.map +3 -3
  105. package/dist/esm/components/credits/modal/modalContainer.js +1 -1
  106. package/dist/esm/components/credits/modal/modalContainer.js.map +3 -3
  107. package/dist/esm/components/credits/modal/subscribeModal.js +1 -1
  108. package/dist/esm/components/credits/modal/subscribeModal.js.map +3 -3
  109. package/dist/esm/components/credits/modal/tip.js +1 -1
  110. package/dist/esm/components/credits/modal/tip.js.map +3 -3
  111. package/dist/esm/components/credits/type.d.ts +3 -2
  112. package/dist/esm/components/registration/authCodeActivate/Message.js +1 -1
  113. package/dist/esm/components/registration/authCodeActivate/Message.js.map +2 -2
  114. package/dist/esm/components/registration/authCodeActivate/index.js +1 -1
  115. package/dist/esm/components/registration/authCodeActivate/index.js.map +3 -3
  116. package/dist/esm/components/registration/authCodeActivate/type.d.ts +0 -1
  117. package/dist/esm/components/registration/context/provider.d.ts +2 -0
  118. package/dist/esm/components/registration/context/provider.js +1 -1
  119. package/dist/esm/components/registration/context/provider.js.map +3 -3
  120. package/dist/esm/components/registration/modalContainer.d.ts +1 -2
  121. package/dist/esm/components/registration/modalContainer.js +1 -1
  122. package/dist/esm/components/registration/modalContainer.js.map +3 -3
  123. package/dist/esm/templates/credits.d.ts +9 -8
  124. package/dist/esm/templates/credits.js +1 -1
  125. package/dist/esm/templates/credits.js.map +3 -3
  126. package/package.json +3 -3
  127. package/src/components/credits/context/provider.tsx +1 -4
  128. package/src/components/credits/creditsBenefits/benefitItem.tsx +2 -5
  129. package/src/components/credits/creditsBenefits/index.tsx +1 -4
  130. package/src/components/credits/creditsCash/CreditsCash.tsx +3 -6
  131. package/src/components/credits/creditsFaq/index.tsx +2 -3
  132. package/src/components/credits/creditsInfoCard/index.tsx +10 -12
  133. package/src/components/credits/creditsRedeemList/AddressForm/CountrySelect.tsx +3 -4
  134. package/src/components/credits/creditsRedeemList/AddressForm/StateSelect.tsx +2 -3
  135. package/src/components/credits/creditsRedeemList/AddressForm/index.tsx +2 -3
  136. package/src/components/credits/creditsRedeemList/CreditsRedeemList.tsx +2 -4
  137. package/src/components/credits/creditsRedeemList/RedeemProductModal/Address.tsx +2 -3
  138. package/src/components/credits/creditsRedeemList/RedeemProductModal/ProductInfo.tsx +6 -4
  139. package/src/components/credits/creditsRedeemList/RedeemProductModal/Success.tsx +2 -3
  140. package/src/components/credits/creditsRedeemList/RedeemableItem.tsx +2 -3
  141. package/src/components/credits/creditsWaysToGetCredits/CreditsWaysToGetCredits.tsx +5 -3
  142. package/src/components/credits/creditsWaysToGetCredits/useActions.ts +4 -1
  143. package/src/components/credits/modal/MyRewardsModal.tsx +2 -3
  144. package/src/components/credits/modal/activitiesModal.tsx +2 -3
  145. package/src/components/credits/modal/creditsUploadReceiptModal.tsx +2 -3
  146. package/src/components/credits/modal/modalContainer.tsx +2 -3
  147. package/src/components/credits/modal/subscribeModal.tsx +9 -32
  148. package/src/components/credits/modal/tip.tsx +2 -3
  149. package/src/components/credits/type.ts +3 -2
  150. package/src/components/registration/authCodeActivate/Message.tsx +1 -1
  151. package/src/components/registration/authCodeActivate/index.tsx +141 -109
  152. package/src/components/registration/authCodeActivate/type.ts +0 -1
  153. package/src/components/registration/context/provider.tsx +9 -0
  154. package/src/components/registration/modalContainer.tsx +9 -7
  155. package/src/templates/credits.tsx +41 -31
  156. package/src/components/credits/const.ts +0 -1
@@ -1,2 +1,2 @@
1
- import{jsx as n,jsxs as b}from"react/jsx-runtime";import{Button as O,Text as r}from"@anker-in/headless-ui";import{useSendEmailValidation as Q,gaTrack as I,classNames as D,useHeadlessContext as U,useEmailValidation as W,useCountDown as X}from"@anker-in/lib";import{useCallback as R,useEffect as p,useRef as Y,useState as m}from"react";import{Message as Z}from"./Message";import{useRegistration as ee}from"../context";const ce=({copy:t,autoSendEmail:A=!1})=>{const{locale:H}=U(),{email:o,authCodeActivate:L}=ee(),{activeToken:x,setActiveToken:V,setIsSendingActivateEmail:T,setIsActivateSuccess:$,onAuthSuccess:j}=L,{isMutating:B,trigger:F}=W(),{isMutating:h,trigger:g,data:v}=Q(),[P,k]=m(""),[y,C]=m(""),{startCountDown:S,startAction:z,countDown:K}=X(60),[M,l]=m(""),[_,c]=m(0),[s,E]=m(new Array(6).fill("")),N=Y([]),f=s.join("");p(()=>{N.current[_]&&N.current[_].focus()},[_]),p(()=>{v.active_token&&V(v.active_token)},[v]),p(()=>{T(h)},[h,T]),p(()=>{A&&o&&g({email:o,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}})},[A,o,g]);const q=R(async()=>{o&&(await g({email:o,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}},{onSuccess:()=>{C("success"),z()}}),I({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"sent_again"}}))},[o,g]),G=(d,e)=>{const{value:a}=d.target;if(l(""),Number.isNaN(Number(a)))return;if(a.length>1){e<s.length-1&&(s[e+1]||(c(e+1),E(u=>{const w=[...u];return w[e]=a[0],a.length>1&&(w[e+1]=a[1]),w})));return}const i=[...s];i[e]=a,E(i),a?e<s.length-1&&!s[e+1]&&c(e+1):e>0&&c(e-1)},J=R(async()=>{if(!f?.length){l(t?.codeEmptyError||"");return}if(f.length<6){l(t?.incorrectCodeError||"");return}x&&await F({token:x,code:f},{onSuccess:()=>{C("success"),k(t?.authSuccessMessage||""),$(!0),j?.()},onError:e=>{e?.errorCode==="104"||(e?.errorCode==="142"?l(t?.incorrectCodeError||"Invalid verification code."):e?.errorCode==="154"?l(t?.expiredCodeMessage||""):l(t?.sendEmailErrorMessage||""))}});let d=setTimeout(()=>{C(""),k(""),clearTimeout(d)},5e3);I({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"check_and_active"}})},[f,t?.codeEmptyError,t?.authSuccessMessage,t?.incorrectCodeError,t?.expiredCodeMessage,t?.sendEmailErrorMessage,H,x]);return b("div",{className:D("p-12 px-5 !pb-12 min-l:px-12"),children:[b("div",{children:[n(r,{className:"text-[22px] font-extrabold leading-[120%] text-[#333] min-l:text-[24px] [&_abbr]:text-[#005d8e]",html:t?.authCodeTitle}),n(r,{as:"p",className:"mt-3 text-[14px] font-semibold leading-[140%] text-[rgba(51,51,51,0.75)] min-l:text-base [&_abbr]:text-[#333]",html:t?.authCodeDesc?.replace("%email%",o||"")})]}),b("div",{className:"mt-6",children:[n(r,{className:"mt-4 text-[14px] !font-bold font-semibold leading-[140%] text-[#333] min-l:mt-6",html:t?.enterActiveCodeText}),n("div",{className:"my-3 flex justify-between",children:s.map((d,e)=>n("div",{className:"col-span-1 aspect-1 text-[#555]",children:n("input",{ref:a=>{a&&(N.current[e]=a)},type:"tel",className:"flex size-full items-center justify-center rounded-[12px] border border-[#333333]/20 bg-[#EEEEEE] text-center text-[24px] font-medium focus:border-[#333]/50 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none [&:focus-visible]:outline-none",value:d,autoComplete:"false",autoCorrect:"false",spellCheck:"false",autoCapitalize:"false",onChange:a=>G(a,e),onFocus:()=>{c(e)},onPaste:a=>{const i=a.clipboardData.getData("text");if(!Number.isNaN(Number(i))){const u=i.split("").slice(0,6);E(u.concat(Array(6-u.length).fill(""))),u.length<=s.length&&c(u.length-1)}},onKeyDown:a=>{const{value:i}=a.target;a.key==="Backspace"&&!i&&e>0&&c(e-1)}},e)},e))}),M&&n(r,{className:"mb-3 text-[14px] font-semibold leading-[120%] text-[#f84d4f]",html:M}),t?.authCodeContent&&n("ul",{className:'flex flex-col gap-1 [&_li]:flex [&_li]:gap-2 [&_li]:text-[14px] [&_li]:font-semibold [&_li]:leading-[120%] [&_li]:text-[rgba(51,51,51,0.55)] [&_li]:before:content-["\u2022"]',dangerouslySetInnerHTML:{__html:t?.authCodeContent}})]}),b("div",{className:"mt-4 min-l:mt-6",children:[n(r,{className:"text-base font-semibold leading-[100%] text-[#333]",html:t?.authCodeReceiveText})," ",S?n(r,{html:t?.retrieveText?.replace("%countdownTime%",K.toString()),className:"cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline"}):n(r,{onClick:q,className:D("cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline",{"pointer-events-none":S||h}),html:t?.sendAgainText}),n(O,{type:"submit",loading:B,className:"mt-6 flex h-[54px] w-full cursor-pointer items-center justify-center rounded-[40px] px-8 py-[15px] text-center text-base font-bold leading-[100%] text-white min-l:mt-8",onClick:J,children:t.buttonText})]}),n(Z,{status:y,message:P})]})};export{ce as AuthCodeActivate};
1
+ import{jsx as n,jsxs as C}from"react/jsx-runtime";import{Button as W,Text as r}from"@anker-in/headless-ui";import{useSendEmailValidation as X,gaTrack as H,classNames as L,useHeadlessContext as Y,useEmailValidation as Z,useCountDown as y,ROUNDED_BRANDS as ee}from"@anker-in/lib";import{useCallback as V,useEffect as x,useRef as te,useState as f}from"react";import{Message as ae}from"./Message";import{useRegistration as ne}from"../context";import{RegistrationModalContainer as se}from"../modalContainer";const fe=({copy:t})=>{const{locale:B,brand:$}=Y(),{email:o,authCodeActivate:p}=ne(),F=ee.includes($),{activeToken:v,setActiveToken:O,setIsSendingActivateEmail:A,setIsActivateSuccess:P,onAuthSuccess:M,autoSendEmail:k}=p,{isMutating:j,trigger:z}=Z(),{isMutating:E,trigger:b,data:_}=X(),[K,l]=f(""),[U,c]=f(""),{startCountDown:D,startAction:I,countDown:q}=y(60),[R,u]=f(""),[N,d]=f(0),[s,w]=f(new Array(6).fill("")),S=te([]),h=s.join("");x(()=>{S.current[N]&&S.current[N].focus()},[N]),x(()=>{_?.data?.data?.active_token&&O(_.data.data.active_token)},[_?.data?.data?.active_token]),x(()=>{A(E)},[E,A]),x(()=>{k&&o&&b({email:o,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}},{onSuccess:()=>{c("success"),l(t?.sendEmailSuccessMessage||""),I(),setTimeout(()=>{c(""),l("")},5e3)}})},[k,o,b]);const G=V(async()=>{o&&(await b({email:o,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}},{onSuccess:()=>{c("success"),l(t?.sendEmailSuccessMessage||""),I(),setTimeout(()=>{c(""),l("")},5e3)}}),H({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"sent_again"}}))},[o,b]),J=(g,e)=>{const{value:a}=g.target;if(u(""),Number.isNaN(Number(a)))return;if(a.length>1){e<s.length-1&&(s[e+1]||(d(e+1),w(m=>{const T=[...m];return T[e]=a[0],a.length>1&&(T[e+1]=a[1]),T})));return}const i=[...s];i[e]=a,w(i),a?e<s.length-1&&!s[e+1]&&d(e+1):e>0&&d(e-1)},Q=V(async()=>{if(!h?.length){u(t?.codeEmptyError||"");return}if(h.length<6){u(t?.incorrectCodeError||"");return}v&&await z({token:v,code:h},{onSuccess:()=>{c("success"),l(t?.authSuccessMessage||""),P(!0),M?M():setTimeout(()=>{p.close()},3e3)},onError:e=>{e?.errorCode==="104"||(e?.errorCode==="142"?u(t?.incorrectCodeError||"Invalid verification code."):e?.errorCode==="154"?u(t?.expiredCodeMessage||""):u(t?.sendEmailErrorMessage||""))}});let g=setTimeout(()=>{c(""),l(""),clearTimeout(g)},5e3);H({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"check_and_active"}})},[h,t?.codeEmptyError,t?.authSuccessMessage,t?.incorrectCodeError,t?.expiredCodeMessage,t?.sendEmailErrorMessage,B,v]);return n(se,{isOpen:p.isOpen,onClose:p.close,children:C("div",{className:"relative",children:[C("div",{children:[n(r,{className:"text-[22px] font-extrabold leading-[120%] text-[#333] min-l:text-[24px] [&_abbr]:text-[#005d8e]",html:t?.authCodeTitle}),n(r,{as:"p",className:"mt-3 text-[14px] font-semibold leading-[140%] text-[rgba(51,51,51,0.75)] min-l:text-base [&_abbr]:text-[#333]",html:t?.authCodeDesc?.replace("%email%",o||"")})]}),C("div",{className:"mt-6",children:[n(r,{className:"mt-4 text-[14px] !font-bold font-semibold leading-[140%] text-[#333] min-l:mt-6",html:t?.enterActiveCodeText}),n("div",{className:"my-3 grid grid-cols-6 gap-2",children:s.map((g,e)=>n("div",{className:"col-span-1 aspect-1 text-[#555]",children:n("input",{ref:a=>{a&&(S.current[e]=a)},type:"tel",className:L("flex size-full items-center justify-center border border-[#333333]/20 bg-[#EEEEEE] text-center text-[24px] font-medium focus:border-[#333]/50 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none [&:focus-visible]:outline-none",F&&"rounded-[12px]"),value:g,autoComplete:"false",autoCorrect:"false",spellCheck:"false",autoCapitalize:"false",onChange:a=>J(a,e),onFocus:()=>{d(e)},onPaste:a=>{const i=a.clipboardData.getData("text");if(!Number.isNaN(Number(i))){const m=i.split("").slice(0,6);w(m.concat(Array(6-m.length).fill(""))),m.length<=s.length&&d(m.length-1)}},onKeyDown:a=>{const{value:i}=a.target;a.key==="Backspace"&&!i&&e>0&&d(e-1)}},e)},e))}),R&&n(r,{className:"mb-3 text-[14px] font-semibold leading-[120%] text-[#f84d4f]",html:R}),t?.authCodeContent&&n("ul",{className:'flex flex-col gap-1 [&_li]:flex [&_li]:gap-2 [&_li]:text-[14px] [&_li]:font-semibold [&_li]:leading-[120%] [&_li]:text-[rgba(51,51,51,0.55)] [&_li]:before:content-["\u2022"]',dangerouslySetInnerHTML:{__html:t?.authCodeContent}})]}),C("div",{className:"mt-4 min-l:mt-6",children:[n(r,{className:"text-base font-semibold leading-[100%] text-[#333]",html:t?.authCodeReceiveText})," ",D?n(r,{html:t?.retrieveText?.replace("%countdownTime%",q.toString()),className:"cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline"}):n(r,{onClick:G,className:L("cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline",{"pointer-events-none":D||E}),html:t?.sendAgainText}),n(W,{type:"submit",loading:j,className:"mt-6 flex h-[54px] w-full cursor-pointer items-center justify-center px-8 py-[15px] text-center text-base font-bold leading-[100%] text-white min-l:mt-8",onClick:Q,children:t.buttonText})]}),n(ae,{status:U,message:K})]})})};export{fe as AuthCodeActivate};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/components/registration/authCodeActivate/index.tsx"],
4
- "sourcesContent": ["import { Button, Text } from '@anker-in/headless-ui'\nimport {\n useSendEmailValidation,\n gaTrack,\n classNames as cn,\n useHeadlessContext,\n useEmailValidation,\n useCountDown,\n} from '@anker-in/lib'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { Message } from './Message'\nimport { AuthCodeActivateProps } from './type'\nimport { useRegistration } from '../context'\n\nexport const AuthCodeActivate: React.FC<AuthCodeActivateProps> = ({ copy, autoSendEmail = false }) => {\n const { locale } = useHeadlessContext()\n const { email, authCodeActivate } = useRegistration()\n\n const { activeToken, setActiveToken, setIsSendingActivateEmail, setIsActivateSuccess, onAuthSuccess } =\n authCodeActivate\n\n const { isMutating: emailValidationLoading, trigger: triggerEmailValidation } = useEmailValidation()\n\n const {\n isMutating: isSendingEmail,\n trigger: triggerSendValidationEmail,\n data: sendEmailData,\n } = useSendEmailValidation()\n\n const [messageText, setMessageText] = useState('')\n const [resendStatus, setResendStatus] = useState('')\n const { startCountDown, startAction, countDown } = useCountDown(60)\n\n const [error, setError] = useState('')\n const [focusIndex, setFocusIndex] = useState(0)\n const [codeArray, setCodeArray] = useState(new Array(6).fill(''))\n\n const inputRefs = useRef<HTMLInputElement[]>([])\n const code = codeArray.join('')\n\n useEffect(() => {\n if (inputRefs.current[focusIndex]) {\n inputRefs.current[focusIndex].focus()\n }\n }, [focusIndex])\n\n useEffect(() => {\n if (sendEmailData.active_token) {\n setActiveToken(sendEmailData.active_token)\n }\n }, [sendEmailData])\n\n useEffect(() => {\n setIsSendingActivateEmail(isSendingEmail)\n }, [isSendingEmail, setIsSendingActivateEmail])\n\n // \u81EA\u52A8\u53D1\u9001\u90AE\u7BB1\u9A8C\u8BC1\u7801\n useEffect(() => {\n if (autoSendEmail && email) {\n triggerSendValidationEmail({\n email: email,\n data: {\n redirect_url: `${window?.location?.origin}${window?.location?.pathname}`,\n },\n })\n }\n }, [autoSendEmail, email, triggerSendValidationEmail])\n\n const handleSendAgain = useCallback(async () => {\n if (!email) return\n // \u53D1\u8D77\u7F51\u7EDC\u8BF7\u6C42\n await triggerSendValidationEmail(\n {\n email: email,\n data: {\n redirect_url: `${window?.location?.origin}${window?.location?.pathname}`,\n },\n },\n {\n onSuccess: () => {\n setResendStatus('success')\n startAction()\n },\n }\n )\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n page_group: 'reg_sub_pop',\n position: 'auth_code',\n button_name: 'sent_again',\n },\n })\n }, [email, triggerSendValidationEmail])\n\n const handleInputCodeChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {\n const { value } = event.target\n\n setError('')\n\n if (Number.isNaN(Number(value))) {\n return\n }\n\n if (value.length > 1) {\n if (index < codeArray.length - 1) {\n if (!codeArray[index + 1]) {\n setFocusIndex(index + 1)\n setCodeArray(old => {\n const newCode = [...old]\n newCode[index] = value[0]\n if (value.length > 1) {\n newCode[index + 1] = value[1]\n }\n return newCode\n })\n }\n }\n return\n }\n const newCode = [...codeArray]\n newCode[index] = value\n setCodeArray(newCode)\n if (value) {\n if (index < codeArray.length - 1 && !codeArray[index + 1]) {\n setFocusIndex(index + 1)\n }\n } else if (index > 0) {\n setFocusIndex(index - 1)\n }\n }\n\n const handleAuthCodeSubmit = useCallback(async () => {\n if (!code?.length) {\n setError(copy?.codeEmptyError || '')\n return\n }\n\n if (code.length < 6) {\n setError(copy?.incorrectCodeError || '')\n return\n }\n\n if (activeToken) {\n await triggerEmailValidation(\n {\n token: activeToken,\n code: code,\n },\n {\n onSuccess: () => {\n setResendStatus('success')\n setMessageText(copy?.authSuccessMessage || '')\n setIsActivateSuccess(true)\n onAuthSuccess?.()\n },\n onError: (err: any) => {\n if (err?.errorCode === '104') {\n } else if (err?.errorCode === '142') {\n setError(copy?.incorrectCodeError || 'Invalid verification code.')\n } else if (err?.errorCode === '154') {\n setError(copy?.expiredCodeMessage || '')\n } else {\n setError(copy?.sendEmailErrorMessage || '')\n }\n },\n }\n )\n }\n\n // \u8BBE\u7F6E\u5B9A\u65F6\u5668\u6E05\u9664\u72B6\u6001\u4FE1\u606F\n let timer = setTimeout(() => {\n setResendStatus('')\n setMessageText('')\n clearTimeout(timer)\n }, 5000)\n\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n page_group: 'reg_sub_pop',\n position: 'auth_code',\n button_name: 'check_and_active',\n },\n })\n }, [\n code,\n copy?.codeEmptyError,\n copy?.authSuccessMessage,\n copy?.incorrectCodeError,\n copy?.expiredCodeMessage,\n copy?.sendEmailErrorMessage,\n locale,\n activeToken,\n ])\n\n return (\n <div className={cn('p-12 px-5 !pb-12 min-l:px-12')}>\n <div>\n <Text\n className=\"text-[22px] font-extrabold leading-[120%] text-[#333] min-l:text-[24px] [&_abbr]:text-[#005d8e]\"\n html={copy?.authCodeTitle}\n />\n <Text\n as=\"p\"\n className=\"mt-3 text-[14px] font-semibold leading-[140%] text-[rgba(51,51,51,0.75)] min-l:text-base [&_abbr]:text-[#333]\"\n html={copy?.authCodeDesc?.replace('%email%', email || '')}\n />\n </div>\n <div className=\"mt-6\">\n <Text\n className=\"mt-4 text-[14px] !font-bold font-semibold leading-[140%] text-[#333] min-l:mt-6\"\n html={copy?.enterActiveCodeText}\n />\n <div className=\"my-3 flex justify-between\">\n {codeArray.map((item, index) => (\n <div key={index} className=\"col-span-1 aspect-1 text-[#555]\">\n <input\n ref={inputRef => {\n if (inputRef) {\n inputRefs.current[index] = inputRef\n }\n }}\n key={index}\n type=\"tel\"\n className=\"flex size-full items-center justify-center rounded-[12px] border border-[#333333]/20 bg-[#EEEEEE] text-center text-[24px] font-medium focus:border-[#333]/50 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none [&:focus-visible]:outline-none\"\n value={item}\n autoComplete=\"false\"\n autoCorrect=\"false\"\n spellCheck=\"false\"\n autoCapitalize=\"false\"\n onChange={event => handleInputCodeChange(event, index)}\n onFocus={() => {\n setFocusIndex(index)\n }}\n onPaste={event => {\n const paste = event.clipboardData.getData('text')\n if (!Number.isNaN(Number(paste))) {\n const pastedCode = paste.split('').slice(0, 6)\n setCodeArray(pastedCode.concat(Array(6 - pastedCode.length).fill('')))\n if (pastedCode.length <= codeArray.length) {\n setFocusIndex(pastedCode.length - 1)\n }\n }\n }}\n onKeyDown={event => {\n const { value } = event.target as HTMLInputElement\n if (event.key === 'Backspace' && !value && index > 0) {\n setFocusIndex(index - 1)\n }\n }}\n />\n </div>\n ))}\n </div>\n\n {error && <Text className=\"mb-3 text-[14px] font-semibold leading-[120%] text-[#f84d4f]\" html={error} />}\n {copy?.authCodeContent && (\n <ul\n className='flex flex-col gap-1 [&_li]:flex [&_li]:gap-2 [&_li]:text-[14px] [&_li]:font-semibold [&_li]:leading-[120%] [&_li]:text-[rgba(51,51,51,0.55)] [&_li]:before:content-[\"\u2022\"]'\n dangerouslySetInnerHTML={{ __html: copy?.authCodeContent }}\n />\n )}\n </div>\n <div className=\"mt-4 min-l:mt-6\">\n <Text className=\"text-base font-semibold leading-[100%] text-[#333]\" html={copy?.authCodeReceiveText} />{' '}\n {startCountDown ? (\n <Text\n html={copy?.retrieveText?.replace('%countdownTime%', countDown.toString())}\n className=\"cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline\"\n />\n ) : (\n <Text\n onClick={handleSendAgain}\n className={cn(\n 'cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline',\n {\n 'pointer-events-none': startCountDown || isSendingEmail,\n }\n )}\n html={copy?.sendAgainText}\n />\n )}\n <Button\n type=\"submit\"\n loading={emailValidationLoading}\n className=\"mt-6 flex h-[54px] w-full cursor-pointer items-center justify-center rounded-[40px] px-8 py-[15px] text-center text-base font-bold leading-[100%] text-white min-l:mt-8\"\n onClick={handleAuthCodeSubmit}\n >\n {copy.buttonText}\n </Button>\n </div>\n <Message status={resendStatus} message={messageText} />\n </div>\n )\n}\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "Button", "Text", "useSendEmailValidation", "gaTrack", "cn", "useHeadlessContext", "useEmailValidation", "useCountDown", "useCallback", "useEffect", "useRef", "useState", "Message", "useRegistration", "AuthCodeActivate", "copy", "autoSendEmail", "locale", "email", "authCodeActivate", "activeToken", "setActiveToken", "setIsSendingActivateEmail", "setIsActivateSuccess", "onAuthSuccess", "emailValidationLoading", "triggerEmailValidation", "isSendingEmail", "triggerSendValidationEmail", "sendEmailData", "messageText", "setMessageText", "resendStatus", "setResendStatus", "startCountDown", "startAction", "countDown", "error", "setError", "focusIndex", "setFocusIndex", "codeArray", "setCodeArray", "inputRefs", "code", "handleSendAgain", "handleInputCodeChange", "event", "index", "value", "old", "newCode", "handleAuthCodeSubmit", "err", "timer", "item", "inputRef", "paste", "pastedCode"]
4
+ "sourcesContent": ["import { Button, Text } from '@anker-in/headless-ui'\nimport {\n useSendEmailValidation,\n gaTrack,\n classNames as cn,\n useHeadlessContext,\n useEmailValidation,\n useCountDown,\n ROUNDED_BRANDS,\n} from '@anker-in/lib'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { Message } from './Message'\nimport { AuthCodeActivateProps } from './type'\nimport { useRegistration } from '../context'\nimport { RegistrationModalContainer } from '../modalContainer'\n\nexport const AuthCodeActivate: React.FC<AuthCodeActivateProps> = ({ copy }) => {\n const { locale, brand } = useHeadlessContext()\n const { email, authCodeActivate } = useRegistration()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n const { activeToken, setActiveToken, setIsSendingActivateEmail, setIsActivateSuccess, onAuthSuccess, autoSendEmail } =\n authCodeActivate\n\n const { isMutating: emailValidationLoading, trigger: triggerEmailValidation } = useEmailValidation()\n\n const {\n isMutating: isSendingEmail,\n trigger: triggerSendValidationEmail,\n data: sendEmailData,\n } = useSendEmailValidation()\n\n const [messageText, setMessageText] = useState('')\n const [messageStatus, setMessageStatus] = useState('')\n const { startCountDown: isStartCountDown, startAction: startCountDown, countDown } = useCountDown(60)\n\n const [error, setError] = useState('')\n const [focusIndex, setFocusIndex] = useState(0)\n const [codeArray, setCodeArray] = useState(new Array(6).fill(''))\n\n const inputRefs = useRef<HTMLInputElement[]>([])\n const code = codeArray.join('')\n\n useEffect(() => {\n if (inputRefs.current[focusIndex]) {\n inputRefs.current[focusIndex].focus()\n }\n }, [focusIndex])\n\n useEffect(() => {\n if (sendEmailData?.data?.data?.active_token) {\n setActiveToken(sendEmailData.data.data.active_token)\n }\n }, [sendEmailData?.data?.data?.active_token])\n\n useEffect(() => {\n setIsSendingActivateEmail(isSendingEmail)\n }, [isSendingEmail, setIsSendingActivateEmail])\n\n // \u81EA\u52A8\u53D1\u9001\u90AE\u7BB1\u9A8C\u8BC1\u7801\n useEffect(() => {\n if (autoSendEmail && email) {\n triggerSendValidationEmail(\n {\n email: email,\n data: {\n redirect_url: `${window?.location?.origin}${window?.location?.pathname}`,\n },\n },\n {\n onSuccess: () => {\n setMessageStatus('success')\n setMessageText(copy?.sendEmailSuccessMessage || '')\n startCountDown()\n setTimeout(() => {\n setMessageStatus('')\n setMessageText('')\n }, 5000)\n },\n }\n )\n }\n }, [autoSendEmail, email, triggerSendValidationEmail])\n\n const handleSendAgain = useCallback(async () => {\n if (!email) return\n // \u53D1\u8D77\u7F51\u7EDC\u8BF7\u6C42\n await triggerSendValidationEmail(\n {\n email: email,\n data: {\n redirect_url: `${window?.location?.origin}${window?.location?.pathname}`,\n },\n },\n {\n onSuccess: () => {\n setMessageStatus('success')\n setMessageText(copy?.sendEmailSuccessMessage || '')\n startCountDown()\n setTimeout(() => {\n setMessageStatus('')\n setMessageText('')\n }, 5000)\n },\n }\n )\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n page_group: 'reg_sub_pop',\n position: 'auth_code',\n button_name: 'sent_again',\n },\n })\n }, [email, triggerSendValidationEmail])\n\n const handleInputCodeChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {\n const { value } = event.target\n\n setError('')\n\n if (Number.isNaN(Number(value))) {\n return\n }\n\n if (value.length > 1) {\n if (index < codeArray.length - 1) {\n if (!codeArray[index + 1]) {\n setFocusIndex(index + 1)\n setCodeArray(old => {\n const newCode = [...old]\n newCode[index] = value[0]\n if (value.length > 1) {\n newCode[index + 1] = value[1]\n }\n return newCode\n })\n }\n }\n return\n }\n const newCode = [...codeArray]\n newCode[index] = value\n setCodeArray(newCode)\n if (value) {\n if (index < codeArray.length - 1 && !codeArray[index + 1]) {\n setFocusIndex(index + 1)\n }\n } else if (index > 0) {\n setFocusIndex(index - 1)\n }\n }\n\n const handleAuthCodeSubmit = useCallback(async () => {\n if (!code?.length) {\n setError(copy?.codeEmptyError || '')\n return\n }\n\n if (code.length < 6) {\n setError(copy?.incorrectCodeError || '')\n return\n }\n\n if (activeToken) {\n await triggerEmailValidation(\n {\n token: activeToken,\n code: code,\n },\n {\n onSuccess: () => {\n setMessageStatus('success')\n setMessageText(copy?.authSuccessMessage || '')\n setIsActivateSuccess(true)\n if (onAuthSuccess) {\n onAuthSuccess()\n } else {\n setTimeout(() => {\n authCodeActivate.close()\n }, 3000)\n }\n },\n onError: (err: any) => {\n if (err?.errorCode === '104') {\n } else if (err?.errorCode === '142') {\n setError(copy?.incorrectCodeError || 'Invalid verification code.')\n } else if (err?.errorCode === '154') {\n setError(copy?.expiredCodeMessage || '')\n } else {\n setError(copy?.sendEmailErrorMessage || '')\n }\n },\n }\n )\n }\n\n // \u8BBE\u7F6E\u5B9A\u65F6\u5668\u6E05\u9664\u72B6\u6001\u4FE1\u606F\n let timer = setTimeout(() => {\n setMessageStatus('')\n setMessageText('')\n clearTimeout(timer)\n }, 5000)\n\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n page_group: 'reg_sub_pop',\n position: 'auth_code',\n button_name: 'check_and_active',\n },\n })\n }, [\n code,\n copy?.codeEmptyError,\n copy?.authSuccessMessage,\n copy?.incorrectCodeError,\n copy?.expiredCodeMessage,\n copy?.sendEmailErrorMessage,\n locale,\n activeToken,\n ])\n\n return (\n <RegistrationModalContainer isOpen={authCodeActivate.isOpen} onClose={authCodeActivate.close}>\n <div className=\"relative\">\n <div>\n <Text\n className=\"text-[22px] font-extrabold leading-[120%] text-[#333] min-l:text-[24px] [&_abbr]:text-[#005d8e]\"\n html={copy?.authCodeTitle}\n />\n <Text\n as=\"p\"\n className=\"mt-3 text-[14px] font-semibold leading-[140%] text-[rgba(51,51,51,0.75)] min-l:text-base [&_abbr]:text-[#333]\"\n html={copy?.authCodeDesc?.replace('%email%', email || '')}\n />\n </div>\n <div className=\"mt-6\">\n <Text\n className=\"mt-4 text-[14px] !font-bold font-semibold leading-[140%] text-[#333] min-l:mt-6\"\n html={copy?.enterActiveCodeText}\n />\n <div className=\"my-3 grid grid-cols-6 gap-2\">\n {codeArray.map((item, index) => (\n <div key={index} className=\"col-span-1 aspect-1 text-[#555]\">\n <input\n ref={inputRef => {\n if (inputRef) {\n inputRefs.current[index] = inputRef\n }\n }}\n key={index}\n type=\"tel\"\n className={cn(\n 'flex size-full items-center justify-center border border-[#333333]/20 bg-[#EEEEEE] text-center text-[24px] font-medium focus:border-[#333]/50 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none [&:focus-visible]:outline-none',\n rounded && 'rounded-[12px]'\n )}\n value={item}\n autoComplete=\"false\"\n autoCorrect=\"false\"\n spellCheck=\"false\"\n autoCapitalize=\"false\"\n onChange={event => handleInputCodeChange(event, index)}\n onFocus={() => {\n setFocusIndex(index)\n }}\n onPaste={event => {\n const paste = event.clipboardData.getData('text')\n if (!Number.isNaN(Number(paste))) {\n const pastedCode = paste.split('').slice(0, 6)\n setCodeArray(pastedCode.concat(Array(6 - pastedCode.length).fill('')))\n if (pastedCode.length <= codeArray.length) {\n setFocusIndex(pastedCode.length - 1)\n }\n }\n }}\n onKeyDown={event => {\n const { value } = event.target as HTMLInputElement\n if (event.key === 'Backspace' && !value && index > 0) {\n setFocusIndex(index - 1)\n }\n }}\n />\n </div>\n ))}\n </div>\n\n {error && <Text className=\"mb-3 text-[14px] font-semibold leading-[120%] text-[#f84d4f]\" html={error} />}\n {copy?.authCodeContent && (\n <ul\n className='flex flex-col gap-1 [&_li]:flex [&_li]:gap-2 [&_li]:text-[14px] [&_li]:font-semibold [&_li]:leading-[120%] [&_li]:text-[rgba(51,51,51,0.55)] [&_li]:before:content-[\"\u2022\"]'\n dangerouslySetInnerHTML={{ __html: copy?.authCodeContent }}\n />\n )}\n </div>\n <div className=\"mt-4 min-l:mt-6\">\n <Text className=\"text-base font-semibold leading-[100%] text-[#333]\" html={copy?.authCodeReceiveText} />{' '}\n {isStartCountDown ? (\n <Text\n html={copy?.retrieveText?.replace('%countdownTime%', countDown.toString())}\n className=\"cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline\"\n />\n ) : (\n <Text\n onClick={handleSendAgain}\n className={cn(\n 'cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline',\n {\n 'pointer-events-none': isStartCountDown || isSendingEmail,\n }\n )}\n html={copy?.sendAgainText}\n />\n )}\n <Button\n type=\"submit\"\n loading={emailValidationLoading}\n className=\"mt-6 flex h-[54px] w-full cursor-pointer items-center justify-center px-8 py-[15px] text-center text-base font-bold leading-[100%] text-white min-l:mt-8\"\n onClick={handleAuthCodeSubmit}\n >\n {copy.buttonText}\n </Button>\n </div>\n <Message status={messageStatus} message={messageText} />\n </div>\n </RegistrationModalContainer>\n )\n}\n"],
5
+ "mappings": "AAoOQ,OACE,OAAAA,EADF,QAAAC,MAAA,oBApOR,OAAS,UAAAC,EAAQ,QAAAC,MAAY,wBAC7B,OACE,0BAAAC,EACA,WAAAC,EACA,cAAcC,EACd,sBAAAC,EACA,sBAAAC,EACA,gBAAAC,EACA,kBAAAC,OACK,gBACP,OAAgB,eAAAC,EAAa,aAAAC,EAAW,UAAAC,GAAQ,YAAAC,MAAgB,QAChE,OAAS,WAAAC,OAAe,YAExB,OAAS,mBAAAC,OAAuB,aAChC,OAAS,8BAAAC,OAAkC,oBAEpC,MAAMC,GAAoD,CAAC,CAAE,KAAAC,CAAK,IAAM,CAC7E,KAAM,CAAE,OAAAC,EAAQ,MAAAC,CAAM,EAAId,EAAmB,EACvC,CAAE,MAAAe,EAAO,iBAAAC,CAAiB,EAAIP,GAAgB,EAC9CQ,EAAUd,GAAe,SAASW,CAAK,EAEvC,CAAE,YAAAI,EAAa,eAAAC,EAAgB,0BAAAC,EAA2B,qBAAAC,EAAsB,cAAAC,EAAe,cAAAC,CAAc,EACjHP,EAEI,CAAE,WAAYQ,EAAwB,QAASC,CAAuB,EAAIxB,EAAmB,EAE7F,CACJ,WAAYyB,EACZ,QAASC,EACT,KAAMC,CACR,EAAI/B,EAAuB,EAErB,CAACgC,EAAaC,CAAc,EAAIvB,EAAS,EAAE,EAC3C,CAACwB,EAAeC,CAAgB,EAAIzB,EAAS,EAAE,EAC/C,CAAE,eAAgB0B,EAAkB,YAAaC,EAAgB,UAAAC,CAAU,EAAIjC,EAAa,EAAE,EAE9F,CAACkC,EAAOC,CAAQ,EAAI9B,EAAS,EAAE,EAC/B,CAAC+B,EAAYC,CAAa,EAAIhC,EAAS,CAAC,EACxC,CAACiC,EAAWC,CAAY,EAAIlC,EAAS,IAAI,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,EAE1DmC,EAAYpC,GAA2B,CAAC,CAAC,EACzCqC,EAAOH,EAAU,KAAK,EAAE,EAE9BnC,EAAU,IAAM,CACVqC,EAAU,QAAQJ,CAAU,GAC9BI,EAAU,QAAQJ,CAAU,EAAE,MAAM,CAExC,EAAG,CAACA,CAAU,CAAC,EAEfjC,EAAU,IAAM,CACVuB,GAAe,MAAM,MAAM,cAC7BT,EAAeS,EAAc,KAAK,KAAK,YAAY,CAEvD,EAAG,CAACA,GAAe,MAAM,MAAM,YAAY,CAAC,EAE5CvB,EAAU,IAAM,CACde,EAA0BM,CAAc,CAC1C,EAAG,CAACA,EAAgBN,CAAyB,CAAC,EAG9Cf,EAAU,IAAM,CACVkB,GAAiBR,GACnBY,EACE,CACE,MAAOZ,EACP,KAAM,CACJ,aAAc,GAAG,QAAQ,UAAU,MAAM,GAAG,QAAQ,UAAU,QAAQ,EACxE,CACF,EACA,CACE,UAAW,IAAM,CACfiB,EAAiB,SAAS,EAC1BF,EAAelB,GAAM,yBAA2B,EAAE,EAClDsB,EAAe,EACf,WAAW,IAAM,CACfF,EAAiB,EAAE,EACnBF,EAAe,EAAE,CACnB,EAAG,GAAI,CACT,CACF,CACF,CAEJ,EAAG,CAACP,EAAeR,EAAOY,CAA0B,CAAC,EAErD,MAAMiB,EAAkBxC,EAAY,SAAY,CACzCW,IAEL,MAAMY,EACJ,CACE,MAAOZ,EACP,KAAM,CACJ,aAAc,GAAG,QAAQ,UAAU,MAAM,GAAG,QAAQ,UAAU,QAAQ,EACxE,CACF,EACA,CACE,UAAW,IAAM,CACfiB,EAAiB,SAAS,EAC1BF,EAAelB,GAAM,yBAA2B,EAAE,EAClDsB,EAAe,EACf,WAAW,IAAM,CACfF,EAAiB,EAAE,EACnBF,EAAe,EAAE,CACnB,EAAG,GAAI,CACT,CACF,CACF,EACAhC,EAAQ,CACN,MAAO,WACP,WAAY,YACZ,iBAAkB,CAChB,WAAY,cACZ,SAAU,YACV,YAAa,YACf,CACF,CAAC,EACH,EAAG,CAACiB,EAAOY,CAA0B,CAAC,EAEhCkB,EAAwB,CAACC,EAA4CC,IAAkB,CAC3F,KAAM,CAAE,MAAAC,CAAM,EAAIF,EAAM,OAIxB,GAFAT,EAAS,EAAE,EAEP,OAAO,MAAM,OAAOW,CAAK,CAAC,EAC5B,OAGF,GAAIA,EAAM,OAAS,EAAG,CAChBD,EAAQP,EAAU,OAAS,IACxBA,EAAUO,EAAQ,CAAC,IACtBR,EAAcQ,EAAQ,CAAC,EACvBN,EAAaQ,GAAO,CAClB,MAAMC,EAAU,CAAC,GAAGD,CAAG,EACvB,OAAAC,EAAQH,CAAK,EAAIC,EAAM,CAAC,EACpBA,EAAM,OAAS,IACjBE,EAAQH,EAAQ,CAAC,EAAIC,EAAM,CAAC,GAEvBE,CACT,CAAC,IAGL,MACF,CACA,MAAMA,EAAU,CAAC,GAAGV,CAAS,EAC7BU,EAAQH,CAAK,EAAIC,EACjBP,EAAaS,CAAO,EAChBF,EACED,EAAQP,EAAU,OAAS,GAAK,CAACA,EAAUO,EAAQ,CAAC,GACtDR,EAAcQ,EAAQ,CAAC,EAEhBA,EAAQ,GACjBR,EAAcQ,EAAQ,CAAC,CAE3B,EAEMI,EAAuB/C,EAAY,SAAY,CACnD,GAAI,CAACuC,GAAM,OAAQ,CACjBN,EAASzB,GAAM,gBAAkB,EAAE,EACnC,MACF,CAEA,GAAI+B,EAAK,OAAS,EAAG,CACnBN,EAASzB,GAAM,oBAAsB,EAAE,EACvC,MACF,CAEIM,GACF,MAAMO,EACJ,CACE,MAAOP,EACP,KAAMyB,CACR,EACA,CACE,UAAW,IAAM,CACfX,EAAiB,SAAS,EAC1BF,EAAelB,GAAM,oBAAsB,EAAE,EAC7CS,EAAqB,EAAI,EACrBC,EACFA,EAAc,EAEd,WAAW,IAAM,CACfN,EAAiB,MAAM,CACzB,EAAG,GAAI,CAEX,EACA,QAAUoC,GAAa,CACjBA,GAAK,YAAc,QACZA,GAAK,YAAc,MAC5Bf,EAASzB,GAAM,oBAAsB,4BAA4B,EACxDwC,GAAK,YAAc,MAC5Bf,EAASzB,GAAM,oBAAsB,EAAE,EAEvCyB,EAASzB,GAAM,uBAAyB,EAAE,EAE9C,CACF,CACF,EAIF,IAAIyC,EAAQ,WAAW,IAAM,CAC3BrB,EAAiB,EAAE,EACnBF,EAAe,EAAE,EACjB,aAAauB,CAAK,CACpB,EAAG,GAAI,EAEPvD,EAAQ,CACN,MAAO,WACP,WAAY,YACZ,iBAAkB,CAChB,WAAY,cACZ,SAAU,YACV,YAAa,kBACf,CACF,CAAC,CACH,EAAG,CACD6C,EACA/B,GAAM,eACNA,GAAM,mBACNA,GAAM,mBACNA,GAAM,mBACNA,GAAM,sBACNC,EACAK,CACF,CAAC,EAED,OACEzB,EAACiB,GAAA,CAA2B,OAAQM,EAAiB,OAAQ,QAASA,EAAiB,MACrF,SAAAtB,EAAC,OAAI,UAAU,WACb,UAAAA,EAAC,OACC,UAAAD,EAACG,EAAA,CACC,UAAU,kGACV,KAAMgB,GAAM,cACd,EACAnB,EAACG,EAAA,CACC,GAAG,IACH,UAAU,gHACV,KAAMgB,GAAM,cAAc,QAAQ,UAAWG,GAAS,EAAE,EAC1D,GACF,EACArB,EAAC,OAAI,UAAU,OACb,UAAAD,EAACG,EAAA,CACC,UAAU,kFACV,KAAMgB,GAAM,oBACd,EACAnB,EAAC,OAAI,UAAU,8BACZ,SAAA+C,EAAU,IAAI,CAACc,EAAMP,IACpBtD,EAAC,OAAgB,UAAU,kCACzB,SAAAA,EAAC,SACC,IAAK8D,GAAY,CACXA,IACFb,EAAU,QAAQK,CAAK,EAAIQ,EAE/B,EAEA,KAAK,MACL,UAAWxD,EACT,6QACAkB,GAAW,gBACb,EACA,MAAOqC,EACP,aAAa,QACb,YAAY,QACZ,WAAW,QACX,eAAe,QACf,SAAUR,GAASD,EAAsBC,EAAOC,CAAK,EACrD,QAAS,IAAM,CACbR,EAAcQ,CAAK,CACrB,EACA,QAASD,GAAS,CAChB,MAAMU,EAAQV,EAAM,cAAc,QAAQ,MAAM,EAChD,GAAI,CAAC,OAAO,MAAM,OAAOU,CAAK,CAAC,EAAG,CAChC,MAAMC,EAAaD,EAAM,MAAM,EAAE,EAAE,MAAM,EAAG,CAAC,EAC7Cf,EAAagB,EAAW,OAAO,MAAM,EAAIA,EAAW,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,EACjEA,EAAW,QAAUjB,EAAU,QACjCD,EAAckB,EAAW,OAAS,CAAC,CAEvC,CACF,EACA,UAAWX,GAAS,CAClB,KAAM,CAAE,MAAAE,CAAM,EAAIF,EAAM,OACpBA,EAAM,MAAQ,aAAe,CAACE,GAASD,EAAQ,GACjDR,EAAcQ,EAAQ,CAAC,CAE3B,GA9BKA,CA+BP,GAtCQA,CAuCV,CACD,EACH,EAECX,GAAS3C,EAACG,EAAA,CAAK,UAAU,+DAA+D,KAAMwC,EAAO,EACrGxB,GAAM,iBACLnB,EAAC,MACC,UAAU,gLACV,wBAAyB,CAAE,OAAQmB,GAAM,eAAgB,EAC3D,GAEJ,EACAlB,EAAC,OAAI,UAAU,kBACb,UAAAD,EAACG,EAAA,CAAK,UAAU,qDAAqD,KAAMgB,GAAM,oBAAqB,EAAG,IACxGqB,EACCxC,EAACG,EAAA,CACC,KAAMgB,GAAM,cAAc,QAAQ,kBAAmBuB,EAAU,SAAS,CAAC,EACzE,UAAU,yGACZ,EAEA1C,EAACG,EAAA,CACC,QAASgD,EACT,UAAW7C,EACT,yGACA,CACE,sBAAuBkC,GAAoBP,CAC7C,CACF,EACA,KAAMd,GAAM,cACd,EAEFnB,EAACE,EAAA,CACC,KAAK,SACL,QAAS6B,EACT,UAAU,2JACV,QAAS2B,EAER,SAAAvC,EAAK,WACR,GACF,EACAnB,EAACe,GAAA,CAAQ,OAAQuB,EAAe,QAASF,EAAa,GACxD,EACF,CAEJ",
6
+ "names": ["jsx", "jsxs", "Button", "Text", "useSendEmailValidation", "gaTrack", "cn", "useHeadlessContext", "useEmailValidation", "useCountDown", "ROUNDED_BRANDS", "useCallback", "useEffect", "useRef", "useState", "Message", "useRegistration", "RegistrationModalContainer", "AuthCodeActivate", "copy", "locale", "brand", "email", "authCodeActivate", "rounded", "activeToken", "setActiveToken", "setIsSendingActivateEmail", "setIsActivateSuccess", "onAuthSuccess", "autoSendEmail", "emailValidationLoading", "triggerEmailValidation", "isSendingEmail", "triggerSendValidationEmail", "sendEmailData", "messageText", "setMessageText", "messageStatus", "setMessageStatus", "isStartCountDown", "startCountDown", "countDown", "error", "setError", "focusIndex", "setFocusIndex", "codeArray", "setCodeArray", "inputRefs", "code", "handleSendAgain", "handleInputCodeChange", "event", "index", "value", "old", "newCode", "handleAuthCodeSubmit", "err", "timer", "item", "inputRef", "paste", "pastedCode"]
7
7
  }
@@ -19,5 +19,4 @@ export type AuthCodeActivateCopy = {
19
19
  };
20
20
  export type AuthCodeActivateProps = {
21
21
  copy: AuthCodeActivateCopy;
22
- autoSendEmail?: boolean;
23
22
  };
@@ -14,6 +14,8 @@ interface RegistrationContextType {
14
14
  setActiveToken: Dispatch<SetStateAction<string | undefined>>;
15
15
  setIsActivateSuccess: Dispatch<SetStateAction<boolean>>;
16
16
  setOnAuthSuccess: Dispatch<SetStateAction<(() => void) | undefined>>;
17
+ autoSendEmail: boolean;
18
+ setAutoSendEmail: Dispatch<SetStateAction<boolean>>;
17
19
  };
18
20
  }
19
21
  export declare const RegistrationContext: import("react").Context<RegistrationContextType>;
@@ -1,2 +1,2 @@
1
- import{jsx as f}from"react/jsx-runtime";import{createContext as p,useContext as h,useState as e}from"react";const s=p({email:void 0,copy:void 0,authCodeActivate:{activeToken:void 0,setActiveToken:()=>{},isOpen:!1,open:()=>{},close:()=>{},isActivateSuccess:!1,isSendingActivateEmail:!1,setIsSendingActivateEmail:()=>{},setIsActivateSuccess:()=>{},setOnAuthSuccess:()=>{},onAuthSuccess:void 0}}),R=()=>{const t=h(s);if(!t)throw new Error("useRegistration must be used within a RegistrationProvider");return t},T=({children:t,email:n,copy:o})=>{const[c,i]=e(!1),[a,d]=e(void 0),[u,r]=e(!1),[v,A]=e(),[S,l]=e(!1);return f(s.Provider,{value:{email:n,copy:o,authCodeActivate:{activeToken:v,isOpen:c,open:()=>i(!0),close:()=>i(!1),isActivateSuccess:u,setIsActivateSuccess:r,onAuthSuccess:a,setOnAuthSuccess:d,isSendingActivateEmail:S,setIsSendingActivateEmail:l,setActiveToken:A}},children:t})};export{s as RegistrationContext,T as RegistrationProvider,R as useRegistration};
1
+ import{jsx as C,jsxs as E}from"react/jsx-runtime";import{createContext as f,useContext as g,useState as e}from"react";import{AuthCodeActivate as m}from"../authCodeActivate";const s=f({email:void 0,copy:void 0,authCodeActivate:{activeToken:void 0,setActiveToken:()=>{},isOpen:!1,open:()=>{},close:()=>{},isActivateSuccess:!1,isSendingActivateEmail:!1,setIsSendingActivateEmail:()=>{},setIsActivateSuccess:()=>{},setOnAuthSuccess:()=>{},onAuthSuccess:void 0,autoSendEmail:!1,setAutoSendEmail:()=>{}}}),k=()=>{const t=g(s);if(!t)throw new Error("useRegistration must be used within a RegistrationProvider");return t},y=({children:t,email:o,copy:i})=>{const[a,n]=e(!1),[c,d]=e(void 0),[u,r]=e(!1),[A,l]=e(),[S,v]=e(!1),[h,p]=e(!1);return E(s.Provider,{value:{email:o,copy:i,authCodeActivate:{activeToken:A,isOpen:a,open:()=>n(!0),close:()=>n(!1),isActivateSuccess:u,setIsActivateSuccess:r,onAuthSuccess:c,setOnAuthSuccess:d,isSendingActivateEmail:S,setIsSendingActivateEmail:v,setActiveToken:l,autoSendEmail:h,setAutoSendEmail:p}},children:[t,i?.authCodeActivate&&C(m,{copy:i.authCodeActivate})]})};export{s as RegistrationContext,y as RegistrationProvider,k as useRegistration};
2
2
  //# sourceMappingURL=provider.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/components/registration/context/provider.tsx"],
4
- "sourcesContent": ["import { createContext, Dispatch, PropsWithChildren, SetStateAction, useContext, useState } from 'react'\n\ninterface RegistrationContextType {\n email?: string\n copy?: any\n authCodeActivate: {\n isOpen: boolean\n open: () => void\n close: () => void\n isActivateSuccess: boolean\n activeToken?: string\n onAuthSuccess: (() => void) | undefined\n isSendingActivateEmail: boolean\n setIsSendingActivateEmail: Dispatch<SetStateAction<boolean>>\n setActiveToken: Dispatch<SetStateAction<string | undefined>>\n setIsActivateSuccess: Dispatch<SetStateAction<boolean>>\n setOnAuthSuccess: Dispatch<SetStateAction<(() => void) | undefined>>\n }\n}\n\nexport const RegistrationContext = createContext<RegistrationContextType>({\n email: undefined,\n copy: undefined,\n authCodeActivate: {\n activeToken: undefined,\n setActiveToken: () => {},\n isOpen: false,\n open: () => {},\n close: () => {},\n isActivateSuccess: false,\n isSendingActivateEmail: false,\n setIsSendingActivateEmail: () => {},\n setIsActivateSuccess: () => {},\n setOnAuthSuccess: () => {},\n onAuthSuccess: undefined,\n },\n})\n\nexport const useRegistration = () => {\n const context = useContext(RegistrationContext)\n if (!context) {\n throw new Error('useRegistration must be used within a RegistrationProvider')\n }\n return context\n}\n\nexport const RegistrationProvider = ({ children, email, copy }: PropsWithChildren<{ email?: string; copy?: any }>) => {\n const [popAuthCode, setPopAuthCode] = useState(false)\n const [onAuthSuccess, setOnAuthSuccess] = useState<(() => void) | undefined>(undefined)\n const [isActivateSuccess, setIsActivateSuccess] = useState(false)\n const [activeToken, setActiveToken] = useState<string>()\n const [isSendingActivateEmail, setIsSendingActivateEmail] = useState(false)\n\n return (\n <RegistrationContext.Provider\n value={{\n email,\n copy,\n authCodeActivate: {\n activeToken,\n isOpen: popAuthCode,\n open: () => setPopAuthCode(true),\n close: () => setPopAuthCode(false),\n isActivateSuccess,\n setIsActivateSuccess,\n onAuthSuccess,\n setOnAuthSuccess,\n isSendingActivateEmail,\n setIsSendingActivateEmail,\n setActiveToken,\n },\n }}\n >\n {children}\n </RegistrationContext.Provider>\n )\n}\n"],
5
- "mappings": "AAsDI,cAAAA,MAAA,oBAtDJ,OAAS,iBAAAC,EAA4D,cAAAC,EAAY,YAAAC,MAAgB,QAoB1F,MAAMC,EAAsBH,EAAuC,CACxE,MAAO,OACP,KAAM,OACN,iBAAkB,CAChB,YAAa,OACb,eAAgB,IAAM,CAAC,EACvB,OAAQ,GACR,KAAM,IAAM,CAAC,EACb,MAAO,IAAM,CAAC,EACd,kBAAmB,GACnB,uBAAwB,GACxB,0BAA2B,IAAM,CAAC,EAClC,qBAAsB,IAAM,CAAC,EAC7B,iBAAkB,IAAM,CAAC,EACzB,cAAe,MACjB,CACF,CAAC,EAEYI,EAAkB,IAAM,CACnC,MAAMC,EAAUJ,EAAWE,CAAmB,EAC9C,GAAI,CAACE,EACH,MAAM,IAAI,MAAM,4DAA4D,EAE9E,OAAOA,CACT,EAEaC,EAAuB,CAAC,CAAE,SAAAC,EAAU,MAAAC,EAAO,KAAAC,CAAK,IAAyD,CACpH,KAAM,CAACC,EAAaC,CAAc,EAAIT,EAAS,EAAK,EAC9C,CAACU,EAAeC,CAAgB,EAAIX,EAAmC,MAAS,EAChF,CAACY,EAAmBC,CAAoB,EAAIb,EAAS,EAAK,EAC1D,CAACc,EAAaC,CAAc,EAAIf,EAAiB,EACjD,CAACgB,EAAwBC,CAAyB,EAAIjB,EAAS,EAAK,EAE1E,OACEH,EAACI,EAAoB,SAApB,CACC,MAAO,CACL,MAAAK,EACA,KAAAC,EACA,iBAAkB,CAChB,YAAAO,EACA,OAAQN,EACR,KAAM,IAAMC,EAAe,EAAI,EAC/B,MAAO,IAAMA,EAAe,EAAK,EACjC,kBAAAG,EACA,qBAAAC,EACA,cAAAH,EACA,iBAAAC,EACA,uBAAAK,EACA,0BAAAC,EACA,eAAAF,CACF,CACF,EAEC,SAAAV,EACH,CAEJ",
6
- "names": ["jsx", "createContext", "useContext", "useState", "RegistrationContext", "useRegistration", "context", "RegistrationProvider", "children", "email", "copy", "popAuthCode", "setPopAuthCode", "onAuthSuccess", "setOnAuthSuccess", "isActivateSuccess", "setIsActivateSuccess", "activeToken", "setActiveToken", "isSendingActivateEmail", "setIsSendingActivateEmail"]
4
+ "sourcesContent": ["import { createContext, Dispatch, PropsWithChildren, SetStateAction, useContext, useState } from 'react'\nimport { AuthCodeActivate } from '../authCodeActivate'\n\ninterface RegistrationContextType {\n email?: string\n copy?: any\n authCodeActivate: {\n isOpen: boolean\n open: () => void\n close: () => void\n isActivateSuccess: boolean\n activeToken?: string\n onAuthSuccess: (() => void) | undefined\n isSendingActivateEmail: boolean\n setIsSendingActivateEmail: Dispatch<SetStateAction<boolean>>\n setActiveToken: Dispatch<SetStateAction<string | undefined>>\n setIsActivateSuccess: Dispatch<SetStateAction<boolean>>\n setOnAuthSuccess: Dispatch<SetStateAction<(() => void) | undefined>>\n autoSendEmail: boolean\n setAutoSendEmail: Dispatch<SetStateAction<boolean>>\n }\n}\n\nexport const RegistrationContext = createContext<RegistrationContextType>({\n email: undefined,\n copy: undefined,\n authCodeActivate: {\n activeToken: undefined,\n setActiveToken: () => {},\n isOpen: false,\n open: () => {},\n close: () => {},\n isActivateSuccess: false,\n isSendingActivateEmail: false,\n setIsSendingActivateEmail: () => {},\n setIsActivateSuccess: () => {},\n setOnAuthSuccess: () => {},\n onAuthSuccess: undefined,\n autoSendEmail: false,\n setAutoSendEmail: () => {},\n },\n})\n\nexport const useRegistration = () => {\n const context = useContext(RegistrationContext)\n if (!context) {\n throw new Error('useRegistration must be used within a RegistrationProvider')\n }\n return context\n}\n\nexport const RegistrationProvider = ({ children, email, copy }: PropsWithChildren<{ email?: string; copy?: any }>) => {\n const [popAuthCode, setPopAuthCode] = useState(false)\n const [onAuthSuccess, setOnAuthSuccess] = useState<(() => void) | undefined>(undefined)\n const [isActivateSuccess, setIsActivateSuccess] = useState(false)\n const [activeToken, setActiveToken] = useState<string>()\n const [isSendingActivateEmail, setIsSendingActivateEmail] = useState(false)\n const [autoSendEmail, setAutoSendEmail] = useState(false)\n\n return (\n <RegistrationContext.Provider\n value={{\n email,\n copy,\n authCodeActivate: {\n activeToken,\n isOpen: popAuthCode,\n open: () => setPopAuthCode(true),\n close: () => setPopAuthCode(false),\n isActivateSuccess,\n setIsActivateSuccess,\n onAuthSuccess,\n setOnAuthSuccess,\n isSendingActivateEmail,\n setIsSendingActivateEmail,\n setActiveToken,\n autoSendEmail,\n setAutoSendEmail,\n },\n }}\n >\n {children}\n {copy?.authCodeActivate && <AuthCodeActivate copy={copy.authCodeActivate} />}\n </RegistrationContext.Provider>\n )\n}\n"],
5
+ "mappings": "AA4DI,OAsB6B,OAAAA,EAtB7B,QAAAC,MAAA,oBA5DJ,OAAS,iBAAAC,EAA4D,cAAAC,EAAY,YAAAC,MAAgB,QACjG,OAAS,oBAAAC,MAAwB,sBAsB1B,MAAMC,EAAsBJ,EAAuC,CACxE,MAAO,OACP,KAAM,OACN,iBAAkB,CAChB,YAAa,OACb,eAAgB,IAAM,CAAC,EACvB,OAAQ,GACR,KAAM,IAAM,CAAC,EACb,MAAO,IAAM,CAAC,EACd,kBAAmB,GACnB,uBAAwB,GACxB,0BAA2B,IAAM,CAAC,EAClC,qBAAsB,IAAM,CAAC,EAC7B,iBAAkB,IAAM,CAAC,EACzB,cAAe,OACf,cAAe,GACf,iBAAkB,IAAM,CAAC,CAC3B,CACF,CAAC,EAEYK,EAAkB,IAAM,CACnC,MAAMC,EAAUL,EAAWG,CAAmB,EAC9C,GAAI,CAACE,EACH,MAAM,IAAI,MAAM,4DAA4D,EAE9E,OAAOA,CACT,EAEaC,EAAuB,CAAC,CAAE,SAAAC,EAAU,MAAAC,EAAO,KAAAC,CAAK,IAAyD,CACpH,KAAM,CAACC,EAAaC,CAAc,EAAIV,EAAS,EAAK,EAC9C,CAACW,EAAeC,CAAgB,EAAIZ,EAAmC,MAAS,EAChF,CAACa,EAAmBC,CAAoB,EAAId,EAAS,EAAK,EAC1D,CAACe,EAAaC,CAAc,EAAIhB,EAAiB,EACjD,CAACiB,EAAwBC,CAAyB,EAAIlB,EAAS,EAAK,EACpE,CAACmB,EAAeC,CAAgB,EAAIpB,EAAS,EAAK,EAExD,OACEH,EAACK,EAAoB,SAApB,CACC,MAAO,CACL,MAAAK,EACA,KAAAC,EACA,iBAAkB,CAChB,YAAAO,EACA,OAAQN,EACR,KAAM,IAAMC,EAAe,EAAI,EAC/B,MAAO,IAAMA,EAAe,EAAK,EACjC,kBAAAG,EACA,qBAAAC,EACA,cAAAH,EACA,iBAAAC,EACA,uBAAAK,EACA,0BAAAC,EACA,eAAAF,EACA,cAAAG,EACA,iBAAAC,CACF,CACF,EAEC,UAAAd,EACAE,GAAM,kBAAoBZ,EAACK,EAAA,CAAiB,KAAMO,EAAK,iBAAkB,GAC5E,CAEJ",
6
+ "names": ["jsx", "jsxs", "createContext", "useContext", "useState", "AuthCodeActivate", "RegistrationContext", "useRegistration", "context", "RegistrationProvider", "children", "email", "copy", "popAuthCode", "setPopAuthCode", "onAuthSuccess", "setOnAuthSuccess", "isActivateSuccess", "setIsActivateSuccess", "activeToken", "setActiveToken", "isSendingActivateEmail", "setIsSendingActivateEmail", "autoSendEmail", "setAutoSendEmail"]
7
7
  }
@@ -6,10 +6,9 @@ export type ModalContainerProps = {
6
6
  title?: string;
7
7
  titleClassName?: string;
8
8
  useAnimation?: boolean;
9
- animationClassName?: string;
10
9
  isOpen: boolean;
11
10
  children?: any;
12
11
  onClose: () => void;
13
12
  onScrollEnd?: (event: UIEvent<HTMLDivElement>) => void;
14
13
  };
15
- export declare const CreditsModalContainer: ({ isOpen, title, className, overlayClassName, scrollClassName, onClose, onScrollEnd, children, useAnimation, animationClassName, titleClassName, ...props }: ModalContainerProps) => React.ReactElement;
14
+ export declare const RegistrationModalContainer: ({ isOpen, title, className, overlayClassName, scrollClassName, onClose, onScrollEnd, children, useAnimation, titleClassName, ...props }: ModalContainerProps) => React.ReactElement;
@@ -1,2 +1,2 @@
1
- import{jsx as l,jsxs as m}from"react/jsx-runtime";import{classNames as n}from"@anker-in/lib";import{useEffect as g,useState as u}from"react";import w from"react-modal";const M=({isOpen:i,title:o,className:d="",overlayClassName:c="",scrollClassName:p="",onClose:a,onScrollEnd:s,children:x,useAnimation:r,animationClassName:C,titleClassName:f="",...v})=>{const[h,L]=u(!1);return g(()=>{r&&requestAnimationFrame(()=>{L(i??!1)})},[i,r]),m(w,{isOpen:i??!1,overlayClassName:n("fixed inset-0 z-[999] flex items-center justify-center bg-black/70 leading-[1.2] md:items-end",c),className:n("min-md:max-h-[calc(100vh-96px)] relative flex min-h-[200px] flex-col overflow-hidden rounded-[16px] bg-white outline-none transition-all duration-300 md:h-[88.27vh] md:w-full md:rounded-b-none",h?"":C,d),onRequestClose:a,...v,children:[m("div",{className:n("flex w-full shrink-0 items-center justify-between",o?"min-l:px-[32px] h-[70px] border-b border-[#e2e2e2] px-[24px]":"h-[48px] px-[16px]",f),children:[l("div",{className:"text-[18px] font-bold",children:o}),l("div",{className:"size-[22px] cursor-pointer",onClick:a,onKeyDown:e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),a?.())},role:"button",tabIndex:0,children:l("svg",{xmlns:"http://www.w3.org/2000/svg",width:"22",height:"22",viewBox:"0 0 22 22",fill:"none",children:l("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M16.8525 5.31015C16.4558 4.91337 15.8125 4.91338 15.4157 5.31015L11.1268 9.5991L6.83815 5.31049C6.44138 4.91372 5.79808 4.91372 5.40131 5.31049C5.00454 5.70726 5.00455 6.35055 5.40131 6.74732L9.68993 11.0359L5.40105 15.3248C5.00428 15.7216 5.00428 16.3649 5.40105 16.7616C5.79782 17.1584 6.44111 17.1584 6.83788 16.7616L11.1268 12.4728L15.416 16.762C15.8128 17.1588 16.456 17.1588 16.8528 16.762C17.2496 16.3652 17.2496 15.7219 16.8528 15.3252L12.5636 11.0359L16.8525 6.74698C17.2493 6.35021 17.2493 5.70692 16.8525 5.31015ZM16.921 6.02856C16.921 6.22992 16.8441 6.43127 16.6905 6.5849L14.465 8.8104L12.2395 11.0359L12.2395 11.0359L16.6905 6.58493C16.8441 6.43129 16.921 6.22993 16.921 6.02856ZM5.34966 6.19087C5.37992 6.3354 5.45115 6.47307 5.56336 6.58528L10.014 11.0359L10.014 11.0359L5.56336 6.58524C5.45116 6.47304 5.37992 6.33539 5.34966 6.19087ZM5.35087 16.2121C5.38193 16.3541 5.45267 16.4891 5.56309 16.5996C5.87037 16.9068 6.36856 16.9068 6.67583 16.5996L11.1268 12.1486L15.578 16.5999C15.8853 16.9072 16.3835 16.9072 16.6908 16.5999C16.8498 16.4409 16.9265 16.2307 16.9209 16.0223C16.9265 16.2307 16.8498 16.4409 16.6908 16.5999C16.3835 16.9072 15.8853 16.9072 15.578 16.5999L11.1268 12.1487L6.67583 16.5996C6.36856 16.9069 5.87037 16.9069 5.56309 16.5996C5.45267 16.4892 5.38192 16.3541 5.35087 16.2121Z",fill:"#333333"})})})]}),l("div",{className:n("my-[32px] flex-1 overflow-auto overscroll-contain px-[24px] md:mb-[48px]",!o&&"mt-0","min-l:px-[32px]",p),onScroll:e=>{const t=e.target;t.scrollHeight<=t.clientHeight||t.scrollTop+t.clientHeight>=t.scrollHeight-50&&s&&s(e)},children:x})]})};export{M as CreditsModalContainer};
1
+ import{jsx as n,jsxs as d}from"react/jsx-runtime";import{classNames as l,useHeadlessContext as g,ROUNDED_BRANDS as w}from"@anker-in/lib";import{useEffect as b,useState as y}from"react";import N from"react-modal";const D=({isOpen:o,title:a,className:m="",overlayClassName:c="",scrollClassName:p="",onClose:i,onScrollEnd:r,children:x,useAnimation:s=!0,titleClassName:f="",...v})=>{const{brand:C}=g(),u=w.includes(C),[h,L]=y(!1);return b(()=>{s&&requestAnimationFrame(()=>{L(o??!1)})},[o,s]),d(N,{isOpen:o??!1,overlayClassName:l("fixed inset-0 z-[999] flex items-center justify-center bg-black/70 leading-[1.2] md:items-end",c),className:l("min-md:max-h-[calc(100vh-96px)] w-[540px] relative flex min-h-[200px] flex-col overflow-hidden bg-white outline-none transition-all duration-300 md:h-auto md:w-full",u&&"rounded-[16px] md:rounded-b-none",s&&"md:translate-y-[100vh]",h&&"md:translate-y-0",m),onRequestClose:i,...v,children:[d("div",{className:l("flex w-full shrink-0 items-center justify-between",a?"min-l:px-[32px] h-[70px] border-b border-[#e2e2e2] px-[24px]":"h-[48px] px-[16px]",f),children:[n("div",{className:"text-[18px] font-bold",children:a}),n("div",{className:"size-[22px] cursor-pointer",onClick:i,onKeyDown:e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),i?.())},role:"button",tabIndex:0,children:n("svg",{xmlns:"http://www.w3.org/2000/svg",width:"22",height:"22",viewBox:"0 0 22 22",fill:"none",children:n("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M16.8525 5.31015C16.4558 4.91337 15.8125 4.91338 15.4157 5.31015L11.1268 9.5991L6.83815 5.31049C6.44138 4.91372 5.79808 4.91372 5.40131 5.31049C5.00454 5.70726 5.00455 6.35055 5.40131 6.74732L9.68993 11.0359L5.40105 15.3248C5.00428 15.7216 5.00428 16.3649 5.40105 16.7616C5.79782 17.1584 6.44111 17.1584 6.83788 16.7616L11.1268 12.4728L15.416 16.762C15.8128 17.1588 16.456 17.1588 16.8528 16.762C17.2496 16.3652 17.2496 15.7219 16.8528 15.3252L12.5636 11.0359L16.8525 6.74698C17.2493 6.35021 17.2493 5.70692 16.8525 5.31015ZM16.921 6.02856C16.921 6.22992 16.8441 6.43127 16.6905 6.5849L14.465 8.8104L12.2395 11.0359L12.2395 11.0359L16.6905 6.58493C16.8441 6.43129 16.921 6.22993 16.921 6.02856ZM5.34966 6.19087C5.37992 6.3354 5.45115 6.47307 5.56336 6.58528L10.014 11.0359L10.014 11.0359L5.56336 6.58524C5.45116 6.47304 5.37992 6.33539 5.34966 6.19087ZM5.35087 16.2121C5.38193 16.3541 5.45267 16.4891 5.56309 16.5996C5.87037 16.9068 6.36856 16.9068 6.67583 16.5996L11.1268 12.1486L15.578 16.5999C15.8853 16.9072 16.3835 16.9072 16.6908 16.5999C16.8498 16.4409 16.9265 16.2307 16.9209 16.0223C16.9265 16.2307 16.8498 16.4409 16.6908 16.5999C16.3835 16.9072 15.8853 16.9072 15.578 16.5999L11.1268 12.1487L6.67583 16.5996C6.36856 16.9069 5.87037 16.9069 5.56309 16.5996C5.45267 16.4892 5.38192 16.3541 5.35087 16.2121Z",fill:"#333333"})})})]}),n("div",{className:l("my-[32px] flex-1 overflow-auto overscroll-contain px-[24px] md:mb-[48px]",!a&&"mt-0","min-l:px-[32px]",p),onScroll:e=>{const t=e.target;t.scrollHeight<=t.clientHeight||t.scrollTop+t.clientHeight>=t.scrollHeight-50&&r&&r(e)},children:x})]})};export{D as RegistrationModalContainer};
2
2
  //# sourceMappingURL=modalContainer.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/components/registration/modalContainer.tsx"],
4
- "sourcesContent": ["import { classNames as cn } from '@anker-in/lib'\nimport { useEffect, useState, type UIEvent } from 'react'\nimport ReactModal from 'react-modal'\n\nexport type ModalContainerProps = {\n overlayClassName?: string\n className?: string\n scrollClassName?: string\n title?: string\n titleClassName?: string\n useAnimation?: boolean // \u4F7F\u7528\u52A8\u753B\u5C55\u793A\n animationClassName?: string // \u52A8\u753B\u5C55\u793A\u63A7\u5236\u7684classname\n isOpen: boolean\n children?: any\n onClose: () => void\n onScrollEnd?: (event: UIEvent<HTMLDivElement>) => void\n}\n\nexport const CreditsModalContainer = ({\n isOpen,\n title,\n className = '',\n overlayClassName = '',\n scrollClassName = '',\n onClose,\n onScrollEnd,\n children,\n useAnimation,\n animationClassName,\n titleClassName = '',\n ...props\n}: ModalContainerProps): React.ReactElement => {\n const [animationShow, setAnimationShow] = useState(false)\n\n useEffect(() => {\n if (!useAnimation) {\n return\n }\n requestAnimationFrame(() => {\n setAnimationShow(isOpen ?? false)\n })\n }, [isOpen, useAnimation])\n\n return (\n <ReactModal\n isOpen={isOpen ?? false}\n overlayClassName={cn(\n 'fixed inset-0 z-[999] flex items-center justify-center bg-black/70 leading-[1.2] md:items-end',\n overlayClassName\n )}\n className={cn(\n 'min-md:max-h-[calc(100vh-96px)] relative flex min-h-[200px] flex-col overflow-hidden rounded-[16px] bg-white outline-none transition-all duration-300 md:h-[88.27vh] md:w-full md:rounded-b-none',\n animationShow ? '' : animationClassName,\n className\n )}\n onRequestClose={onClose}\n {...props}\n >\n <div\n className={cn(\n 'flex w-full shrink-0 items-center justify-between',\n title ? 'min-l:px-[32px] h-[70px] border-b border-[#e2e2e2] px-[24px]' : 'h-[48px] px-[16px]',\n titleClassName\n )}\n >\n <div className=\"text-[18px] font-bold\">{title}</div>\n <div\n className=\"size-[22px] cursor-pointer\"\n onClick={onClose}\n onKeyDown={e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n onClose?.()\n }\n }}\n role=\"button\"\n tabIndex={0}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M16.8525 5.31015C16.4558 4.91337 15.8125 4.91338 15.4157 5.31015L11.1268 9.5991L6.83815 5.31049C6.44138 4.91372 5.79808 4.91372 5.40131 5.31049C5.00454 5.70726 5.00455 6.35055 5.40131 6.74732L9.68993 11.0359L5.40105 15.3248C5.00428 15.7216 5.00428 16.3649 5.40105 16.7616C5.79782 17.1584 6.44111 17.1584 6.83788 16.7616L11.1268 12.4728L15.416 16.762C15.8128 17.1588 16.456 17.1588 16.8528 16.762C17.2496 16.3652 17.2496 15.7219 16.8528 15.3252L12.5636 11.0359L16.8525 6.74698C17.2493 6.35021 17.2493 5.70692 16.8525 5.31015ZM16.921 6.02856C16.921 6.22992 16.8441 6.43127 16.6905 6.5849L14.465 8.8104L12.2395 11.0359L12.2395 11.0359L16.6905 6.58493C16.8441 6.43129 16.921 6.22993 16.921 6.02856ZM5.34966 6.19087C5.37992 6.3354 5.45115 6.47307 5.56336 6.58528L10.014 11.0359L10.014 11.0359L5.56336 6.58524C5.45116 6.47304 5.37992 6.33539 5.34966 6.19087ZM5.35087 16.2121C5.38193 16.3541 5.45267 16.4891 5.56309 16.5996C5.87037 16.9068 6.36856 16.9068 6.67583 16.5996L11.1268 12.1486L15.578 16.5999C15.8853 16.9072 16.3835 16.9072 16.6908 16.5999C16.8498 16.4409 16.9265 16.2307 16.9209 16.0223C16.9265 16.2307 16.8498 16.4409 16.6908 16.5999C16.3835 16.9072 15.8853 16.9072 15.578 16.5999L11.1268 12.1487L6.67583 16.5996C6.36856 16.9069 5.87037 16.9069 5.56309 16.5996C5.45267 16.4892 5.38192 16.3541 5.35087 16.2121Z\"\n fill=\"#333333\"\n />\n </svg>\n </div>\n </div>\n <div\n className={cn(\n 'my-[32px] flex-1 overflow-auto overscroll-contain px-[24px] md:mb-[48px]',\n !title && 'mt-0',\n 'min-l:px-[32px]',\n scrollClassName\n )}\n onScroll={event => {\n const targetElement = event.target as HTMLDivElement\n\n if (targetElement.scrollHeight <= targetElement.clientHeight) {\n return\n }\n\n if (targetElement.scrollTop + targetElement.clientHeight >= targetElement.scrollHeight - 50) {\n onScrollEnd && onScrollEnd(event)\n }\n }}\n >\n {children}\n </div>\n </ReactModal>\n )\n}\n"],
5
- "mappings": "AA0DM,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBA1DN,OAAS,cAAcC,MAAU,gBACjC,OAAS,aAAAC,EAAW,YAAAC,MAA8B,QAClD,OAAOC,MAAgB,cAgBhB,MAAMC,EAAwB,CAAC,CACpC,OAAAC,EACA,MAAAC,EACA,UAAAC,EAAY,GACZ,iBAAAC,EAAmB,GACnB,gBAAAC,EAAkB,GAClB,QAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,mBAAAC,EACA,eAAAC,EAAiB,GACjB,GAAGC,CACL,IAA+C,CAC7C,KAAM,CAACC,EAAeC,CAAgB,EAAIhB,EAAS,EAAK,EAExD,OAAAD,EAAU,IAAM,CACTY,GAGL,sBAAsB,IAAM,CAC1BK,EAAiBb,GAAU,EAAK,CAClC,CAAC,CACH,EAAG,CAACA,EAAQQ,CAAY,CAAC,EAGvBd,EAACI,EAAA,CACC,OAAQE,GAAU,GAClB,iBAAkBL,EAChB,gGACAQ,CACF,EACA,UAAWR,EACT,mMACAiB,EAAgB,GAAKH,EACrBP,CACF,EACA,eAAgBG,EACf,GAAGM,EAEJ,UAAAjB,EAAC,OACC,UAAWC,EACT,oDACAM,EAAQ,+DAAiE,qBACzES,CACF,EAEA,UAAAjB,EAAC,OAAI,UAAU,wBAAyB,SAAAQ,EAAM,EAC9CR,EAAC,OACC,UAAU,6BACV,QAASY,EACT,UAAW,GAAK,EACV,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,eAAe,EACjBA,IAAU,EAEd,EACA,KAAK,SACL,SAAU,EAEV,SAAAZ,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,SAAS,UACT,SAAS,UACT,EAAE,syCACF,KAAK,UACP,EACF,EACF,GACF,EACAA,EAAC,OACC,UAAWE,EACT,2EACA,CAACM,GAAS,OACV,kBACAG,CACF,EACA,SAAUU,GAAS,CACjB,MAAMC,EAAgBD,EAAM,OAExBC,EAAc,cAAgBA,EAAc,cAI5CA,EAAc,UAAYA,EAAc,cAAgBA,EAAc,aAAe,IACvFT,GAAeA,EAAYQ,CAAK,CAEpC,EAEC,SAAAP,EACH,GACF,CAEJ",
6
- "names": ["jsx", "jsxs", "cn", "useEffect", "useState", "ReactModal", "CreditsModalContainer", "isOpen", "title", "className", "overlayClassName", "scrollClassName", "onClose", "onScrollEnd", "children", "useAnimation", "animationClassName", "titleClassName", "props", "animationShow", "setAnimationShow", "event", "targetElement"]
4
+ "sourcesContent": ["import { classNames as cn, useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'\nimport { useEffect, useState, type UIEvent } from 'react'\nimport ReactModal from 'react-modal'\n\nexport type ModalContainerProps = {\n overlayClassName?: string\n className?: string\n scrollClassName?: string\n title?: string\n titleClassName?: string\n useAnimation?: boolean // \u4F7F\u7528\u52A8\u753B\u5C55\u793A\n isOpen: boolean\n children?: any\n onClose: () => void\n onScrollEnd?: (event: UIEvent<HTMLDivElement>) => void\n}\n\nexport const RegistrationModalContainer = ({\n isOpen,\n title,\n className = '',\n overlayClassName = '',\n scrollClassName = '',\n onClose,\n onScrollEnd,\n children,\n useAnimation = true,\n titleClassName = '',\n ...props\n}: ModalContainerProps): React.ReactElement => {\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n const [animationShow, setAnimationShow] = useState(false)\n\n useEffect(() => {\n if (!useAnimation) {\n return\n }\n requestAnimationFrame(() => {\n setAnimationShow(isOpen ?? false)\n })\n }, [isOpen, useAnimation])\n\n return (\n <ReactModal\n isOpen={isOpen ?? false}\n overlayClassName={cn(\n 'fixed inset-0 z-[999] flex items-center justify-center bg-black/70 leading-[1.2] md:items-end',\n overlayClassName\n )}\n className={cn(\n 'min-md:max-h-[calc(100vh-96px)] w-[540px] relative flex min-h-[200px] flex-col overflow-hidden bg-white outline-none transition-all duration-300 md:h-auto md:w-full',\n rounded && 'rounded-[16px] md:rounded-b-none',\n useAnimation && 'md:translate-y-[100vh]',\n animationShow && 'md:translate-y-0',\n className\n )}\n onRequestClose={onClose}\n {...props}\n >\n <div\n className={cn(\n 'flex w-full shrink-0 items-center justify-between',\n title ? 'min-l:px-[32px] h-[70px] border-b border-[#e2e2e2] px-[24px]' : 'h-[48px] px-[16px]',\n titleClassName\n )}\n >\n <div className=\"text-[18px] font-bold\">{title}</div>\n <div\n className=\"size-[22px] cursor-pointer\"\n onClick={onClose}\n onKeyDown={e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n onClose?.()\n }\n }}\n role=\"button\"\n tabIndex={0}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M16.8525 5.31015C16.4558 4.91337 15.8125 4.91338 15.4157 5.31015L11.1268 9.5991L6.83815 5.31049C6.44138 4.91372 5.79808 4.91372 5.40131 5.31049C5.00454 5.70726 5.00455 6.35055 5.40131 6.74732L9.68993 11.0359L5.40105 15.3248C5.00428 15.7216 5.00428 16.3649 5.40105 16.7616C5.79782 17.1584 6.44111 17.1584 6.83788 16.7616L11.1268 12.4728L15.416 16.762C15.8128 17.1588 16.456 17.1588 16.8528 16.762C17.2496 16.3652 17.2496 15.7219 16.8528 15.3252L12.5636 11.0359L16.8525 6.74698C17.2493 6.35021 17.2493 5.70692 16.8525 5.31015ZM16.921 6.02856C16.921 6.22992 16.8441 6.43127 16.6905 6.5849L14.465 8.8104L12.2395 11.0359L12.2395 11.0359L16.6905 6.58493C16.8441 6.43129 16.921 6.22993 16.921 6.02856ZM5.34966 6.19087C5.37992 6.3354 5.45115 6.47307 5.56336 6.58528L10.014 11.0359L10.014 11.0359L5.56336 6.58524C5.45116 6.47304 5.37992 6.33539 5.34966 6.19087ZM5.35087 16.2121C5.38193 16.3541 5.45267 16.4891 5.56309 16.5996C5.87037 16.9068 6.36856 16.9068 6.67583 16.5996L11.1268 12.1486L15.578 16.5999C15.8853 16.9072 16.3835 16.9072 16.6908 16.5999C16.8498 16.4409 16.9265 16.2307 16.9209 16.0223C16.9265 16.2307 16.8498 16.4409 16.6908 16.5999C16.3835 16.9072 15.8853 16.9072 15.578 16.5999L11.1268 12.1487L6.67583 16.5996C6.36856 16.9069 5.87037 16.9069 5.56309 16.5996C5.45267 16.4892 5.38192 16.3541 5.35087 16.2121Z\"\n fill=\"#333333\"\n />\n </svg>\n </div>\n </div>\n <div\n className={cn(\n 'my-[32px] flex-1 overflow-auto overscroll-contain px-[24px] md:mb-[48px]',\n !title && 'mt-0',\n 'min-l:px-[32px]',\n scrollClassName\n )}\n onScroll={event => {\n const targetElement = event.target as HTMLDivElement\n\n if (targetElement.scrollHeight <= targetElement.clientHeight) {\n return\n }\n\n if (targetElement.scrollTop + targetElement.clientHeight >= targetElement.scrollHeight - 50) {\n onScrollEnd && onScrollEnd(event)\n }\n }}\n >\n {children}\n </div>\n </ReactModal>\n )\n}\n"],
5
+ "mappings": "AA4DM,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBA5DN,OAAS,cAAcC,EAAI,sBAAAC,EAAoB,kBAAAC,MAAsB,gBACrE,OAAS,aAAAC,EAAW,YAAAC,MAA8B,QAClD,OAAOC,MAAgB,cAehB,MAAMC,EAA6B,CAAC,CACzC,OAAAC,EACA,MAAAC,EACA,UAAAC,EAAY,GACZ,iBAAAC,EAAmB,GACnB,gBAAAC,EAAkB,GAClB,QAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,GACf,eAAAC,EAAiB,GACjB,GAAGC,CACL,IAA+C,CAC7C,KAAM,CAAE,MAAAC,CAAM,EAAIjB,EAAmB,EAC/BkB,EAAUjB,EAAe,SAASgB,CAAK,EACvC,CAACE,EAAeC,CAAgB,EAAIjB,EAAS,EAAK,EAExD,OAAAD,EAAU,IAAM,CACTY,GAGL,sBAAsB,IAAM,CAC1BM,EAAiBd,GAAU,EAAK,CAClC,CAAC,CACH,EAAG,CAACA,EAAQQ,CAAY,CAAC,EAGvBhB,EAACM,EAAA,CACC,OAAQE,GAAU,GAClB,iBAAkBP,EAChB,gGACAU,CACF,EACA,UAAWV,EACT,uKACAmB,GAAW,mCACXJ,GAAgB,yBAChBK,GAAiB,mBACjBX,CACF,EACA,eAAgBG,EACf,GAAGK,EAEJ,UAAAlB,EAAC,OACC,UAAWC,EACT,oDACAQ,EAAQ,+DAAiE,qBACzEQ,CACF,EAEA,UAAAlB,EAAC,OAAI,UAAU,wBAAyB,SAAAU,EAAM,EAC9CV,EAAC,OACC,UAAU,6BACV,QAASc,EACT,UAAW,GAAK,EACV,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,eAAe,EACjBA,IAAU,EAEd,EACA,KAAK,SACL,SAAU,EAEV,SAAAd,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,SAAS,UACT,SAAS,UACT,EAAE,syCACF,KAAK,UACP,EACF,EACF,GACF,EACAA,EAAC,OACC,UAAWE,EACT,2EACA,CAACQ,GAAS,OACV,kBACAG,CACF,EACA,SAAUW,GAAS,CACjB,MAAMC,EAAgBD,EAAM,OAExBC,EAAc,cAAgBA,EAAc,cAI5CA,EAAc,UAAYA,EAAc,cAAgBA,EAAc,aAAe,IACvFV,GAAeA,EAAYS,CAAK,CAEpC,EAEC,SAAAR,EACH,GACF,CAEJ",
6
+ "names": ["jsx", "jsxs", "cn", "useHeadlessContext", "ROUNDED_BRANDS", "useEffect", "useState", "ReactModal", "RegistrationModalContainer", "isOpen", "title", "className", "overlayClassName", "scrollClassName", "onClose", "onScrollEnd", "children", "useAnimation", "titleClassName", "props", "brand", "rounded", "animationShow", "setAnimationShow", "event", "targetElement"]
7
7
  }
@@ -8,20 +8,21 @@ import { CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysTo
8
8
  import { CreditsRedeemListCopy } from '../components/credits/creditsRedeemList';
9
9
  import { CreditsCashCopy } from '../components/credits/creditsCash';
10
10
  import { CreditsFaqCopy } from '../components/credits/creditsFaq';
11
+ import { AuthCodeActivateCopy } from 'src/components/registration/authCodeActivate/type';
11
12
  export declare enum ComponentKey {
12
- Banner = "banner",
13
- InfoCard = "infoCard",
14
- Benefits = "benefits",
15
- WaysToGetCredits = "waysToGetCredits",
16
- RedeemList = "redeemList",
17
- SpendCreditsLikeCash = "spendCreditsLikeCash",
18
- Faqs = "faqs"
13
+ Banner = "creditsBanner",
14
+ InfoCard = "creditsInfoCard",
15
+ Benefits = "creditsBenefits",
16
+ WaysToGetCredits = "creditsWaysToGetCredits",
17
+ RedeemList = "creditsRedeemList",
18
+ SpendCreditsLikeCash = "creditsCash",
19
+ Faqs = "creditsFaq"
19
20
  }
20
21
  export type CreditsTemplateProps = {
21
22
  headlessConfig: HeadlessConfig;
22
23
  siteConfig: {
23
24
  registrationsSettings: {
24
- authCodeActivate: any;
25
+ authCodeActivate: AuthCodeActivateCopy;
25
26
  };
26
27
  taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>;
27
28
  };
@@ -1,2 +1,2 @@
1
- import{Fragment as L,jsx as o,jsxs as v}from"react/jsx-runtime";import{classNames as C,HeadlessProvider as m}from"@anker-in/lib";import{RegistrationProvider as f}from"../components/registration/context/provider";import{CreditsProvider as y}from"../components/credits/context/provider";import{CreditsBanner as c}from"../components/credits/creditsBanner";import{CreditsInfoCard as l}from"../components/credits/creditsInfoCard";import{CreditsBenefits as g}from"../components/credits/creditsBenefits";import{CreditsWaysToGetCredits as P}from"../components/credits/creditsWaysToGetCredits";import{CreditsRedeemList as T}from"../components/credits/creditsRedeemList";import{CreditsCash as u}from"../components/credits/creditsCash";import{CreditsFaq as h}from"../components/credits/creditsFaq";var I=(e=>(e.Banner="banner",e.InfoCard="infoCard",e.Benefits="benefits",e.WaysToGetCredits="waysToGetCredits",e.RedeemList="redeemList",e.SpendCreditsLikeCash="spendCreditsLikeCash",e.Faqs="faqs",e))(I||{});const O=({headlessConfig:d,siteConfig:s,userContext:r,pageConfig:i,registrationContext:t,gtm:n})=>o(m,{headlessConfig:d,children:o(f,{copy:s.registrationsSettings,email:r?.profile?.email,children:o(y,{profile:r?.profile,removeProfile:r?.removeProfile,isLoadingProfile:r?.isLoadingProfile,openSignInPopup:t.openSignInPopup,openSignUpPopup:t.openSignUpPopup,creditInfo:r?.creditInfo,taskIdToTypeMapping:s.taskIdToTypeMapping,customer:r?.customer,fetchCreditInfo:r?.fetchCreditInfo,customerLoading:r?.customerLoading,gtm:n,pageCommon:i.common,children:o("div",{className:C("bg-[#f5f5f7] leading-[1.2]"),children:i.order.map(p=>{const e=i.components?.[p];return e?v(L,{children:[a=>{switch(a){case"banner":return o(c,{copy:e});case"infoCard":return o(l,{copy:e});case"benefits":return o(g,{copy:e});case"waysToGetCredits":return o(P,{copy:e});case"redeemList":return o(T,{copy:e});case"spendCreditsLikeCash":return o(u,{copy:e});case"faqs":return o(h,{copy:e});default:return null}},o("div",{className:"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16"})]}):null})})})})});export{I as ComponentKey,O as CreditsTemplate};
1
+ import{Fragment as v,jsx as o,jsxs as u}from"react/jsx-runtime";import{classNames as a,HeadlessProvider as C}from"@anker-in/lib";import{RegistrationProvider as m}from"../components/registration/context/provider";import{CreditsProvider as f}from"../components/credits/context/provider";import{CreditsBanner as y}from"../components/credits/creditsBanner";import{CreditsInfoCard as c}from"../components/credits/creditsInfoCard";import{CreditsBenefits as l}from"../components/credits/creditsBenefits";import{CreditsWaysToGetCredits as g}from"../components/credits/creditsWaysToGetCredits";import{CreditsRedeemList as T}from"../components/credits/creditsRedeemList";import{CreditsCash as P}from"../components/credits/creditsCash";import{CreditsFaq as h}from"../components/credits/creditsFaq";var I=(e=>(e.Banner="creditsBanner",e.InfoCard="creditsInfoCard",e.Benefits="creditsBenefits",e.WaysToGetCredits="creditsWaysToGetCredits",e.RedeemList="creditsRedeemList",e.SpendCreditsLikeCash="creditsCash",e.Faqs="creditsFaq",e))(I||{});const O=({headlessConfig:s,siteConfig:d,userContext:t,pageConfig:r,registrationContext:n,gtm:p})=>o(C,{headlessConfig:s,children:o(m,{copy:d.registrationsSettings,email:t?.profile?.email,children:o(f,{profile:t?.profile,removeProfile:t?.removeProfile,isLoadingProfile:t?.isLoadingProfile,openSignInPopup:n.openSignInPopup,openSignUpPopup:n.openSignUpPopup,creditInfo:t?.creditInfo,taskIdToTypeMapping:d.taskIdToTypeMapping,customer:t?.customer,fetchCreditInfo:t?.fetchCreditInfo,customerLoading:t?.customerLoading,gtm:p,pageCommon:r.common,children:o("div",{className:a("bg-[#f5f5f7] leading-[1.2]"),children:r.order.map(i=>{const e=r.components?.[i];return e?u(v,{children:[i==="creditsBanner"&&o(y,{copy:e}),i==="creditsInfoCard"&&t?.profile&&o(c,{copy:e}),i==="creditsBenefits"&&o(l,{copy:e}),i==="creditsWaysToGetCredits"&&o(g,{copy:e,classNames:s.brand==="anker"?{subtitle:"text-white",equalCreditsText:"bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent"}:{subtitle:"text-[#D1D1D1]",equalCreditsText:"text-[#F6EAD0]"}}),i==="creditsRedeemList"&&o(T,{copy:e}),i==="creditsCash"&&o(P,{copy:e}),i==="creditsFaq"&&o(h,{copy:e}),i!=="creditsBanner"&&o("div",{className:"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16"})]}):null})})})})});export{I as ComponentKey,O as CreditsTemplate};
2
2
  //# sourceMappingURL=credits.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/templates/credits.tsx"],
4
- "sourcesContent": ["import { classNames, HeadlessConfig, HeadlessProvider } from '@anker-in/lib'\nimport { RegistrationProvider } from '../components/registration/context/provider'\n\nimport { DTC_TASK_TYPE } from '../components/credits/context/const'\nimport { CreditsProvider } from '../components/credits/context/provider'\nimport { CreditsPageCommon } from '../components/credits/type'\n\nimport { CreditsBanner, CreditsBannerCopy } from '../components/credits/creditsBanner'\nimport { CreditsInfoCard, CreditsInfoCardCopy } from '../components/credits/creditsInfoCard'\nimport { CreditsBenefits, CreditsBenefitsCopy } from '../components/credits/creditsBenefits'\nimport { CreditsWaysToGetCredits, CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits'\nimport { CreditsRedeemList, CreditsRedeemListCopy } from '../components/credits/creditsRedeemList'\nimport { CreditsCash, CreditsCashCopy } from '../components/credits/creditsCash'\nimport { CreditsFaq, CreditsFaqCopy } from '../components/credits/creditsFaq'\n\nexport enum ComponentKey {\n Banner = 'banner',\n InfoCard = 'infoCard',\n Benefits = 'benefits',\n WaysToGetCredits = 'waysToGetCredits',\n RedeemList = 'redeemList',\n SpendCreditsLikeCash = 'spendCreditsLikeCash',\n Faqs = 'faqs',\n}\nexport type CreditsTemplateProps = {\n headlessConfig: HeadlessConfig\n siteConfig: {\n registrationsSettings: {\n authCodeActivate: any\n }\n taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n }\n pageConfig: {\n order: ComponentKey[]\n common: CreditsPageCommon\n components: {\n [ComponentKey.Banner]?: CreditsBannerCopy\n [ComponentKey.InfoCard]?: CreditsInfoCardCopy\n [ComponentKey.Benefits]?: CreditsBenefitsCopy\n [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy\n [ComponentKey.RedeemList]?: CreditsRedeemListCopy\n [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy\n [ComponentKey.Faqs]?: CreditsFaqCopy\n }\n }\n userContext: {\n profile: any\n removeProfile: () => void\n isLoadingProfile: boolean\n creditInfo: any\n customer: any\n customerLoading: boolean\n fetchCreditInfo: () => void\n }\n registrationContext: {\n openSignUpPopup: () => void\n openSignInPopup: () => void\n }\n gtm: {\n pageGroup: string\n }\n}\n\nexport const CreditsTemplate = ({\n headlessConfig,\n siteConfig,\n userContext,\n pageConfig,\n registrationContext,\n gtm,\n}: CreditsTemplateProps) => {\n return (\n <HeadlessProvider headlessConfig={headlessConfig}>\n <RegistrationProvider copy={siteConfig.registrationsSettings} email={userContext?.profile?.email}>\n <CreditsProvider\n profile={userContext?.profile}\n removeProfile={userContext?.removeProfile}\n isLoadingProfile={userContext?.isLoadingProfile}\n openSignInPopup={registrationContext.openSignInPopup}\n openSignUpPopup={registrationContext.openSignUpPopup}\n creditInfo={userContext?.creditInfo}\n taskIdToTypeMapping={siteConfig.taskIdToTypeMapping}\n customer={userContext?.customer}\n fetchCreditInfo={userContext?.fetchCreditInfo}\n customerLoading={userContext?.customerLoading}\n gtm={gtm}\n pageCommon={pageConfig.common}\n >\n <div className={classNames('bg-[#f5f5f7] leading-[1.2]')}>\n {pageConfig.order.map(item => {\n const componentCopy = pageConfig.components?.[item]\n if (!componentCopy) return null\n return (\n <>\n {(item: ComponentKey) => {\n switch (item) {\n case 'banner':\n return <CreditsBanner copy={componentCopy as CreditsBannerCopy} />\n case 'infoCard':\n return <CreditsInfoCard copy={componentCopy as CreditsInfoCardCopy} />\n case 'benefits':\n return <CreditsBenefits copy={componentCopy as CreditsBenefitsCopy} />\n case 'waysToGetCredits':\n return <CreditsWaysToGetCredits copy={componentCopy as CreditsWaysToGetCreditsCopy} />\n case 'redeemList':\n return <CreditsRedeemList copy={componentCopy as CreditsRedeemListCopy} />\n case 'spendCreditsLikeCash':\n return <CreditsCash copy={componentCopy as CreditsCashCopy} />\n case 'faqs':\n return <CreditsFaq copy={componentCopy as CreditsFaqCopy} />\n default:\n return null\n }\n }}\n <div className=\"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16\" />\n </>\n )\n })}\n </div>\n </CreditsProvider>\n </RegistrationProvider>\n </HeadlessProvider>\n )\n}\n"],
5
- "mappings": "AA6FgB,mBAAAA,EAIe,OAAAC,EAJf,QAAAC,MAAA,oBA7FhB,OAAS,cAAAC,EAA4B,oBAAAC,MAAwB,gBAC7D,OAAS,wBAAAC,MAA4B,8CAGrC,OAAS,mBAAAC,MAAuB,yCAGhC,OAAS,iBAAAC,MAAwC,sCACjD,OAAS,mBAAAC,MAA4C,wCACrD,OAAS,mBAAAC,MAA4C,wCACrD,OAAS,2BAAAC,MAA4D,gDACrE,OAAS,qBAAAC,MAAgD,0CACzD,OAAS,eAAAC,MAAoC,oCAC7C,OAAS,cAAAC,MAAkC,mCAEpC,IAAKC,OACVA,EAAA,OAAS,SACTA,EAAA,SAAW,WACXA,EAAA,SAAW,WACXA,EAAA,iBAAmB,mBACnBA,EAAA,WAAa,aACbA,EAAA,qBAAuB,uBACvBA,EAAA,KAAO,OAPGA,OAAA,IAgDL,MAAMC,EAAkB,CAAC,CAC9B,eAAAC,EACA,WAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,IAAAC,CACF,IAEIpB,EAACG,EAAA,CAAiB,eAAgBY,EAChC,SAAAf,EAACI,EAAA,CAAqB,KAAMY,EAAW,sBAAuB,MAAOC,GAAa,SAAS,MACzF,SAAAjB,EAACK,EAAA,CACC,QAASY,GAAa,QACtB,cAAeA,GAAa,cAC5B,iBAAkBA,GAAa,iBAC/B,gBAAiBE,EAAoB,gBACrC,gBAAiBA,EAAoB,gBACrC,WAAYF,GAAa,WACzB,oBAAqBD,EAAW,oBAChC,SAAUC,GAAa,SACvB,gBAAiBA,GAAa,gBAC9B,gBAAiBA,GAAa,gBAC9B,IAAKG,EACL,WAAYF,EAAW,OAEvB,SAAAlB,EAAC,OAAI,UAAWE,EAAW,4BAA4B,EACpD,SAAAgB,EAAW,MAAM,IAAIG,GAAQ,CAC5B,MAAMC,EAAgBJ,EAAW,aAAaG,CAAI,EAClD,OAAKC,EAEHrB,EAAAF,EAAA,CACG,UAACsB,GAAuB,CACvB,OAAQA,EAAM,CACZ,IAAK,SACH,OAAOrB,EAACM,EAAA,CAAc,KAAMgB,EAAoC,EAClE,IAAK,WACH,OAAOtB,EAACO,EAAA,CAAgB,KAAMe,EAAsC,EACtE,IAAK,WACH,OAAOtB,EAACQ,EAAA,CAAgB,KAAMc,EAAsC,EACtE,IAAK,mBACH,OAAOtB,EAACS,EAAA,CAAwB,KAAMa,EAA8C,EACtF,IAAK,aACH,OAAOtB,EAACU,EAAA,CAAkB,KAAMY,EAAwC,EAC1E,IAAK,uBACH,OAAOtB,EAACW,EAAA,CAAY,KAAMW,EAAkC,EAC9D,IAAK,OACH,OAAOtB,EAACY,EAAA,CAAW,KAAMU,EAAiC,EAC5D,QACE,OAAO,IACX,CACF,EACAtB,EAAC,OAAI,UAAU,qEAAqE,GACtF,EAxByB,IA0B7B,CAAC,EACH,EACF,EACF,EACF",
6
- "names": ["Fragment", "jsx", "jsxs", "classNames", "HeadlessProvider", "RegistrationProvider", "CreditsProvider", "CreditsBanner", "CreditsInfoCard", "CreditsBenefits", "CreditsWaysToGetCredits", "CreditsRedeemList", "CreditsCash", "CreditsFaq", "ComponentKey", "CreditsTemplate", "headlessConfig", "siteConfig", "userContext", "pageConfig", "registrationContext", "gtm", "item", "componentCopy"]
4
+ "sourcesContent": ["import { classNames, HeadlessConfig, HeadlessProvider } from '@anker-in/lib'\nimport { RegistrationProvider } from '../components/registration/context/provider'\n\nimport { DTC_TASK_TYPE } from '../components/credits/context/const'\nimport { CreditsProvider } from '../components/credits/context/provider'\nimport { CreditsPageCommon } from '../components/credits/type'\n\nimport { CreditsBanner, CreditsBannerCopy } from '../components/credits/creditsBanner'\nimport { CreditsInfoCard, CreditsInfoCardCopy } from '../components/credits/creditsInfoCard'\nimport { CreditsBenefits, CreditsBenefitsCopy } from '../components/credits/creditsBenefits'\nimport { CreditsWaysToGetCredits, CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits'\nimport { CreditsRedeemList, CreditsRedeemListCopy } from '../components/credits/creditsRedeemList'\nimport { CreditsCash, CreditsCashCopy } from '../components/credits/creditsCash'\nimport { CreditsFaq, CreditsFaqCopy } from '../components/credits/creditsFaq'\nimport { AuthCodeActivateCopy } from 'src/components/registration/authCodeActivate/type'\n\nexport enum ComponentKey {\n Banner = 'creditsBanner',\n InfoCard = 'creditsInfoCard',\n Benefits = 'creditsBenefits',\n WaysToGetCredits = 'creditsWaysToGetCredits',\n RedeemList = 'creditsRedeemList',\n SpendCreditsLikeCash = 'creditsCash',\n Faqs = 'creditsFaq',\n}\nexport type CreditsTemplateProps = {\n headlessConfig: HeadlessConfig\n siteConfig: {\n registrationsSettings: {\n authCodeActivate: AuthCodeActivateCopy\n }\n taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n }\n pageConfig: {\n order: ComponentKey[]\n common: CreditsPageCommon\n components: {\n [ComponentKey.Banner]?: CreditsBannerCopy\n [ComponentKey.InfoCard]?: CreditsInfoCardCopy\n [ComponentKey.Benefits]?: CreditsBenefitsCopy\n [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy\n [ComponentKey.RedeemList]?: CreditsRedeemListCopy\n [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy\n [ComponentKey.Faqs]?: CreditsFaqCopy\n }\n }\n userContext: {\n profile: any\n removeProfile: () => void\n isLoadingProfile: boolean\n creditInfo: any\n customer: any\n customerLoading: boolean\n fetchCreditInfo: () => void\n }\n registrationContext: {\n openSignUpPopup: () => void\n openSignInPopup: () => void\n }\n gtm: {\n pageGroup: string\n }\n}\n\nexport const CreditsTemplate = ({\n headlessConfig,\n siteConfig,\n userContext,\n pageConfig,\n registrationContext,\n gtm,\n}: CreditsTemplateProps) => {\n return (\n <HeadlessProvider headlessConfig={headlessConfig}>\n <RegistrationProvider copy={siteConfig.registrationsSettings} email={userContext?.profile?.email}>\n <CreditsProvider\n profile={userContext?.profile}\n removeProfile={userContext?.removeProfile}\n isLoadingProfile={userContext?.isLoadingProfile}\n openSignInPopup={registrationContext.openSignInPopup}\n openSignUpPopup={registrationContext.openSignUpPopup}\n creditInfo={userContext?.creditInfo}\n taskIdToTypeMapping={siteConfig.taskIdToTypeMapping}\n customer={userContext?.customer}\n fetchCreditInfo={userContext?.fetchCreditInfo}\n customerLoading={userContext?.customerLoading}\n gtm={gtm}\n pageCommon={pageConfig.common}\n >\n <div className={classNames('bg-[#f5f5f7] leading-[1.2]')}>\n {pageConfig.order.map(key => {\n const componentCopy = pageConfig.components?.[key]\n if (!componentCopy) return null\n return (\n <>\n {key === ComponentKey.Banner && <CreditsBanner copy={componentCopy as CreditsBannerCopy} />}\n {key === ComponentKey.InfoCard && userContext?.profile && (\n <CreditsInfoCard copy={componentCopy as CreditsInfoCardCopy} />\n )}\n {key === ComponentKey.Benefits && <CreditsBenefits copy={componentCopy as CreditsBenefitsCopy} />}\n {key === ComponentKey.WaysToGetCredits && (\n <CreditsWaysToGetCredits\n copy={componentCopy as CreditsWaysToGetCreditsCopy}\n classNames={\n headlessConfig.brand === 'anker'\n ? {\n subtitle: 'text-white',\n equalCreditsText:\n 'bg-gradient-to-r from-[#3AD1FF] to-[#008CD6] bg-clip-text text-transparent',\n }\n : {\n subtitle: 'text-[#D1D1D1]',\n equalCreditsText: 'text-[#F6EAD0]',\n }\n }\n />\n )}\n {key === ComponentKey.RedeemList && (\n <CreditsRedeemList copy={componentCopy as CreditsRedeemListCopy} />\n )}\n {key === ComponentKey.SpendCreditsLikeCash && <CreditsCash copy={componentCopy as CreditsCashCopy} />}\n {key === ComponentKey.Faqs && <CreditsFaq copy={componentCopy as CreditsFaqCopy} />}\n {key !== ComponentKey.Banner && (\n <div className=\"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16\" />\n )}\n </>\n )\n })}\n </div>\n </CreditsProvider>\n </RegistrationProvider>\n </HeadlessProvider>\n )\n}\n"],
5
+ "mappings": "AA8FgB,mBAAAA,EACkC,OAAAC,EADlC,QAAAC,MAAA,oBA9FhB,OAAS,cAAAC,EAA4B,oBAAAC,MAAwB,gBAC7D,OAAS,wBAAAC,MAA4B,8CAGrC,OAAS,mBAAAC,MAAuB,yCAGhC,OAAS,iBAAAC,MAAwC,sCACjD,OAAS,mBAAAC,MAA4C,wCACrD,OAAS,mBAAAC,MAA4C,wCACrD,OAAS,2BAAAC,MAA4D,gDACrE,OAAS,qBAAAC,MAAgD,0CACzD,OAAS,eAAAC,MAAoC,oCAC7C,OAAS,cAAAC,MAAkC,mCAGpC,IAAKC,OACVA,EAAA,OAAS,gBACTA,EAAA,SAAW,kBACXA,EAAA,SAAW,kBACXA,EAAA,iBAAmB,0BACnBA,EAAA,WAAa,oBACbA,EAAA,qBAAuB,cACvBA,EAAA,KAAO,aAPGA,OAAA,IAgDL,MAAMC,EAAkB,CAAC,CAC9B,eAAAC,EACA,WAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,IAAAC,CACF,IAEIpB,EAACG,EAAA,CAAiB,eAAgBY,EAChC,SAAAf,EAACI,EAAA,CAAqB,KAAMY,EAAW,sBAAuB,MAAOC,GAAa,SAAS,MACzF,SAAAjB,EAACK,EAAA,CACC,QAASY,GAAa,QACtB,cAAeA,GAAa,cAC5B,iBAAkBA,GAAa,iBAC/B,gBAAiBE,EAAoB,gBACrC,gBAAiBA,EAAoB,gBACrC,WAAYF,GAAa,WACzB,oBAAqBD,EAAW,oBAChC,SAAUC,GAAa,SACvB,gBAAiBA,GAAa,gBAC9B,gBAAiBA,GAAa,gBAC9B,IAAKG,EACL,WAAYF,EAAW,OAEvB,SAAAlB,EAAC,OAAI,UAAWE,EAAW,4BAA4B,EACpD,SAAAgB,EAAW,MAAM,IAAIG,GAAO,CAC3B,MAAMC,EAAgBJ,EAAW,aAAaG,CAAG,EACjD,OAAKC,EAEHrB,EAAAF,EAAA,CACG,UAAAsB,IAAQ,iBAAuBrB,EAACM,EAAA,CAAc,KAAMgB,EAAoC,EACxFD,IAAQ,mBAAyBJ,GAAa,SAC7CjB,EAACO,EAAA,CAAgB,KAAMe,EAAsC,EAE9DD,IAAQ,mBAAyBrB,EAACQ,EAAA,CAAgB,KAAMc,EAAsC,EAC9FD,IAAQ,2BACPrB,EAACS,EAAA,CACC,KAAMa,EACN,WACEP,EAAe,QAAU,QACrB,CACE,SAAU,aACV,iBACE,4EACJ,EACA,CACE,SAAU,iBACV,iBAAkB,gBACpB,EAER,EAEDM,IAAQ,qBACPrB,EAACU,EAAA,CAAkB,KAAMY,EAAwC,EAElED,IAAQ,eAAqCrB,EAACW,EAAA,CAAY,KAAMW,EAAkC,EAClGD,IAAQ,cAAqBrB,EAACY,EAAA,CAAW,KAAMU,EAAiC,EAChFD,IAAQ,iBACPrB,EAAC,OAAI,UAAU,qEAAqE,GAExF,EAjCyB,IAmC7B,CAAC,EACH,EACF,EACF,EACF",
6
+ "names": ["Fragment", "jsx", "jsxs", "classNames", "HeadlessProvider", "RegistrationProvider", "CreditsProvider", "CreditsBanner", "CreditsInfoCard", "CreditsBenefits", "CreditsWaysToGetCredits", "CreditsRedeemList", "CreditsCash", "CreditsFaq", "ComponentKey", "CreditsTemplate", "headlessConfig", "siteConfig", "userContext", "pageConfig", "registrationContext", "gtm", "key", "componentCopy"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/campaign-ui",
3
- "version": "0.2.0-beta.1",
3
+ "version": "0.2.0-beta.10",
4
4
  "description": "Campaign UI components and utilities for Anker projects",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",
@@ -87,8 +87,8 @@
87
87
  "swiper": "^11.1.3",
88
88
  "tailwind-merge": "^2.3.0",
89
89
  "tailwindcss": "^3.4.3",
90
- "@anker-in/lib": "1.1.0",
91
- "@anker-in/headless-ui": "1.0.26"
90
+ "@anker-in/headless-ui": "1.0.26",
91
+ "@anker-in/lib": "1.1.0-beta.6"
92
92
  },
93
93
  "publishConfig": {
94
94
  "access": "public",
@@ -1,7 +1,6 @@
1
- import React, { createContext, PropsWithChildren, useContext } from 'react'
1
+ import { createContext, PropsWithChildren, useContext } from 'react'
2
2
  import type { DTC_TASK_TYPE } from './const'
3
3
  import type { CreditInfoResponse } from './response'
4
- import { AuthCodeActivate, useRegistration } from '../../registration'
5
4
  import { CreditsPageCommon } from '../type'
6
5
 
7
6
  type Context = {
@@ -52,7 +51,6 @@ export function CreditsProvider({
52
51
  gtm,
53
52
  pageCommon,
54
53
  }: PropsWithChildren<Context>) {
55
- const { copy } = useRegistration()
56
54
  return (
57
55
  <CreditsContext.Provider
58
56
  value={{
@@ -71,7 +69,6 @@ export function CreditsProvider({
71
69
  }}
72
70
  >
73
71
  {children}
74
- {copy?.authCodeActivate && <AuthCodeActivate copy={copy.authCodeActivate} autoSendEmail />}
75
72
  </CreditsContext.Provider>
76
73
  )
77
74
  }
@@ -1,7 +1,6 @@
1
1
  import { Heading, Picture, Text } from '@anker-in/headless-ui'
2
- import { classNames as cn, useHeadlessContext } from '@anker-in/lib'
2
+ import { classNames as cn, useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'
3
3
  import IconInfo from './iconInfo'
4
- import { roundedBrands } from '../const'
5
4
 
6
5
  export interface BenefitItemCopy {
7
6
  icon: {
@@ -24,9 +23,7 @@ const BenefitItem = ({
24
23
  index: number
25
24
  }) => {
26
25
  const { brand } = useHeadlessContext()
27
- console.log('brand', brand)
28
- const rounded = roundedBrands.includes(brand)
29
- console.log('rounded', rounded)
26
+ const rounded = ROUNDED_BRANDS.includes(brand)
30
27
  return (
31
28
  <div
32
29
  className={cn(
@@ -9,8 +9,7 @@ import { Swiper, SwiperSlide } from 'swiper/react'
9
9
 
10
10
  import BenefitItem, { type BenefitItemCopy } from './benefitItem'
11
11
  import { useCreditsContext } from '../context/provider'
12
- import { gaTrack, classNames as cn, useHeadlessContext } from '@anker-in/lib'
13
- import { roundedBrands } from '../const'
12
+ import { gaTrack, classNames as cn } from '@anker-in/lib'
14
13
 
15
14
  export type CreditsBenefitsCopy = {
16
15
  title: string
@@ -20,8 +19,6 @@ export type CreditsBenefitsCopy = {
20
19
  export const CreditsBenefits = ({ copy }: { copy: CreditsBenefitsCopy }) => {
21
20
  const [activeNoteIndex, setActiveNoteIndex] = useState<number | null>(null)
22
21
  const { profile, gtm } = useCreditsContext()
23
- const { brand } = useHeadlessContext()
24
- const rounded = roundedBrands.includes(brand)
25
22
  const handleClick = ({ item, index }: { item: BenefitItemCopy; index: number }) => {
26
23
  gaTrack({
27
24
  event: 'ga4Event',
@@ -4,18 +4,13 @@ import { useMemo, useState } from 'react'
4
4
  import RedeemableItem from './RedeemableItem'
5
5
  import useRedeemableList from '../context/hooks/useRedeemableList'
6
6
  import RulesModal from '../modal/rulesModal'
7
- import { useProductsByHandles, useHeadlessContext } from '@anker-in/lib'
7
+ import { useProductsByHandles } from '@anker-in/lib'
8
8
  import { CreditsCashCopy, RedeemItem } from './type'
9
9
  import { Product, classNames as cn } from '@anker-in/lib'
10
- import { useRegistration } from '../../../components/registration'
11
- import { roundedBrands } from '../const'
12
10
 
13
11
  export const CreditsCash = ({ copy }: { copy: CreditsCashCopy }) => {
14
- const { authCodeActivate } = useRegistration()
15
12
  const [rules, setRules] = useState<string | string[]>()
16
13
  const { redeemableList } = useRedeemableList()
17
- const { brand } = useHeadlessContext()
18
- const rounded = roundedBrands.includes(brand)
19
14
 
20
15
  const variantMetafieldIdentifiers: any[] = []
21
16
 
@@ -52,6 +47,8 @@ export const CreditsCash = ({ copy }: { copy: CreditsCashCopy }) => {
52
47
  .filter(Boolean) as unknown as RedeemItem[]
53
48
  }, [productByHandles, copy.list, redeemableList])
54
49
 
50
+ console.log('list', list)
51
+
55
52
  return (
56
53
  <Container className={cn('bg-[#F5F5F5]')}>
57
54
  <Heading as="h2" size="4" html={copy.title} />
@@ -1,9 +1,8 @@
1
1
  import { Container, Heading, Tabs, TabsList, TabsTrigger, Text } from '@anker-in/headless-ui'
2
- import { classNames as cn, useHeadlessContext } from '@anker-in/lib'
2
+ import { classNames as cn, useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'
3
3
  import { useMemo, useState } from 'react'
4
4
 
5
5
  import { FaqItem } from './faqItem/FaqItem'
6
- import { roundedBrands } from '../const'
7
6
 
8
7
  export type CreditsFaqCopy = {
9
8
  title: string
@@ -21,7 +20,7 @@ export type CreditsFaqCopy = {
21
20
  export const CreditsFaq = ({ copy }: { copy: CreditsFaqCopy }) => {
22
21
  const { title, items: faqList, subTitle = '' } = copy || {}
23
22
  const { brand } = useHeadlessContext()
24
- const rounded = roundedBrands.includes(brand)
23
+ const rounded = ROUNDED_BRANDS.includes(brand)
25
24
  const categoryList = useMemo(() => {
26
25
  return Array.from(new Set(faqList?.map?.(faq => faq.category_name).filter(item => !!item)))
27
26
  }, [faqList])
@@ -5,8 +5,7 @@ import { useCreditsContext } from '../context/provider'
5
5
  import { numberFormat } from '../context/utils'
6
6
  import ActivitiesModal from '../modal/activitiesModal'
7
7
  import MyRewardsModal from '../modal/MyRewardsModal'
8
- import { gaNormalClick, classNames as cn, useHeadlessContext } from '@anker-in/lib'
9
- import { roundedBrands } from '../const'
8
+ import { gaNormalClick, classNames as cn, useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'
10
9
 
11
10
  type ButtonConfig = {
12
11
  text: string
@@ -17,8 +16,6 @@ export type CreditsInfoCardCopy = {
17
16
  comingSoonLabel: string
18
17
  comingSoonTips: string
19
18
  buttons: ButtonConfig[]
20
- pointUnit: string
21
- infoIcon: string
22
19
  }
23
20
 
24
21
  export function CreditsInfoCard({ copy }: { copy: CreditsInfoCardCopy }) {
@@ -27,7 +24,8 @@ export function CreditsInfoCard({ copy }: { copy: CreditsInfoCardCopy }) {
27
24
  const [hover, setHover] = useState<boolean>(false)
28
25
  const { creditInfo, pageCommon } = useCreditsContext()
29
26
  const { brand } = useHeadlessContext()
30
- const rounded = roundedBrands.includes(brand)
27
+ const rounded = ROUNDED_BRANDS.includes(brand)
28
+
31
29
  const handleButtonClick = useCallback((buttonConfig: ButtonConfig) => {
32
30
  gaNormalClick({ position: 'info_card', label: buttonConfig.text })
33
31
 
@@ -76,7 +74,7 @@ export function CreditsInfoCard({ copy }: { copy: CreditsInfoCardCopy }) {
76
74
  <div className={cn('mr-[8px] text-[36px] font-extrabold', 'min-md:text-[44px]', 'min-xl:text-[56px]')}>
77
75
  {creditInfo ? numberFormat(creditInfo.available_credit) : 0}
78
76
  </div>
79
- <div className="text-[16px]">{copy?.pointUnit}</div>
77
+ <div className="text-[16px]">{pageCommon?.pointUnit}</div>
80
78
  </div>
81
79
  </div>
82
80
  <div className="w-fit md:flex-1">
@@ -86,7 +84,7 @@ export function CreditsInfoCard({ copy }: { copy: CreditsInfoCardCopy }) {
86
84
  <div className="group relative ml-[4px] flex cursor-pointer items-start">
87
85
  <Text
88
86
  as="div"
89
- html={copy?.infoIcon}
87
+ html={pageCommon?.infoIcon}
90
88
  className="size-[18px] cursor-pointer [&_svg]:size-full"
91
89
  onClick={() => {
92
90
  if (hover) {
@@ -127,7 +125,7 @@ export function CreditsInfoCard({ copy }: { copy: CreditsInfoCardCopy }) {
127
125
  <div className={cn('mr-[8px] text-[36px] font-extrabold', 'min-l:text-[44px]', 'min-xl:text-[56px]')}>
128
126
  {creditInfo ? numberFormat(creditInfo.pending_credit) : 0}
129
127
  </div>
130
- <div className="text-[16px]">{copy?.pointUnit}</div>
128
+ <div className="text-[16px]">{pageCommon?.pointUnit}</div>
131
129
  </div>
132
130
  </div>
133
131
  </div>
@@ -151,19 +149,19 @@ export function CreditsInfoCard({ copy }: { copy: CreditsInfoCardCopy }) {
151
149
  ))}
152
150
  </div>
153
151
 
154
- {pageCommon?.activities && (
152
+ {pageCommon?.activitiesModal && (
155
153
  <ActivitiesModal
156
154
  isOpen={openActivities}
157
- data={pageCommon?.activities}
155
+ data={pageCommon?.activitiesModal}
158
156
  onClose={() => {
159
157
  setOpenActivities(false)
160
158
  }}
161
159
  />
162
160
  )}
163
- {pageCommon?.rewards && (
161
+ {pageCommon?.rewardsModal && (
164
162
  <MyRewardsModal
165
163
  isOpen={openRewards}
166
- data={pageCommon?.rewards}
164
+ data={pageCommon?.rewardsModal}
167
165
  onClose={() => {
168
166
  setOpenRewards(false)
169
167
  }}