npm - @greatapps/common - Versions diffs - 1.1.788 → 1.1.789 - Mend

@greatapps/common 1.1.788 → 1.1.789

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

Files changed (43) hide show

package/dist/components/account/AccountModals.mjs CHANGED Viewed

@@ -4,15 +4,12 @@ import ConfigurationsMyAccountModal from "./ConfigurationsMyAccountModal";
 import DeleteAccountModal from "./DeleteAccountModal";
 import IsntPossibleDeleteAccountModal from "./IsntPossibleDeleteAccountModal";
 import ConfirmDeleteAccountModal from "./ConfirmDeleteAccountModal";
-import { DialogLayer } from "../ui/overlay/layers";
 function AccountModals() {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(ConfigurationsMyAccountModal, {}),
-    /* @__PURE__ */ jsxs(DialogLayer, { children: [
-      /* @__PURE__ */ jsx(DeleteAccountModal, {}),
-      /* @__PURE__ */ jsx(IsntPossibleDeleteAccountModal, {}),
-      /* @__PURE__ */ jsx(ConfirmDeleteAccountModal, {})
-    ] })
+    /* @__PURE__ */ jsx(DeleteAccountModal, {}),
+    /* @__PURE__ */ jsx(IsntPossibleDeleteAccountModal, {}),
+    /* @__PURE__ */ jsx(ConfirmDeleteAccountModal, {})
   ] });
 }
 export {

package/dist/components/account/AccountModals.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/account/AccountModals.tsx"],"sourcesContent":["'use client';\n\nimport ConfigurationsMyAccountModal from './ConfigurationsMyAccountModal';\nimport DeleteAccountModal from './DeleteAccountModal';\nimport IsntPossibleDeleteAccountModal from './IsntPossibleDeleteAccountModal';\nimport ConfirmDeleteAccountModal from './ConfirmDeleteAccountModal';\~~nimport { DialogLayer } from '../ui/overlay/layers';\~~n\nexport default function AccountModals() {\n return (\n <>\n <ConfigurationsMyAccountModal />\n {/* Os tres abrem por cima do de configuracoes, mas sao declarados como\n irmaos dele, entao nasceriam todos na mesma faixa de z e o overlay de\n cada um cairia sob o conteudo do de baixo. */}\n <~~DialogLayer>\n <~~DeleteAccountModal />\n <IsntPossibleDeleteAccountModal />\n <ConfirmDeleteAccountModal />\n ~~</DialogLayer>\n~~ </>\n );\n}\n"],"mappings":";~~AAUI~~,mBACE,~~KAIA,YALF~~;~~AARJ~~,OAAO,kCAAkC;AACzC,OAAO,wBAAwB;AAC/B,OAAO,oCAAoC;AAC3C,OAAO,+BAA+B;~~AACtC~~,~~SAAS,mBAAmB;AAEb,~~SAAR,gBAAiC;AACtC,SACE,iCACE;AAAA,wBAAC,gCAA6B;AAAA,~~IAI9B~~,~~qBAAC~~,~~eACC;AAAA,0BAAC,~~sBAAmB;AAAA,~~MACpB~~,oBAAC,kCAA+B;AAAA,~~MAChC~~,oBAAC,6BAA0B;AAAA,~~OAC7B~~;~~AAAA,KACF;~~AAEJ;","names":[]}
1	+ {"version":3,"sources":["../../../src/components/account/AccountModals.tsx"],"sourcesContent":["'use client';\n\nimport ConfigurationsMyAccountModal from './ConfigurationsMyAccountModal';\nimport DeleteAccountModal from './DeleteAccountModal';\nimport IsntPossibleDeleteAccountModal from './IsntPossibleDeleteAccountModal';\nimport ConfirmDeleteAccountModal from './ConfirmDeleteAccountModal';\n\nexport default function AccountModals() {\n return (\n <>\n <ConfigurationsMyAccountModal />\n <DeleteAccountModal />\n <IsntPossibleDeleteAccountModal />\n <ConfirmDeleteAccountModal />\n </>\n );\n}\n"],"mappings":";AASI,mBACE,KADF;AAPJ,OAAO,kCAAkC;AACzC,OAAO,wBAAwB;AAC/B,OAAO,oCAAoC;AAC3C,OAAO,+BAA+B;AAEvB,SAAR,gBAAiC;AACtC,SACE,iCACE;AAAA,wBAAC,gCAA6B;AAAA,IAC9B,oBAAC,sBAAmB;AAAA,IACpB,oBAAC,kCAA+B;AAAA,IAChC,oBAAC,6BAA0B;AAAA,KAC7B;AAEJ;","names":[]}

package/dist/components/account/DisableTwoFactorAuthModal.mjs CHANGED Viewed

@@ -10,7 +10,6 @@ import {
   DialogHeader,
   DialogTitle
 } from "../ui/overlay/Dialog";
-import { DialogLayer } from "../ui/overlay/layers";
 import { InputOTP, InputOTPGroup, InputOTPSlot } from "../ui/form/InputOtp";
 import { REGEXP_ONLY_DIGITS } from "input-otp";
 import useDisableTwoFactorAuthForm from "./hooks/useDisableTwoFactorAuthForm";
@@ -21,7 +20,7 @@ function DisableTwoFactorAuthModal({
 }) {
   const translate = useTranslations();
   const { code, setCode, isValid, isLoading, handleClose, handleSubmit } = useDisableTwoFactorAuthForm({ onClose, onSuccess });
-  return /* @__PURE__ */ jsx(DialogLayer, { children: /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsx(DialogContent, { className: "flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-117.5 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsx(DialogContent, { className: "flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-117.5 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]", children: /* @__PURE__ */ jsxs(
     "form",
     {
       onSubmit: (e) => {
@@ -63,7 +62,7 @@ function DisableTwoFactorAuthModal({
         ] })
       ]
     }
-  ) }) }) });
+  ) }) });
 }
 export {
   DisableTwoFactorAuthModal as default

package/dist/components/account/DisableTwoFactorAuthModal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/account/DisableTwoFactorAuthModal.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { IconShieldCheck } from '@tabler/icons-react';\nimport { Button } from '../ui/buttons/Button';\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogHeader,\n DialogTitle,\n} from '../ui/overlay/Dialog';\nimport { ~~DialogLayer } from '../ui/overlay/layers';\nimport {~~ InputOTP, InputOTPGroup, InputOTPSlot } from '../ui/form/InputOtp';\nimport { REGEXP_ONLY_DIGITS } from 'input-otp';\nimport useDisableTwoFactorAuthForm from './hooks/useDisableTwoFactorAuthForm';\n\ninterface DisableTwoFactorAuthModalProps {\n open: boolean;\n onClose: () => void;\n onSuccess?: () => void;\n}\n\nexport default function DisableTwoFactorAuthModal({\n open,\n onClose,\n onSuccess,\n}: DisableTwoFactorAuthModalProps) {\n const translate = useTranslations();\n const { code, setCode, isValid, isLoading, handleClose, handleSubmit } =\n useDisableTwoFactorAuthForm({ onClose, onSuccess });\n\n return (\n <~~DialogLayer>\n <~~Dialog open={open} onOpenChange={handleClose}>\n <DialogContent className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-117.5 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\">\n <form\n onSubmit={(e) => {\n e.preventDefault();\n handleSubmit();\n }}\n className=\"flex flex-col flex-1 lg:flex-none\"\n >\n <div className=\"flex flex-col gap-4 lg:gap-5 p-4 lg:p-5 flex-1 lg:flex-none\">\n <div className=\"flex items-center justify-center w-fit bg-gray-50 rounded-lg p-2\">\n <IconShieldCheck size={20} className=\"text-gray-600\" />\n </div>\n <DialogHeader className=\"p-0 gap-2\">\n <DialogTitle className=\"paragraph-medium-semibold text-gray-950\">\n {translate('common.account.twoFactor.disableTitle')}\n </DialogTitle>\n <DialogDescription className=\"paragraph-small-regular text-gray-600\">\n {translate('common.account.twoFactor.disableDescription')}\n </DialogDescription>\n </DialogHeader>\n\n <div className=\"flex flex-col gap-2\">\n <span className=\"paragraph-small-medium text-gray-700\">\n {translate('common.account.twoFactor.authenticatorCode')}\n </span>\n <InputOTP maxLength={6} pattern={REGEXP_ONLY_DIGITS} value={code} onChange={setCode}>\n <InputOTPGroup className=\"gap-2\">\n {Array.from({ length: 6 }).map((_, i) => (\n <InputOTPSlot\n key={i}\n index={i}\n className=\"w-11! lg:w-12! h-13! lg:h-14! rounded-lg! text-lg border-gray-200\"\n />\n ))}\n </InputOTPGroup>\n </InputOTP>\n </div>\n </div>\n\n <div className=\"flex flex-row items-center gap-2 p-4 lg:p-5 border-t border-gray-200 mt-auto lg:mt-0\">\n <Button className=\"h-10! flex-1\" disabled={!isValid \|\| isLoading} type=\"submit\">\n {isLoading\n ? translate('common.account.twoFactor.disabling')\n : translate('common.account.twoFactor.disable')}\n </Button>\n <Button\n variant=\"secondary\"\n className=\"h-10! flex-1\"\n type=\"button\"\n onClick={handleClose}\n >\n {translate('common.actions.cancel')}\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n ~~</DialogLayer>\n~~ );\n}\n"],"mappings":";~~AA6CgB~~,cAEF,YAFE;~~AA3ChB~~,SAAS,uBAAuB;AAChC,SAAS,uBAAuB;AAChC,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,~~mBAAmB;AAC5B,SAAS,~~UAAU,eAAe,oBAAoB;AACtD,SAAS,0BAA0B;AACnC,OAAO,iCAAiC;AAQzB,SAAR,0BAA2C;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AACF,GAAmC;AACjC,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,MAAM,SAAS,SAAS,WAAW,aAAa,aAAa,IACnE,4BAA4B,EAAE,SAAS,UAAU,CAAC;AAEpD,SACE,oBAAC,~~eACC,8BAAC,~~UAAO,MAAY,cAAc,aAChC,8BAAC,iBAAc,WAAU,+SACvB;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC,MAAM;AACf,UAAE,eAAe;AACjB,qBAAa;AAAA,MACf;AAAA,MACA,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,+DACb;AAAA,8BAAC,SAAI,WAAU,oEACb,8BAAC,mBAAgB,MAAM,IAAI,WAAU,iBAAgB,GACvD;AAAA,UACA,qBAAC,gBAAa,WAAU,aACtB;AAAA,gCAAC,eAAY,WAAU,2CACpB,oBAAU,uCAAuC,GACpD;AAAA,YACA,oBAAC,qBAAkB,WAAU,yCAC1B,oBAAU,6CAA6C,GAC1D;AAAA,aACF;AAAA,UAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,gCAAC,UAAK,WAAU,wCACb,oBAAU,4CAA4C,GACzD;AAAA,YACA,oBAAC,YAAS,WAAW,GAAG,SAAS,oBAAoB,OAAO,MAAM,UAAU,SAC1E,8BAAC,iBAAc,WAAU,SACtB,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC;AAAA,cAAC;AAAA;AAAA,gBAEC,OAAO;AAAA,gBACP,WAAU;AAAA;AAAA,cAFL;AAAA,YAGP,CACD,GACH,GACF;AAAA,aACF;AAAA,WACF;AAAA,QAEA,qBAAC,SAAI,WAAU,wFACb;AAAA,8BAAC,UAAO,WAAU,gBAAe,UAAU,CAAC,WAAW,WAAW,MAAK,UACpE,sBACG,UAAU,oCAAoC,IAC9C,UAAU,kCAAkC,GAClD;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAS;AAAA,cAER,oBAAU,uBAAuB;AAAA;AAAA,UACpC;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF,GACF~~,GACF~~;AAEJ;","names":[]}
1	+ {"version":3,"sources":["../../../src/components/account/DisableTwoFactorAuthModal.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { IconShieldCheck } from '@tabler/icons-react';\nimport { Button } from '../ui/buttons/Button';\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogHeader,\n DialogTitle,\n} from '../ui/overlay/Dialog';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../ui/form/InputOtp';\nimport { REGEXP_ONLY_DIGITS } from 'input-otp';\nimport useDisableTwoFactorAuthForm from './hooks/useDisableTwoFactorAuthForm';\n\ninterface DisableTwoFactorAuthModalProps {\n open: boolean;\n onClose: () => void;\n onSuccess?: () => void;\n}\n\nexport default function DisableTwoFactorAuthModal({\n open,\n onClose,\n onSuccess,\n}: DisableTwoFactorAuthModalProps) {\n const translate = useTranslations();\n const { code, setCode, isValid, isLoading, handleClose, handleSubmit } =\n useDisableTwoFactorAuthForm({ onClose, onSuccess });\n\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-117.5 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\">\n <form\n onSubmit={(e) => {\n e.preventDefault();\n handleSubmit();\n }}\n className=\"flex flex-col flex-1 lg:flex-none\"\n >\n <div className=\"flex flex-col gap-4 lg:gap-5 p-4 lg:p-5 flex-1 lg:flex-none\">\n <div className=\"flex items-center justify-center w-fit bg-gray-50 rounded-lg p-2\">\n <IconShieldCheck size={20} className=\"text-gray-600\" />\n </div>\n <DialogHeader className=\"p-0 gap-2\">\n <DialogTitle className=\"paragraph-medium-semibold text-gray-950\">\n {translate('common.account.twoFactor.disableTitle')}\n </DialogTitle>\n <DialogDescription className=\"paragraph-small-regular text-gray-600\">\n {translate('common.account.twoFactor.disableDescription')}\n </DialogDescription>\n </DialogHeader>\n\n <div className=\"flex flex-col gap-2\">\n <span className=\"paragraph-small-medium text-gray-700\">\n {translate('common.account.twoFactor.authenticatorCode')}\n </span>\n <InputOTP maxLength={6} pattern={REGEXP_ONLY_DIGITS} value={code} onChange={setCode}>\n <InputOTPGroup className=\"gap-2\">\n {Array.from({ length: 6 }).map((_, i) => (\n <InputOTPSlot\n key={i}\n index={i}\n className=\"w-11! lg:w-12! h-13! lg:h-14! rounded-lg! text-lg border-gray-200\"\n />\n ))}\n </InputOTPGroup>\n </InputOTP>\n </div>\n </div>\n\n <div className=\"flex flex-row items-center gap-2 p-4 lg:p-5 border-t border-gray-200 mt-auto lg:mt-0\">\n <Button className=\"h-10! flex-1\" disabled={!isValid \|\| isLoading} type=\"submit\">\n {isLoading\n ? translate('common.account.twoFactor.disabling')\n : translate('common.account.twoFactor.disable')}\n </Button>\n <Button\n variant=\"secondary\"\n className=\"h-10! flex-1\"\n type=\"button\"\n onClick={handleClose}\n >\n {translate('common.actions.cancel')}\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n );\n}\n"],"mappings":";AA2Cc,cAEF,YAFE;AAzCd,SAAS,uBAAuB;AAChC,SAAS,uBAAuB;AAChC,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU,eAAe,oBAAoB;AACtD,SAAS,0BAA0B;AACnC,OAAO,iCAAiC;AAQzB,SAAR,0BAA2C;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AACF,GAAmC;AACjC,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,MAAM,SAAS,SAAS,WAAW,aAAa,aAAa,IACnE,4BAA4B,EAAE,SAAS,UAAU,CAAC;AAEpD,SACE,oBAAC,UAAO,MAAY,cAAc,aAChC,8BAAC,iBAAc,WAAU,+SACvB;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC,MAAM;AACf,UAAE,eAAe;AACjB,qBAAa;AAAA,MACf;AAAA,MACA,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,+DACb;AAAA,8BAAC,SAAI,WAAU,oEACb,8BAAC,mBAAgB,MAAM,IAAI,WAAU,iBAAgB,GACvD;AAAA,UACA,qBAAC,gBAAa,WAAU,aACtB;AAAA,gCAAC,eAAY,WAAU,2CACpB,oBAAU,uCAAuC,GACpD;AAAA,YACA,oBAAC,qBAAkB,WAAU,yCAC1B,oBAAU,6CAA6C,GAC1D;AAAA,aACF;AAAA,UAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,gCAAC,UAAK,WAAU,wCACb,oBAAU,4CAA4C,GACzD;AAAA,YACA,oBAAC,YAAS,WAAW,GAAG,SAAS,oBAAoB,OAAO,MAAM,UAAU,SAC1E,8BAAC,iBAAc,WAAU,SACtB,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC;AAAA,cAAC;AAAA;AAAA,gBAEC,OAAO;AAAA,gBACP,WAAU;AAAA;AAAA,cAFL;AAAA,YAGP,CACD,GACH,GACF;AAAA,aACF;AAAA,WACF;AAAA,QAEA,qBAAC,SAAI,WAAU,wFACb;AAAA,8BAAC,UAAO,WAAU,gBAAe,UAAU,CAAC,WAAW,WAAW,MAAK,UACpE,sBACG,UAAU,oCAAoC,IAC9C,UAAU,kCAAkC,GAClD;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAS;AAAA,cAER,oBAAU,uBAAuB;AAAA;AAAA,UACpC;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF,GACF;AAEJ;","names":[]}

package/dist/components/account/TwoFactorAuthModal.mjs CHANGED Viewed

@@ -4,7 +4,6 @@ import { useTranslations } from "next-intl";
 import { IconX, IconCopy, IconRefresh } from "@tabler/icons-react";
 import { Button } from "../ui/buttons/Button";
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from "../ui/overlay/Dialog";
-import { DialogLayer } from "../ui/overlay/layers";
 import { Separator } from "../ui/data-display/Separator";
 import { InputOTP, InputOTPGroup, InputOTPSlot } from "../ui/form/InputOtp";
 import { REGEXP_ONLY_DIGITS } from "input-otp";
@@ -32,7 +31,7 @@ function TwoFactorAuthModal({ open, onClose, onSuccess }) {
     onClose();
   };
   if (step === "recovery") {
-    return /* @__PURE__ */ jsx(DialogLayer, { children: /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(
       DialogContent,
       {
         showCloseButton: false,
@@ -84,9 +83,9 @@ function TwoFactorAuthModal({ open, onClose, onSuccess }) {
           ] })
         ]
       }
-    ) }) });
+    ) });
   }
-  return /* @__PURE__ */ jsx(DialogLayer, { children: /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(
     DialogContent,
     {
       showCloseButton: false,
@@ -173,7 +172,7 @@ function TwoFactorAuthModal({ open, onClose, onSuccess }) {
         )
       ]
     }
-  ) }) });
+  ) });
 }
 export {
   TwoFactorAuthModal as default

package/dist/components/account/TwoFactorAuthModal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/account/TwoFactorAuthModal.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { IconX, IconCopy, IconRefresh } from '@tabler/icons-react';\nimport { Button } from '../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';\nimport { DialogLayer } from '../ui/overlay/layers';\nimport { Separator } from '../ui/data-display/Separator';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../ui/form/InputOtp';\nimport { REGEXP_ONLY_DIGITS } from 'input-otp';\nimport useTwoFactorAuthForm from './hooks/useTwoFactorAuthForm';\n\ninterface TwoFactorAuthModalProps {\n open: boolean;\n onClose: () => void;\n onSuccess?: () => void;\n}\n\nexport default function TwoFactorAuthModal({ open, onClose, onSuccess }: TwoFactorAuthModalProps) {\n const translate = useTranslations();\n const {\n code,\n setCode,\n isCodeComplete,\n isGenerating,\n isConfirming,\n generateFailed,\n retryGenerate,\n qrcode,\n backupCodes,\n step,\n handleSubmit,\n handleFinalize,\n handleCopyCodes,\n resetForm,\n } = useTwoFactorAuthForm({ onSuccess, open });\n\n const handleClose = () => {\n resetForm();\n onClose();\n };\n\n if (step === 'recovery') {\n return (\n <DialogLayer>\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>{translate('common.account.twoFactor.recoveryTitle')}</DialogTitle>\n </DialogHeader>\n <div className=\"flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n {translate('common.account.twoFactor.recoveryTitle')}\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\n <div className=\"flex flex-col gap-5 lg:gap-6 px-4 lg:px-5 py-5 lg:py-6 flex-1 lg:flex-none\">\n <div className=\"flex flex-col gap-2\">\n <h3 className=\"paragraph-medium-semibold text-gray-950 max-w-[269px]\">\n {translate('common.account.twoFactor.recoveryHeading')}\n </h3>\n <div className=\"paragraph-small-regular text-gray-600\">\n <p>{translate('common.account.twoFactor.recoveryText1')}</p>\n <br />\n <p>{translate('common.account.twoFactor.recoveryText2')}</p>\n </div>\n </div>\n\n <div className=\"bg-gray-50 rounded-lg p-4 flex flex-col gap-4\">\n <div className=\"paragraph-small-medium text-gray-950 whitespace-nowrap\">\n {backupCodes.map((backupCode, i) => (\n <p key={i}>{backupCode}</p>\n ))}\n </div>\n <Button\n type=\"button\"\n variant=\"secondary\"\n className=\"h-8! w-fit\"\n onClick={handleCopyCodes}\n >\n <IconCopy size={16} />\n {translate('common.account.twoFactor.copyCodes')}\n </Button>\n </div>\n </div>\n\n <div className=\"flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between mt-auto lg:mt-0\">\n <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n {translate('common.actions.cancel')}\n </Button>\n <Button className=\"h-10!\" type=\"button\" onClick={handleFinalize}>\n {translate('common.account.twoFactor.finish')}\n </Button>\n </div>\n </DialogContent>\n </Dialog>\n </DialogLayer>\n );\n }\n\n return (\n <DialogLayer>\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] lg:h-auto lg:max-h-[90vh] lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>{translate('common.account.twoFactor.title')}</DialogTitle>\n </DialogHeader>\n <div className=\"shrink-0 flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n {translate('common.account.twoFactor.title')}\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\n <form\n className=\"flex-1 min-h-0 flex flex-col\"\n onSubmit={(e) => {\n e.preventDefault();\n if (isCodeComplete) handleSubmit();\n }}\n >\n <div className=\"flex-1 min-h-0 overflow-y-auto overscroll-contain lg:overflow-visible\">\n <div className=\"flex flex-col items-center gap-4 lg:gap-8 px-4 lg:px-5 py-4 lg:py-6 pb-60 lg:pb-6\">\n <p className=\"paragraph-small-regular text-gray-950 text-center max-w-full lg:max-w-[412px]\">\n {translate.rich('common.account.twoFactor.instructions', {\n link: (chunks) => (\n <a\n href=\"https://support.google.com/accounts/answer/1066447\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"paragraph-small-medium underline\"\n >\n {chunks}\n </a>\n ),\n })}\n </p>\n\n <div className=\"border border-gray-200 rounded-lg overflow-hidden p-2 lg:p-3 flex items-center justify-center w-[136px] h-[136px] lg:w-[203px] lg:h-[203px]\">\n {generateFailed ? (\n <button\n type=\"button\"\n onClick={() => retryGenerate()}\n className=\"flex flex-col items-center gap-1.5 text-center\"\n >\n <IconRefresh size={20} className=\"text-gray-400\" />\n <span className=\"paragraph-xsmall-medium text-gray-500\">\n {translate('common.account.twoFactor.retry')}\n </span>\n </button>\n ) : isGenerating \|\| !qrcode ? (\n <div className=\"skeleton w-full h-full rounded\" />\n ) : (\n // eslint-disable-next-line @next/next/no-img-element\n <img\n src={qrcode}\n alt={translate('common.account.twoFactor.qrAlt')}\n className=\"w-full h-full\"\n />\n )}\n </div>\n\n <div className=\"flex items-center gap-3 w-full\">\n <Separator className=\"flex-1\" />\n <span className=\"paragraph-xsmall-medium text-gray-500 opacity-80 whitespace-nowrap\">\n {translate('common.account.twoFactor.pasteDigits')}\n </span>\n <Separator className=\"flex-1\" />\n </div>\n\n <div className=\"scroll-mt-20\">\n <InputOTP maxLength={6} pattern={REGEXP_ONLY_DIGITS} value={code} onChange={setCode}>\n <InputOTPGroup className=\"gap-2\">\n {Array.from({ length: 6 }).map((_, i) => (\n <InputOTPSlot\n key={i}\n index={i}\n className=\"w-11! lg:w-12! h-13! lg:h-14! rounded-lg! text-lg border-gray-200\"\n />\n ))}\n </InputOTPGroup>\n </InputOTP>\n </div>\n </div>\n </div>\n\n <div className=\"shrink-0 flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between gap-2 bg-white\">\n <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n {translate('common.actions.cancel')}\n </Button>\n <Button type=\"submit\" className=\"h-10!\" disabled={!isCodeComplete \|\| isConfirming}>\n {isConfirming\n ? translate('common.account.twoFactor.activating')\n : translate('common.account.twoFactor.activate')}\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n </DialogLayer>\n );\n}\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../src/components/account/TwoFactorAuthModal.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { IconX, IconCopy, IconRefresh } from '@tabler/icons-react';\nimport { Button } from '../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';\nimport { Separator } from '../ui/data-display/Separator';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../ui/form/InputOtp';\nimport { REGEXP_ONLY_DIGITS } from 'input-otp';\nimport useTwoFactorAuthForm from './hooks/useTwoFactorAuthForm';\n\ninterface TwoFactorAuthModalProps {\n open: boolean;\n onClose: () => void;\n onSuccess?: () => void;\n}\n\nexport default function TwoFactorAuthModal({ open, onClose, onSuccess }: TwoFactorAuthModalProps) {\n const translate = useTranslations();\n const {\n code,\n setCode,\n isCodeComplete,\n isGenerating,\n isConfirming,\n generateFailed,\n retryGenerate,\n qrcode,\n backupCodes,\n step,\n handleSubmit,\n handleFinalize,\n handleCopyCodes,\n resetForm,\n } = useTwoFactorAuthForm({ onSuccess, open });\n\n const handleClose = () => {\n resetForm();\n onClose();\n };\n\n if (step === 'recovery') {\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>{translate('common.account.twoFactor.recoveryTitle')}</DialogTitle>\n </DialogHeader>\n <div className=\"flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n {translate('common.account.twoFactor.recoveryTitle')}\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\n <div className=\"flex flex-col gap-5 lg:gap-6 px-4 lg:px-5 py-5 lg:py-6 flex-1 lg:flex-none\">\n <div className=\"flex flex-col gap-2\">\n <h3 className=\"paragraph-medium-semibold text-gray-950 max-w-[269px]\">\n {translate('common.account.twoFactor.recoveryHeading')}\n </h3>\n <div className=\"paragraph-small-regular text-gray-600\">\n <p>{translate('common.account.twoFactor.recoveryText1')}</p>\n <br />\n <p>{translate('common.account.twoFactor.recoveryText2')}</p>\n </div>\n </div>\n\n <div className=\"bg-gray-50 rounded-lg p-4 flex flex-col gap-4\">\n <div className=\"paragraph-small-medium text-gray-950 whitespace-nowrap\">\n {backupCodes.map((backupCode, i) => (\n <p key={i}>{backupCode}</p>\n ))}\n </div>\n <Button\n type=\"button\"\n variant=\"secondary\"\n className=\"h-8! w-fit\"\n onClick={handleCopyCodes}\n >\n <IconCopy size={16} />\n {translate('common.account.twoFactor.copyCodes')}\n </Button>\n </div>\n </div>\n\n <div className=\"flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between mt-auto lg:mt-0\">\n <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n {translate('common.actions.cancel')}\n </Button>\n <Button className=\"h-10!\" type=\"button\" onClick={handleFinalize}>\n {translate('common.account.twoFactor.finish')}\n </Button>\n </div>\n </DialogContent>\n </Dialog>\n );\n }\n\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] lg:h-auto lg:max-h-[90vh] lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>{translate('common.account.twoFactor.title')}</DialogTitle>\n </DialogHeader>\n <div className=\"shrink-0 flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n {translate('common.account.twoFactor.title')}\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\n <form\n className=\"flex-1 min-h-0 flex flex-col\"\n onSubmit={(e) => {\n e.preventDefault();\n if (isCodeComplete) handleSubmit();\n }}\n >\n <div className=\"flex-1 min-h-0 overflow-y-auto overscroll-contain lg:overflow-visible\">\n <div className=\"flex flex-col items-center gap-4 lg:gap-8 px-4 lg:px-5 py-4 lg:py-6 pb-60 lg:pb-6\">\n <p className=\"paragraph-small-regular text-gray-950 text-center max-w-full lg:max-w-[412px]\">\n {translate.rich('common.account.twoFactor.instructions', {\n link: (chunks) => (\n <a\n href=\"https://support.google.com/accounts/answer/1066447\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"paragraph-small-medium underline\"\n >\n {chunks}\n </a>\n ),\n })}\n </p>\n\n <div className=\"border border-gray-200 rounded-lg overflow-hidden p-2 lg:p-3 flex items-center justify-center w-[136px] h-[136px] lg:w-[203px] lg:h-[203px]\">\n {generateFailed ? (\n <button\n type=\"button\"\n onClick={() => retryGenerate()}\n className=\"flex flex-col items-center gap-1.5 text-center\"\n >\n <IconRefresh size={20} className=\"text-gray-400\" />\n <span className=\"paragraph-xsmall-medium text-gray-500\">\n {translate('common.account.twoFactor.retry')}\n </span>\n </button>\n ) : isGenerating \|\| !qrcode ? (\n <div className=\"skeleton w-full h-full rounded\" />\n ) : (\n // eslint-disable-next-line @next/next/no-img-element\n <img\n src={qrcode}\n alt={translate('common.account.twoFactor.qrAlt')}\n className=\"w-full h-full\"\n />\n )}\n </div>\n\n <div className=\"flex items-center gap-3 w-full\">\n <Separator className=\"flex-1\" />\n <span className=\"paragraph-xsmall-medium text-gray-500 opacity-80 whitespace-nowrap\">\n {translate('common.account.twoFactor.pasteDigits')}\n </span>\n <Separator className=\"flex-1\" />\n </div>\n\n <div className=\"scroll-mt-20\">\n <InputOTP maxLength={6} pattern={REGEXP_ONLY_DIGITS} value={code} onChange={setCode}>\n <InputOTPGroup className=\"gap-2\">\n {Array.from({ length: 6 }).map((_, i) => (\n <InputOTPSlot\n key={i}\n index={i}\n className=\"w-11! lg:w-12! h-13! lg:h-14! rounded-lg! text-lg border-gray-200\"\n />\n ))}\n </InputOTPGroup>\n </InputOTP>\n </div>\n </div>\n </div>\n\n <div className=\"shrink-0 flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between gap-2 bg-white\">\n <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n {translate('common.actions.cancel')}\n </Button>\n <Button type=\"submit\" className=\"h-10!\" disabled={!isCodeComplete \|\| isConfirming}>\n {isConfirming\n ? translate('common.account.twoFactor.activating')\n : translate('common.account.twoFactor.activate')}\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n );\n}\n"],"mappings":"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","names":[]}

package/dist/components/account/sections/MyProfileSection.mjs CHANGED Viewed

@@ -20,7 +20,6 @@ import { useUpdateAccountUser } from "../../../modules/accounts/hooks/useAccount
 import { GENDER_OPTIONS } from "../constants";
 import { ChangePhoneModal } from "./ChangePhoneModal";
 import { ChangeEmailModal } from "./ChangeEmailModal";
-import { DialogLayer } from "../../ui/overlay/layers";
 function MyProfileSection({ onClose, storageUrl }) {
   const translate = useTranslations();
   const genderOptions = GENDER_OPTIONS.map((option) => ({
@@ -266,10 +265,8 @@ function MyProfileSection({ onClose, storageUrl }) {
         /* @__PURE__ */ jsx(Button, { className: "h-10! cursor-pointer", type: "submit", disabled: isSubmitting, children: isSubmitting ? translate("common.actions.saving") : translate("common.actions.saveChanges") })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs(DialogLayer, { children: [
-      /* @__PURE__ */ jsx(ChangePhoneModal, { open: changePhoneOpen, onClose: () => setChangePhoneOpen(false) }),
-      /* @__PURE__ */ jsx(ChangeEmailModal, { open: changeEmailOpen, onClose: () => setChangeEmailOpen(false) })
-    ] })
+    /* @__PURE__ */ jsx(ChangePhoneModal, { open: changePhoneOpen, onClose: () => setChangePhoneOpen(false) }),
+    /* @__PURE__ */ jsx(ChangeEmailModal, { open: changeEmailOpen, onClose: () => setChangeEmailOpen(false) })
   ] });
 }
 export {

package/dist/components/account/sections/MyProfileSection.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/account/sections/MyProfileSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useRef } from 'react';\nimport Image from 'next/image';\nimport { useTranslations } from 'next-intl';\nimport { useForm } from 'react-hook-form';\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { toast } from 'sonner';\nimport { IconUpload, IconTrash } from '@tabler/icons-react';\nimport { ACCEPTED_IMAGE_FORMATS_STRING } from '../../../modules/images/constants/image.constants';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { FormField } from '../../ui/form/FormField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport PhoneInput from '../../ui/form/PhoneInput';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { myProfileSchema, type MyProfileFormData } from '../../../utils/validators/account';\nimport { useUpdateAccountUser } from '../../../modules/accounts/hooks/useAccountManagement';\nimport { GENDER_OPTIONS } from '../constants';\nimport { ChangePhoneModal } from './ChangePhoneModal';\nimport { ChangeEmailModal } from './ChangeEmailModal';\nimport { DialogLayer } from '../../ui/overlay/layers';\n\ninterface MyProfileSectionProps {\n onClose: () => void;\n storageUrl?: string;\n}\n\nexport function MyProfileSection({ onClose, storageUrl }: MyProfileSectionProps) {\n const translate = useTranslations();\n const genderOptions = GENDER_OPTIONS.map((option) => ({\n ...option,\n label: translate(\n `common.account.profile.genderOptions.${option.value === 'masculino' ? 'male' : 'female'}`,\n ),\n }));\n const { user } = useAuth();\n const updateAccountUser = useUpdateAccountUser();\n const fileInputRef = useRef<HTMLInputElement>(null);\n const [selectedPhoto, setSelectedPhoto] = useState<File \| null>(null);\n const [photoRemoved, setPhotoRemoved] = useState(false);\n const [changePhoneOpen, setChangePhoneOpen] = useState(false);\n const [changeEmailOpen, setChangeEmailOpen] = useState(false);\n\n const form = useForm<MyProfileFormData>({\n resolver: zodResolver(myProfileSchema),\n mode: 'onChange',\n defaultValues: {\n name: user?.name ?? '',\n last_name: user?.last_name ?? '',\n gender: GENDER_OPTIONS.find((g) => g.apiValue === user?.gender)?.value ?? '',\n },\n });\n\n const {\n register,\n handleSubmit,\n watch,\n setValue,\n formState: { errors, isSubmitting },\n } = form;\n\n const baseStorageUrl = storageUrl ?? process.env.NEXT_PUBLIC_STORAGE_URL ?? '';\n\n const avatarPreview = selectedPhoto\n ? URL.createObjectURL(selectedPhoto)\n : !photoRemoved && user?.photo\n ? `${baseStorageUrl}/${user.photo}`\n : null;\n\n const handlePhotoChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0] ?? null;\n if (file) {\n setSelectedPhoto(file);\n setPhotoRemoved(false);\n }\n };\n\n const handleRemovePhoto = () => {\n setSelectedPhoto(null);\n setPhotoRemoved(true);\n };\n\n const onSubmit = async (data: MyProfileFormData) => {\n try {\n await updateAccountUser.mutateAsync({\n name: data.name,\n last_name: data.last_name,\n gender: GENDER_OPTIONS.find((g) => g.value === data.gender)?.apiValue,\n ...(selectedPhoto ? { photo: selectedPhoto } : {}),\n ...(photoRemoved ? { photo: '' } : {}),\n });\n\n form.reset(data);\n setSelectedPhoto(null);\n setPhotoRemoved(false);\n toast.custom((toastId) => (\n <Toast\n variant=\"success\"\n message={translate('common.account.profile.savedSuccess')}\n toastId={toastId}\n />\n ));\n onClose();\n } catch (error) {\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={error instanceof Error ? error.message : translate('common.account.profile.saveError')}\n toastId={toastId}\n />\n ));\n }\n };\n\n return (\n <>\n <form onSubmit={handleSubmit(onSubmit)} className=\"lg:h-full lg:flex lg:flex-col\">\n <input\n ref={fileInputRef}\n type=\"file\"\n accept={ACCEPTED_IMAGE_FORMATS_STRING}\n className=\"hidden\"\n onChange={handlePhotoChange}\n />\n <div className=\"absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:static lg:flex-1 lg:min-h-0 lg:overscroll-auto flex flex-col gap-5 lg:gap-6\">\n <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">\n {translate('common.account.profile.title')}\n </span>\n <div className=\"flex flex-col gap-5\">\n <div className=\"flex items-center gap-4\">\n {avatarPreview ? (\n <Image\n src={avatarPreview}\n alt={translate('common.account.profile.avatarAlt')}\n width={48}\n height={48}\n className=\"size-12 rounded-full object-cover cursor-pointer\"\n onClick={() => fileInputRef.current?.click()}\n />\n ) : (\n <div\n className=\"size-12 rounded-full bg-gray-50 border border-dashed border-gray-200 flex items-center justify-center cursor-pointer\"\n onClick={() => fileInputRef.current?.click()}\n >\n <IconUpload size={20} className=\"text-gray-400\" />\n </div>\n )}\n {avatarPreview ? (\n <div className=\"flex items-center gap-2\">\n <Button\n variant=\"secondary\"\n className=\"w-fit h-8!\"\n type=\"button\"\n onClick={() => fileInputRef.current?.click()}\n >\n {translate('common.account.profile.changePhoto')}\n </Button>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"h-8!\"\n onClick={handleRemovePhoto}\n >\n <IconTrash size={16} className=\"text-gray-500\" />\n </Button>\n </div>\n ) : (\n <Button\n variant=\"secondary\"\n className=\"w-fit h-8!\"\n type=\"button\"\n onClick={() => fileInputRef.current?.click()}\n >\n {translate('common.account.profile.changePhoto')}\n </Button>\n )}\n </div>\n\n <div className=\"flex flex-col gap-8\">\n <div className=\"flex flex-col gap-4\">\n <div className=\"flex gap-4\">\n <FormField\n label={translate('common.account.profile.name')}\n placeholder={translate('common.account.profile.namePlaceholder')}\n error={!!errors.name}\n errorMessage={errors.name?.message}\n {...register('name')}\n />\n <FormField\n label={translate('common.account.profile.lastName')}\n placeholder={translate('common.account.profile.lastNamePlaceholder')}\n error={!!errors.last_name}\n errorMessage={errors.last_name?.message}\n {...register('last_name')}\n />\n </div>\n <SelectField\n label={translate('common.account.profile.gender')}\n placeholder={translate('common.account.profile.genderPlaceholder')}\n options={genderOptions}\n value={watch('gender')}\n className=\"h-10!\"\n onChange={(value) => setValue('gender', value as string)}\n />\n <div className=\"relative\">\n <PhoneInput\n label={translate('common.account.profile.phone')}\n value={user?.phone ?? ''}\n disabled\n classnameContainer=\"bg-gray-50 border-0!\"\n />\n <button\n type=\"button\"\n className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n onClick={() => setChangePhoneOpen(true)}\n >\n {translate('common.account.profile.change')}\n </button>\n </div>\n </div>\n\n <Separator />\n\n <div className=\"flex flex-col gap-4\">\n <span className=\"paragraph-medium-semibold text-gray-600\">\n {translate('common.account.profile.accessData')}\n </span>\n <div className=\"relative\">\n <div className='cursor-not-allowed'>\n <FormField\n label={translate('common.account.profile.email')}\n value={user?.email ?? ''}\n disabled\n classnameContainer=\"bg-gray-50 border-0!\"\n />\n </div>\n <button\n type=\"button\"\n className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n onClick={() => setChangeEmailOpen(true)}\n >\n {translate('common.account.profile.change')}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div className=\"fixed bottom-0 left-0 right-0 lg:static flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white z-10\">\n <Button\n variant=\"secondary\"\n className=\"h-10!\"\n type=\"button\"\n disabled={isSubmitting}\n onClick={() => {\n form.reset();\n setSelectedPhoto(null);\n setPhotoRemoved(false);\n onClose();\n }}\n >\n {translate('common.actions.cancel')}\n </Button>\n <Button className=\"h-10! cursor-pointer\" type=\"submit\" disabled={isSubmitting}>\n {isSubmitting ? translate('common.actions.saving') : translate('common.actions.saveChanges')}\n </Button>\n </div>\n </form>\n\n {/* Abrem por cima desta secao, mas sao declarados como irmaos dela. */}\n <DialogLayer>\n <ChangePhoneModal open={changePhoneOpen} onClose={() => setChangePhoneOpen(false)} />\n <ChangeEmailModal open={changeEmailOpen} onClose={() => setChangeEmailOpen(false)} />\n </DialogLayer>\n </>\n );\n}\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../../src/components/account/sections/MyProfileSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useRef } from 'react';\nimport Image from 'next/image';\nimport { useTranslations } from 'next-intl';\nimport { useForm } from 'react-hook-form';\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { toast } from 'sonner';\nimport { IconUpload, IconTrash } from '@tabler/icons-react';\nimport { ACCEPTED_IMAGE_FORMATS_STRING } from '../../../modules/images/constants/image.constants';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { FormField } from '../../ui/form/FormField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport PhoneInput from '../../ui/form/PhoneInput';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { myProfileSchema, type MyProfileFormData } from '../../../utils/validators/account';\nimport { useUpdateAccountUser } from '../../../modules/accounts/hooks/useAccountManagement';\nimport { GENDER_OPTIONS } from '../constants';\nimport { ChangePhoneModal } from './ChangePhoneModal';\nimport { ChangeEmailModal } from './ChangeEmailModal';\n\ninterface MyProfileSectionProps {\n onClose: () => void;\n storageUrl?: string;\n}\n\nexport function MyProfileSection({ onClose, storageUrl }: MyProfileSectionProps) {\n const translate = useTranslations();\n const genderOptions = GENDER_OPTIONS.map((option) => ({\n ...option,\n label: translate(\n `common.account.profile.genderOptions.${option.value === 'masculino' ? 'male' : 'female'}`,\n ),\n }));\n const { user } = useAuth();\n const updateAccountUser = useUpdateAccountUser();\n const fileInputRef = useRef<HTMLInputElement>(null);\n const [selectedPhoto, setSelectedPhoto] = useState<File \| null>(null);\n const [photoRemoved, setPhotoRemoved] = useState(false);\n const [changePhoneOpen, setChangePhoneOpen] = useState(false);\n const [changeEmailOpen, setChangeEmailOpen] = useState(false);\n\n const form = useForm<MyProfileFormData>({\n resolver: zodResolver(myProfileSchema),\n mode: 'onChange',\n defaultValues: {\n name: user?.name ?? '',\n last_name: user?.last_name ?? '',\n gender: GENDER_OPTIONS.find((g) => g.apiValue === user?.gender)?.value ?? '',\n },\n });\n\n const {\n register,\n handleSubmit,\n watch,\n setValue,\n formState: { errors, isSubmitting },\n } = form;\n\n const baseStorageUrl = storageUrl ?? process.env.NEXT_PUBLIC_STORAGE_URL ?? '';\n\n const avatarPreview = selectedPhoto\n ? URL.createObjectURL(selectedPhoto)\n : !photoRemoved && user?.photo\n ? `${baseStorageUrl}/${user.photo}`\n : null;\n\n const handlePhotoChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0] ?? null;\n if (file) {\n setSelectedPhoto(file);\n setPhotoRemoved(false);\n }\n };\n\n const handleRemovePhoto = () => {\n setSelectedPhoto(null);\n setPhotoRemoved(true);\n };\n\n const onSubmit = async (data: MyProfileFormData) => {\n try {\n await updateAccountUser.mutateAsync({\n name: data.name,\n last_name: data.last_name,\n gender: GENDER_OPTIONS.find((g) => g.value === data.gender)?.apiValue,\n ...(selectedPhoto ? { photo: selectedPhoto } : {}),\n ...(photoRemoved ? { photo: '' } : {}),\n });\n\n form.reset(data);\n setSelectedPhoto(null);\n setPhotoRemoved(false);\n toast.custom((toastId) => (\n <Toast\n variant=\"success\"\n message={translate('common.account.profile.savedSuccess')}\n toastId={toastId}\n />\n ));\n onClose();\n } catch (error) {\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={error instanceof Error ? error.message : translate('common.account.profile.saveError')}\n toastId={toastId}\n />\n ));\n }\n };\n\n return (\n <>\n <form onSubmit={handleSubmit(onSubmit)} className=\"lg:h-full lg:flex lg:flex-col\">\n <input\n ref={fileInputRef}\n type=\"file\"\n accept={ACCEPTED_IMAGE_FORMATS_STRING}\n className=\"hidden\"\n onChange={handlePhotoChange}\n />\n <div className=\"absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:static lg:flex-1 lg:min-h-0 lg:overscroll-auto flex flex-col gap-5 lg:gap-6\">\n <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">\n {translate('common.account.profile.title')}\n </span>\n <div className=\"flex flex-col gap-5\">\n <div className=\"flex items-center gap-4\">\n {avatarPreview ? (\n <Image\n src={avatarPreview}\n alt={translate('common.account.profile.avatarAlt')}\n width={48}\n height={48}\n className=\"size-12 rounded-full object-cover cursor-pointer\"\n onClick={() => fileInputRef.current?.click()}\n />\n ) : (\n <div\n className=\"size-12 rounded-full bg-gray-50 border border-dashed border-gray-200 flex items-center justify-center cursor-pointer\"\n onClick={() => fileInputRef.current?.click()}\n >\n <IconUpload size={20} className=\"text-gray-400\" />\n </div>\n )}\n {avatarPreview ? (\n <div className=\"flex items-center gap-2\">\n <Button\n variant=\"secondary\"\n className=\"w-fit h-8!\"\n type=\"button\"\n onClick={() => fileInputRef.current?.click()}\n >\n {translate('common.account.profile.changePhoto')}\n </Button>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"h-8!\"\n onClick={handleRemovePhoto}\n >\n <IconTrash size={16} className=\"text-gray-500\" />\n </Button>\n </div>\n ) : (\n <Button\n variant=\"secondary\"\n className=\"w-fit h-8!\"\n type=\"button\"\n onClick={() => fileInputRef.current?.click()}\n >\n {translate('common.account.profile.changePhoto')}\n </Button>\n )}\n </div>\n\n <div className=\"flex flex-col gap-8\">\n <div className=\"flex flex-col gap-4\">\n <div className=\"flex gap-4\">\n <FormField\n label={translate('common.account.profile.name')}\n placeholder={translate('common.account.profile.namePlaceholder')}\n error={!!errors.name}\n errorMessage={errors.name?.message}\n {...register('name')}\n />\n <FormField\n label={translate('common.account.profile.lastName')}\n placeholder={translate('common.account.profile.lastNamePlaceholder')}\n error={!!errors.last_name}\n errorMessage={errors.last_name?.message}\n {...register('last_name')}\n />\n </div>\n <SelectField\n label={translate('common.account.profile.gender')}\n placeholder={translate('common.account.profile.genderPlaceholder')}\n options={genderOptions}\n value={watch('gender')}\n className=\"h-10!\"\n onChange={(value) => setValue('gender', value as string)}\n />\n <div className=\"relative\">\n <PhoneInput\n label={translate('common.account.profile.phone')}\n value={user?.phone ?? ''}\n disabled\n classnameContainer=\"bg-gray-50 border-0!\"\n />\n <button\n type=\"button\"\n className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n onClick={() => setChangePhoneOpen(true)}\n >\n {translate('common.account.profile.change')}\n </button>\n </div>\n </div>\n\n <Separator />\n\n <div className=\"flex flex-col gap-4\">\n <span className=\"paragraph-medium-semibold text-gray-600\">\n {translate('common.account.profile.accessData')}\n </span>\n <div className=\"relative\">\n <div className='cursor-not-allowed'>\n <FormField\n label={translate('common.account.profile.email')}\n value={user?.email ?? ''}\n disabled\n classnameContainer=\"bg-gray-50 border-0!\"\n />\n </div>\n <button\n type=\"button\"\n className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n onClick={() => setChangeEmailOpen(true)}\n >\n {translate('common.account.profile.change')}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div className=\"fixed bottom-0 left-0 right-0 lg:static flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white z-10\">\n <Button\n variant=\"secondary\"\n className=\"h-10!\"\n type=\"button\"\n disabled={isSubmitting}\n onClick={() => {\n form.reset();\n setSelectedPhoto(null);\n setPhotoRemoved(false);\n onClose();\n }}\n >\n {translate('common.actions.cancel')}\n </Button>\n <Button className=\"h-10! cursor-pointer\" type=\"submit\" disabled={isSubmitting}>\n {isSubmitting ? translate('common.actions.saving') : translate('common.actions.saveChanges')}\n </Button>\n </div>\n </form>\n\n <ChangePhoneModal open={changePhoneOpen} onClose={() => setChangePhoneOpen(false)} />\n <ChangeEmailModal open={changeEmailOpen} onClose={() => setChangeEmailOpen(false)} />\n </>\n );\n}\n"],"mappings":"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","names":[]}

package/dist/components/layouts/UsersSelectorPopover.mjs CHANGED Viewed

@@ -174,7 +174,7 @@ function UsersSelectorPopover({
                                 )
                               }
                             ) }),
-                            /* @__PURE__ */ jsx(TooltipContent, { className: "z-[1002]", children: inProject ? translate("common.layout.usersSelector.removeFromProject") : translate("common.layout.usersSelector.addToProject") })
+                            /* @__PURE__ */ jsx(TooltipContent, { children: inProject ? translate("common.layout.usersSelector.removeFromProject") : translate("common.layout.usersSelector.addToProject") })
                           ] })
                         ] })
                       },

package/dist/components/layouts/UsersSelectorPopover.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/layouts/UsersSelectorPopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useTranslations } from \"next-intl\";\nimport { IconPlus, IconUser, IconUsers } from '@tabler/icons-react';\nimport { UserAvatar } from \"../ui/data-display/UserAvatar\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport {\n Command,\n CommandEmpty,\n CommandInput,\n CommandItem,\n CommandList,\n} from \"../ui/overlay/Command\";\nimport { Checkbox } from \"../ui/form/Checkbox\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useListProjectUsers } from \"../../modules/projects/hooks/list-project-users.hook\";\nimport { useListAllAccountUsers } from \"../../modules/projects/hooks/list-all-account-users.hook\";\nimport { useAddProjectUser } from \"../../modules/projects/hooks/add-project-user.hook\";\nimport { useRemoveProjectUser } from \"../../modules/projects/hooks/remove-project-user.hook\";\nimport { useWhitelabelUrls } from \"../../providers/whitelabel.provider\";\n\nexport interface UsersSelectorPopoverProps {\n projectId?: number;\n side?: \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n align?: \"start\" \| \"center\" \| \"end\";\n contentClassName?: string;\n}\n\nfunction UserItemSkeleton() {\n return (\n <div className=\"flex items-center justify-between px-2 py-1.5 gap-2\">\n <div className=\"flex items-center gap-2 flex-1\">\n <div className=\"skeleton size-8 rounded-full shrink-0\" />\n <div className=\"skeleton h-3.5 w-28 rounded\" />\n </div>\n <div className=\"skeleton size-4 rounded shrink-0\" />\n </div>\n );\n}\n\nexport function UsersSelectorPopover({\n projectId,\n side,\n align,\n contentClassName,\n}: UsersSelectorPopoverProps) {\n const translate = useTranslations();\n const { accountsUrl } = useWhitelabelUrls();\n const [open, setOpen] = useState(false);\n const [hoveredId, setHoveredId] = useState<number \| null>(null);\n const [searchInput, setSearchInput] = useState(\"\");\n const [search, setSearch] = useState(\"\");\n\n const id = projectId ?? 0;\n\n useEffect(() => {\n const timer = setTimeout(() => setSearch(searchInput), 300);\n return () => clearTimeout(timer);\n }, [searchInput]);\n\n const accountUsers = useListAllAccountUsers(search, id \|\| undefined);\n const projectUsers = useListProjectUsers(id, \"\");\n const addMutation = useAddProjectUser(id);\n const removeMutation = useRemoveProjectUser(id);\n\n const allUsers = accountUsers.data?.pages.flatMap((p) => p.data) ?? [];\n const isLoading = accountUsers.isLoading;\n const isFetchingMore = accountUsers.isFetchingNextPage;\n const totalInProject = projectUsers.data?.pages[0]?.total ?? 0;\n\n const toggleUser = (userId: number, inProject: boolean, removable: boolean) => {\n if (inProject) {\n if (!removable) return;\n removeMutation.mutate(userId);\n } else {\n addMutation.mutate(userId);\n }\n };\n\n const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {\n const target = e.currentTarget;\n const nearBottom =\n target.scrollTop + target.clientHeight >= target.scrollHeight - 50;\n if (!nearBottom) return;\n if (accountUsers.hasNextPage && !accountUsers.isFetchingNextPage) {\n accountUsers.fetchNextPage();\n }\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger className=\"cursor-pointer\">\n <div className=\"flex items-center gap-2 text-gray-950 px-3 py-2 border border-gray-200 rounded-full hover:border-gray-950\">\n <span className=\"paragraph-small-semibold\">{totalInProject}</span>\n <IconUser size={16} />\n </div>\n </PopoverTrigger>\n\n <PopoverContent\n className={cn(\n \"absolute right-0 md:right-[-88px] w-[296px] p-0 bg-white rounded-2xl shadow-md border border-gray-200\",\n contentClassName,\n )}\n side={side}\n align={align}\n sideOffset={8}\n >\n <div className=\"flex flex-col p-3 gap-2\">\n <div className=\"flex items-center justify-between\">\n <span className=\"paragraph-small-semibold\">{translate('common.layout.usersSelector.title')}</span>\n <div className=\"flex items-center gap-1.5\">\n <Button\n variant=\"secondary\"\n className=\"h-8 paragraph-small-semibold text-gray-950\"\n onClick={() => {\n window.location.href = `${accountsUrl}/my-teams?createNew=true`;\n }}\n >\n <IconPlus size={16} />\n {translate('common.layout.usersSelector.add')}\n </Button>\n </div>\n </div>\n\n <Command shouldFilter={false} className=\"gap-2\" value=\"\">\n <CommandInput\n placeholder={translate('common.layout.usersSelector.searchPlaceholder')}\n value={searchInput}\n onValueChange={setSearchInput}\n />\n <CommandList\n className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]\"\n onScroll={handleScroll}\n >\n {isLoading ? (\n <>\n <UserItemSkeleton />\n <UserItemSkeleton />\n <UserItemSkeleton />\n </>\n ) : allUsers.length === 0 ? (\n <div className=\"flex flex-col items-center justify-center gap-2 h-full text-gray-400 py-4\">\n <IconUsers size={28} className=\"text-gray-300\" />\n <span className=\"paragraph-small-medium text-center text-gray-500\">\n {translate('common.layout.usersSelector.empty')}\n </span>\n </div>\n ) : (\n <>\n <CommandEmpty>{translate('common.layout.usersSelector.noResults')}</CommandEmpty>\n {allUsers.map((user) => {\n const inProject = user.in_project ?? false;\n const removable =\n inProject &&\n user.profile !== \"owner\" &&\n user.profile !== \"admin\";\n const interactive = !inProject \|\| removable;\n\n return (\n <CommandItem\n key={user.id}\n value={user.name \|\| String(user.id)}\n autoFocus={false}\n onPointerEnter={() => setHoveredId(user.id)}\n onPointerLeave={() => setHoveredId(null)}\n onFocus={() => setHoveredId(user.id)}\n onBlur={() => setHoveredId(null)}\n onSelect={() => toggleUser(user.id, inProject, removable)}\n className={interactive ? \"cursor-pointer\" : \"cursor-default\"}\n >\n <div className=\"flex items-center justify-between w-full\">\n <div className=\"flex items-center gap-2 min-w-0\">\n <UserAvatar\n photo={user.photo}\n name={user.name ?? undefined}\n size={32}\n />\n <span className=\"truncate\">{user.name}</span>\n </div>\n <Tooltip open={interactive && hoveredId === user.id}>\n <TooltipTrigger asChild>\n <div\n onClick={(e) => e.stopPropagation()}\n onPointerDown={(e) => e.stopPropagation()}\n >\n <Checkbox\n checked={inProject}\n disabled={!interactive}\n onCheckedChange={() =>\n toggleUser(user.id, inProject, removable)\n }\n className={cn(\n interactive && hoveredId === user.id\n ? \"border-gray-950\"\n : \"\",\n \"disabled:opacity-10\",\n )}\n />\n </div>\n </TooltipTrigger>\n {/* Continua na mao: este tooltip nasce dentro de um\n `PopoverContent`, e a escala de faixas so modela\n aninhamento de modal. Sem o z explicito o tooltip\n fica na faixa do popover que o hospeda e some\n atras dele. */}\n <TooltipContent className=\"z-[1002]\">\n {inProject ? translate('common.layout.usersSelector.removeFromProject') : translate('common.layout.usersSelector.addToProject')}\n </TooltipContent>\n </Tooltip>\n </div>\n </CommandItem>\n );\n })}\n {isFetchingMore && (\n <>\n <UserItemSkeleton />\n <UserItemSkeleton />\n </>\n )}\n </>\n )}\n </CommandList>\n </Command>\n <div className=\"border-t border-gray-200\" />\n <Button\n variant=\"ghost\"\n className=\"h-10! paragraph-small-medium text-gray-600 hover:text-gray-950 hover:bg-zinc-50 w-full justify-center\"\n onClick={() => {\n window.location.href = `${accountsUrl}/my-teams`;\n }}\n >\n {translate('common.layout.usersSelector.manageTeam')}\n </Button>\n </div>\n </PopoverContent>\n </Popover>\n );\n}\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../src/components/layouts/UsersSelectorPopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useTranslations } from \"next-intl\";\nimport { IconPlus, IconUser, IconUsers } from '@tabler/icons-react';\nimport { UserAvatar } from \"../ui/data-display/UserAvatar\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport {\n Command,\n CommandEmpty,\n CommandInput,\n CommandItem,\n CommandList,\n} from \"../ui/overlay/Command\";\nimport { Checkbox } from \"../ui/form/Checkbox\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useListProjectUsers } from \"../../modules/projects/hooks/list-project-users.hook\";\nimport { useListAllAccountUsers } from \"../../modules/projects/hooks/list-all-account-users.hook\";\nimport { useAddProjectUser } from \"../../modules/projects/hooks/add-project-user.hook\";\nimport { useRemoveProjectUser } from \"../../modules/projects/hooks/remove-project-user.hook\";\nimport { useWhitelabelUrls } from \"../../providers/whitelabel.provider\";\n\nexport interface UsersSelectorPopoverProps {\n projectId?: number;\n side?: \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n align?: \"start\" \| \"center\" \| \"end\";\n contentClassName?: string;\n}\n\nfunction UserItemSkeleton() {\n return (\n <div className=\"flex items-center justify-between px-2 py-1.5 gap-2\">\n <div className=\"flex items-center gap-2 flex-1\">\n <div className=\"skeleton size-8 rounded-full shrink-0\" />\n <div className=\"skeleton h-3.5 w-28 rounded\" />\n </div>\n <div className=\"skeleton size-4 rounded shrink-0\" />\n </div>\n );\n}\n\nexport function UsersSelectorPopover({\n projectId,\n side,\n align,\n contentClassName,\n}: UsersSelectorPopoverProps) {\n const translate = useTranslations();\n const { accountsUrl } = useWhitelabelUrls();\n const [open, setOpen] = useState(false);\n const [hoveredId, setHoveredId] = useState<number \| null>(null);\n const [searchInput, setSearchInput] = useState(\"\");\n const [search, setSearch] = useState(\"\");\n\n const id = projectId ?? 0;\n\n useEffect(() => {\n const timer = setTimeout(() => setSearch(searchInput), 300);\n return () => clearTimeout(timer);\n }, [searchInput]);\n\n const accountUsers = useListAllAccountUsers(search, id \|\| undefined);\n const projectUsers = useListProjectUsers(id, \"\");\n const addMutation = useAddProjectUser(id);\n const removeMutation = useRemoveProjectUser(id);\n\n const allUsers = accountUsers.data?.pages.flatMap((p) => p.data) ?? [];\n const isLoading = accountUsers.isLoading;\n const isFetchingMore = accountUsers.isFetchingNextPage;\n const totalInProject = projectUsers.data?.pages[0]?.total ?? 0;\n\n const toggleUser = (userId: number, inProject: boolean, removable: boolean) => {\n if (inProject) {\n if (!removable) return;\n removeMutation.mutate(userId);\n } else {\n addMutation.mutate(userId);\n }\n };\n\n const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {\n const target = e.currentTarget;\n const nearBottom =\n target.scrollTop + target.clientHeight >= target.scrollHeight - 50;\n if (!nearBottom) return;\n if (accountUsers.hasNextPage && !accountUsers.isFetchingNextPage) {\n accountUsers.fetchNextPage();\n }\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger className=\"cursor-pointer\">\n <div className=\"flex items-center gap-2 text-gray-950 px-3 py-2 border border-gray-200 rounded-full hover:border-gray-950\">\n <span className=\"paragraph-small-semibold\">{totalInProject}</span>\n <IconUser size={16} />\n </div>\n </PopoverTrigger>\n\n <PopoverContent\n className={cn(\n \"absolute right-0 md:right-[-88px] w-[296px] p-0 bg-white rounded-2xl shadow-md border border-gray-200\",\n contentClassName,\n )}\n side={side}\n align={align}\n sideOffset={8}\n >\n <div className=\"flex flex-col p-3 gap-2\">\n <div className=\"flex items-center justify-between\">\n <span className=\"paragraph-small-semibold\">{translate('common.layout.usersSelector.title')}</span>\n <div className=\"flex items-center gap-1.5\">\n <Button\n variant=\"secondary\"\n className=\"h-8 paragraph-small-semibold text-gray-950\"\n onClick={() => {\n window.location.href = `${accountsUrl}/my-teams?createNew=true`;\n }}\n >\n <IconPlus size={16} />\n {translate('common.layout.usersSelector.add')}\n </Button>\n </div>\n </div>\n\n <Command shouldFilter={false} className=\"gap-2\" value=\"\">\n <CommandInput\n placeholder={translate('common.layout.usersSelector.searchPlaceholder')}\n value={searchInput}\n onValueChange={setSearchInput}\n />\n <CommandList\n className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[162px]\"\n onScroll={handleScroll}\n >\n {isLoading ? (\n <>\n <UserItemSkeleton />\n <UserItemSkeleton />\n <UserItemSkeleton />\n </>\n ) : allUsers.length === 0 ? (\n <div className=\"flex flex-col items-center justify-center gap-2 h-full text-gray-400 py-4\">\n <IconUsers size={28} className=\"text-gray-300\" />\n <span className=\"paragraph-small-medium text-center text-gray-500\">\n {translate('common.layout.usersSelector.empty')}\n </span>\n </div>\n ) : (\n <>\n <CommandEmpty>{translate('common.layout.usersSelector.noResults')}</CommandEmpty>\n {allUsers.map((user) => {\n const inProject = user.in_project ?? false;\n const removable =\n inProject &&\n user.profile !== \"owner\" &&\n user.profile !== \"admin\";\n const interactive = !inProject \|\| removable;\n\n return (\n <CommandItem\n key={user.id}\n value={user.name \|\| String(user.id)}\n autoFocus={false}\n onPointerEnter={() => setHoveredId(user.id)}\n onPointerLeave={() => setHoveredId(null)}\n onFocus={() => setHoveredId(user.id)}\n onBlur={() => setHoveredId(null)}\n onSelect={() => toggleUser(user.id, inProject, removable)}\n className={interactive ? \"cursor-pointer\" : \"cursor-default\"}\n >\n <div className=\"flex items-center justify-between w-full\">\n <div className=\"flex items-center gap-2 min-w-0\">\n <UserAvatar\n photo={user.photo}\n name={user.name ?? undefined}\n size={32}\n />\n <span className=\"truncate\">{user.name}</span>\n </div>\n <Tooltip open={interactive && hoveredId === user.id}>\n <TooltipTrigger asChild>\n <div\n onClick={(e) => e.stopPropagation()}\n onPointerDown={(e) => e.stopPropagation()}\n >\n <Checkbox\n checked={inProject}\n disabled={!interactive}\n onCheckedChange={() =>\n toggleUser(user.id, inProject, removable)\n }\n className={cn(\n interactive && hoveredId === user.id\n ? \"border-gray-950\"\n : \"\",\n \"disabled:opacity-10\",\n )}\n />\n </div>\n </TooltipTrigger>\n <TooltipContent>\n {inProject ? translate('common.layout.usersSelector.removeFromProject') : translate('common.layout.usersSelector.addToProject')}\n </TooltipContent>\n </Tooltip>\n </div>\n </CommandItem>\n );\n })}\n {isFetchingMore && (\n <>\n <UserItemSkeleton />\n <UserItemSkeleton />\n </>\n )}\n </>\n )}\n </CommandList>\n </Command>\n <div className=\"border-t border-gray-200\" />\n <Button\n variant=\"ghost\"\n className=\"h-10! paragraph-small-medium text-gray-600 hover:text-gray-950 hover:bg-zinc-50 w-full justify-center\"\n onClick={() => {\n window.location.href = `${accountsUrl}/my-teams`;\n }}\n >\n {translate('common.layout.usersSelector.manageTeam')}\n </Button>\n </div>\n </PopoverContent>\n </Popover>\n );\n}\n"],"mappings":"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","names":[]}

package/dist/components/modals/ModalManager.mjs CHANGED Viewed

@@ -1,19 +1,16 @@
 "use client";
 import { Fragment, jsx } from "react/jsx-runtime";
-import { useContext } from "react";
 import { useModalManager } from "../../store/useModalManager";
-import { DialogDepthContext } from "../ui/overlay/layers";
 function ModalManager({ registry }) {
   const { modalStack } = useModalManager();
-  const depth = useContext(DialogDepthContext);
   if (modalStack.length === 0) return null;
-  return /* @__PURE__ */ jsx(Fragment, { children: modalStack.map((modal, index) => {
+  return /* @__PURE__ */ jsx(Fragment, { children: modalStack.map((modal) => {
     const ModalComponent = registry[modal.key];
     if (!ModalComponent) {
       console.warn(`Modal "${modal.key}" not found in registry`);
       return null;
     }
-    return /* @__PURE__ */ jsx(DialogDepthContext.Provider, { value: depth + index, children: /* @__PURE__ */ jsx(ModalComponent, {}) }, modal.key);
+    return /* @__PURE__ */ jsx(ModalComponent, {}, modal.key);
   }) });
 }
 export {

package/dist/components/modals/ModalManager.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/modals/ModalManager.tsx"],"sourcesContent":["'use client';\n\nimport { ComponentType, ~~useContext~~ } from 'react';\nimport { useModalManager } from '../../store/useModalManager';\~~nimport { DialogDepthContext } from '../ui/overlay/layers';\~~n\ninterface ModalManagerProps {\n registry: Record<string, ComponentType>;\n}\n\nexport function ModalManager({ registry }: ModalManagerProps) {\n const { modalStack } = useModalManager();\n ~~const depth = useContext(DialogDepthContext);\n~~\n if (modalStack.length === 0) return null;\n\n return (\n <>\n {modalStack.map((modal~~, index~~) => {\n const ModalComponent = registry[modal.key];\n\n if (!ModalComponent) {\n console.warn(`Modal \"${modal.key}\" not found in registry`);\n return null;\n }\n\n return ~~(\n~~ <~~DialogDepthContext.Provider~~ ~~value={depth + index}~~ key={modal.key}~~>\n <ModalComponent~~ ~~/>\~~n ~~</DialogDepthContext.Provider>\n );\n~~ })}\n </>\n );\n}\n"],"mappings":";~~AAiBI~~,~~mBAWQ~~,~~WAXR~~;~~AAfJ~~,~~SAAwB,kBAAkB;AAC1C,~~SAAS,uBAAuB;~~AAChC~~,SAAS,~~0BAA0B;AAM5B,SAAS,~~aAAa,EAAE,SAAS,GAAsB;AAC5D,QAAM,EAAE,WAAW,IAAI,gBAAgB;~~AACvC~~,~~QAAM,QAAQ,WAAW,kBAAkB;AAE3C,~~MAAI,WAAW,WAAW,EAAG,QAAO;AAEpC,SACE,gCACG,qBAAW,IAAI,CAAC,~~OAAO,~~UAAU;~~AAChC~~,UAAM,iBAAiB,SAAS,MAAM,GAAG;AAEzC,QAAI,CAAC,gBAAgB;AACnB,cAAQ,KAAK,UAAU,MAAM,GAAG,yBAAyB;AACzD,aAAO;AAAA,IACT;AAEA,~~WACE~~,oBAAC,~~mBAAmB~~,~~UAAnB,EAA4B,OAAO,QAAQ,OAC1C,8BAAC,kBAAe,KADsC,~~MAAM,~~GAE9D~~;AAAA,~~EAEJ~~,CAAC,GACH;AAEJ;","names":[]}
1	+ {"version":3,"sources":["../../../src/components/modals/ModalManager.tsx"],"sourcesContent":["'use client';\n\nimport { ComponentType } from 'react';\nimport { useModalManager } from '../../store/useModalManager';\n\ninterface ModalManagerProps {\n registry: Record<string, ComponentType>;\n}\n\nexport function ModalManager({ registry }: ModalManagerProps) {\n const { modalStack } = useModalManager();\n\n if (modalStack.length === 0) return null;\n\n return (\n <>\n {modalStack.map((modal) => {\n const ModalComponent = registry[modal.key];\n\n if (!ModalComponent) {\n console.warn(`Modal \"${modal.key}\" not found in registry`);\n return null;\n }\n\n return <ModalComponent key={modal.key} />;\n })}\n </>\n );\n}\n"],"mappings":";AAeI,mBASW,WATX;AAZJ,SAAS,uBAAuB;AAMzB,SAAS,aAAa,EAAE,SAAS,GAAsB;AAC5D,QAAM,EAAE,WAAW,IAAI,gBAAgB;AAEvC,MAAI,WAAW,WAAW,EAAG,QAAO;AAEpC,SACE,gCACG,qBAAW,IAAI,CAAC,UAAU;AACzB,UAAM,iBAAiB,SAAS,MAAM,GAAG;AAEzC,QAAI,CAAC,gBAAgB;AACnB,cAAQ,KAAK,UAAU,MAAM,GAAG,yBAAyB;AACzD,aAAO;AAAA,IACT;AAEA,WAAO,oBAAC,oBAAoB,MAAM,GAAK;AAAA,EACzC,CAAC,GACH;AAEJ;","names":[]}

package/dist/components/modals/promo/AiCreditsOfferModal/AiCreditsOfferModal.mjs CHANGED Viewed

@@ -25,7 +25,6 @@ import { readOfferStageCookie, writeOfferStageCookie } from "../../../../modules
 import { useAiCreditsOfferModal } from "../../../../store/useAiCreditsOfferModal";
 import { useModalManager } from "../../../../store/useModalManager";
 import { LoseOfferDialog } from "./components/LoseOfferDialog";
-import { DialogLayer } from "../../../ui/overlay/layers";
 import { OfferIllustration } from "./components/OfferIllustration";
 import { OfferPaymentField } from "./components/OfferPaymentField";
 function AiCreditsOfferModal() {
@@ -258,7 +257,7 @@ function AiCreditsOfferModal() {
         ] })
       }
     ) }),
-    /* @__PURE__ */ jsx(DialogLayer, { children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(
       LoseOfferDialog,
       {
         open: confirmingExit,
@@ -268,7 +267,7 @@ function AiCreditsOfferModal() {
         onKeep: () => setConfirmingExit(false),
         onLose: dismiss
       }
-    ) })
+    )
   ] });
 }
 export {

package/dist/components/modals/promo/AiCreditsOfferModal/AiCreditsOfferModal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/modals/promo/AiCreditsOfferModal/AiCreditsOfferModal.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useState } from 'react';\nimport { useStripe } from '@stripe/react-stripe-js';\nimport { IconCheck, IconX } from '@tabler/icons-react';\nimport { useLocale, useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { Button } from '../../../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogTitle } from '../../../ui/overlay/Dialog';\nimport { Toast } from '../../../ui/feedback/Toast';\nimport { useAuth } from '../../../../providers/auth.provider';\nimport { useWhitelabel, useWhitelabelUrls } from '../../../../providers/whitelabel.provider';\nimport { useActiveSubscription } from '../../../../modules/subscriptions/hooks/find-active-subscription.hook';\nimport { useCards } from '../../../../modules/cards/hooks/cards.hook';\nimport { useCurrencyFormatter } from '../../../../modules/accounts/hooks/use-currency-formatter.hook';\nimport { confirmPaymentIfRequired } from '../../../../modules/subscriptions/utils/confirm-payment-if-required';\nimport {\n AI_CREDITS_FIRST_PURCHASE_OFFER,\n AiCreditsOfferStage,\n PAYMENT_METHOD_CARD,\n} from '../../../../modules/ia-credits/constants/ai-credits-offer.constants';\nimport { useAiCreditsOfferEligibility } from '../../../../modules/ia-credits/hooks/use-offer-eligibility.hook';\nimport { usePurchaseIaCredits } from '../../../../modules/ia-credits/hooks/purchase-ia-credits.hook';\nimport type { PurchaseIaCreditsResult } from '../../../../modules/ia-credits/types/ai-credits-offer.type';\nimport { readOfferStageCookie, writeOfferStageCookie } from '../../../../modules/ia-credits/utils/offer-stage-cookie';\nimport { useAiCreditsOfferModal } from '../../../../store/useAiCreditsOfferModal';\nimport { useModalManager } from '../../../../store/useModalManager';\nimport { LoseOfferDialog } from './components/LoseOfferDialog';\nimport { DialogLayer } from '../../../ui/overlay/layers';\nimport { OfferIllustration } from './components/OfferIllustration';\nimport { OfferPaymentField } from './components/OfferPaymentField';\n\n/*\n Oferta de primeira compra de créditos de IA — a tela que a base gratuita vê quando o\n * `AiCreditsOfferGate` decide que é a vez dela.\n \n Duas colunas, como a referência de produto: à esquerda a oferta e o cartão (via\n * `OfferPaymentField`, que cadastra pelo `addCardModal` padrão da plataforma); à direita o\n * gradiente da tela de login com a ilustração do editor.\n \n Fechar não fecha: `X`, `Esc`, clique fora e \"Agora não\" caem todos no `LoseOfferDialog`, que\n * pergunta se a pessoa quer mesmo perder o desconto.\n \n ⚠️ PREÇO: o card manda só o SLUG da oferta (`AI_CREDITS_FIRST_PURCHASE_OFFER.slug`) — quem\n * resolve pacote, preço e elegibilidade é o backend (Asana ID-1217333331953496). O \"de/por\" desta\n * tela usa `AI_CREDITS_FIRST_PURCHASE_OFFER.price` (fixo, parte do contrato da oferta) contra\n * `anchorCents` do `useAiCreditsOfferEligibility` (derivado do preço real do addon no plano — nunca\n * hardcoded).\n \n ANIMAÇÃO: CSS puro, sem `motion/react` (a lib não depende dela). As classes `gp-offer-rise`,\n * `gp-offer-window-in`, `gp-offer-card-in` e `gp-offer-icon-pulse` vêm do `globals.css` de cada app\n * consumidor — bloco documentado abaixo, precisa estar presente nos 3 apps (gpages/gapps/editor):\n \n ```css\n * @keyframes gp-offer-rise {\n * from { opacity: 0; translate: 0 10px; }\n * to { opacity: 1; translate: 0 0; }\n * }\n * .gp-offer-rise { animation: gp-offer-rise 420ms cubic-bezier(0.22, 1, 0.36, 1) both; }\n \n @keyframes gp-offer-window-in {\n * from { opacity: 0; translate: 0 18px; scale: 0.985; }\n * to { opacity: 1; translate: 0 0; scale: 1; }\n * }\n * .gp-offer-window-in { animation: gp-offer-window-in 550ms cubic-bezier(0.22, 1, 0.36, 1) 50ms both; }\n \n @keyframes gp-offer-card-in {\n * from { opacity: 0; translate: 0 26px; scale: 0.97; }\n * to { opacity: 1; translate: 0 0; scale: 1; }\n * }\n * .gp-offer-card-in { animation: gp-offer-card-in 520ms cubic-bezier(0.34, 1.56, 0.64, 1) 340ms both; }\n \n @keyframes gp-offer-icon-pulse {\n * 0%, 100% { scale: 1; }\n * 50% { scale: 1.06; }\n * }\n * .gp-offer-icon-pulse { animation: gp-offer-icon-pulse 2.6s ease-in-out 1.6s infinite; }\n \n @media (prefers-reduced-motion: reduce) {\n * .gp-offer-rise, .gp-offer-window-in, .gp-offer-card-in, .gp-offer-icon-pulse { animation: none; }\n * }\n * ```\n \n `translate`/`scale` (propriedades CSS independentes, não `transform`) pra conviver sem conflito\n * com utilitários de posicionamento do Tailwind (mesmo problema que já forçou o `.gp-offer-modal`\n * de entrada/saída a sair de `@layer` — ver `AiCreditsOfferGate`/`globals.css`).\n /\nexport default function AiCreditsOfferModal() {\n const translate = useTranslations();\n const locale = useLocale();\n const stripe = useStripe();\n const { open, closeModal } = useAiCreditsOfferModal();\n const { openModal } = useModalManager();\n const { user } = useAuth();\n const { whitelabel } = useWhitelabel();\n const { accountsUrl } = useWhitelabelUrls();\n const { formatCurrencyNumber } = useCurrencyFormatter();\n\n const [confirmingExit, setConfirmingExit] = useState(false);\n const [pickedCardId, setPickedCardId] = useState('');\n\n const { data: cardsData } = useCards();\n const { data: subscriptionData } = useActiveSubscription();\n const eligibility = useAiCreditsOfferEligibility();\n const purchaseMutation = usePurchaseIaCredits();\n\n const subscription = subscriptionData?.data?.[0] ?? null;\n const subscriptionId = subscription?.id;\n const accountId = user?.id_account;\n\n const defaultCardId =\n cardsData?.data?.find((card) => card.is_default)?.id?.toString() ??\n cardsData?.data?.[0]?.id?.toString() ??\n '';\n\n // Os cartões chegam depois da abertura (query no client). Derivar — em vez de sincronizar num\n // efeito — faz o padrão da conta já entrar selecionado no render em que a lista chega, e a\n // escolha explícita da pessoa continua mandando.\n const pickedCardExists = cardsData?.data?.some((card) => card.id.toString() === pickedCardId);\n const selectedCardId = pickedCardExists ? pickedCardId : defaultCardId;\n\n const offerPrice = AI_CREDITS_FIRST_PURCHASE_OFFER.price;\n const fullPrice = eligibility.data?.anchorCents != null ? eligibility.data.anchorCents / 100 : null;\n const discountPercent = fullPrice != null ? Math.round((1 - offerPrice / fullPrice) 100) : null;\n\n const creditsLabel = AI_CREDITS_FIRST_PURCHASE_OFFER.credits.toLocaleString(locale);\n const discountLabel =\n discountPercent != null\n ? translate('common.promo.aiCreditsOffer.discountBadge', { percent: String(discountPercent) })\n : '';\n\n const hasCard = Boolean(selectedCardId);\n const isSubmitting = purchaseMutation.isPending;\n\n /** Fecha de verdade — só o `LoseOfferDialog` e a compra concluída chegam aqui. /\n const dismiss = useCallback(() => {\n setConfirmingExit(false);\n closeModal();\n }, [closeModal]);\n\n /* Toda tentativa de sair passa por aqui — X, Esc, clique fora e \"Agora não\". /\n const requestClose = useCallback(() => setConfirmingExit(true), []);\n\n /\n Cobra o cartão informado e credita — sem tocar na recorrência do plano. Chamado tanto pelo CTA\n * com cartão já selecionado quanto (encadeado, sem segundo clique) pelo `onCardAdded` do\n * `addCardModal` quando a pessoa ainda não tinha cartão.\n /\n const submitPurchase = useCallback(\n async (cardId: string) => {\n // Sem assinatura não dá pra cobrar aqui — o CTA vira a porta do checkout do accounts em vez\n // de virar um botão morto.\n if (subscriptionId == null) {\n closeModal();\n window.location.assign(`${accountsUrl}/subscriptions?tab=plans`);\n return;\n }\n\n const input = {\n subscriptionId,\n offer: AI_CREDITS_FIRST_PURCHASE_OFFER.slug,\n paymentMethod: PAYMENT_METHOD_CARD,\n idCard: cardId,\n };\n\n try {\n let result: PurchaseIaCreditsResult = await purchaseMutation.mutateAsync(input);\n\n // 3DS: confirma o desafio e RE-POSTA o MESMO input — a chave de idempotência do backend\n // devolve a mesma cobrança já paga, então o segundo POST fecha com status 1.\n if (result.status === 2) {\n await confirmPaymentIfRequired(stripe, result, translate('common.payment.authFailed'));\n result = await purchaseMutation.mutateAsync(input);\n }\n\n // O `message` do status 0 é código de máquina do backend (`offer_consumed`,\n // `offer_card_only`…), não copy — a tela mostra o erro genérico do catálogo.\n if (result.status !== 1) {\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={translate('common.promo.aiCreditsOffer.errorToast')}\n toastId={toastId}\n />\n ));\n return;\n }\n\n if (accountId != null) {\n const cookie = readOfferStageCookie(accountId);\n writeOfferStageCookie(\n accountId,\n {\n stage: AiCreditsOfferStage.CONVERTED,\n lastSessionIat: eligibility.data?.sessionIssuedAt ?? cookie.lastSessionIat,\n repeatCount: cookie.repeatCount,\n },\n whitelabel?.domain\n );\n }\n\n toast.custom((toastId) => (\n <Toast\n variant=\"success\"\n message={translate('common.promo.aiCreditsOffer.successToast', { credits: creditsLabel })}\n toastId={toastId}\n />\n ));\n dismiss();\n } catch {\n // Erro técnico (rede, HTTP não-JSON, resposta fora do `PurchaseIaCreditsResultSchema`) —\n // `error.message` aqui é texto de máquina (inclusive o dump do ZodError), nunca copy. Mesma\n // decisão do `status !== 1` acima: a tela mostra a mensagem genérica do catálogo.\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={translate('common.promo.aiCreditsOffer.errorToast')}\n toastId={toastId}\n />\n ));\n }\n },\n [\n accountId,\n accountsUrl,\n closeModal,\n creditsLabel,\n dismiss,\n eligibility.data?.sessionIssuedAt,\n purchaseMutation,\n stripe,\n subscriptionId,\n translate,\n whitelabel?.domain,\n ]\n );\n\n const handleOpenAddCard = useCallback(() => {\n openModal('addCardModal', {\n onCardAdded: (cardId: string) => {\n setPickedCardId(cardId);\n void submitPurchase(cardId);\n },\n });\n }, [openModal, submitPurchase]);\n\n const handleConfirm = useCallback(async () => {\n // 1º passo do fluxo: sem cartão, o CTA é o próprio cadastro — a compra encadeia sozinha\n // assim que o cartão é criado (ver `handleOpenAddCard`).\n if (!hasCard) {\n handleOpenAddCard();\n return;\n }\n await submitPurchase(selectedCardId);\n }, [handleOpenAddCard, hasCard, selectedCardId, submitPurchase]);\n\n const bullets = [\n translate('common.promo.aiCreditsOffer.bullets.first'),\n translate('common.promo.aiCreditsOffer.bullets.second'),\n translate('common.promo.aiCreditsOffer.bullets.third'),\n ];\n\n return (\n <>\n <Dialog open={open} onOpenChange={() => {}}>\n <DialogContent\n showCloseButton={false}\n onOpenAutoFocus={(event) => event.preventDefault()}\n onEscapeKeyDown={(event) => {\n event.preventDefault();\n requestClose();\n }}\n onPointerDownOutside={(event) => {\n event.preventDefault();\n requestClose();\n }}\n onInteractOutside={(event) => event.preventDefault()}\n overlayClassName=\"duration-300\"\n className={[\n // mobile: folha de tela cheia (mesma geometria do BuyCreditsModal)\n 'flex flex-col gap-0 overflow-hidden rounded-t-2xl rounded-b-none border-0 p-0 shadow-elevated',\n 'top-0 right-0 bottom-0 left-0 h-dvh max-w-full translate-x-0 translate-y-0 sm:max-w-full',\n // desktop (≥ md): cartão de duas colunas, centralizado\n 'md:top-[50%] md:right-auto md:bottom-auto md:left-[50%] md:h-auto md:max-h-[92vh] md:w-[900px]! md:max-w-[900px]! md:translate-x-[-50%] md:translate-y-[-50%] md:rounded-xl md:border',\n // entrada de baixo pra cima: a classe (e não utilidade `animate-[...]`) porque o\n // `DialogContent` já traz `animate-in` e o merge do Tailwind não funde as duas — ver\n // `.gp-offer-modal` no globals.css.\n 'gp-offer-modal',\n ].join(' ')}\n >\n <div className=\"gm-scroll flex h-full flex-col overflow-y-auto md:h-auto md:min-h-[600px] md:flex-row md:items-stretch md:overflow-visible\">\n {/ Ilustração: topo no mobile, coluna da direita no desktop (`md:order-2`). /}\n <div className=\"relative h-[180px] w-full shrink-0 md:order-2 md:h-auto md:w-1/2\">\n <OfferIllustration credits={AI_CREDITS_FIRST_PURCHASE_OFFER.credits} locale={locale} />\n\n <button\n type=\"button\"\n onClick={requestClose}\n aria-label={translate('common.promo.aiCreditsOffer.close')}\n className=\"absolute top-4 right-4 z-10 flex size-8 cursor-pointer items-center justify-center rounded-lg text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-950\"\n >\n <IconX className=\"size-[18px]\" />\n </button>\n </div>\n\n {/ Coluna da oferta /}\n <div className=\"flex flex-1 flex-col gap-6 p-6 md:order-1 md:w-1/2 md:shrink-0 md:gap-7 md:p-10\">\n <span\n className=\"gp-offer-rise paragraph-xsmall-semibold w-fit rounded-full bg-cyan-50 px-2.5 py-1 text-cyan-700\"\n style={{ animationDelay: '160ms' }}\n >\n {translate('common.promo.aiCreditsOffer.eyebrow')}\n </span>\n\n {/ 26px (2px acima do `title-large`) e Outfit 700: a oferta bate mais forte que um\n título de modal comum. A quebra vem do catálogo, pela tag `<break>`, então cada\n idioma escolhe onde partir a frase. /}\n <div className=\"gp-offer-rise\" style={{ animationDelay: '220ms' }}>\n <DialogTitle className=\"title-large-semibold text-[26px] leading-8 font-bold tracking-[-0.4px] text-zinc-950\">\n {translate.rich('common.promo.aiCreditsOffer.title', {\n credits: creditsLabel,\n discount: discountLabel,\n break: () => <br />,\n })}\n </DialogTitle>\n </div>\n\n <ul className=\"flex flex-col gap-3.5\">\n {bullets.map((bullet, index) => (\n <li\n key={bullet}\n className=\"gp-offer-rise flex items-start gap-2.5\"\n style={{ animationDelay: `${300 + index 70}ms` }}\n >\n <span className=\"mt-0.5 flex size-5 shrink-0 items-center justify-center rounded-full bg-cyan-50\">\n <IconCheck size={13} stroke={3} className=\"text-cyan-700\" />\n </span>\n <span className=\"paragraph-small-medium text-zinc-600\">{bullet}</span>\n </li>\n ))}\n </ul>\n\n {/* Preço de tabela em cima, pequeno e riscado; o de campanha embaixo, na mesma\n tipografia do título (Outfit 700) pra os dois números não competirem entre si. Sem\n âncora resolvida (elegibilidade ainda carregando) some a linha do preço cheio em\n vez de mostrar um \"de\" vazio. /}\n <div className=\"gp-offer-rise flex flex-col gap-0.5\" style={{ animationDelay: '520ms' }}>\n {fullPrice != null && (\n <span className=\"paragraph-small-medium text-zinc-400 line-through\">\n {formatCurrencyNumber(fullPrice)}\n </span>\n )}\n <div className=\"flex items-center gap-2.5\">\n <span className=\"title-large-semibold font-bold tracking-[-0.4px] text-zinc-950\">\n {formatCurrencyNumber(offerPrice)}\n </span>\n {discountLabel && (\n <span className=\"paragraph-xsmall-semibold rounded-md bg-green-50 px-2 py-1 text-green-600\">\n {discountLabel}\n </span>\n )}\n </div>\n </div>\n\n <div className=\"gp-offer-rise mt-2\" style={{ animationDelay: '580ms' }}>\n <OfferPaymentField cardId={selectedCardId} onCardAdded={setPickedCardId} />\n </div>\n\n <div\n className=\"gp-offer-rise mt-auto flex flex-col gap-2\"\n style={{ animationDelay: '640ms' }}\n >\n <Button className=\"w-full\" loading={isSubmitting} onClick={handleConfirm}>\n {hasCard\n ? translate('common.promo.aiCreditsOffer.cta', { discount: discountLabel })\n : translate('common.promo.aiCreditsOffer.ctaAddCard')}\n </Button>\n <Button\n variant=\"secondary\"\n className=\"h-10! w-full\"\n disabled={isSubmitting}\n onClick={requestClose}\n >\n {translate('common.promo.aiCreditsOffer.later')}\n </Button>\n </div>\n </div>\n </div>\n </DialogContent>\n </Dialog>\n\n {/ Irmao do `Dialog` acima, entao nasceria na mesma faixa de z. */}\n <DialogLayer>\n <LoseOfferDialog\n open={confirmingExit}\n discountLabel={discountLabel}\n creditsLabel={creditsLabel}\n fullPriceLabel={fullPrice != null ? formatCurrencyNumber(fullPrice) : ''}\n onKeep={() => setConfirmingExit(false)}\n onLose={dismiss}\n />\n </DialogLayer>\n </>\n );\n}\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../../../src/components/modals/promo/AiCreditsOfferModal/AiCreditsOfferModal.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useState } from 'react';\nimport { useStripe } from '@stripe/react-stripe-js';\nimport { IconCheck, IconX } from '@tabler/icons-react';\nimport { useLocale, useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { Button } from '../../../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogTitle } from '../../../ui/overlay/Dialog';\nimport { Toast } from '../../../ui/feedback/Toast';\nimport { useAuth } from '../../../../providers/auth.provider';\nimport { useWhitelabel, useWhitelabelUrls } from '../../../../providers/whitelabel.provider';\nimport { useActiveSubscription } from '../../../../modules/subscriptions/hooks/find-active-subscription.hook';\nimport { useCards } from '../../../../modules/cards/hooks/cards.hook';\nimport { useCurrencyFormatter } from '../../../../modules/accounts/hooks/use-currency-formatter.hook';\nimport { confirmPaymentIfRequired } from '../../../../modules/subscriptions/utils/confirm-payment-if-required';\nimport {\n AI_CREDITS_FIRST_PURCHASE_OFFER,\n AiCreditsOfferStage,\n PAYMENT_METHOD_CARD,\n} from '../../../../modules/ia-credits/constants/ai-credits-offer.constants';\nimport { useAiCreditsOfferEligibility } from '../../../../modules/ia-credits/hooks/use-offer-eligibility.hook';\nimport { usePurchaseIaCredits } from '../../../../modules/ia-credits/hooks/purchase-ia-credits.hook';\nimport type { PurchaseIaCreditsResult } from '../../../../modules/ia-credits/types/ai-credits-offer.type';\nimport { readOfferStageCookie, writeOfferStageCookie } from '../../../../modules/ia-credits/utils/offer-stage-cookie';\nimport { useAiCreditsOfferModal } from '../../../../store/useAiCreditsOfferModal';\nimport { useModalManager } from '../../../../store/useModalManager';\nimport { LoseOfferDialog } from './components/LoseOfferDialog';\nimport { OfferIllustration } from './components/OfferIllustration';\nimport { OfferPaymentField } from './components/OfferPaymentField';\n\n/*\n Oferta de primeira compra de créditos de IA — a tela que a base gratuita vê quando o\n * `AiCreditsOfferGate` decide que é a vez dela.\n \n Duas colunas, como a referência de produto: à esquerda a oferta e o cartão (via\n * `OfferPaymentField`, que cadastra pelo `addCardModal` padrão da plataforma); à direita o\n * gradiente da tela de login com a ilustração do editor.\n \n Fechar não fecha: `X`, `Esc`, clique fora e \"Agora não\" caem todos no `LoseOfferDialog`, que\n * pergunta se a pessoa quer mesmo perder o desconto.\n \n ⚠️ PREÇO: o card manda só o SLUG da oferta (`AI_CREDITS_FIRST_PURCHASE_OFFER.slug`) — quem\n * resolve pacote, preço e elegibilidade é o backend (Asana ID-1217333331953496). O \"de/por\" desta\n * tela usa `AI_CREDITS_FIRST_PURCHASE_OFFER.price` (fixo, parte do contrato da oferta) contra\n * `anchorCents` do `useAiCreditsOfferEligibility` (derivado do preço real do addon no plano — nunca\n * hardcoded).\n \n ANIMAÇÃO: CSS puro, sem `motion/react` (a lib não depende dela). As classes `gp-offer-rise`,\n * `gp-offer-window-in`, `gp-offer-card-in` e `gp-offer-icon-pulse` vêm do `globals.css` de cada app\n * consumidor — bloco documentado abaixo, precisa estar presente nos 3 apps (gpages/gapps/editor):\n \n ```css\n * @keyframes gp-offer-rise {\n * from { opacity: 0; translate: 0 10px; }\n * to { opacity: 1; translate: 0 0; }\n * }\n * .gp-offer-rise { animation: gp-offer-rise 420ms cubic-bezier(0.22, 1, 0.36, 1) both; }\n \n @keyframes gp-offer-window-in {\n * from { opacity: 0; translate: 0 18px; scale: 0.985; }\n * to { opacity: 1; translate: 0 0; scale: 1; }\n * }\n * .gp-offer-window-in { animation: gp-offer-window-in 550ms cubic-bezier(0.22, 1, 0.36, 1) 50ms both; }\n \n @keyframes gp-offer-card-in {\n * from { opacity: 0; translate: 0 26px; scale: 0.97; }\n * to { opacity: 1; translate: 0 0; scale: 1; }\n * }\n * .gp-offer-card-in { animation: gp-offer-card-in 520ms cubic-bezier(0.34, 1.56, 0.64, 1) 340ms both; }\n \n @keyframes gp-offer-icon-pulse {\n * 0%, 100% { scale: 1; }\n * 50% { scale: 1.06; }\n * }\n * .gp-offer-icon-pulse { animation: gp-offer-icon-pulse 2.6s ease-in-out 1.6s infinite; }\n \n @media (prefers-reduced-motion: reduce) {\n * .gp-offer-rise, .gp-offer-window-in, .gp-offer-card-in, .gp-offer-icon-pulse { animation: none; }\n * }\n * ```\n \n `translate`/`scale` (propriedades CSS independentes, não `transform`) pra conviver sem conflito\n * com utilitários de posicionamento do Tailwind (mesmo problema que já forçou o `.gp-offer-modal`\n * de entrada/saída a sair de `@layer` — ver `AiCreditsOfferGate`/`globals.css`).\n /\nexport default function AiCreditsOfferModal() {\n const translate = useTranslations();\n const locale = useLocale();\n const stripe = useStripe();\n const { open, closeModal } = useAiCreditsOfferModal();\n const { openModal } = useModalManager();\n const { user } = useAuth();\n const { whitelabel } = useWhitelabel();\n const { accountsUrl } = useWhitelabelUrls();\n const { formatCurrencyNumber } = useCurrencyFormatter();\n\n const [confirmingExit, setConfirmingExit] = useState(false);\n const [pickedCardId, setPickedCardId] = useState('');\n\n const { data: cardsData } = useCards();\n const { data: subscriptionData } = useActiveSubscription();\n const eligibility = useAiCreditsOfferEligibility();\n const purchaseMutation = usePurchaseIaCredits();\n\n const subscription = subscriptionData?.data?.[0] ?? null;\n const subscriptionId = subscription?.id;\n const accountId = user?.id_account;\n\n const defaultCardId =\n cardsData?.data?.find((card) => card.is_default)?.id?.toString() ??\n cardsData?.data?.[0]?.id?.toString() ??\n '';\n\n // Os cartões chegam depois da abertura (query no client). Derivar — em vez de sincronizar num\n // efeito — faz o padrão da conta já entrar selecionado no render em que a lista chega, e a\n // escolha explícita da pessoa continua mandando.\n const pickedCardExists = cardsData?.data?.some((card) => card.id.toString() === pickedCardId);\n const selectedCardId = pickedCardExists ? pickedCardId : defaultCardId;\n\n const offerPrice = AI_CREDITS_FIRST_PURCHASE_OFFER.price;\n const fullPrice = eligibility.data?.anchorCents != null ? eligibility.data.anchorCents / 100 : null;\n const discountPercent = fullPrice != null ? Math.round((1 - offerPrice / fullPrice) 100) : null;\n\n const creditsLabel = AI_CREDITS_FIRST_PURCHASE_OFFER.credits.toLocaleString(locale);\n const discountLabel =\n discountPercent != null\n ? translate('common.promo.aiCreditsOffer.discountBadge', { percent: String(discountPercent) })\n : '';\n\n const hasCard = Boolean(selectedCardId);\n const isSubmitting = purchaseMutation.isPending;\n\n /** Fecha de verdade — só o `LoseOfferDialog` e a compra concluída chegam aqui. /\n const dismiss = useCallback(() => {\n setConfirmingExit(false);\n closeModal();\n }, [closeModal]);\n\n /* Toda tentativa de sair passa por aqui — X, Esc, clique fora e \"Agora não\". /\n const requestClose = useCallback(() => setConfirmingExit(true), []);\n\n /\n Cobra o cartão informado e credita — sem tocar na recorrência do plano. Chamado tanto pelo CTA\n * com cartão já selecionado quanto (encadeado, sem segundo clique) pelo `onCardAdded` do\n * `addCardModal` quando a pessoa ainda não tinha cartão.\n /\n const submitPurchase = useCallback(\n async (cardId: string) => {\n // Sem assinatura não dá pra cobrar aqui — o CTA vira a porta do checkout do accounts em vez\n // de virar um botão morto.\n if (subscriptionId == null) {\n closeModal();\n window.location.assign(`${accountsUrl}/subscriptions?tab=plans`);\n return;\n }\n\n const input = {\n subscriptionId,\n offer: AI_CREDITS_FIRST_PURCHASE_OFFER.slug,\n paymentMethod: PAYMENT_METHOD_CARD,\n idCard: cardId,\n };\n\n try {\n let result: PurchaseIaCreditsResult = await purchaseMutation.mutateAsync(input);\n\n // 3DS: confirma o desafio e RE-POSTA o MESMO input — a chave de idempotência do backend\n // devolve a mesma cobrança já paga, então o segundo POST fecha com status 1.\n if (result.status === 2) {\n await confirmPaymentIfRequired(stripe, result, translate('common.payment.authFailed'));\n result = await purchaseMutation.mutateAsync(input);\n }\n\n // O `message` do status 0 é código de máquina do backend (`offer_consumed`,\n // `offer_card_only`…), não copy — a tela mostra o erro genérico do catálogo.\n if (result.status !== 1) {\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={translate('common.promo.aiCreditsOffer.errorToast')}\n toastId={toastId}\n />\n ));\n return;\n }\n\n if (accountId != null) {\n const cookie = readOfferStageCookie(accountId);\n writeOfferStageCookie(\n accountId,\n {\n stage: AiCreditsOfferStage.CONVERTED,\n lastSessionIat: eligibility.data?.sessionIssuedAt ?? cookie.lastSessionIat,\n repeatCount: cookie.repeatCount,\n },\n whitelabel?.domain\n );\n }\n\n toast.custom((toastId) => (\n <Toast\n variant=\"success\"\n message={translate('common.promo.aiCreditsOffer.successToast', { credits: creditsLabel })}\n toastId={toastId}\n />\n ));\n dismiss();\n } catch {\n // Erro técnico (rede, HTTP não-JSON, resposta fora do `PurchaseIaCreditsResultSchema`) —\n // `error.message` aqui é texto de máquina (inclusive o dump do ZodError), nunca copy. Mesma\n // decisão do `status !== 1` acima: a tela mostra a mensagem genérica do catálogo.\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={translate('common.promo.aiCreditsOffer.errorToast')}\n toastId={toastId}\n />\n ));\n }\n },\n [\n accountId,\n accountsUrl,\n closeModal,\n creditsLabel,\n dismiss,\n eligibility.data?.sessionIssuedAt,\n purchaseMutation,\n stripe,\n subscriptionId,\n translate,\n whitelabel?.domain,\n ]\n );\n\n const handleOpenAddCard = useCallback(() => {\n openModal('addCardModal', {\n onCardAdded: (cardId: string) => {\n setPickedCardId(cardId);\n void submitPurchase(cardId);\n },\n });\n }, [openModal, submitPurchase]);\n\n const handleConfirm = useCallback(async () => {\n // 1º passo do fluxo: sem cartão, o CTA é o próprio cadastro — a compra encadeia sozinha\n // assim que o cartão é criado (ver `handleOpenAddCard`).\n if (!hasCard) {\n handleOpenAddCard();\n return;\n }\n await submitPurchase(selectedCardId);\n }, [handleOpenAddCard, hasCard, selectedCardId, submitPurchase]);\n\n const bullets = [\n translate('common.promo.aiCreditsOffer.bullets.first'),\n translate('common.promo.aiCreditsOffer.bullets.second'),\n translate('common.promo.aiCreditsOffer.bullets.third'),\n ];\n\n return (\n <>\n <Dialog open={open} onOpenChange={() => {}}>\n <DialogContent\n showCloseButton={false}\n onOpenAutoFocus={(event) => event.preventDefault()}\n onEscapeKeyDown={(event) => {\n event.preventDefault();\n requestClose();\n }}\n onPointerDownOutside={(event) => {\n event.preventDefault();\n requestClose();\n }}\n onInteractOutside={(event) => event.preventDefault()}\n overlayClassName=\"duration-300\"\n className={[\n // mobile: folha de tela cheia (mesma geometria do BuyCreditsModal)\n 'flex flex-col gap-0 overflow-hidden rounded-t-2xl rounded-b-none border-0 p-0 shadow-elevated',\n 'top-0 right-0 bottom-0 left-0 h-dvh max-w-full translate-x-0 translate-y-0 sm:max-w-full',\n // desktop (≥ md): cartão de duas colunas, centralizado\n 'md:top-[50%] md:right-auto md:bottom-auto md:left-[50%] md:h-auto md:max-h-[92vh] md:w-[900px]! md:max-w-[900px]! md:translate-x-[-50%] md:translate-y-[-50%] md:rounded-xl md:border',\n // entrada de baixo pra cima: a classe (e não utilidade `animate-[...]`) porque o\n // `DialogContent` já traz `animate-in` e o merge do Tailwind não funde as duas — ver\n // `.gp-offer-modal` no globals.css.\n 'gp-offer-modal',\n ].join(' ')}\n >\n <div className=\"gm-scroll flex h-full flex-col overflow-y-auto md:h-auto md:min-h-[600px] md:flex-row md:items-stretch md:overflow-visible\">\n {/ Ilustração: topo no mobile, coluna da direita no desktop (`md:order-2`). /}\n <div className=\"relative h-[180px] w-full shrink-0 md:order-2 md:h-auto md:w-1/2\">\n <OfferIllustration credits={AI_CREDITS_FIRST_PURCHASE_OFFER.credits} locale={locale} />\n\n <button\n type=\"button\"\n onClick={requestClose}\n aria-label={translate('common.promo.aiCreditsOffer.close')}\n className=\"absolute top-4 right-4 z-10 flex size-8 cursor-pointer items-center justify-center rounded-lg text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-950\"\n >\n <IconX className=\"size-[18px]\" />\n </button>\n </div>\n\n {/ Coluna da oferta /}\n <div className=\"flex flex-1 flex-col gap-6 p-6 md:order-1 md:w-1/2 md:shrink-0 md:gap-7 md:p-10\">\n <span\n className=\"gp-offer-rise paragraph-xsmall-semibold w-fit rounded-full bg-cyan-50 px-2.5 py-1 text-cyan-700\"\n style={{ animationDelay: '160ms' }}\n >\n {translate('common.promo.aiCreditsOffer.eyebrow')}\n </span>\n\n {/ 26px (2px acima do `title-large`) e Outfit 700: a oferta bate mais forte que um\n título de modal comum. A quebra vem do catálogo, pela tag `<break>`, então cada\n idioma escolhe onde partir a frase. /}\n <div className=\"gp-offer-rise\" style={{ animationDelay: '220ms' }}>\n <DialogTitle className=\"title-large-semibold text-[26px] leading-8 font-bold tracking-[-0.4px] text-zinc-950\">\n {translate.rich('common.promo.aiCreditsOffer.title', {\n credits: creditsLabel,\n discount: discountLabel,\n break: () => <br />,\n })}\n </DialogTitle>\n </div>\n\n <ul className=\"flex flex-col gap-3.5\">\n {bullets.map((bullet, index) => (\n <li\n key={bullet}\n className=\"gp-offer-rise flex items-start gap-2.5\"\n style={{ animationDelay: `${300 + index 70}ms` }}\n >\n <span className=\"mt-0.5 flex size-5 shrink-0 items-center justify-center rounded-full bg-cyan-50\">\n <IconCheck size={13} stroke={3} className=\"text-cyan-700\" />\n </span>\n <span className=\"paragraph-small-medium text-zinc-600\">{bullet}</span>\n </li>\n ))}\n </ul>\n\n {/* Preço de tabela em cima, pequeno e riscado; o de campanha embaixo, na mesma\n tipografia do título (Outfit 700) pra os dois números não competirem entre si. Sem\n âncora resolvida (elegibilidade ainda carregando) some a linha do preço cheio em\n vez de mostrar um \"de\" vazio. */}\n <div className=\"gp-offer-rise flex flex-col gap-0.5\" style={{ animationDelay: '520ms' }}>\n {fullPrice != null && (\n <span className=\"paragraph-small-medium text-zinc-400 line-through\">\n {formatCurrencyNumber(fullPrice)}\n </span>\n )}\n <div className=\"flex items-center gap-2.5\">\n <span className=\"title-large-semibold font-bold tracking-[-0.4px] text-zinc-950\">\n {formatCurrencyNumber(offerPrice)}\n </span>\n {discountLabel && (\n <span className=\"paragraph-xsmall-semibold rounded-md bg-green-50 px-2 py-1 text-green-600\">\n {discountLabel}\n </span>\n )}\n </div>\n </div>\n\n <div className=\"gp-offer-rise mt-2\" style={{ animationDelay: '580ms' }}>\n <OfferPaymentField cardId={selectedCardId} onCardAdded={setPickedCardId} />\n </div>\n\n <div\n className=\"gp-offer-rise mt-auto flex flex-col gap-2\"\n style={{ animationDelay: '640ms' }}\n >\n <Button className=\"w-full\" loading={isSubmitting} onClick={handleConfirm}>\n {hasCard\n ? translate('common.promo.aiCreditsOffer.cta', { discount: discountLabel })\n : translate('common.promo.aiCreditsOffer.ctaAddCard')}\n </Button>\n <Button\n variant=\"secondary\"\n className=\"h-10! w-full\"\n disabled={isSubmitting}\n onClick={requestClose}\n >\n {translate('common.promo.aiCreditsOffer.later')}\n </Button>\n </div>\n </div>\n </div>\n </DialogContent>\n </Dialog>\n\n <LoseOfferDialog\n open={confirmingExit}\n discountLabel={discountLabel}\n creditsLabel={creditsLabel}\n fullPriceLabel={fullPrice != null ? formatCurrencyNumber(fullPrice) : ''}\n onKeep={() => setConfirmingExit(false)}\n onLose={dismiss}\n />\n </>\n );\n}\n"],"mappings":";AAkLY,SAoFR,UApFQ,KAiHA,YAjHA;AAhLZ,SAAS,aAAa,gBAAgB;AACtC,SAAS,iBAAiB;AAC1B,SAAS,WAAW,aAAa;AACjC,SAAS,WAAW,uBAAuB;AAC3C,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,QAAQ,eAAe,mBAAmB;AACnD,SAAS,aAAa;AACtB,SAAS,eAAe;AACxB,SAAS,eAAe,yBAAyB;AACjD,SAAS,6BAA6B;AACtC,SAAS,gBAAgB;AACzB,SAAS,4BAA4B;AACrC,SAAS,gCAAgC;AACzC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oCAAoC;AAC7C,SAAS,4BAA4B;AAErC,SAAS,sBAAsB,6BAA6B;AAC5D,SAAS,8BAA8B;AACvC,SAAS,uBAAuB;AAChC,SAAS,uBAAuB;AAChC,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAyDnB,SAAR,sBAAuC;AAC5C,QAAM,YAAY,gBAAgB;AAClC,QAAM,SAAS,UAAU;AACzB,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,MAAM,WAAW,IAAI,uBAAuB;AACpD,QAAM,EAAE,UAAU,IAAI,gBAAgB;AACtC,QAAM,EAAE,KAAK,IAAI,QAAQ;AACzB,QAAM,EAAE,WAAW,IAAI,cAAc;AACrC,QAAM,EAAE,YAAY,IAAI,kBAAkB;AAC1C,QAAM,EAAE,qBAAqB,IAAI,qBAAqB;AAEtD,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,EAAE;AAEnD,QAAM,EAAE,MAAM,UAAU,IAAI,SAAS;AACrC,QAAM,EAAE,MAAM,iBAAiB,IAAI,sBAAsB;AACzD,QAAM,cAAc,6BAA6B;AACjD,QAAM,mBAAmB,qBAAqB;AAE9C,QAAM,eAAe,kBAAkB,OAAO,CAAC,KAAK;AACpD,QAAM,iBAAiB,cAAc;AACrC,QAAM,YAAY,MAAM;AAExB,QAAM,gBACJ,WAAW,MAAM,KAAK,CAAC,SAAS,KAAK,UAAU,GAAG,IAAI,SAAS,KAC/D,WAAW,OAAO,CAAC,GAAG,IAAI,SAAS,KACnC;AAKF,QAAM,mBAAmB,WAAW,MAAM,KAAK,CAAC,SAAS,KAAK,GAAG,SAAS,MAAM,YAAY;AAC5F,QAAM,iBAAiB,mBAAmB,eAAe;AAEzD,QAAM,aAAa,gCAAgC;AACnD,QAAM,YAAY,YAAY,MAAM,eAAe,OAAO,YAAY,KAAK,cAAc,MAAM;AAC/F,QAAM,kBAAkB,aAAa,OAAO,KAAK,OAAO,IAAI,aAAa,aAAa,GAAG,IAAI;AAE7F,QAAM,eAAe,gCAAgC,QAAQ,eAAe,MAAM;AAClF,QAAM,gBACJ,mBAAmB,OACf,UAAU,6CAA6C,EAAE,SAAS,OAAO,eAAe,EAAE,CAAC,IAC3F;AAEN,QAAM,UAAU,QAAQ,cAAc;AACtC,QAAM,eAAe,iBAAiB;AAGtC,QAAM,UAAU,YAAY,MAAM;AAChC,sBAAkB,KAAK;AACvB,eAAW;AAAA,EACb,GAAG,CAAC,UAAU,CAAC;AAGf,QAAM,eAAe,YAAY,MAAM,kBAAkB,IAAI,GAAG,CAAC,CAAC;AAOlE,QAAM,iBAAiB;AAAA,IACrB,OAAO,WAAmB;AAGxB,UAAI,kBAAkB,MAAM;AAC1B,mBAAW;AACX,eAAO,SAAS,OAAO,GAAG,WAAW,0BAA0B;AAC/D;AAAA,MACF;AAEA,YAAM,QAAQ;AAAA,QACZ;AAAA,QACA,OAAO,gCAAgC;AAAA,QACvC,eAAe;AAAA,QACf,QAAQ;AAAA,MACV;AAEA,UAAI;AACF,YAAI,SAAkC,MAAM,iBAAiB,YAAY,KAAK;AAI9E,YAAI,OAAO,WAAW,GAAG;AACvB,gBAAM,yBAAyB,QAAQ,QAAQ,UAAU,2BAA2B,CAAC;AACrF,mBAAS,MAAM,iBAAiB,YAAY,KAAK;AAAA,QACnD;AAIA,YAAI,OAAO,WAAW,GAAG;AACvB,gBAAM,OAAO,CAAC,YACZ;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,SAAS,UAAU,wCAAwC;AAAA,cAC3D;AAAA;AAAA,UACF,CACD;AACD;AAAA,QACF;AAEA,YAAI,aAAa,MAAM;AACrB,gBAAM,SAAS,qBAAqB,SAAS;AAC7C;AAAA,YACE;AAAA,YACA;AAAA,cACE,OAAO,oBAAoB;AAAA,cAC3B,gBAAgB,YAAY,MAAM,mBAAmB,OAAO;AAAA,cAC5D,aAAa,OAAO;AAAA,YACtB;AAAA,YACA,YAAY;AAAA,UACd;AAAA,QACF;AAEA,cAAM,OAAO,CAAC,YACZ;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,SAAS,UAAU,4CAA4C,EAAE,SAAS,aAAa,CAAC;AAAA,YACxF;AAAA;AAAA,QACF,CACD;AACD,gBAAQ;AAAA,MACV,QAAQ;AAIN,cAAM,OAAO,CAAC,YACZ;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,SAAS,UAAU,wCAAwC;AAAA,YAC3D;AAAA;AAAA,QACF,CACD;AAAA,MACH;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY,MAAM;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,IACd;AAAA,EACF;AAEA,QAAM,oBAAoB,YAAY,MAAM;AAC1C,cAAU,gBAAgB;AAAA,MACxB,aAAa,CAAC,WAAmB;AAC/B,wBAAgB,MAAM;AACtB,aAAK,eAAe,MAAM;AAAA,MAC5B;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,WAAW,cAAc,CAAC;AAE9B,QAAM,gBAAgB,YAAY,YAAY;AAG5C,QAAI,CAAC,SAAS;AACZ,wBAAkB;AAClB;AAAA,IACF;AACA,UAAM,eAAe,cAAc;AAAA,EACrC,GAAG,CAAC,mBAAmB,SAAS,gBAAgB,cAAc,CAAC;AAE/D,QAAM,UAAU;AAAA,IACd,UAAU,2CAA2C;AAAA,IACrD,UAAU,4CAA4C;AAAA,IACtD,UAAU,2CAA2C;AAAA,EACvD;AAEA,SACE,iCACE;AAAA,wBAAC,UAAO,MAAY,cAAc,MAAM;AAAA,IAAC,GACvC;AAAA,MAAC;AAAA;AAAA,QACC,iBAAiB;AAAA,QACjB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAAA,QACjD,iBAAiB,CAAC,UAAU;AAC1B,gBAAM,eAAe;AACrB,uBAAa;AAAA,QACf;AAAA,QACA,sBAAsB,CAAC,UAAU;AAC/B,gBAAM,eAAe;AACrB,uBAAa;AAAA,QACf;AAAA,QACA,mBAAmB,CAAC,UAAU,MAAM,eAAe;AAAA,QACnD,kBAAiB;AAAA,QACjB,WAAW;AAAA;AAAA,UAET;AAAA,UACA;AAAA;AAAA,UAEA;AAAA;AAAA;AAAA;AAAA,UAIA;AAAA,QACF,EAAE,KAAK,GAAG;AAAA,QAEV,+BAAC,SAAI,WAAU,8HAEb;AAAA,+BAAC,SAAI,WAAU,oEACb;AAAA,gCAAC,qBAAkB,SAAS,gCAAgC,SAAS,QAAgB;AAAA,YAErF;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS;AAAA,gBACT,cAAY,UAAU,mCAAmC;AAAA,gBACzD,WAAU;AAAA,gBAEV,8BAAC,SAAM,WAAU,eAAc;AAAA;AAAA,YACjC;AAAA,aACF;AAAA,UAGA,qBAAC,SAAI,WAAU,mFACb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO,EAAE,gBAAgB,QAAQ;AAAA,gBAEhC,oBAAU,qCAAqC;AAAA;AAAA,YAClD;AAAA,YAKA,oBAAC,SAAI,WAAU,iBAAgB,OAAO,EAAE,gBAAgB,QAAQ,GAC9D,8BAAC,eAAY,WAAU,wFACpB,oBAAU,KAAK,qCAAqC;AAAA,cACnD,SAAS;AAAA,cACT,UAAU;AAAA,cACV,OAAO,MAAM,oBAAC,QAAG;AAAA,YACnB,CAAC,GACH,GACF;AAAA,YAEA,oBAAC,QAAG,WAAU,yBACX,kBAAQ,IAAI,CAAC,QAAQ,UACpB;AAAA,cAAC;AAAA;AAAA,gBAEC,WAAU;AAAA,gBACV,OAAO,EAAE,gBAAgB,GAAG,MAAM,QAAQ,EAAE,KAAK;AAAA,gBAEjD;AAAA,sCAAC,UAAK,WAAU,mFACd,8BAAC,aAAU,MAAM,IAAI,QAAQ,GAAG,WAAU,iBAAgB,GAC5D;AAAA,kBACA,oBAAC,UAAK,WAAU,wCAAwC,kBAAO;AAAA;AAAA;AAAA,cAP1D;AAAA,YAQP,CACD,GACH;AAAA,YAMA,qBAAC,SAAI,WAAU,uCAAsC,OAAO,EAAE,gBAAgB,QAAQ,GACnF;AAAA,2BAAa,QACZ,oBAAC,UAAK,WAAU,qDACb,+BAAqB,SAAS,GACjC;AAAA,cAEF,qBAAC,SAAI,WAAU,6BACb;AAAA,oCAAC,UAAK,WAAU,kEACb,+BAAqB,UAAU,GAClC;AAAA,gBACC,iBACC,oBAAC,UAAK,WAAU,6EACb,yBACH;AAAA,iBAEJ;AAAA,eACF;AAAA,YAEA,oBAAC,SAAI,WAAU,sBAAqB,OAAO,EAAE,gBAAgB,QAAQ,GACnE,8BAAC,qBAAkB,QAAQ,gBAAgB,aAAa,iBAAiB,GAC3E;AAAA,YAEA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO,EAAE,gBAAgB,QAAQ;AAAA,gBAEjC;AAAA,sCAAC,UAAO,WAAU,UAAS,SAAS,cAAc,SAAS,eACxD,oBACG,UAAU,mCAAmC,EAAE,UAAU,cAAc,CAAC,IACxE,UAAU,wCAAwC,GACxD;AAAA,kBACA;AAAA,oBAAC;AAAA;AAAA,sBACC,SAAQ;AAAA,sBACR,WAAU;AAAA,sBACV,UAAU;AAAA,sBACV,SAAS;AAAA,sBAER,oBAAU,mCAAmC;AAAA;AAAA,kBAChD;AAAA;AAAA;AAAA,YACF;AAAA,aACF;AAAA,WACF;AAAA;AAAA,IACF,GACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA,gBAAgB,aAAa,OAAO,qBAAqB,SAAS,IAAI;AAAA,QACtE,QAAQ,MAAM,kBAAkB,KAAK;AAAA,QACrC,QAAQ;AAAA;AAAA,IACV;AAAA,KACF;AAEJ;","names":[]}