@anker-in/campaign-ui 0.2.0 → 0.2.2

package/dist/esm/components/credits/modal/modalContainer.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/modal/modalContainer.tsx"],
-  "sourcesContent": ["import { cn } from '../../../helpers/utils'\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"],
-  "mappings": "AA0DM,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBA1DN,OAAS,MAAAC,MAAU,yBACnB,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",
-  "names": ["jsx", "jsxs", "cn", "useEffect", "useState", "ReactModal", "CreditsModalContainer", "isOpen", "title", "className", "overlayClassName", "scrollClassName", "onClose", "onScrollEnd", "children", "useAnimation", "animationClassName", "titleClassName", "props", "animationShow", "setAnimationShow", "event", "targetElement"]
+  "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  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  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\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        !rounded && 'rounded-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"],
+  "mappings": "AA8DM,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBA9DN,OAAS,cAAcC,EAAI,sBAAAC,EAAoB,kBAAAC,MAAsB,gBACrE,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,EAExDD,EAAU,IAAM,CACTY,GAGL,sBAAsB,IAAM,CAC1BK,EAAiBb,GAAU,EAAK,CAClC,CAAC,CACH,EAAG,CAACA,EAAQQ,CAAY,CAAC,EAEzB,KAAM,CAAE,MAAAM,CAAM,EAAIpB,EAAmB,EAC/BqB,EAAUpB,EAAe,SAASmB,CAAK,EAE7C,OACEtB,EAACM,EAAA,CACC,OAAQE,GAAU,GAClB,iBAAkBP,EAChB,gGACAU,CACF,EACA,UAAWV,EACT,mMACA,CAACsB,GAAW,eACZH,EAAgB,GAAKH,EACrBP,CACF,EACA,eAAgBG,EACf,GAAGM,EAEJ,UAAAnB,EAAC,OACC,UAAWC,EACT,oDACAQ,EAAQ,+DAAiE,qBACzES,CACF,EAEA,UAAAnB,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,SAAUY,GAAS,CACjB,MAAMC,EAAgBD,EAAM,OAExBC,EAAc,cAAgBA,EAAc,cAI5CA,EAAc,UAAYA,EAAc,cAAgBA,EAAc,aAAe,IACvFX,GAAeA,EAAYU,CAAK,CAEpC,EAEC,SAAAT,EACH,GACF,CAEJ",
+  "names": ["jsx", "jsxs", "cn", "useHeadlessContext", "ROUNDED_BRANDS", "useEffect", "useState", "ReactModal", "CreditsModalContainer", "isOpen", "title", "className", "overlayClassName", "scrollClassName", "onClose", "onScrollEnd", "children", "useAnimation", "animationClassName", "titleClassName", "props", "animationShow", "setAnimationShow", "brand", "rounded", "event", "targetElement"]
 }

package/dist/esm/components/credits/modal/rulesModal.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import{Text as i}from"@anker-in/headless-ui";import{useMemo as p}from"react";import{CreditsModalContainer as d}from"./modalContainer";import{cn as o}from"../../../helpers/utils";function x({rules:e,className:n,ruleClassName:s,...r}){const a=p(()=>typeof e=="string"?t(i,{className:o("text-[16px] font-semibold",s),html:e}):t("ul",{className:"ml-4 text-[16px]",children:e?.map((l,m)=>t("li",{className:o("mb-[10px] list-disc"),children:t(i,{as:"div",className:o("text-[16px] font-semibold leading-[1.4] text-[#777777]",s),html:l})},m))}),[s,e]);return t(d,{className:o("max-h-[90vh] w-[640px]",n),...r,children:a})}var C=x;export{C as default};
+import{jsx as t}from"react/jsx-runtime";import{Text as a}from"@anker-in/headless-ui";import{useMemo as p}from"react";import{CreditsModalContainer as d}from"./modalContainer";import{classNames as o}from"@anker-in/lib";function x({rules:e,className:i,ruleClassName:s,...n}){const r=p(()=>typeof e=="string"?t(a,{className:o("text-[16px] font-semibold",s),html:e}):t("ul",{className:"ml-4 text-[16px]",children:e?.map((l,m)=>t("li",{className:o("mb-[10px] list-disc"),children:t(a,{as:"div",className:o("text-[16px] font-semibold leading-[1.4] text-[#777777]",s),html:l})},m))}),[s,e]);return t(d,{className:o("max-h-[90vh] w-[640px]",i),...n,children:r})}var C=x;export{C as default};
 //# sourceMappingURL=rulesModal.js.map

package/dist/esm/components/credits/modal/rulesModal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/modal/rulesModal.tsx"],
-  "sourcesContent": ["import { Text } from '@anker-in/headless-ui'\nimport { useMemo } from 'react'\n\nimport { CreditsModalContainer, type ModalContainerProps } from './modalContainer'\nimport { cn } from '../../../helpers/utils'\n\nfunction RulesModal({\n  rules,\n  className,\n  ruleClassName,\n  ...props\n}: {\n  rules: string | string[]\n  ruleClassName?: string\n  className?: string\n} & ModalContainerProps) {\n  const rulesComponent = useMemo(() => {\n    if (typeof rules === 'string') {\n      return <Text className={cn('text-[16px] font-semibold', ruleClassName)} html={rules}></Text>\n    } else {\n      return (\n        <ul className=\"ml-4 text-[16px]\">\n          {rules?.map((rule, index) => (\n            <li key={index} className={cn('mb-[10px] list-disc')}>\n              <Text\n                as=\"div\"\n                className={cn('text-[16px] font-semibold leading-[1.4] text-[#777777]', ruleClassName)}\n                html={rule}\n              ></Text>\n            </li>\n          ))}\n        </ul>\n      )\n    }\n  }, [ruleClassName, rules])\n\n  return (\n    <CreditsModalContainer className={cn('max-h-[90vh] w-[640px]', className)} {...props}>\n      {rulesComponent}\n    </CreditsModalContainer>\n  )\n}\n\nexport default RulesModal\n"],
-  "mappings": "AAkBa,cAAAA,MAAA,oBAlBb,OAAS,QAAAC,MAAY,wBACrB,OAAS,WAAAC,MAAe,QAExB,OAAS,yBAAAC,MAAuD,mBAChE,OAAS,MAAAC,MAAU,yBAEnB,SAASC,EAAW,CAClB,MAAAC,EACA,UAAAC,EACA,cAAAC,EACA,GAAGC,CACL,EAIyB,CACvB,MAAMC,EAAiBR,EAAQ,IACzB,OAAOI,GAAU,SACZN,EAACC,EAAA,CAAK,UAAWG,EAAG,4BAA6BI,CAAa,EAAG,KAAMF,EAAO,EAGnFN,EAAC,MAAG,UAAU,mBACX,SAAAM,GAAO,IAAI,CAACK,EAAMC,IACjBZ,EAAC,MAAe,UAAWI,EAAG,qBAAqB,EACjD,SAAAJ,EAACC,EAAA,CACC,GAAG,MACH,UAAWG,EAAG,yDAA0DI,CAAa,EACrF,KAAMG,EACP,GALMC,CAMT,CACD,EACH,EAGH,CAACJ,EAAeF,CAAK,CAAC,EAEzB,OACEN,EAACG,EAAA,CAAsB,UAAWC,EAAG,yBAA0BG,CAAS,EAAI,GAAGE,EAC5E,SAAAC,EACH,CAEJ,CAEA,IAAOG,EAAQR",
+  "sourcesContent": ["import { Text } from '@anker-in/headless-ui'\nimport { useMemo } from 'react'\n\nimport { CreditsModalContainer, type ModalContainerProps } from './modalContainer'\nimport { classNames as cn } from '@anker-in/lib'\n\nfunction RulesModal({\n  rules,\n  className,\n  ruleClassName,\n  ...props\n}: {\n  rules: string | string[]\n  ruleClassName?: string\n  className?: string\n} & ModalContainerProps) {\n  const rulesComponent = useMemo(() => {\n    if (typeof rules === 'string') {\n      return <Text className={cn('text-[16px] font-semibold', ruleClassName)} html={rules}></Text>\n    } else {\n      return (\n        <ul className=\"ml-4 text-[16px]\">\n          {rules?.map((rule, index) => (\n            <li key={index} className={cn('mb-[10px] list-disc')}>\n              <Text\n                as=\"div\"\n                className={cn('text-[16px] font-semibold leading-[1.4] text-[#777777]', ruleClassName)}\n                html={rule}\n              ></Text>\n            </li>\n          ))}\n        </ul>\n      )\n    }\n  }, [ruleClassName, rules])\n\n  return (\n    <CreditsModalContainer className={cn('max-h-[90vh] w-[640px]', className)} {...props}>\n      {rulesComponent}\n    </CreditsModalContainer>\n  )\n}\n\nexport default RulesModal\n"],
+  "mappings": "AAkBa,cAAAA,MAAA,oBAlBb,OAAS,QAAAC,MAAY,wBACrB,OAAS,WAAAC,MAAe,QAExB,OAAS,yBAAAC,MAAuD,mBAChE,OAAS,cAAcC,MAAU,gBAEjC,SAASC,EAAW,CAClB,MAAAC,EACA,UAAAC,EACA,cAAAC,EACA,GAAGC,CACL,EAIyB,CACvB,MAAMC,EAAiBR,EAAQ,IACzB,OAAOI,GAAU,SACZN,EAACC,EAAA,CAAK,UAAWG,EAAG,4BAA6BI,CAAa,EAAG,KAAMF,EAAO,EAGnFN,EAAC,MAAG,UAAU,mBACX,SAAAM,GAAO,IAAI,CAACK,EAAMC,IACjBZ,EAAC,MAAe,UAAWI,EAAG,qBAAqB,EACjD,SAAAJ,EAACC,EAAA,CACC,GAAG,MACH,UAAWG,EAAG,yDAA0DI,CAAa,EACrF,KAAMG,EACP,GALMC,CAMT,CACD,EACH,EAGH,CAACJ,EAAeF,CAAK,CAAC,EAEzB,OACEN,EAACG,EAAA,CAAsB,UAAWC,EAAG,yBAA0BG,CAAS,EAAI,GAAGE,EAC5E,SAAAC,EACH,CAEJ,CAEA,IAAOG,EAAQR",
   "names": ["jsx", "Text", "useMemo", "CreditsModalContainer", "cn", "RulesModal", "rules", "className", "ruleClassName", "props", "rulesComponent", "rule", "index", "rulesModal_default"]
 }

package/dist/esm/components/credits/modal/subscribeModal.d.ts

@@ -0,0 +1,15 @@
+import { type ModalContainerProps } from './modalContainer';
+export type CreditsSubscribeModalCopy = {
+    title: string;
+    desc?: string;
+    placeholder: string;
+    policy?: string;
+    successTips?: string;
+    dealsType?: string;
+};
+interface CreditsSubscribeModalProps extends ModalContainerProps {
+    copy: CreditsSubscribeModalCopy;
+    onSuccess?: () => void;
+}
+export declare function CreditsSubscribeModal({ copy, onSuccess, ...props }: CreditsSubscribeModalProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/credits/modal/subscribeModal.js

@@ -0,0 +1,2 @@
+import{jsx as t,jsxs as g}from"react/jsx-runtime";import{useCallback as T,useEffect as P,useState as l}from"react";import{useRouter as k}from"next/router";import{Button as A,Checkbox as D,Picture as I,Text as x}from"@anker-in/headless-ui";import{classNames as n,fetcher as L,gaTrack as b,useHeadlessContext as R,ROUNDED_BRANDS as B}from"@anker-in/lib";import r from"js-cookie";import{parse as F}from"query-string";import H from"crypto-js/sha256";import{useCreditsContext as q}from"../context/provider";import{emailValidate as O}from"../context/utils";import{CreditsModalContainer as U}from"./modalContainer";const V=()=>{if(typeof window>"u")return{register_source:""};const{search:e,href:a}=window.location||{},o=F(e);return{fbuy_ref_code:r.get("fbuy_ref_code"),affiliate:r.get("affiliate"),ref:r.get("ref_ads"),inviter_code:o.ic||o.inviter_code||r.get("inviter_code"),register_source:o.redirect||r.get("reg_source")||a,deals_type:r.get("deal"),transfer_id:r.get("transfer_id")}};function j({copy:e,onSuccess:a,...o}){const{brand:p}=R(),u=B.includes(p),{locale:h}=k(),[d,M]=l(!1),[s,v]=l(""),[_,i]=l(""),[C,y]=l(""),[w,N]=l(!1),{profile:c}=q(),S=T(m=>{i(""),v(m.target?.value?.trim())},[]),E=T(async()=>{if(i(""),!s)return i("Please fill in your email");if(!O(s))return i("Invalid email address");if(!d)return i("Please agree to the policy");N(!0);const{register_source:m}=V(),f=await L({locale:h,action:"subscribe",url:"/api/multipass/subscribe/subscribe_emails",method:"POST",body:{email:s,register_source:m,brand:p,deals_type:e.dealsType||"vip_subscribe"},headers:{},type:""});N(!1),f.errors?i(f.errors||f.statusText):(y(e.successTips||"Subscribed successfully!"),a&&a(),setTimeout(()=>{y("")},3e3),b({subscribe_hashed_email:s?H(s):""}),b({event:"ga4Event",event_name:"subscribe",event_parameters:{page_group:e.dealsType||"vip_subscribe",position:"pop_up"}}),b({event:"uaEvent",eventCategory:"subscribe",eventAction:e.dealsType||"vip_subscribe",eventLabel:"pop_up",nonInteraction:!1}))},[s,d,h,p,e.dealsType,e.successTips,a]);return P(()=>{c&&c?.email&&v(c?.email)},[c]),t(U,{className:"w-[540px] md:h-auto",scrollClassName:"mb-[40px] min-l:px-[48px] md:mb-[24px]",titleClassName:"h-[56px]",useAnimation:!0,animationClassName:"md:translate-y-[100vh]",...o,children:g("div",{className:"flex flex-col gap-[16px] text-center min-l:px-[16px]",children:[t("div",{children:t(x,{className:n("mb-[24px] text-[22px] font-bold"),html:e.title})}),e.desc&&t(x,{className:"mb-[8px] text-left text-[16px] font-semibold leading-[1.4] text-[#1F2021]",html:e.desc}),g("div",{className:n("relative flex h-[52px] w-full overflow-hidden rounded-[2px] md:grid md:h-auto md:grid-rows-1 md:gap-[16px]",!u&&"rounded-none"),children:[t("input",{className:n("h-full flex-1 rounded-l-[2px] border-[1px] border-[#d8d8d8] px-[14px] py-[17px] text-[16px] font-semibold leading-[1] outline-none placeholder:text-[#999] md:h-[52px] md:rounded-[2px]",!u&&"rounded-none"),placeholder:e.placeholder,value:s,onChange:S}),t(A,{variant:"primary",onClick:E,loading:w,className:n("legacy-headless-ui-primary-button !h-full !min-w-0 !rounded-l-none !rounded-r-[2px] !px-[40px] !py-[13px]",!u&&"rounded-none"),children:t(I,{source:"https://cdn.shopify.com/s/files/1/0512/8568/8505/files/icon_email.png?v=1697527383",className:"h-[24px] w-[24px]",alt:"email"})})]}),g("div",{className:"flex w-full",children:[t(D,{checked:d,onCheckedChange:()=>M(!d),required:!0,className:"border-[#1d1d1f]"}),t("label",{className:"text-left ml-2 text-[14px] font-semibold text-[#777] [&_a]:underline",dangerouslySetInnerHTML:{__html:e?.policy||""}})]}),t("div",{className:n("w-full text-left text-[16px] font-semibold",_&&"text-[#F84D4F]",C&&"text-[#52C41A]"),children:t(x,{html:C||_||""})})]})})}export{j as CreditsSubscribeModal};
+//# sourceMappingURL=subscribeModal.js.map

package/dist/esm/components/credits/modal/subscribeModal.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/credits/modal/subscribeModal.tsx"],
+  "sourcesContent": ["import { useCallback, useEffect, useState } from 'react'\nimport { useRouter } from 'next/router'\nimport { Button, Checkbox, Picture, Text } from '@anker-in/headless-ui'\nimport { classNames, fetcher, gaTrack, useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'\nimport Cookies from 'js-cookie'\nimport { parse } from 'query-string'\nimport sha256 from 'crypto-js/sha256'\nimport { useCreditsContext } from '../context/provider'\nimport { emailValidate } from '../context/utils'\nimport { CreditsModalContainer, type ModalContainerProps } from './modalContainer'\n\nexport type CreditsSubscribeModalCopy = {\n  title: string\n  desc?: string\n  placeholder: string\n  policy?: string\n  successTips?: string\n  dealsType?: string\n}\n\ninterface CreditsSubscribeModalProps extends ModalContainerProps {\n  copy: CreditsSubscribeModalCopy\n  onSuccess?: () => void\n}\n\nconst getAdCookie = () => {\n  if (typeof window === 'undefined') {\n    return { register_source: '' }\n  }\n  const { search, href } = window.location || {}\n  const query = parse(search)\n\n  return {\n    fbuy_ref_code: Cookies.get('fbuy_ref_code'),\n    affiliate: Cookies.get('affiliate'),\n    ref: Cookies.get('ref_ads'),\n    inviter_code: query.ic || query.inviter_code || Cookies.get('inviter_code'),\n    register_source: query.redirect || Cookies.get('reg_source') || href,\n    deals_type: Cookies.get('deal'),\n    transfer_id: Cookies.get('transfer_id'),\n  }\n}\n\nexport function CreditsSubscribeModal({ copy, onSuccess, ...props }: CreditsSubscribeModalProps) {\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n  const { locale } = useRouter()\n  const [policy, setPolicy] = useState(false)\n  const [email, setEmail] = useState('')\n  const [errorMessage, setErrorMessage] = useState('')\n  const [successMessage, setSuccessMessage] = useState('')\n  const [loading, setLoading] = useState(false)\n  const { profile } = useCreditsContext()\n\n  const handleEmailChange = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n    setErrorMessage('')\n    setEmail(event.target?.value?.trim())\n  }, [])\n\n  const handleSubmit = useCallback(async () => {\n    setErrorMessage('')\n    if (!email) {\n      return setErrorMessage('Please fill in your email')\n    }\n\n    if (!emailValidate(email)) {\n      return setErrorMessage('Invalid email address')\n    }\n\n    if (!policy) {\n      return setErrorMessage('Please agree to the policy')\n    }\n\n    setLoading(true)\n    const { register_source } = getAdCookie()\n\n    const result = await fetcher({\n      locale,\n      action: 'subscribe',\n      url: '/api/multipass/subscribe/subscribe_emails',\n      method: 'POST',\n      body: {\n        email,\n        register_source,\n        brand,\n        deals_type: copy.dealsType || 'vip_subscribe',\n      },\n      headers: {},\n      type: '',\n    })\n    setLoading(false)\n\n    if (!result.errors) {\n      setSuccessMessage(copy.successTips || 'Subscribed successfully!')\n      if (onSuccess) {\n        onSuccess()\n      }\n      setTimeout(() => {\n        setSuccessMessage('')\n      }, 3000)\n      gaTrack({\n        subscribe_hashed_email: email ? sha256(email) : '',\n      })\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'subscribe',\n        event_parameters: {\n          page_group: copy.dealsType || 'vip_subscribe',\n          position: 'pop_up',\n        },\n      })\n      gaTrack({\n        event: 'uaEvent',\n        eventCategory: 'subscribe',\n        eventAction: copy.dealsType || 'vip_subscribe',\n        eventLabel: 'pop_up',\n        nonInteraction: false,\n      })\n    } else {\n      setErrorMessage(result.errors || result.statusText)\n    }\n  }, [email, policy, locale, brand, copy.dealsType, copy.successTips, onSuccess])\n\n  useEffect(() => {\n    if (profile && profile?.email) {\n      setEmail(profile?.email)\n    }\n  }, [profile])\n\n  return (\n    <CreditsModalContainer\n      className=\"w-[540px] md:h-auto\"\n      scrollClassName=\"mb-[40px] min-l:px-[48px] md:mb-[24px]\"\n      titleClassName=\"h-[56px]\"\n      useAnimation\n      animationClassName=\"md:translate-y-[100vh]\"\n      {...props}\n    >\n      <div className=\"flex flex-col gap-[16px] text-center min-l:px-[16px]\">\n        <div>\n          <Text className={classNames('mb-[24px] text-[22px] font-bold')} html={copy.title}></Text>\n        </div>\n        {copy.desc && (\n          <Text\n            className=\"mb-[8px] text-left text-[16px] font-semibold leading-[1.4] text-[#1F2021]\"\n            html={copy.desc}\n          ></Text>\n        )}\n        <div\n          className={classNames(\n            'relative flex h-[52px] w-full overflow-hidden rounded-[2px] md:grid md:h-auto md:grid-rows-1 md:gap-[16px]',\n            !rounded && 'rounded-none'\n          )}\n        >\n          <input\n            className={classNames(\n              'h-full flex-1 rounded-l-[2px] border-[1px] border-[#d8d8d8] px-[14px] py-[17px] text-[16px] font-semibold leading-[1] outline-none placeholder:text-[#999] md:h-[52px] md:rounded-[2px]',\n              !rounded && 'rounded-none'\n            )}\n            placeholder={copy.placeholder}\n            value={email}\n            onChange={handleEmailChange}\n          />\n          <Button\n            variant=\"primary\"\n            onClick={handleSubmit}\n            loading={loading}\n            className={classNames(\n              'legacy-headless-ui-primary-button !h-full !min-w-0 !rounded-l-none !rounded-r-[2px] !px-[40px] !py-[13px]',\n              !rounded && 'rounded-none'\n            )}\n          >\n            <Picture\n              source=\"https://cdn.shopify.com/s/files/1/0512/8568/8505/files/icon_email.png?v=1697527383\"\n              className=\"h-[24px] w-[24px]\"\n              alt=\"email\"\n            />\n          </Button>\n        </div>\n        <div className=\"flex w-full\">\n          <Checkbox checked={policy} onCheckedChange={() => setPolicy(!policy)} required className=\"border-[#1d1d1f]\" />\n          <label\n            className=\"text-left ml-2 text-[14px] font-semibold text-[#777] [&_a]:underline\"\n            dangerouslySetInnerHTML={{\n              __html: copy?.policy || '',\n            }}\n          />\n        </div>\n        <div\n          className={classNames(\n            'w-full text-left text-[16px] font-semibold',\n            errorMessage && 'text-[#F84D4F]',\n            successMessage && 'text-[#52C41A]'\n          )}\n        >\n          <Text html={successMessage || errorMessage || ''} />\n        </div>\n      </div>\n    </CreditsModalContainer>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "useCallback", "useEffect", "useState", "useRouter", "Button", "Checkbox", "Picture", "Text", "classNames", "fetcher", "gaTrack", "useHeadlessContext", "ROUNDED_BRANDS", "Cookies", "parse", "sha256", "useCreditsContext", "emailValidate", "CreditsModalContainer", "getAdCookie", "search", "href", "query", "CreditsSubscribeModal", "copy", "onSuccess", "props", "brand", "rounded", "locale", "policy", "setPolicy", "email", "setEmail", "errorMessage", "setErrorMessage", "successMessage", "setSuccessMessage", "loading", "setLoading", "profile", "handleEmailChange", "event", "handleSubmit", "register_source", "result"]
+}

package/dist/esm/components/credits/modal/tip.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as s}from"react/jsx-runtime";import a from"classnames";import{useState as i}from"react";function n({info:l,index:o}){const[p,t]=i(!1);return s("div",{className:"relative ml-[6px] cursor-pointer",onClick:()=>{t(!p)},role:"button",tabIndex:0,onKeyDown:r=>{(r.key==="Enter"||r.key===" ")&&r.preventDefault()},onMouseOver:()=>{t(!0)},onFocus:()=>{t(!0)},onMouseLeave:()=>{t(!1)},onBlur:()=>{t(!1)},children:[e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",children:e("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M9 18C13.9706 18 18 13.9706 18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18ZM9.765 10.7118H8.316C8.316 9.71658 8.95624 9.11788 9.5487 8.56386C10.0589 8.08679 10.5336 7.64285 10.5336 7.0074C10.5336 6.2766 9.9918 5.9112 9.1854 5.9112C8.3916 5.9112 7.7994 6.327 7.5474 7.0704L6.3 6.3648C6.7788 5.13 7.938 4.5 9.2232 4.5C10.6218 4.5 11.9826 5.3316 11.9826 6.9192C11.9826 7.95842 11.3297 8.58584 10.7324 9.15979C10.2289 9.64359 9.765 10.0894 9.765 10.7118ZM9.9918 12.69C9.9918 13.2066 9.5634 13.635 9.0468 13.635C8.5176 13.635 8.1018 13.2066 8.1018 12.69C8.1018 12.1608 8.5176 11.745 9.0468 11.745C9.5634 11.745 9.9918 12.1608 9.9918 12.69Z",fill:"#999999"})}),s("div",{className:a("absolute -right-[14px] hidden min-w-[300px] shadow-[0px_1px_12px_0px_rgba(0,0,0,0.12)]",o===0?"top-[33px]":"bottom-[33px]",p&&"!block"),children:[e("i",{className:"absolute right-[8px] blur-[12px]",style:o===0?{top:"-9px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderBottom:"8px solid rgba(0,0,0,0.12)"}:{bottom:"-9px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderTop:"8px solid rgba(0,0,0,0.12)"}}),e("i",{className:"absolute right-[8px]",style:o===0?{top:"-7px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderBottom:"8px solid #fff "}:{bottom:"-7px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderTop:"8px solid #fff "}}),e("p",{className:"relative block rounded-[4px] bg-white px-[14px] py-[12px]",children:e("span",{className:"block text-left text-[14px] font-semibold leading-[1.4] text-[#333]",children:l})})]})]})}var b=n;export{b as default};
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import{useHeadlessContext as d,ROUNDED_BRANDS as x}from"@anker-in/lib";import p from"classnames";import{useState as b}from"react";function f({info:n,index:t}){const[s,o]=b(!1),{brand:a}=d(),i=x.includes(a);return l("div",{className:"relative ml-[6px] cursor-pointer",onClick:()=>{o(!s)},role:"button",tabIndex:0,onKeyDown:r=>{(r.key==="Enter"||r.key===" ")&&r.preventDefault()},onMouseOver:()=>{o(!0)},onFocus:()=>{o(!0)},onMouseLeave:()=>{o(!1)},onBlur:()=>{o(!1)},children:[e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",children:e("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M9 18C13.9706 18 18 13.9706 18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18ZM9.765 10.7118H8.316C8.316 9.71658 8.95624 9.11788 9.5487 8.56386C10.0589 8.08679 10.5336 7.64285 10.5336 7.0074C10.5336 6.2766 9.9918 5.9112 9.1854 5.9112C8.3916 5.9112 7.7994 6.327 7.5474 7.0704L6.3 6.3648C6.7788 5.13 7.938 4.5 9.2232 4.5C10.6218 4.5 11.9826 5.3316 11.9826 6.9192C11.9826 7.95842 11.3297 8.58584 10.7324 9.15979C10.2289 9.64359 9.765 10.0894 9.765 10.7118ZM9.9918 12.69C9.9918 13.2066 9.5634 13.635 9.0468 13.635C8.5176 13.635 8.1018 13.2066 8.1018 12.69C8.1018 12.1608 8.5176 11.745 9.0468 11.745C9.5634 11.745 9.9918 12.1608 9.9918 12.69Z",fill:"#999999"})}),l("div",{className:p("absolute -right-[14px] hidden min-w-[300px] shadow-[0px_1px_12px_0px_rgba(0,0,0,0.12)]",t===0?"top-[33px]":"bottom-[33px]",s&&"!block"),children:[e("i",{className:"absolute right-[8px] blur-[12px]",style:t===0?{top:"-9px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderBottom:"8px solid rgba(0,0,0,0.12)"}:{bottom:"-9px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderTop:"8px solid rgba(0,0,0,0.12)"}}),e("i",{className:"absolute right-[8px]",style:t===0?{top:"-7px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderBottom:"8px solid #fff "}:{bottom:"-7px",borderRight:"16px solid transparent ",borderLeft:"16px solid transparent ",borderTop:"8px solid #fff "}}),e("p",{className:p("relative block rounded-[4px] bg-white px-[14px] py-[12px]",!i&&"rounded-none"),children:e("span",{className:"block text-left text-[14px] font-semibold leading-[1.4] text-[#333]",children:n})})]})]})}var g=f;export{g as default};
 //# sourceMappingURL=tip.js.map

package/dist/esm/components/credits/modal/tip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/credits/modal/tip.tsx"],
-  "sourcesContent": ["import classNames from 'classnames'\nimport { useState } from 'react'\n\nfunction Tip({ info, index }: { info: string; index: number }) {\n  const [show, setShow] = useState(false)\n\n  return (\n    <div\n      className=\"relative ml-[6px] cursor-pointer\"\n      onClick={() => {\n        setShow(!show)\n      }}\n      role=\"button\"\n      tabIndex={0}\n      onKeyDown={e => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault()\n        }\n      }}\n      onMouseOver={() => {\n        setShow(true)\n      }}\n      onFocus={() => {\n        setShow(true)\n      }}\n      onMouseLeave={() => {\n        setShow(false)\n      }}\n      onBlur={() => {\n        setShow(false)\n      }}\n    >\n      <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M9 18C13.9706 18 18 13.9706 18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18ZM9.765 10.7118H8.316C8.316 9.71658 8.95624 9.11788 9.5487 8.56386C10.0589 8.08679 10.5336 7.64285 10.5336 7.0074C10.5336 6.2766 9.9918 5.9112 9.1854 5.9112C8.3916 5.9112 7.7994 6.327 7.5474 7.0704L6.3 6.3648C6.7788 5.13 7.938 4.5 9.2232 4.5C10.6218 4.5 11.9826 5.3316 11.9826 6.9192C11.9826 7.95842 11.3297 8.58584 10.7324 9.15979C10.2289 9.64359 9.765 10.0894 9.765 10.7118ZM9.9918 12.69C9.9918 13.2066 9.5634 13.635 9.0468 13.635C8.5176 13.635 8.1018 13.2066 8.1018 12.69C8.1018 12.1608 8.5176 11.745 9.0468 11.745C9.5634 11.745 9.9918 12.1608 9.9918 12.69Z\"\n          fill=\"#999999\"\n        />\n      </svg>\n      <div\n        className={classNames(\n          'absolute -right-[14px] hidden min-w-[300px] shadow-[0px_1px_12px_0px_rgba(0,0,0,0.12)]',\n          index === 0 ? 'top-[33px]' : 'bottom-[33px]',\n          show && '!block'\n        )}\n      >\n        <i\n          className=\"absolute right-[8px] blur-[12px]\"\n          style={\n            index === 0\n              ? {\n                  top: '-9px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderBottom: '8px solid rgba(0,0,0,0.12)',\n                }\n              : {\n                  bottom: '-9px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderTop: '8px solid rgba(0,0,0,0.12)',\n                }\n          }\n        ></i>\n        <i\n          className=\"absolute right-[8px]\"\n          style={\n            index === 0\n              ? {\n                  top: '-7px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderBottom: '8px solid #fff ',\n                }\n              : {\n                  bottom: '-7px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderTop: '8px solid #fff ',\n                }\n          }\n        ></i>\n        <p className=\"relative block rounded-[4px] bg-white px-[14px] py-[12px]\">\n          <span className=\"block text-left text-[14px] font-semibold leading-[1.4] text-[#333]\">{info}</span>\n        </p>\n      </div>\n    </div>\n  )\n}\n\nexport default Tip\n"],
-  "mappings": "AAiCQ,cAAAA,EAOF,QAAAC,MAPE,oBAjCR,OAAOC,MAAgB,aACvB,OAAS,YAAAC,MAAgB,QAEzB,SAASC,EAAI,CAAE,KAAAC,EAAM,MAAAC,CAAM,EAAoC,CAC7D,KAAM,CAACC,EAAMC,CAAO,EAAIL,EAAS,EAAK,EAEtC,OACEF,EAAC,OACC,UAAU,mCACV,QAAS,IAAM,CACbO,EAAQ,CAACD,CAAI,CACf,EACA,KAAK,SACL,SAAU,EACV,UAAWE,GAAK,EACVA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MACjCA,EAAE,eAAe,CAErB,EACA,YAAa,IAAM,CACjBD,EAAQ,EAAI,CACd,EACA,QAAS,IAAM,CACbA,EAAQ,EAAI,CACd,EACA,aAAc,IAAM,CAClBA,EAAQ,EAAK,CACf,EACA,OAAQ,IAAM,CACZA,EAAQ,EAAK,CACf,EAEA,UAAAR,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,YAAU,UACV,YAAU,UACV,EAAE,8pBACF,KAAK,UACP,EACF,EACAC,EAAC,OACC,UAAWC,EACT,yFACAI,IAAU,EAAI,aAAe,gBAC7BC,GAAQ,QACV,EAEA,UAAAP,EAAC,KACC,UAAU,mCACV,MACEM,IAAU,EACN,CACE,IAAK,OACL,YAAa,0BACb,WAAY,0BACZ,aAAc,4BAChB,EACA,CACE,OAAQ,OACR,YAAa,0BACb,WAAY,0BACZ,UAAW,4BACb,EAEP,EACDN,EAAC,KACC,UAAU,uBACV,MACEM,IAAU,EACN,CACE,IAAK,OACL,YAAa,0BACb,WAAY,0BACZ,aAAc,iBAChB,EACA,CACE,OAAQ,OACR,YAAa,0BACb,WAAY,0BACZ,UAAW,iBACb,EAEP,EACDN,EAAC,KAAE,UAAU,4DACX,SAAAA,EAAC,QAAK,UAAU,sEAAuE,SAAAK,EAAK,EAC9F,GACF,GACF,CAEJ,CAEA,IAAOK,EAAQN",
-  "names": ["jsx", "jsxs", "classNames", "useState", "Tip", "info", "index", "show", "setShow", "e", "tip_default"]
+  "sourcesContent": ["import { useHeadlessContext, ROUNDED_BRANDS } from '@anker-in/lib'\nimport classNames from 'classnames'\nimport { useState } from 'react'\n\nfunction Tip({ info, index }: { info: string; index: number }) {\n  const [show, setShow] = useState(false)\n\n  const { brand } = useHeadlessContext()\n  const rounded = ROUNDED_BRANDS.includes(brand)\n\n  return (\n    <div\n      className=\"relative ml-[6px] cursor-pointer\"\n      onClick={() => {\n        setShow(!show)\n      }}\n      role=\"button\"\n      tabIndex={0}\n      onKeyDown={e => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault()\n        }\n      }}\n      onMouseOver={() => {\n        setShow(true)\n      }}\n      onFocus={() => {\n        setShow(true)\n      }}\n      onMouseLeave={() => {\n        setShow(false)\n      }}\n      onBlur={() => {\n        setShow(false)\n      }}\n    >\n      <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M9 18C13.9706 18 18 13.9706 18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18ZM9.765 10.7118H8.316C8.316 9.71658 8.95624 9.11788 9.5487 8.56386C10.0589 8.08679 10.5336 7.64285 10.5336 7.0074C10.5336 6.2766 9.9918 5.9112 9.1854 5.9112C8.3916 5.9112 7.7994 6.327 7.5474 7.0704L6.3 6.3648C6.7788 5.13 7.938 4.5 9.2232 4.5C10.6218 4.5 11.9826 5.3316 11.9826 6.9192C11.9826 7.95842 11.3297 8.58584 10.7324 9.15979C10.2289 9.64359 9.765 10.0894 9.765 10.7118ZM9.9918 12.69C9.9918 13.2066 9.5634 13.635 9.0468 13.635C8.5176 13.635 8.1018 13.2066 8.1018 12.69C8.1018 12.1608 8.5176 11.745 9.0468 11.745C9.5634 11.745 9.9918 12.1608 9.9918 12.69Z\"\n          fill=\"#999999\"\n        />\n      </svg>\n      <div\n        className={classNames(\n          'absolute -right-[14px] hidden min-w-[300px] shadow-[0px_1px_12px_0px_rgba(0,0,0,0.12)]',\n          index === 0 ? 'top-[33px]' : 'bottom-[33px]',\n          show && '!block'\n        )}\n      >\n        <i\n          className=\"absolute right-[8px] blur-[12px]\"\n          style={\n            index === 0\n              ? {\n                  top: '-9px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderBottom: '8px solid rgba(0,0,0,0.12)',\n                }\n              : {\n                  bottom: '-9px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderTop: '8px solid rgba(0,0,0,0.12)',\n                }\n          }\n        ></i>\n        <i\n          className=\"absolute right-[8px]\"\n          style={\n            index === 0\n              ? {\n                  top: '-7px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderBottom: '8px solid #fff ',\n                }\n              : {\n                  bottom: '-7px',\n                  borderRight: '16px solid transparent ',\n                  borderLeft: '16px solid transparent ',\n                  borderTop: '8px solid #fff ',\n                }\n          }\n        ></i>\n        <p\n          className={classNames(\n            'relative block rounded-[4px] bg-white px-[14px] py-[12px]',\n            !rounded && 'rounded-none'\n          )}\n        >\n          <span className=\"block text-left text-[14px] font-semibold leading-[1.4] text-[#333]\">{info}</span>\n        </p>\n      </div>\n    </div>\n  )\n}\n\nexport default Tip\n"],
+  "mappings": "AAqCQ,cAAAA,EAOF,QAAAC,MAPE,oBArCR,OAAS,sBAAAC,EAAoB,kBAAAC,MAAsB,gBACnD,OAAOC,MAAgB,aACvB,OAAS,YAAAC,MAAgB,QAEzB,SAASC,EAAI,CAAE,KAAAC,EAAM,MAAAC,CAAM,EAAoC,CAC7D,KAAM,CAACC,EAAMC,CAAO,EAAIL,EAAS,EAAK,EAEhC,CAAE,MAAAM,CAAM,EAAIT,EAAmB,EAC/BU,EAAUT,EAAe,SAASQ,CAAK,EAE7C,OACEV,EAAC,OACC,UAAU,mCACV,QAAS,IAAM,CACbS,EAAQ,CAACD,CAAI,CACf,EACA,KAAK,SACL,SAAU,EACV,UAAWI,GAAK,EACVA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MACjCA,EAAE,eAAe,CAErB,EACA,YAAa,IAAM,CACjBH,EAAQ,EAAI,CACd,EACA,QAAS,IAAM,CACbA,EAAQ,EAAI,CACd,EACA,aAAc,IAAM,CAClBA,EAAQ,EAAK,CACf,EACA,OAAQ,IAAM,CACZA,EAAQ,EAAK,CACf,EAEA,UAAAV,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,YAAU,UACV,YAAU,UACV,EAAE,8pBACF,KAAK,UACP,EACF,EACAC,EAAC,OACC,UAAWG,EACT,yFACAI,IAAU,EAAI,aAAe,gBAC7BC,GAAQ,QACV,EAEA,UAAAT,EAAC,KACC,UAAU,mCACV,MACEQ,IAAU,EACN,CACE,IAAK,OACL,YAAa,0BACb,WAAY,0BACZ,aAAc,4BAChB,EACA,CACE,OAAQ,OACR,YAAa,0BACb,WAAY,0BACZ,UAAW,4BACb,EAEP,EACDR,EAAC,KACC,UAAU,uBACV,MACEQ,IAAU,EACN,CACE,IAAK,OACL,YAAa,0BACb,WAAY,0BACZ,aAAc,iBAChB,EACA,CACE,OAAQ,OACR,YAAa,0BACb,WAAY,0BACZ,UAAW,iBACb,EAEP,EACDR,EAAC,KACC,UAAWI,EACT,4DACA,CAACQ,GAAW,cACd,EAEA,SAAAZ,EAAC,QAAK,UAAU,sEAAuE,SAAAO,EAAK,EAC9F,GACF,GACF,CAEJ,CAEA,IAAOO,EAAQR",
+  "names": ["jsx", "jsxs", "useHeadlessContext", "ROUNDED_BRANDS", "classNames", "useState", "Tip", "info", "index", "show", "setShow", "brand", "rounded", "e", "tip_default"]
 }

package/dist/esm/components/credits/type.d.ts

@@ -1,5 +1,7 @@
 import type { Product, ProductVariant } from '@anker-in/lib';
 import type { AlpcConsumeType, ConsumeType } from './context/const';
+import { MyActivitiesMetafields } from './modal/activitiesModal';
+import { MyRewardsMetafields } from './modal/MyRewardsModal';
 export interface Subscription {
     preference: {
         subscribe: boolean;
@@ -44,12 +46,29 @@ export interface ShippingZone {
     countries: ShippingCountry[];
 }
 export type CreditsPageCommon = {
-    pointUnit: string;
-    ruleLabel: string;
-    soldOut: string;
-    imageMapping: {
+    pointUnit?: string;
+    infoIcon?: string;
+    ruleLabel?: string;
+    soldOut?: string;
+    copied?: string;
+    off?: string;
+    copy?: string;
+    giftCardLabel?: string;
+    imageMapping?: {
         [key in ConsumeType]: {
             url: string;
         };
     };
+    activitiesModal?: MyActivitiesMetafields;
+    rewardsModal?: MyRewardsMetafields;
+    insufficientCredits?: string;
+    validatorInfo?: {
+        addressInfo: {
+            name: string;
+            country: string;
+            province: string;
+            city: string;
+            address: string;
+        };
+    };
 };

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

@@ -1,3 +1,4 @@
 export { default as Chat } from './chat/index';
 export { Role, ActionExecutionMessage, TextMessage, useCopilotChat, useCopilotAction, useCopilotReadable, } from './chat/utils';
 export * from './credits/index';
+export * from './registration/index';

package/dist/esm/components/index.js

@@ -1,2 +1,2 @@
-import{default as t}from"./chat/index";import{Role as s,ActionExecutionMessage as i,TextMessage as l,useCopilotChat as p,useCopilotAction as r,useCopilotReadable as u}from"./chat/utils";export*from"./credits/index";export{i as ActionExecutionMessage,t as Chat,s as Role,l as TextMessage,r as useCopilotAction,p as useCopilotChat,u as useCopilotReadable};
+import{default as t}from"./chat/index";import{Role as r,ActionExecutionMessage as s,TextMessage as p,useCopilotChat as i,useCopilotAction as l,useCopilotReadable as x}from"./chat/utils";export*from"./credits/index";export*from"./registration/index";export{s as ActionExecutionMessage,t as Chat,r as Role,p as TextMessage,l as useCopilotAction,i as useCopilotChat,x as useCopilotReadable};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/index.ts"],
-  "sourcesContent": ["// eslint-disable-next-line import/extensions\n\nexport { default as Chat } from './chat/index'\n\nexport {\n  Role,\n  ActionExecutionMessage,\n  TextMessage,\n  useCopilotChat,\n  useCopilotAction,\n  useCopilotReadable,\n} from './chat/utils'\n\nexport * from './credits/index'\n"],
-  "mappings": "AAEA,OAAoB,WAAXA,MAAuB,eAEhC,OACE,QAAAC,EACA,0BAAAC,EACA,eAAAC,EACA,kBAAAC,EACA,oBAAAC,EACA,sBAAAC,MACK,eAEP,WAAc",
+  "sourcesContent": ["export { default as Chat } from './chat/index'\n\nexport {\n  Role,\n  ActionExecutionMessage,\n  TextMessage,\n  useCopilotChat,\n  useCopilotAction,\n  useCopilotReadable,\n} from './chat/utils'\n\nexport * from './credits/index'\n\nexport * from './registration/index'\n"],
+  "mappings": "AAAA,OAAoB,WAAXA,MAAuB,eAEhC,OACE,QAAAC,EACA,0BAAAC,EACA,eAAAC,EACA,kBAAAC,EACA,oBAAAC,EACA,sBAAAC,MACK,eAEP,WAAc,kBAEd,WAAc",
   "names": ["default", "Role", "ActionExecutionMessage", "TextMessage", "useCopilotChat", "useCopilotAction", "useCopilotReadable"]
 }

package/dist/esm/components/registration/authCodeActivate/Message.js

@@ -1,2 +1,2 @@
-import{jsx as i,jsxs as e}from"react/jsx-runtime";const s=({status:t,message:l})=>t&&e("div",{className:"absolute left-5 right-5 top-10 flex items-center gap-2 rounded-sm bg-white px-4 py-3 shadow-lg min-md:left-12 min-md:right-12",children:[e("div",{className:"flex-shrink-0",children:[t==="success"&&i("span",{className:"inline-block h-5 w-5",children:e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e("g",{clipPath:"url(#clip0_205_16388)",children:[i("circle",{cx:"10",cy:"10",r:"10",fill:"#1677FF"}),i("path",{d:"M10 16L10 10",stroke:"white",strokeWidth:"2",strokeLinecap:"round"}),i("circle",{cx:"10",cy:"6.5",r:"1.5",transform:"rotate(-180 10 6.5)",fill:"white"})]}),i("defs",{children:i("clipPath",{id:"clip0_205_16388",children:i("rect",{width:"20",height:"20",fill:"white"})})})]})}),t==="error"&&i("span",{className:"inline-block h-5 w-5",children:e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e("g",{clipPath:"url(#clip0_205_16236)",children:[i("circle",{cx:"10",cy:"10",r:"10",fill:"#F84D4F"}),i("path",{d:"M10 5L10 11",stroke:"white",strokeWidth:"2",strokeLinecap:"round"}),i("circle",{cx:"10",cy:"14.5",r:"1.5",fill:"white"})]}),i("defs",{children:i("clipPath",{id:"clip0_205_16236",children:i("rect",{width:"20",height:"20",fill:"white"})})})]})})]}),i("p",{className:"text-sm font-semibold leading-[120%] text-[#333]",children:l})]});export{s as Message};
+import{jsx as i,jsxs as e}from"react/jsx-runtime";const s=({status:t,message:l})=>t&&e("div",{className:"absolute left-5 right-5 top-2 flex items-center gap-2 rounded-sm bg-white px-4 py-3 shadow-lg min-md:left-12 min-md:right-12",children:[e("div",{className:"flex-shrink-0",children:[t==="success"&&i("span",{className:"inline-block h-5 w-5",children:e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e("g",{clipPath:"url(#clip0_205_16388)",children:[i("circle",{cx:"10",cy:"10",r:"10",fill:"#1677FF"}),i("path",{d:"M10 16L10 10",stroke:"white",strokeWidth:"2",strokeLinecap:"round"}),i("circle",{cx:"10",cy:"6.5",r:"1.5",transform:"rotate(-180 10 6.5)",fill:"white"})]}),i("defs",{children:i("clipPath",{id:"clip0_205_16388",children:i("rect",{width:"20",height:"20",fill:"white"})})})]})}),t==="error"&&i("span",{className:"inline-block h-5 w-5",children:e("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e("g",{clipPath:"url(#clip0_205_16236)",children:[i("circle",{cx:"10",cy:"10",r:"10",fill:"#F84D4F"}),i("path",{d:"M10 5L10 11",stroke:"white",strokeWidth:"2",strokeLinecap:"round"}),i("circle",{cx:"10",cy:"14.5",r:"1.5",fill:"white"})]}),i("defs",{children:i("clipPath",{id:"clip0_205_16236",children:i("rect",{width:"20",height:"20",fill:"white"})})})]})})]}),i("p",{className:"text-sm font-semibold leading-[120%] text-[#333]",children:l})]});export{s as Message};
 //# sourceMappingURL=Message.js.map

package/dist/esm/components/registration/authCodeActivate/Message.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/registration/authCodeActivate/Message.tsx"],
-  "sourcesContent": ["export const Message = ({ status, message }: { status: string; message: string }) => {\n  return (\n    status && (\n      <div className=\"absolute left-5 right-5 top-10 flex items-center gap-2 rounded-sm bg-white px-4 py-3 shadow-lg min-md:left-12 min-md:right-12\">\n        <div className=\"flex-shrink-0\">\n          {status === 'success' && (\n            <span className=\"inline-block h-5 w-5\">\n              <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <g clipPath=\"url(#clip0_205_16388)\">\n                  <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#1677FF\" />\n                  <path d=\"M10 16L10 10\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n                  <circle cx=\"10\" cy=\"6.5\" r=\"1.5\" transform=\"rotate(-180 10 6.5)\" fill=\"white\" />\n                </g>\n                <defs>\n                  <clipPath id=\"clip0_205_16388\">\n                    <rect width=\"20\" height=\"20\" fill=\"white\" />\n                  </clipPath>\n                </defs>\n              </svg>\n            </span>\n          )}\n          {status === 'error' && (\n            <span className=\"inline-block h-5 w-5\">\n              <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <g clipPath=\"url(#clip0_205_16236)\">\n                  <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#F84D4F\" />\n                  <path d=\"M10 5L10 11\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n                  <circle cx=\"10\" cy=\"14.5\" r=\"1.5\" fill=\"white\" />\n                </g>\n                <defs>\n                  <clipPath id=\"clip0_205_16236\">\n                    <rect width=\"20\" height=\"20\" fill=\"white\" />\n                  </clipPath>\n                </defs>\n              </svg>\n            </span>\n          )}\n        </div>\n        <p className=\"text-sm font-semibold leading-[120%] text-[#333]\">{message}</p>\n      </div>\n    )\n  )\n}\n"],
-  "mappings": "AAQgB,OACE,OAAAA,EADF,QAAAC,MAAA,oBART,MAAMC,EAAU,CAAC,CAAE,OAAAC,EAAQ,QAAAC,CAAQ,IAEtCD,GACEF,EAAC,OAAI,UAAU,gIACb,UAAAA,EAAC,OAAI,UAAU,gBACZ,UAAAE,IAAW,WACVH,EAAC,QAAK,UAAU,uBACd,SAAAC,EAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,UAAAA,EAAC,KAAE,SAAS,wBACV,UAAAD,EAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,KAAK,KAAK,UAAU,EAC9CA,EAAC,QAAK,EAAE,eAAe,OAAO,QAAQ,YAAY,IAAI,cAAc,QAAQ,EAC5EA,EAAC,UAAO,GAAG,KAAK,GAAG,MAAM,EAAE,MAAM,UAAU,sBAAsB,KAAK,QAAQ,GAChF,EACAA,EAAC,QACC,SAAAA,EAAC,YAAS,GAAG,kBACX,SAAAA,EAAC,QAAK,MAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,EAC5C,EACF,GACF,EACF,EAEDG,IAAW,SACVH,EAAC,QAAK,UAAU,uBACd,SAAAC,EAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,UAAAA,EAAC,KAAE,SAAS,wBACV,UAAAD,EAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,KAAK,KAAK,UAAU,EAC9CA,EAAC,QAAK,EAAE,cAAc,OAAO,QAAQ,YAAY,IAAI,cAAc,QAAQ,EAC3EA,EAAC,UAAO,GAAG,KAAK,GAAG,OAAO,EAAE,MAAM,KAAK,QAAQ,GACjD,EACAA,EAAC,QACC,SAAAA,EAAC,YAAS,GAAG,kBACX,SAAAA,EAAC,QAAK,MAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,EAC5C,EACF,GACF,EACF,GAEJ,EACAA,EAAC,KAAE,UAAU,mDAAoD,SAAAI,EAAQ,GAC3E",
+  "sourcesContent": ["export const Message = ({ status, message }: { status: string; message: string }) => {\n  return (\n    status && (\n      <div className=\"absolute left-5 right-5 top-2 flex items-center gap-2 rounded-sm bg-white px-4 py-3 shadow-lg min-md:left-12 min-md:right-12\">\n        <div className=\"flex-shrink-0\">\n          {status === 'success' && (\n            <span className=\"inline-block h-5 w-5\">\n              <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <g clipPath=\"url(#clip0_205_16388)\">\n                  <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#1677FF\" />\n                  <path d=\"M10 16L10 10\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n                  <circle cx=\"10\" cy=\"6.5\" r=\"1.5\" transform=\"rotate(-180 10 6.5)\" fill=\"white\" />\n                </g>\n                <defs>\n                  <clipPath id=\"clip0_205_16388\">\n                    <rect width=\"20\" height=\"20\" fill=\"white\" />\n                  </clipPath>\n                </defs>\n              </svg>\n            </span>\n          )}\n          {status === 'error' && (\n            <span className=\"inline-block h-5 w-5\">\n              <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <g clipPath=\"url(#clip0_205_16236)\">\n                  <circle cx=\"10\" cy=\"10\" r=\"10\" fill=\"#F84D4F\" />\n                  <path d=\"M10 5L10 11\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n                  <circle cx=\"10\" cy=\"14.5\" r=\"1.5\" fill=\"white\" />\n                </g>\n                <defs>\n                  <clipPath id=\"clip0_205_16236\">\n                    <rect width=\"20\" height=\"20\" fill=\"white\" />\n                  </clipPath>\n                </defs>\n              </svg>\n            </span>\n          )}\n        </div>\n        <p className=\"text-sm font-semibold leading-[120%] text-[#333]\">{message}</p>\n      </div>\n    )\n  )\n}\n"],
+  "mappings": "AAQgB,OACE,OAAAA,EADF,QAAAC,MAAA,oBART,MAAMC,EAAU,CAAC,CAAE,OAAAC,EAAQ,QAAAC,CAAQ,IAEtCD,GACEF,EAAC,OAAI,UAAU,+HACb,UAAAA,EAAC,OAAI,UAAU,gBACZ,UAAAE,IAAW,WACVH,EAAC,QAAK,UAAU,uBACd,SAAAC,EAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,UAAAA,EAAC,KAAE,SAAS,wBACV,UAAAD,EAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,KAAK,KAAK,UAAU,EAC9CA,EAAC,QAAK,EAAE,eAAe,OAAO,QAAQ,YAAY,IAAI,cAAc,QAAQ,EAC5EA,EAAC,UAAO,GAAG,KAAK,GAAG,MAAM,EAAE,MAAM,UAAU,sBAAsB,KAAK,QAAQ,GAChF,EACAA,EAAC,QACC,SAAAA,EAAC,YAAS,GAAG,kBACX,SAAAA,EAAC,QAAK,MAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,EAC5C,EACF,GACF,EACF,EAEDG,IAAW,SACVH,EAAC,QAAK,UAAU,uBACd,SAAAC,EAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,UAAAA,EAAC,KAAE,SAAS,wBACV,UAAAD,EAAC,UAAO,GAAG,KAAK,GAAG,KAAK,EAAE,KAAK,KAAK,UAAU,EAC9CA,EAAC,QAAK,EAAE,cAAc,OAAO,QAAQ,YAAY,IAAI,cAAc,QAAQ,EAC3EA,EAAC,UAAO,GAAG,KAAK,GAAG,OAAO,EAAE,MAAM,KAAK,QAAQ,GACjD,EACAA,EAAC,QACC,SAAAA,EAAC,YAAS,GAAG,kBACX,SAAAA,EAAC,QAAK,MAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,EAC5C,EACF,GACF,EACF,GAEJ,EACAA,EAAC,KAAE,UAAU,mDAAoD,SAAAI,EAAQ,GAC3E",
   "names": ["jsx", "jsxs", "Message", "status", "message"]
 }

package/dist/esm/components/registration/authCodeActivate/index.js

@@ -1,2 +1,2 @@
-import{jsx as o,jsxs as b}from"react/jsx-runtime";import{Button as J,Text as r}from"@anker-in/headless-ui";import{useSendEmailValidation as O,gaTrack as M,classNames as I,useHeadlessContext as Q,useRegistration as U,useEmailValidation as W,useCountDown as X}from"@anker-in/lib";import{useCallback as D,useEffect as f,useRef as Y,useState as d}from"react";import{Message as Z}from"./Message";const re=({data:t,autoSendEmail:y=!1})=>{const{locale:R}=Q(),{email:a,authCodeActivate:{activeToken:x,setActiveToken:H,setIsSendingActivateEmail:A,setIsActivateSuccess:L,onAuthSuccess:V}}=U(),{isMutating:$,trigger:j}=W(),{isMutating:h,trigger:p,data:v}=O(),[B,T]=d(""),[F,C]=d(""),{startCountDown:k,startAction:P,countDown:z}=X(60),[S,l]=d(""),[_,c]=d(0),[s,E]=d(new Array(6).fill("")),N=Y([]),g=s.join("");f(()=>{N.current[_]&&N.current[_].focus()},[_]),f(()=>{v.active_token&&H(v.active_token)},[v]),f(()=>{A(h)},[h,A]),f(()=>{y&&a&&p({email:a,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}})},[y,a,p]);const K=D(async()=>{a&&(await p({email:a,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}},{onSuccess:()=>{C("success"),P()}}),M({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"sent_again"}}))},[a,p]),q=(m,e)=>{const{value:n}=m.target;if(l(""),Number.isNaN(Number(n)))return;if(n.length>1){e<s.length-1&&(s[e+1]||(c(e+1),E(u=>{const w=[...u];return w[e]=n[0],n.length>1&&(w[e+1]=n[1]),w})));return}const i=[...s];i[e]=n,E(i),n?e<s.length-1&&!s[e+1]&&c(e+1):e>0&&c(e-1)},G=D(async()=>{if(!g?.length){l(t?.codeEmptyError||"");return}if(g.length<6){l(t?.incorrectCodeError||"");return}x&&await j({token:x,code:g},{onSuccess:()=>{C("success"),T(t?.authSuccessMessage||""),L(!0),V?.()},onError:e=>{e?.errorCode==="104"||(e?.errorCode==="142"?l(t?.incorrectCodeError||"Invalid verification code."):e?.errorCode==="154"?l(t?.expiredCodeMessage||""):l(t?.sendEmailErrorMessage||""))}});let m=setTimeout(()=>{C(""),T(""),clearTimeout(m)},5e3);M({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"check_and_active"}})},[g,t?.codeEmptyError,t?.authSuccessMessage,t?.incorrectCodeError,t?.expiredCodeMessage,t?.sendEmailErrorMessage,R,x]);return b("div",{className:I("p-12 px-5 !pb-12 min-l:px-12"),children:[b("div",{children:[o(r,{className:"text-[22px] font-extrabold leading-[120%] text-[#333] min-l:text-[24px] [&_abbr]:text-[#005d8e]",html:t?.authCodeTitle}),o(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%",a||"")})]}),b("div",{className:"mt-6",children:[o(r,{className:"mt-4 text-[14px] !font-bold font-semibold leading-[140%] text-[#333] min-l:mt-6",html:t?.enterActiveCodeText}),o("div",{className:"my-3 flex justify-between",children:s.map((m,e)=>o("div",{className:"col-span-1 aspect-1 text-[#555]",children:o("input",{ref:n=>{n&&(N.current[e]=n)},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:m,autoComplete:"false",autoCorrect:"false",spellCheck:"false",autoCapitalize:"false",onChange:n=>q(n,e),onFocus:()=>{c(e)},onPaste:n=>{const i=n.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:n=>{const{value:i}=n.target;n.key==="Backspace"&&!i&&e>0&&c(e-1)}},e)},e))}),S&&o(r,{className:"mb-3 text-[14px] font-semibold leading-[120%] text-[#f84d4f]",html:S}),t?.authCodeContent&&o("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:[o(r,{className:"text-base font-semibold leading-[100%] text-[#333]",html:t?.authCodeReceiveText})," ",k?o(r,{html:t?.retrieveText?.replace("%countdownTime%",z.toString()),className:"cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline"}):o(r,{onClick:K,className:I("cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline",{"pointer-events-none":k||h}),html:t?.sendAgainText}),o(J,{type:"submit",loading:$,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:G,children:t.buttonText})]}),o(Z,{status:F,message:B})]})};export{re as AuthCodeActivate};
+import{jsx as s,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 v,useRef as te,useState as p}from"react";import{Message as ae}from"./Message";import{useRegistration as se}from"../context";import{RegistrationModalContainer as ne}from"../modalContainer";const fe=({copy:t})=>{const{locale:B,brand:$}=Y(),{email:o,authCodeActivate:g}=se(),F=ee.includes($),{activeToken:_,setActiveToken:O,setIsSendingActivateEmail:M,setIsActivateSuccess:P,onAuthSuccess:b,autoSendEmail:k}=g,{isMutating:j,trigger:z}=Z(),{isMutating:E,trigger:h,data:N}=X(),[K,l]=p(""),[U,c]=p(""),{startCountDown:D,startAction:I,countDown:q}=y(60),[R,u]=p(""),[w,d]=p(0),[n,S]=p(new Array(6).fill("")),T=te([]),x=n.join("");v(()=>{T.current[w]&&T.current[w].focus()},[w]),v(()=>{N?.data?.data?.active_token&&O(N.data.data.active_token)},[N?.data?.data?.active_token]),v(()=>{M(E)},[E,M]),v(()=>{k&&o&&h({email:o,data:{redirect_url:`${window?.location?.origin}${window?.location?.pathname}`}},{onSuccess:()=>{c("success"),l(t?.sendEmailSuccessMessage||""),I(),setTimeout(()=>{c(""),l("")},5e3)}})},[k,o,h]);const G=V(async()=>{o&&(await h({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,h]),J=(f,e)=>{const{value:a}=f.target;if(u(""),Number.isNaN(Number(a)))return;if(a.length>1){e<n.length-1&&(n[e+1]||(d(e+1),S(m=>{const A=[...m];return A[e]=a[0],a.length>1&&(A[e+1]=a[1]),A})));return}const i=[...n];i[e]=a,S(i),a?e<n.length-1&&!n[e+1]&&d(e+1):e>0&&d(e-1)},Q=V(async()=>{if(!x?.length){u(t?.codeEmptyError||"");return}if(x.length<6){u(t?.incorrectCodeError||"");return}_&&await z({token:_,code:x},{onSuccess:e=>{e.status>=200&&e.status<300?(c("success"),l(t?.authSuccessMessage||""),P(!0),b?b():setTimeout(()=>{g.close()},3e3)):e?.data?.error_code==="104"?b?b():setTimeout(()=>{g.close()},3e3):e?.data?.error_code==="142"?u(t?.incorrectCodeError||"Invalid verification code."):e?.data?.error_code==="154"?u(t?.expiredCodeMessage||""):u(t?.sendEmailErrorMessage||"")}});let f=setTimeout(()=>{c(""),l(""),clearTimeout(f)},5e3);H({event:"ga4Event",event_name:"lp_button",event_parameters:{page_group:"reg_sub_pop",position:"auth_code",button_name:"check_and_active"}})},[x,t?.codeEmptyError,t?.authSuccessMessage,t?.incorrectCodeError,t?.expiredCodeMessage,t?.sendEmailErrorMessage,B,_]);return s(ne,{isOpen:g.isOpen,onClose:g.close,children:C("div",{className:"relative",children:[C("div",{children:[s(r,{className:"text-[22px] font-extrabold leading-[120%] text-[#333] min-l:text-[24px] [&_abbr]:text-[#005d8e]",html:t?.authCodeTitle}),s(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:[s(r,{className:"mt-4 text-[14px] !font-bold font-semibold leading-[140%] text-[#333] min-l:mt-6",html:t?.enterActiveCodeText}),s("div",{className:"my-3 grid grid-cols-6 gap-2",children:n.map((f,e)=>s("div",{className:"col-span-1 aspect-1 text-[#555]",children:s("input",{ref:a=>{a&&(T.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:f,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);S(m.concat(Array(6-m.length).fill(""))),m.length<=n.length&&d(m.length-1)}},onKeyDown:a=>{const{value:i}=a.target;a.key==="Backspace"&&!i&&e>0&&d(e-1)}},e)},e))}),R&&s(r,{className:"mb-3 text-[14px] font-semibold leading-[120%] text-[#f84d4f]",html:R}),t?.authCodeContent&&s("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:[s(r,{className:"text-base font-semibold leading-[100%] text-[#333]",html:t?.authCodeReceiveText})," ",D?s(r,{html:t?.retrieveText?.replace("%countdownTime%",q.toString()),className:"cursor-pointer text-base font-semibold leading-[100%] !text-brand text-[#005d8e] text-[#333] underline"}):s(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}),s(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})]}),s(ae,{status:U,message:K})]})})};export{fe as AuthCodeActivate};
 //# sourceMappingURL=index.js.map

package/dist/esm/components/registration/authCodeActivate/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/registration/authCodeActivate/index.tsx"],
-  "sourcesContent": ["import { Button, Text } from '@anker-in/headless-ui'\nimport {\n  useSendEmailValidation,\n  gaTrack,\n  classNames as cn,\n  useHeadlessContext,\n  useRegistration,\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'\n\nexport const AuthCodeActivate: React.FC<AuthCodeActivateProps> = ({ data, autoSendEmail = false }) => {\n  const { locale } = useHeadlessContext()\n  const {\n    email,\n    authCodeActivate: { activeToken, setActiveToken, setIsSendingActivateEmail, setIsActivateSuccess, onAuthSuccess },\n  } = useRegistration()\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(data?.codeEmptyError || '')\n      return\n    }\n\n    if (code.length < 6) {\n      setError(data?.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(data?.authSuccessMessage || '')\n            setIsActivateSuccess(true)\n            onAuthSuccess?.()\n          },\n          onError: (err: any) => {\n            if (err?.errorCode === '104') {\n            } else if (err?.errorCode === '142') {\n              setError(data?.incorrectCodeError || 'Invalid verification code.')\n            } else if (err?.errorCode === '154') {\n              setError(data?.expiredCodeMessage || '')\n            } else {\n              setError(data?.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    data?.codeEmptyError,\n    data?.authSuccessMessage,\n    data?.incorrectCodeError,\n    data?.expiredCodeMessage,\n    data?.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={data?.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={data?.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={data?.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        {data?.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: data?.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={data?.authCodeReceiveText} />{' '}\n        {startCountDown ? (\n          <Text\n            html={data?.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={data?.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          {data.buttonText}\n        </Button>\n      </div>\n      <Message status={resendStatus} message={messageText} />\n    </div>\n  )\n}\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "Button", "Text", "useSendEmailValidation", "gaTrack", "cn", "useHeadlessContext", "useRegistration", "useEmailValidation", "useCountDown", "useCallback", "useEffect", "useRef", "useState", "Message", "AuthCodeActivate", "data", "autoSendEmail", "locale", "email", "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"]
+  "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: data => {\n            if (data.status >= 200 && data.status < 300) {\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            } else {\n              if (data?.data?.error_code === '104') {\n                if (onAuthSuccess) {\n                  onAuthSuccess()\n                } else {\n                  setTimeout(() => {\n                    authCodeActivate.close()\n                  }, 3000)\n                }\n              } else if (data?.data?.error_code === '142') {\n                setError(copy?.incorrectCodeError || 'Invalid verification code.')\n              } else if (data?.data?.error_code === '154') {\n                setError(copy?.expiredCodeMessage || '')\n              } else {\n                setError(copy?.sendEmailErrorMessage || '')\n              }\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"],
+  "mappings": "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",
+  "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", "data", "timer", "item", "inputRef", "paste", "pastedCode"]
 }

package/dist/esm/components/registration/authCodeActivate/type.d.ts

@@ -18,6 +18,5 @@ export type AuthCodeActivateCopy = {
     expiredCodeMessage?: string;
 };
 export type AuthCodeActivateProps = {
-    data: AuthCodeActivateCopy;
-    autoSendEmail?: boolean;
+    copy: AuthCodeActivateCopy;
 };

package/dist/esm/components/registration/context/index.d.ts

@@ -0,0 +1 @@
+export * from './provider';

package/dist/esm/components/registration/context/index.js

@@ -0,0 +1,2 @@
+export*from"./provider";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/registration/context/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/registration/context/index.tsx"],
+  "sourcesContent": ["export * from './provider'\n"],
+  "mappings": "AAAA,WAAc",
+  "names": []
+}

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

@@ -0,0 +1,27 @@
+import { Dispatch, PropsWithChildren, SetStateAction } from 'react';
+interface RegistrationContextType {
+    email?: string;
+    copy?: any;
+    authCodeActivate: {
+        isOpen: boolean;
+        open: () => void;
+        close: () => void;
+        isActivateSuccess: boolean;
+        activeToken?: string;
+        onAuthSuccess: (() => void) | undefined;
+        isSendingActivateEmail: boolean;
+        setIsSendingActivateEmail: Dispatch<SetStateAction<boolean>>;
+        setActiveToken: Dispatch<SetStateAction<string | undefined>>;
+        setIsActivateSuccess: Dispatch<SetStateAction<boolean>>;
+        setOnAuthSuccess: Dispatch<SetStateAction<(() => void) | undefined>>;
+        autoSendEmail: boolean;
+        setAutoSendEmail: Dispatch<SetStateAction<boolean>>;
+    };
+}
+export declare const RegistrationContext: import("react").Context<RegistrationContextType>;
+export declare const useRegistration: () => RegistrationContextType;
+export declare const RegistrationProvider: ({ children, email, copy }: PropsWithChildren<{
+    email?: string;
+    copy?: any;
+}>) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,2 @@
+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};
+//# sourceMappingURL=provider.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/registration/context/provider.tsx"],
+  "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"],
+  "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",
+  "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"]
+}

package/dist/esm/components/registration/index.d.ts

@@ -1 +1,2 @@
 export * from './authCodeActivate';
+export * from './context';

package/dist/esm/components/registration/index.js

@@ -1,2 +1,2 @@
-export*from"./authCodeActivate";
+export*from"./authCodeActivate";export*from"./context";
 //# sourceMappingURL=index.js.map

package/dist/esm/components/registration/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/registration/index.ts"],
-  "sourcesContent": ["export * from './authCodeActivate'\n"],
-  "mappings": "AAAA,WAAc",
+  "sourcesContent": ["export * from './authCodeActivate'\nexport * from './context'\n"],
+  "mappings": "AAAA,WAAc,qBACd,WAAc",
   "names": []
 }

package/dist/esm/components/registration/modalContainer.d.ts

@@ -6,10 +6,9 @@ export type ModalContainerProps = {
     title?: string;
     titleClassName?: string;
     useAnimation?: boolean;
-    animationClassName?: string;
     isOpen: boolean;
     children?: any;
     onClose: () => void;
     onScrollEnd?: (event: UIEvent<HTMLDivElement>) => void;
 };
-export declare const CreditsModalContainer: ({ isOpen, title, className, overlayClassName, scrollClassName, onClose, onScrollEnd, children, useAnimation, animationClassName, titleClassName, ...props }: ModalContainerProps) => React.ReactElement;
+export declare const RegistrationModalContainer: ({ isOpen, title, className, overlayClassName, scrollClassName, onClose, onScrollEnd, children, useAnimation, titleClassName, ...props }: ModalContainerProps) => React.ReactElement;

package/dist/esm/components/registration/modalContainer.js

@@ -1,2 +1,2 @@
-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};
+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};
 //# sourceMappingURL=modalContainer.js.map