@greatapps/common 1.1.676 → 1.1.677

package/dist/components/modals/cards/CardFormFields.mjs

@@ -15,6 +15,7 @@ import {
   CardExpiryElement,
   CardNumberElement
 } from "@stripe/react-stripe-js";
+import { useTranslations } from "next-intl";
 const stripeElementOptions = {
   style: {
     base: {
@@ -27,30 +28,35 @@ const stripeElementOptions = {
     }
   }
 };
-const cardFormSchema = z.object({
-  name: z.string().min(1, "Nome \xE9 obrigat\xF3rio"),
-  country: z.string().min(1, "Pa\xEDs \xE9 obrigat\xF3rio"),
-  personType: z.enum(["pf", "pj"]),
-  cpf: z.string().optional(),
-  cnpj: z.string().optional(),
-  fullName: z.string().min(1, "Nome completo \xE9 obrigat\xF3rio"),
-  cep: z.string().min(9, "CEP \xE9 obrigat\xF3rio"),
-  street: z.string().min(1, "Endere\xE7o \xE9 obrigat\xF3rio"),
-  streetNumber: z.string().min(1, "N\xFAmero \xE9 obrigat\xF3rio"),
-  city: z.string().min(1, "Cidade \xE9 obrigat\xF3ria"),
-  state: z.string().min(1, "UF \xE9 obrigat\xF3rio"),
-  neighborhood: z.string().min(1, "Bairro \xE9 obrigat\xF3rio"),
-  complement: z.string().optional()
-}).refine(
-  (data) => {
-    if (data.personType === "pf") return !!data.cpf && data.cpf.length >= 14;
-    return !!data.cnpj && data.cnpj.length >= 18;
-  },
-  {
-    message: "Documento \xE9 obrigat\xF3rio",
-    path: ["cpf"]
-  }
-);
+function buildCardFormSchema(isInternational) {
+  const base = z.object({
+    name: z.string().min(1, "Nome \xE9 obrigat\xF3rio"),
+    country: z.string().min(1, "Pa\xEDs \xE9 obrigat\xF3rio"),
+    personType: z.enum(["pf", "pj"]).optional(),
+    cpf: z.string().optional(),
+    cnpj: z.string().optional(),
+    fullName: z.string().min(1, "Nome completo \xE9 obrigat\xF3rio"),
+    cep: z.string().min(isInternational ? 1 : 9, isInternational ? "C\xF3digo postal \xE9 obrigat\xF3rio" : "CEP \xE9 obrigat\xF3rio"),
+    street: z.string().min(1, "Endere\xE7o \xE9 obrigat\xF3rio"),
+    streetNumber: isInternational ? z.string().optional() : z.string().min(1, "N\xFAmero \xE9 obrigat\xF3rio"),
+    city: z.string().min(1, "Cidade \xE9 obrigat\xF3ria"),
+    state: z.string().min(1, "UF \xE9 obrigat\xF3rio"),
+    neighborhood: isInternational ? z.string().optional() : z.string().min(1, "Bairro \xE9 obrigat\xF3rio"),
+    complement: z.string().optional()
+  });
+  if (isInternational) return base;
+  return base.refine(
+    (data) => {
+      if (data.personType === "pf") return !!data.cpf && data.cpf.length >= 14;
+      return !!data.cnpj && data.cnpj.length >= 18;
+    },
+    {
+      message: "Documento \xE9 obrigat\xF3rio",
+      path: ["cpf"]
+    }
+  );
+}
+const cardFormSchema = buildCardFormSchema(false);
 const STEP1_FIELDS = [
   "name",
   "country",
@@ -61,8 +67,10 @@ const STEP1_FIELDS = [
 function CardFormFields({
   form,
   onStripeChange,
-  stripeErrors
+  stripeErrors,
+  isInternational = false
 }) {
+  const translate = useTranslations();
   const {
     register,
     watch,
@@ -74,15 +82,15 @@ function CardFormFields({
     /* @__PURE__ */ jsx(
       FormField,
       {
-        label: "Nome impresso no cart\xE3o",
-        placeholder: "Digite aqui",
+        label: translate("common.cards.form.nameOnCard"),
+        placeholder: translate("common.cards.form.typeHere"),
         ...register("name"),
         error: !!errors.name,
         errorMessage: errors.name?.message
       }
     ),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: "N\xFAmero do cart\xE3o" }),
+      /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: translate("common.cards.form.cardNumber") }),
       /* @__PURE__ */ jsx("div", { className: "h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400 relative", children: /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsx(
         CardNumberElement,
         {
@@ -94,7 +102,7 @@ function CardFormFields({
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: "Data de validade" }),
+        /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: translate("common.cards.form.cardExpiry") }),
         /* @__PURE__ */ jsx("div", { className: "h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400", children: /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsx(
           CardExpiryElement,
           {
@@ -105,7 +113,7 @@ function CardFormFields({
         stripeErrors.cardExpiry && /* @__PURE__ */ jsx("p", { className: "paragraph-xsmall-semibold text-red-600", children: stripeErrors.cardExpiry })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: "CVC" }),
+        /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: translate("common.cards.form.cardCvc") }),
         /* @__PURE__ */ jsx("div", { className: "h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400", children: /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsx(
           CardCvcElement,
           {
@@ -119,19 +127,19 @@ function CardFormFields({
     /* @__PURE__ */ jsx(
       SelectField,
       {
-        label: "Pa\xEDs",
-        placeholder: "Selecione",
+        label: translate("common.cards.form.country"),
+        placeholder: translate("common.cards.form.select"),
         value: watch("country"),
         onChange: (value) => setValue("country", value),
         options: COUNTRIES.map((c) => ({ value: c.iso, label: c.name }))
       }
     ),
-    /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
+    !isInternational && /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
       /* @__PURE__ */ jsx(
         SelectField,
         {
-          label: "Tipo de pessoa",
-          placeholder: "Selecione",
+          label: translate("common.cards.form.personType"),
+          placeholder: translate("common.cards.form.select"),
           value: personType,
           onChange: (value) => {
             setValue("personType", value);
@@ -139,8 +147,8 @@ function CardFormFields({
             setValue("cnpj", "");
           },
           options: [
-            { value: "pf", label: "Pessoa f\xEDsica" },
-            { value: "pj", label: "Pessoa jur\xEDdica" }
+            { value: "pf", label: translate("common.cards.form.personTypePf") },
+            { value: "pj", label: translate("common.cards.form.personTypePj") }
           ],
           containerClassName: "flex-1"
         }
@@ -148,7 +156,7 @@ function CardFormFields({
       /* @__PURE__ */ jsx("div", { className: "flex-1", children: personType === "pj" ? /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "CNPJ",
+          label: translate("common.cards.form.cnpj"),
           placeholder: "__.___.___/____-__",
           ...register("cnpj", {
             onChange: (e) => {
@@ -161,7 +169,7 @@ function CardFormFields({
       ) : /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "CPF",
+          label: translate("common.cards.form.cpf"),
           placeholder: "___.___.___-__",
           ...register("cpf", {
             onChange: (e) => {
@@ -175,7 +183,8 @@ function CardFormFields({
     ] })
   ] });
 }
-function BillingFormFields({ form }) {
+function BillingFormFields({ form, isInternational = false }) {
+  const translate = useTranslations();
   const {
     register,
     setValue,
@@ -183,6 +192,10 @@ function BillingFormFields({ form }) {
   } = form;
   const { mutateAsync: lookupCep } = useViaCep();
   const handleCepChange = (rawValue) => {
+    if (isInternational) {
+      setValue("cep", rawValue);
+      return;
+    }
     const masked = formatPostalCode(rawValue);
     setValue("cep", masked);
     const digits = rawValue.replace(/\D/g, "");
@@ -200,8 +213,8 @@ function BillingFormFields({ form }) {
     /* @__PURE__ */ jsx(
       FormField,
       {
-        label: "Nome completo",
-        placeholder: "Digite aqui",
+        label: translate("common.cards.form.fullName"),
+        placeholder: translate("common.cards.form.typeHere"),
         ...register("fullName"),
         error: !!errors.fullName,
         errorMessage: errors.fullName?.message
@@ -210,8 +223,8 @@ function BillingFormFields({ form }) {
     /* @__PURE__ */ jsx(
       FormField,
       {
-        label: "CEP",
-        placeholder: "_____-___",
+        label: isInternational ? translate("common.cards.form.postalCode") : translate("common.cards.form.cep"),
+        placeholder: isInternational ? "" : "_____-___",
         ...register("cep", {
           onChange: (e) => handleCepChange(e.target.value)
         }),
@@ -223,7 +236,7 @@ function BillingFormFields({ form }) {
       /* @__PURE__ */ jsx("div", { className: "flex-[4]", children: /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "Endere\xE7o",
+          label: translate("common.cards.form.street"),
           placeholder: "",
           ...register("street"),
           error: !!errors.street,
@@ -233,7 +246,7 @@ function BillingFormFields({ form }) {
       /* @__PURE__ */ jsx("div", { className: "flex-[1]", children: /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "N\xFAmero",
+          label: translate("common.cards.form.streetNumber"),
           placeholder: "",
           ...register("streetNumber"),
           error: !!errors.streetNumber,
@@ -245,7 +258,7 @@ function BillingFormFields({ form }) {
       /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "Cidade",
+          label: translate("common.cards.form.city"),
           placeholder: "",
           ...register("city"),
           error: !!errors.city,
@@ -255,7 +268,7 @@ function BillingFormFields({ form }) {
       /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "UF",
+          label: isInternational ? translate("common.cards.form.stateProvince") : translate("common.cards.form.state"),
           placeholder: "",
           ...register("state"),
           error: !!errors.state,
@@ -264,10 +277,10 @@ function BillingFormFields({ form }) {
       ) })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
-      /* @__PURE__ */ jsx(
+      !isInternational && /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "Bairro",
+          label: translate("common.cards.form.neighborhood"),
           placeholder: "",
           ...register("neighborhood"),
           error: !!errors.neighborhood,
@@ -277,7 +290,7 @@ function BillingFormFields({ form }) {
       /* @__PURE__ */ jsx(
         FormField,
         {
-          label: "Complemento",
+          label: translate("common.cards.form.complement"),
           optional: true,
           placeholder: "",
           ...register("complement"),
@@ -292,6 +305,7 @@ export {
   BillingFormFields,
   CardFormFields,
   STEP1_FIELDS,
+  buildCardFormSchema,
   cardFormSchema
 };
 //# sourceMappingURL=CardFormFields.mjs.map

package/dist/components/modals/cards/CardFormFields.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/modals/cards/CardFormFields.tsx"],"sourcesContent":["\"use client\";\n\nimport { UseFormReturn } from \"react-hook-form\";\nimport { useViaCep } from \"../../../modules/accounts/hooks/useViaCep\";\nimport { FormField } from \"../../ui/form/FormField\";\nimport { SelectField } from \"../../ui/form/SelectField\";\nimport { COUNTRIES } from \"../../../utils/countries\";\nimport {\n  formatCPF,\n  formatCNPJ,\n  formatPostalCode,\n} from \"../../../utils/format/masks\";\nimport z from \"zod\";\nimport {\n  CardCvcElement,\n  CardExpiryElement,\n  CardNumberElement,\n} from \"@stripe/react-stripe-js\";\n\nconst stripeElementOptions = {\n  style: {\n    base: {\n      fontSize: \"16px\",\n      color: \"#030712\",\n      fontFamily: \"Inter, sans-serif\",\n      \"::placeholder\": {\n        color: \"#9ca3af\",\n      },\n    },\n  },\n};\n\nexport const cardFormSchema = z\n  .object({\n    name: z.string().min(1, \"Nome é obrigatório\"),\n    country: z.string().min(1, \"País é obrigatório\"),\n    personType: z.enum([\"pf\", \"pj\"]),\n    cpf: z.string().optional(),\n    cnpj: z.string().optional(),\n    fullName: z.string().min(1, \"Nome completo é obrigatório\"),\n    cep: z.string().min(9, \"CEP é obrigatório\"),\n    street: z.string().min(1, \"Endereço é obrigatório\"),\n    streetNumber: z.string().min(1, \"Número é obrigatório\"),\n    city: z.string().min(1, \"Cidade é obrigatória\"),\n    state: z.string().min(1, \"UF é obrigatório\"),\n    neighborhood: z.string().min(1, \"Bairro é obrigatório\"),\n    complement: z.string().optional(),\n  })\n  .refine(\n    (data) => {\n      if (data.personType === \"pf\") return !!data.cpf && data.cpf.length >= 14;\n      return !!data.cnpj && data.cnpj.length >= 18;\n    },\n    {\n      message: \"Documento é obrigatório\",\n      path: [\"cpf\"],\n    },\n  );\n\nexport type CardFormData = z.infer<typeof cardFormSchema>;\n\nexport type StripeElementsStatus = {\n  cardNumber: boolean;\n  cardExpiry: boolean;\n  cardCvc: boolean;\n};\n\nexport const STEP1_FIELDS = [\n  \"name\",\n  \"country\",\n  \"personType\",\n  \"cpf\",\n  \"cnpj\",\n] as const;\n\ntype CardFormFieldsProps = {\n  readonly form: UseFormReturn<CardFormData>;\n  readonly onStripeChange: (\n    field: keyof StripeElementsStatus,\n    complete: boolean,\n  ) => void;\n  readonly stripeErrors: {\n    cardNumber?: string;\n    cardExpiry?: string;\n    cardCvc?: string;\n  };\n};\n\nexport function CardFormFields({\n  form,\n  onStripeChange,\n  stripeErrors,\n}: CardFormFieldsProps) {\n  const {\n    register,\n    watch,\n    setValue,\n    formState: { errors },\n  } = form;\n\n  const personType = watch(\"personType\");\n\n  return (\n    <div className=\"flex flex-col gap-5\">\n      <FormField\n        label=\"Nome impresso no cartão\"\n        placeholder=\"Digite aqui\"\n        {...register(\"name\")}\n        error={!!errors.name}\n        errorMessage={errors.name?.message}\n      />\n\n      <div className=\"flex flex-col gap-1.5\">\n        <label className=\"paragraph-xsmall-semibold text-zinc-600\">\n          Número do cartão\n        </label>\n        <div className=\"h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400 relative\">\n          <div className=\"w-full\">\n            <CardNumberElement\n              options={{ ...stripeElementOptions, showIcon: true }}\n              onChange={(e: { complete: boolean }) =>\n                onStripeChange(\"cardNumber\", e.complete)\n              }\n            />\n          </div>\n        </div>\n        {stripeErrors.cardNumber && (\n          <p className=\"paragraph-xsmall-semibold text-red-600\">\n            {stripeErrors.cardNumber}\n          </p>\n        )}\n      </div>\n\n      <div className=\"flex gap-4\">\n        <div className=\"flex-1 flex flex-col gap-1.5\">\n          <label className=\"paragraph-xsmall-semibold text-zinc-600\">\n            Data de validade\n          </label>\n          <div className=\"h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400\">\n            <div className=\"w-full\">\n              <CardExpiryElement\n                options={stripeElementOptions}\n                onChange={(e: { complete: boolean }) =>\n                  onStripeChange(\"cardExpiry\", e.complete)\n                }\n              />\n            </div>\n          </div>\n          {stripeErrors.cardExpiry && (\n            <p className=\"paragraph-xsmall-semibold text-red-600\">\n              {stripeErrors.cardExpiry}\n            </p>\n          )}\n        </div>\n\n        <div className=\"flex-1 flex flex-col gap-1.5\">\n          <label className=\"paragraph-xsmall-semibold text-zinc-600\">CVC</label>\n          <div className=\"h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400\">\n            <div className=\"w-full\">\n              <CardCvcElement\n                options={stripeElementOptions}\n                onChange={(e: { complete: boolean }) =>\n                  onStripeChange(\"cardCvc\", e.complete)\n                }\n              />\n            </div>\n          </div>\n          {stripeErrors.cardCvc && (\n            <p className=\"paragraph-xsmall-semibold text-red-600\">\n              {stripeErrors.cardCvc}\n            </p>\n          )}\n        </div>\n      </div>\n\n      <SelectField\n        label=\"País\"\n        placeholder=\"Selecione\"\n        value={watch(\"country\")}\n        onChange={(value) => setValue(\"country\", value as string)}\n        options={COUNTRIES.map((c) => ({ value: c.iso, label: c.name }))}\n      />\n\n      <div className=\"flex gap-4\">\n        <SelectField\n          label=\"Tipo de pessoa\"\n          placeholder=\"Selecione\"\n          value={personType}\n          onChange={(value) => {\n            setValue(\"personType\", value as \"pf\" | \"pj\");\n            setValue(\"cpf\", \"\");\n            setValue(\"cnpj\", \"\");\n          }}\n          options={[\n            { value: \"pf\", label: \"Pessoa física\" },\n            { value: \"pj\", label: \"Pessoa jurídica\" },\n          ]}\n          containerClassName=\"flex-1\"\n        />\n        <div className=\"flex-1\">\n          {personType === \"pj\" ? (\n            <FormField\n              label=\"CNPJ\"\n              placeholder=\"__.___.___/____-__\"\n              {...register(\"cnpj\", {\n                onChange: (e) => {\n                  setValue(\"cnpj\", formatCNPJ(e.target.value));\n                },\n              })}\n              error={!!errors.cpf}\n              errorMessage={errors.cpf?.message}\n            />\n          ) : (\n            <FormField\n              label=\"CPF\"\n              placeholder=\"___.___.___-__\"\n              {...register(\"cpf\", {\n                onChange: (e) => {\n                  setValue(\"cpf\", formatCPF(e.target.value));\n                },\n              })}\n              error={!!errors.cpf}\n              errorMessage={errors.cpf?.message}\n            />\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ntype BillingFormFieldsProps = {\n  readonly form: UseFormReturn<CardFormData>;\n};\n\nexport function BillingFormFields({ form }: BillingFormFieldsProps) {\n  const {\n    register,\n    setValue,\n    formState: { errors },\n  } = form;\n\n  const { mutateAsync: lookupCep } = useViaCep();\n\n  const handleCepChange = (rawValue: string) => {\n    const masked = formatPostalCode(rawValue);\n    setValue(\"cep\", masked);\n\n    const digits = rawValue.replace(/\\D/g, \"\");\n    if (digits.length === 8) {\n      lookupCep(digits)\n        .then((data) => {\n          setValue(\"street\", data.logradouro, { shouldValidate: true });\n          setValue(\"neighborhood\", data.bairro, { shouldValidate: true });\n          setValue(\"city\", data.localidade, { shouldValidate: true });\n          setValue(\"state\", data.uf, { shouldValidate: true });\n        })\n        .catch(() => {\n          // silently ignore — user can fill manually\n        });\n    }\n  };\n\n  return (\n    <div className=\"flex flex-col gap-5\">\n      <FormField\n        label=\"Nome completo\"\n        placeholder=\"Digite aqui\"\n        {...register(\"fullName\")}\n        error={!!errors.fullName}\n        errorMessage={errors.fullName?.message}\n      />\n\n      <FormField\n        label=\"CEP\"\n        placeholder=\"_____-___\"\n        {...register(\"cep\", {\n          onChange: (e) => handleCepChange(e.target.value),\n        })}\n        error={!!errors.cep}\n        errorMessage={errors.cep?.message}\n      />\n\n      <div className=\"flex gap-4\">\n        <div className=\"flex-[4]\">\n          <FormField\n            label=\"Endereço\"\n            placeholder=\"\"\n            {...register(\"street\")}\n            error={!!errors.street}\n            errorMessage={errors.street?.message}\n          />\n        </div>\n        <div className=\"flex-[1]\">\n          <FormField\n            label=\"Número\"\n            placeholder=\"\"\n            {...register(\"streetNumber\")}\n            error={!!errors.streetNumber}\n            errorMessage={errors.streetNumber?.message}\n          />\n        </div>\n      </div>\n\n      <div className=\"flex gap-4\">\n        <div className=\"flex-1\">\n          <FormField\n            label=\"Cidade\"\n            placeholder=\"\"\n            {...register(\"city\")}\n            error={!!errors.city}\n            errorMessage={errors.city?.message}\n          />\n        </div>\n        <div className=\"flex-1\">\n          <FormField\n            label=\"UF\"\n            placeholder=\"\"\n            {...register(\"state\")}\n            error={!!errors.state}\n            errorMessage={errors.state?.message}\n          />\n        </div>\n      </div>\n\n      <div className=\"flex gap-4\">\n        <FormField\n          label=\"Bairro\"\n          placeholder=\"\"\n          {...register(\"neighborhood\")}\n          error={!!errors.neighborhood}\n          errorMessage={errors.neighborhood?.message}\n        />\n        <FormField\n          label=\"Complemento\"\n          optional\n          placeholder=\"\"\n          {...register(\"complement\")}\n          error={!!errors.complement}\n          errorMessage={errors.complement?.message}\n        />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/modals/cards/CardFormFields.tsx"],"sourcesContent":["\"use client\";\n\nimport { UseFormReturn } from \"react-hook-form\";\nimport { useViaCep } from \"../../../modules/accounts/hooks/useViaCep\";\nimport { FormField } from \"../../ui/form/FormField\";\nimport { SelectField } from \"../../ui/form/SelectField\";\nimport { COUNTRIES } from \"../../../utils/countries\";\nimport {\n  formatCPF,\n  formatCNPJ,\n  formatPostalCode,\n} from \"../../../utils/format/masks\";\nimport z from \"zod\";\nimport {\n  CardCvcElement,\n  CardExpiryElement,\n  CardNumberElement,\n} from \"@stripe/react-stripe-js\";\nimport { useTranslations } from \"next-intl\";\n\nconst stripeElementOptions = {\n  style: {\n    base: {\n      fontSize: \"16px\",\n      color: \"#030712\",\n      fontFamily: \"Inter, sans-serif\",\n      \"::placeholder\": {\n        color: \"#9ca3af\",\n      },\n    },\n  },\n};\n\nexport function buildCardFormSchema(isInternational: boolean) {\n  const base = z.object({\n    name: z.string().min(1, \"Nome é obrigatório\"),\n    country: z.string().min(1, \"País é obrigatório\"),\n    personType: z.enum([\"pf\", \"pj\"]).optional(),\n    cpf: z.string().optional(),\n    cnpj: z.string().optional(),\n    fullName: z.string().min(1, \"Nome completo é obrigatório\"),\n    cep: z.string().min(isInternational ? 1 : 9, isInternational ? \"Código postal é obrigatório\" : \"CEP é obrigatório\"),\n    street: z.string().min(1, \"Endereço é obrigatório\"),\n    streetNumber: isInternational ? z.string().optional() : z.string().min(1, \"Número é obrigatório\"),\n    city: z.string().min(1, \"Cidade é obrigatória\"),\n    state: z.string().min(1, \"UF é obrigatório\"),\n    neighborhood: isInternational ? z.string().optional() : z.string().min(1, \"Bairro é obrigatório\"),\n    complement: z.string().optional(),\n  });\n  if (isInternational) return base;\n  return base.refine(\n    (data) => {\n      if (data.personType === \"pf\") return !!data.cpf && data.cpf.length >= 14;\n      return !!data.cnpj && data.cnpj.length >= 18;\n    },\n    {\n      message: \"Documento é obrigatório\",\n      path: [\"cpf\"],\n    },\n  );\n}\n\nexport const cardFormSchema = buildCardFormSchema(false);\n\nexport type CardFormData = z.infer<typeof cardFormSchema>;\n\nexport type StripeElementsStatus = {\n  cardNumber: boolean;\n  cardExpiry: boolean;\n  cardCvc: boolean;\n};\n\nexport const STEP1_FIELDS = [\n  \"name\",\n  \"country\",\n  \"personType\",\n  \"cpf\",\n  \"cnpj\",\n] as const;\n\ntype CardFormFieldsProps = {\n  readonly form: UseFormReturn<CardFormData>;\n  readonly onStripeChange: (\n    field: keyof StripeElementsStatus,\n    complete: boolean,\n  ) => void;\n  readonly stripeErrors: {\n    cardNumber?: string;\n    cardExpiry?: string;\n    cardCvc?: string;\n  };\n  readonly isInternational?: boolean;\n};\n\nexport function CardFormFields({\n  form,\n  onStripeChange,\n  stripeErrors,\n  isInternational = false,\n}: CardFormFieldsProps) {\n  const translate = useTranslations();\n  const {\n    register,\n    watch,\n    setValue,\n    formState: { errors },\n  } = form;\n\n  const personType = watch(\"personType\");\n\n  return (\n    <div className=\"flex flex-col gap-5\">\n      <FormField\n        label={translate('common.cards.form.nameOnCard')}\n        placeholder={translate('common.cards.form.typeHere')}\n        {...register(\"name\")}\n        error={!!errors.name}\n        errorMessage={errors.name?.message}\n      />\n\n      <div className=\"flex flex-col gap-1.5\">\n        <label className=\"paragraph-xsmall-semibold text-zinc-600\">\n          {translate('common.cards.form.cardNumber')}\n        </label>\n        <div className=\"h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400 relative\">\n          <div className=\"w-full\">\n            <CardNumberElement\n              options={{ ...stripeElementOptions, showIcon: true }}\n              onChange={(e: { complete: boolean }) =>\n                onStripeChange(\"cardNumber\", e.complete)\n              }\n            />\n          </div>\n        </div>\n        {stripeErrors.cardNumber && (\n          <p className=\"paragraph-xsmall-semibold text-red-600\">\n            {stripeErrors.cardNumber}\n          </p>\n        )}\n      </div>\n\n      <div className=\"flex gap-4\">\n        <div className=\"flex-1 flex flex-col gap-1.5\">\n          <label className=\"paragraph-xsmall-semibold text-zinc-600\">\n            {translate('common.cards.form.cardExpiry')}\n          </label>\n          <div className=\"h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400\">\n            <div className=\"w-full\">\n              <CardExpiryElement\n                options={stripeElementOptions}\n                onChange={(e: { complete: boolean }) =>\n                  onStripeChange(\"cardExpiry\", e.complete)\n                }\n              />\n            </div>\n          </div>\n          {stripeErrors.cardExpiry && (\n            <p className=\"paragraph-xsmall-semibold text-red-600\">\n              {stripeErrors.cardExpiry}\n            </p>\n          )}\n        </div>\n\n        <div className=\"flex-1 flex flex-col gap-1.5\">\n          <label className=\"paragraph-xsmall-semibold text-zinc-600\">{translate('common.cards.form.cardCvc')}</label>\n          <div className=\"h-10 px-3 flex items-center w-full border border-zinc-200 rounded-lg bg-white transition-colors focus-within:border-zinc-400\">\n            <div className=\"w-full\">\n              <CardCvcElement\n                options={stripeElementOptions}\n                onChange={(e: { complete: boolean }) =>\n                  onStripeChange(\"cardCvc\", e.complete)\n                }\n              />\n            </div>\n          </div>\n          {stripeErrors.cardCvc && (\n            <p className=\"paragraph-xsmall-semibold text-red-600\">\n              {stripeErrors.cardCvc}\n            </p>\n          )}\n        </div>\n      </div>\n\n      <SelectField\n        label={translate('common.cards.form.country')}\n        placeholder={translate('common.cards.form.select')}\n        value={watch(\"country\")}\n        onChange={(value) => setValue(\"country\", value as string)}\n        options={COUNTRIES.map((c) => ({ value: c.iso, label: c.name }))}\n      />\n\n      {!isInternational && (\n        <div className=\"flex gap-4\">\n          <SelectField\n            label={translate('common.cards.form.personType')}\n            placeholder={translate('common.cards.form.select')}\n            value={personType}\n            onChange={(value) => {\n              setValue(\"personType\", value as \"pf\" | \"pj\");\n              setValue(\"cpf\", \"\");\n              setValue(\"cnpj\", \"\");\n            }}\n            options={[\n              { value: \"pf\", label: translate('common.cards.form.personTypePf') },\n              { value: \"pj\", label: translate('common.cards.form.personTypePj') },\n            ]}\n            containerClassName=\"flex-1\"\n          />\n          <div className=\"flex-1\">\n            {personType === \"pj\" ? (\n              <FormField\n                label={translate('common.cards.form.cnpj')}\n                placeholder=\"__.___.___/____-__\"\n                {...register(\"cnpj\", {\n                  onChange: (e) => {\n                    setValue(\"cnpj\", formatCNPJ(e.target.value));\n                  },\n                })}\n                error={!!errors.cpf}\n                errorMessage={errors.cpf?.message}\n              />\n            ) : (\n              <FormField\n                label={translate('common.cards.form.cpf')}\n                placeholder=\"___.___.___-__\"\n                {...register(\"cpf\", {\n                  onChange: (e) => {\n                    setValue(\"cpf\", formatCPF(e.target.value));\n                  },\n                })}\n                error={!!errors.cpf}\n                errorMessage={errors.cpf?.message}\n              />\n            )}\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n\ntype BillingFormFieldsProps = {\n  readonly form: UseFormReturn<CardFormData>;\n  readonly isInternational?: boolean;\n};\n\nexport function BillingFormFields({ form, isInternational = false }: BillingFormFieldsProps) {\n  const translate = useTranslations();\n  const {\n    register,\n    setValue,\n    formState: { errors },\n  } = form;\n\n  const { mutateAsync: lookupCep } = useViaCep();\n\n  const handleCepChange = (rawValue: string) => {\n    if (isInternational) {\n      setValue(\"cep\", rawValue);\n      return;\n    }\n    const masked = formatPostalCode(rawValue);\n    setValue(\"cep\", masked);\n\n    const digits = rawValue.replace(/\\D/g, \"\");\n    if (digits.length === 8) {\n      lookupCep(digits)\n        .then((data) => {\n          setValue(\"street\", data.logradouro, { shouldValidate: true });\n          setValue(\"neighborhood\", data.bairro, { shouldValidate: true });\n          setValue(\"city\", data.localidade, { shouldValidate: true });\n          setValue(\"state\", data.uf, { shouldValidate: true });\n        })\n        .catch(() => {\n          // silently ignore — user can fill manually\n        });\n    }\n  };\n\n  return (\n    <div className=\"flex flex-col gap-5\">\n      <FormField\n        label={translate('common.cards.form.fullName')}\n        placeholder={translate('common.cards.form.typeHere')}\n        {...register(\"fullName\")}\n        error={!!errors.fullName}\n        errorMessage={errors.fullName?.message}\n      />\n\n      <FormField\n        label={isInternational ? translate('common.cards.form.postalCode') : translate('common.cards.form.cep')}\n        placeholder={isInternational ? \"\" : \"_____-___\"}\n        {...register(\"cep\", {\n          onChange: (e) => handleCepChange(e.target.value),\n        })}\n        error={!!errors.cep}\n        errorMessage={errors.cep?.message}\n      />\n\n      <div className=\"flex gap-4\">\n        <div className=\"flex-[4]\">\n          <FormField\n            label={translate('common.cards.form.street')}\n            placeholder=\"\"\n            {...register(\"street\")}\n            error={!!errors.street}\n            errorMessage={errors.street?.message}\n          />\n        </div>\n        <div className=\"flex-[1]\">\n          <FormField\n            label={translate('common.cards.form.streetNumber')}\n            placeholder=\"\"\n            {...register(\"streetNumber\")}\n            error={!!errors.streetNumber}\n            errorMessage={errors.streetNumber?.message}\n          />\n        </div>\n      </div>\n\n      <div className=\"flex gap-4\">\n        <div className=\"flex-1\">\n          <FormField\n            label={translate('common.cards.form.city')}\n            placeholder=\"\"\n            {...register(\"city\")}\n            error={!!errors.city}\n            errorMessage={errors.city?.message}\n          />\n        </div>\n        <div className=\"flex-1\">\n          <FormField\n            label={isInternational ? translate('common.cards.form.stateProvince') : translate('common.cards.form.state')}\n            placeholder=\"\"\n            {...register(\"state\")}\n            error={!!errors.state}\n            errorMessage={errors.state?.message}\n          />\n        </div>\n      </div>\n\n      <div className=\"flex gap-4\">\n        {!isInternational && (\n          <FormField\n            label={translate('common.cards.form.neighborhood')}\n            placeholder=\"\"\n            {...register(\"neighborhood\")}\n            error={!!errors.neighborhood}\n            errorMessage={errors.neighborhood?.message}\n          />\n        )}\n        <FormField\n          label={translate('common.cards.form.complement')}\n          optional\n          placeholder=\"\"\n          {...register(\"complement\")}\n          error={!!errors.complement}\n          errorMessage={errors.complement?.message}\n        />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/modals/cards/DeleteCardModal.mjs

@@ -17,7 +17,9 @@ import { useModalManager } from "../../../store/useModalManager";
 import { useDeleteConfirmation } from "../../../modules/cards/hooks/delete-confirmation.hook";
 import { useDeleteCard } from "../../../modules/cards/hooks/delete-card.hook";
 import { useCards } from "../../../modules/cards/hooks/cards.hook";
+import { useTranslations } from "next-intl";
 function DeleteCardModal() {
+  const translate = useTranslations();
   const { activeModal, modalData, closeModal } = useModalManager();
   const { form, isValidConfirmation, resetConfirmation } = useDeleteConfirmation();
   const deleteCard = useDeleteCard();
@@ -42,7 +44,7 @@ function DeleteCardModal() {
           {
             toastId: t,
             variant: "error",
-            message: error instanceof Error ? error.message : "N\xE3o foi poss\xEDvel excluir o cart\xE3o"
+            message: error instanceof Error ? error.message : translate("common.cards.delete.errorToast")
           }
         ),
         { duration: 5e3 }
@@ -57,7 +59,7 @@ function DeleteCardModal() {
         Toast,
         {
           variant: "success",
-          message: `O cart\xE3o \u2022\u2022\u2022\u2022 ${cardLastDigits} foi exclu\xEDdo com sucesso`,
+          message: translate("common.cards.delete.successToast", { digits: cardLastDigits }),
           toastId: t
         }
       ),
@@ -68,9 +70,9 @@ function DeleteCardModal() {
     /* @__PURE__ */ jsxs(DialogHeader, { className: "gap-4 text-left p-4 lg:p-5 pb-0 lg:pb-0", children: [
       /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-fit bg-red-50 rounded-lg p-2.5", children: /* @__PURE__ */ jsx(IconTrash, { size: 20, className: "text-red-500" }) }),
       /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-        /* @__PURE__ */ jsx(DialogTitle, { className: "paragraph-medium-semibold text-zinc-950", children: "Excluir cart\xE3o" }),
+        /* @__PURE__ */ jsx(DialogTitle, { className: "paragraph-medium-semibold text-zinc-950", children: translate("common.cards.delete.title") }),
         /* @__PURE__ */ jsxs(DialogDescription, { className: "paragraph-small-regular text-zinc-600", children: [
-          "Deseja realmente excluir o cart\xE3o:",
+          translate("common.cards.delete.description"),
           " ",
           /* @__PURE__ */ jsxs("span", { className: "font-semibold text-zinc-950", children: [
             "\u2022\u2022\u2022\u2022 ",
@@ -83,9 +85,9 @@ function DeleteCardModal() {
     /* @__PURE__ */ jsx("div", { className: "px-4 lg:px-5 py-5", children: /* @__PURE__ */ jsx(
       FormField,
       {
-        label: "Digite EXCLUIR abaixo",
+        label: translate("common.cards.delete.confirmLabel"),
         required: true,
-        placeholder: "EXCLUIR",
+        placeholder: translate("common.cards.delete.confirmPlaceholder"),
         ...form.register("confirmText")
       }
     ) }),
@@ -98,7 +100,7 @@ function DeleteCardModal() {
           disabled: !isValidConfirmation,
           loading: form.formState.isSubmitting,
           className: "h-10!",
-          children: form.formState.isSubmitting ? "Excluindo..." : "Excluir"
+          children: form.formState.isSubmitting ? translate("common.cards.delete.deleting") : translate("common.actions.delete")
         }
       ),
       /* @__PURE__ */ jsx(
@@ -109,7 +111,7 @@ function DeleteCardModal() {
           className: "h-10!",
           onClick: handleClose,
           disabled: form.formState.isSubmitting,
-          children: "Cancelar"
+          children: translate("common.actions.cancel")
         }
       )
     ] })

package/dist/components/modals/cards/DeleteCardModal.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/modals/cards/DeleteCardModal.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Dialog,\n  DialogContent,\n  DialogHeader,\n  DialogTitle,\n  DialogDescription,\n} from '../../ui/overlay/Dialog';\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 { IconTrash } from '@tabler/icons-react';\nimport { toast } from 'sonner';\nimport { useModalManager } from '../../../store/useModalManager';\nimport { useDeleteConfirmation } from '../../../modules/cards/hooks/delete-confirmation.hook';\nimport { useDeleteCard } from '../../../modules/cards/hooks/delete-card.hook';\nimport { useCards } from '../../../modules/cards/hooks/cards.hook';\n\nexport function DeleteCardModal() {\n  const { activeModal, modalData, closeModal } = useModalManager();\n  const { form, isValidConfirmation, resetConfirmation } = useDeleteConfirmation();\n  const deleteCard = useDeleteCard();\n  const { data: cardsData } = useCards();\n\n  const isOpen = activeModal === 'deleteCardModal';\n  const cardId = modalData.cardId as string | undefined;\n  const onSuccess = modalData.onSuccess as (() => void) | undefined;\n\n  const card = cardsData?.data?.find((c) => c.id.toString() === cardId);\n  const cardLastDigits = (card?.number ?? '').replaceAll(/\\D/g, '').slice(-4);\n\n  const handleClose = () => {\n    resetConfirmation();\n    closeModal();\n  };\n\n  const onSubmit = async () => {\n    if (!cardId) return;\n\n    try {\n      await deleteCard.mutateAsync(cardId);\n    } catch (error) {\n      toast.custom(\n        (t) => (\n          <Toast\n            toastId={t}\n            variant=\"error\"\n            message={\n              error instanceof Error\n                ? error.message\n                : 'Não foi possível excluir o cartão'\n            }\n          />\n        ),\n        { duration: 5000 },\n      );\n      return;\n    }\n\n    onSuccess?.();\n    resetConfirmation();\n    closeModal();\n\n    toast.custom(\n      (t) => (\n        <Toast\n          variant=\"success\"\n          message={`O cartão •••• ${cardLastDigits} foi excluído com sucesso`}\n          toastId={t}\n        />\n      ),\n      { duration: 5000 },\n    );\n  };\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && handleClose()}>\n      <DialogContent className=\"flex flex-col p-0! gap-0! max-w-[calc(100%-2rem)]! w-full sm:max-w-[400px]! lg:max-w-[410px]! rounded-lg border\">\n        <form onSubmit={form.handleSubmit(onSubmit)} className=\"flex flex-col\">\n          <DialogHeader className=\"gap-4 text-left p-4 lg:p-5 pb-0 lg:pb-0\">\n            <div className=\"flex items-center justify-center w-fit bg-red-50 rounded-lg p-2.5\">\n              <IconTrash size={20} className=\"text-red-500\" />\n            </div>\n            <div className=\"flex flex-col gap-2\">\n              <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n                Excluir cartão\n              </DialogTitle>\n              <DialogDescription className=\"paragraph-small-regular text-zinc-600\">\n                Deseja realmente excluir o cartão:{' '}\n                <span className=\"font-semibold text-zinc-950\">\n                  •••• {cardLastDigits}\n                </span>\n                ?\n              </DialogDescription>\n            </div>\n          </DialogHeader>\n\n          <div className=\"px-4 lg:px-5 py-5\">\n            <FormField\n              label=\"Digite EXCLUIR abaixo\"\n              required\n              placeholder=\"EXCLUIR\"\n              {...form.register('confirmText')}\n            />\n          </div>\n          <Separator />\n          <div className=\"flex flex-row items-center gap-2 p-4 lg:p-5\">\n            <Button\n              type=\"submit\"\n              disabled={!isValidConfirmation}\n              loading={form.formState.isSubmitting}\n              className=\"h-10!\"\n            >\n              {form.formState.isSubmitting ? 'Excluindo...' : 'Excluir'}\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"secondary\"\n              className=\"h-10!\"\n              onClick={handleClose}\n              disabled={form.formState.isSubmitting}\n            >\n              Cancelar\n            </Button>\n          </div>\n        </form>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";AA8CU,cA6CM,YA7CN;AA5CV;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,aAAa;AACtB,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAC1B,SAAS,aAAa;AACtB,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AACtC,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AAElB,SAAS,kBAAkB;AAChC,QAAM,EAAE,aAAa,WAAW,WAAW,IAAI,gBAAgB;AAC/D,QAAM,EAAE,MAAM,qBAAqB,kBAAkB,IAAI,sBAAsB;AAC/E,QAAM,aAAa,cAAc;AACjC,QAAM,EAAE,MAAM,UAAU,IAAI,SAAS;AAErC,QAAM,SAAS,gBAAgB;AAC/B,QAAM,SAAS,UAAU;AACzB,QAAM,YAAY,UAAU;AAE5B,QAAM,OAAO,WAAW,MAAM,KAAK,CAAC,MAAM,EAAE,GAAG,SAAS,MAAM,MAAM;AACpE,QAAM,kBAAkB,MAAM,UAAU,IAAI,WAAW,OAAO,EAAE,EAAE,MAAM,EAAE;AAE1E,QAAM,cAAc,MAAM;AACxB,sBAAkB;AAClB,eAAW;AAAA,EACb;AAEA,QAAM,WAAW,YAAY;AAC3B,QAAI,CAAC,OAAQ;AAEb,QAAI;AACF,YAAM,WAAW,YAAY,MAAM;AAAA,IACrC,SAAS,OAAO;AACd,YAAM;AAAA,QACJ,CAAC,MACC;AAAA,UAAC;AAAA;AAAA,YACC,SAAS;AAAA,YACT,SAAQ;AAAA,YACR,SACE,iBAAiB,QACb,MAAM,UACN;AAAA;AAAA,QAER;AAAA,QAEF,EAAE,UAAU,IAAK;AAAA,MACnB;AACA;AAAA,IACF;AAEA,gBAAY;AACZ,sBAAkB;AAClB,eAAW;AAEX,UAAM;AAAA,MACJ,CAAC,MACC;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,wCAAiB,cAAc;AAAA,UACxC,SAAS;AAAA;AAAA,MACX;AAAA,MAEF,EAAE,UAAU,IAAK;AAAA,IACnB;AAAA,EACF;AAEA,SACE,oBAAC,UAAO,MAAM,QAAQ,cAAc,CAAC,SAAS,CAAC,QAAQ,YAAY,GACjE,8BAAC,iBAAc,WAAU,mHACvB,+BAAC,UAAK,UAAU,KAAK,aAAa,QAAQ,GAAG,WAAU,iBACrD;AAAA,yBAAC,gBAAa,WAAU,2CACtB;AAAA,0BAAC,SAAI,WAAU,qEACb,8BAAC,aAAU,MAAM,IAAI,WAAU,gBAAe,GAChD;AAAA,MACA,qBAAC,SAAI,WAAU,uBACb;AAAA,4BAAC,eAAY,WAAU,2CAA0C,+BAEjE;AAAA,QACA,qBAAC,qBAAkB,WAAU,yCAAwC;AAAA;AAAA,UAChC;AAAA,UACnC,qBAAC,UAAK,WAAU,+BAA8B;AAAA;AAAA,YACtC;AAAA,aACR;AAAA,UAAO;AAAA,WAET;AAAA,SACF;AAAA,OACF;AAAA,IAEA,oBAAC,SAAI,WAAU,qBACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,UAAQ;AAAA,QACR,aAAY;AAAA,QACX,GAAG,KAAK,SAAS,aAAa;AAAA;AAAA,IACjC,GACF;AAAA,IACA,oBAAC,aAAU;AAAA,IACX,qBAAC,SAAI,WAAU,+CACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,KAAK,UAAU;AAAA,UACxB,WAAU;AAAA,UAET,eAAK,UAAU,eAAe,iBAAiB;AAAA;AAAA,MAClD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,SAAS;AAAA,UACT,UAAU,KAAK,UAAU;AAAA,UAC1B;AAAA;AAAA,MAED;AAAA,OACF;AAAA,KACF,GACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../../src/components/modals/cards/DeleteCardModal.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Dialog,\n  DialogContent,\n  DialogHeader,\n  DialogTitle,\n  DialogDescription,\n} from '../../ui/overlay/Dialog';\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 { IconTrash } from '@tabler/icons-react';\nimport { toast } from 'sonner';\nimport { useModalManager } from '../../../store/useModalManager';\nimport { useDeleteConfirmation } from '../../../modules/cards/hooks/delete-confirmation.hook';\nimport { useDeleteCard } from '../../../modules/cards/hooks/delete-card.hook';\nimport { useCards } from '../../../modules/cards/hooks/cards.hook';\nimport { useTranslations } from 'next-intl';\n\nexport function DeleteCardModal() {\n  const translate = useTranslations();\n  const { activeModal, modalData, closeModal } = useModalManager();\n  const { form, isValidConfirmation, resetConfirmation } = useDeleteConfirmation();\n  const deleteCard = useDeleteCard();\n  const { data: cardsData } = useCards();\n\n  const isOpen = activeModal === 'deleteCardModal';\n  const cardId = modalData.cardId as string | undefined;\n  const onSuccess = modalData.onSuccess as (() => void) | undefined;\n\n  const card = cardsData?.data?.find((c) => c.id.toString() === cardId);\n  const cardLastDigits = (card?.number ?? '').replaceAll(/\\D/g, '').slice(-4);\n\n  const handleClose = () => {\n    resetConfirmation();\n    closeModal();\n  };\n\n  const onSubmit = async () => {\n    if (!cardId) return;\n\n    try {\n      await deleteCard.mutateAsync(cardId);\n    } catch (error) {\n      toast.custom(\n        (t) => (\n          <Toast\n            toastId={t}\n            variant=\"error\"\n            message={\n              error instanceof Error\n                ? error.message\n                : translate('common.cards.delete.errorToast')\n            }\n          />\n        ),\n        { duration: 5000 },\n      );\n      return;\n    }\n\n    onSuccess?.();\n    resetConfirmation();\n    closeModal();\n\n    toast.custom(\n      (t) => (\n        <Toast\n          variant=\"success\"\n          message={translate('common.cards.delete.successToast', { digits: cardLastDigits })}\n          toastId={t}\n        />\n      ),\n      { duration: 5000 },\n    );\n  };\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && handleClose()}>\n      <DialogContent className=\"flex flex-col p-0! gap-0! max-w-[calc(100%-2rem)]! w-full sm:max-w-[400px]! lg:max-w-[410px]! rounded-lg border\">\n        <form onSubmit={form.handleSubmit(onSubmit)} className=\"flex flex-col\">\n          <DialogHeader className=\"gap-4 text-left p-4 lg:p-5 pb-0 lg:pb-0\">\n            <div className=\"flex items-center justify-center w-fit bg-red-50 rounded-lg p-2.5\">\n              <IconTrash size={20} className=\"text-red-500\" />\n            </div>\n            <div className=\"flex flex-col gap-2\">\n              <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n                {translate('common.cards.delete.title')}\n              </DialogTitle>\n              <DialogDescription className=\"paragraph-small-regular text-zinc-600\">\n                {translate('common.cards.delete.description')}{' '}\n                <span className=\"font-semibold text-zinc-950\">\n                  •••• {cardLastDigits}\n                </span>\n                ?\n              </DialogDescription>\n            </div>\n          </DialogHeader>\n\n          <div className=\"px-4 lg:px-5 py-5\">\n            <FormField\n              label={translate('common.cards.delete.confirmLabel')}\n              required\n              placeholder={translate('common.cards.delete.confirmPlaceholder')}\n              {...form.register('confirmText')}\n            />\n          </div>\n          <Separator />\n          <div className=\"flex flex-row items-center gap-2 p-4 lg:p-5\">\n            <Button\n              type=\"submit\"\n              disabled={!isValidConfirmation}\n              loading={form.formState.isSubmitting}\n              className=\"h-10!\"\n            >\n              {form.formState.isSubmitting ? translate('common.cards.delete.deleting') : translate('common.actions.delete')}\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"secondary\"\n              className=\"h-10!\"\n              onClick={handleClose}\n              disabled={form.formState.isSubmitting}\n            >\n              {translate('common.actions.cancel')}\n            </Button>\n          </div>\n        </form>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/navigation/CancelledSubscriptionBanner.mjs

@@ -5,7 +5,9 @@ import { IconAlertOctagon, IconX } from "@tabler/icons-react";
 import { useActiveSubscription } from "../../modules/subscriptions/hooks/find-active-subscription.hook";
 import { toCalendarDate } from "../../infra/utils/date";
 import { getSubscriptionExpiryDate } from "../../modules/subscriptions/utils/get-subscription-expiry-date";
+import { useTranslations } from "next-intl";
 function CancelledSubscriptionBanner({ onReactivate }) {
+  const translate = useTranslations();
   const { data: { data: [subscription] = [] } = {} } = useActiveSubscription();
   const [visible, setVisible] = useState(true);
   const [animated, setAnimated] = useState(false);
@@ -27,7 +29,7 @@ function CancelledSubscriptionBanner({ onReactivate }) {
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1 w-full sm:w-auto", children: [
           /* @__PURE__ */ jsx(IconAlertOctagon, { size: 16, className: "text-white shrink-0" }),
-          /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white", children: "Assinatura cancelada! Suas p\xE1ginas foram retiradas do ar." })
+          /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white", children: translate("common.navigation.banners.cancelled.message") })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start", children: [
           /* @__PURE__ */ jsx(
@@ -36,7 +38,7 @@ function CancelledSubscriptionBanner({ onReactivate }) {
               type: "button",
               className: "flex items-center justify-center p-1.5 cursor-pointer",
               onClick: onReactivate,
-              children: /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white underline", children: "Escolher um novo plano" })
+              children: /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white underline", children: translate("common.navigation.banners.cancelled.choosePlan") })
             }
           ),
           /* @__PURE__ */ jsx("button", { type: "button", className: "cursor-pointer shrink-0", onClick: dismiss, children: /* @__PURE__ */ jsx(IconX, { size: 18, className: "text-red-200" }) })

package/dist/components/navigation/CancelledSubscriptionBanner.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/navigation/CancelledSubscriptionBanner.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect, useCallback } from 'react';\nimport { IconAlertOctagon, IconX } from '@tabler/icons-react';\nimport { useActiveSubscription } from '../../modules/subscriptions/hooks/find-active-subscription.hook';\nimport { toCalendarDate } from '../../infra/utils/date';\nimport { getSubscriptionExpiryDate } from '../../modules/subscriptions/utils/get-subscription-expiry-date';\n\ninterface CancelledSubscriptionBannerProps {\n  onReactivate?: () => void;\n}\n\nexport function CancelledSubscriptionBanner({ onReactivate }: CancelledSubscriptionBannerProps) {\n  const { data: { data: [subscription] = [] } = {} } = useActiveSubscription();\n  const [visible, setVisible] = useState(true);\n  const [animated, setAnimated] = useState(false);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setAnimated(true), 50);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const dismiss = useCallback(() => setVisible(false), []);\n\n  if (!visible) return null;\n  if (subscription?.type === 'free' || subscription?.type === 'trial') return null;\n\n  const today = toCalendarDate(new Date());\n  const expiryDate = getSubscriptionExpiryDate(subscription);\n\n  // Só mostra se há cancelamento E o período (com grace, no caso de client) já terminou.\n  if (!today || !expiryDate || !subscription?.date_cancellation) return null;\n  if (today.getTime() < expiryDate.getTime()) return null;\n\n  return (\n    <div className=\"fixed top-[80px] md:top-0 left-0 right-0 z-[60] flex justify-center pointer-events-none px-4 lg:px-0\">\n      <div\n        className={`flex flex-col sm:flex-row items-start sm:items-center justify-between bg-red-500 rounded-lg px-3 py-2 sm:py-1 w-full lg:w-[805px] max-w-full pointer-events-auto transition-transform duration-500 ease-out gap-2 sm:gap-0 ${animated ? 'translate-y-0 md:translate-y-9' : '-translate-y-full'}`}\n      >\n        <div className=\"flex items-center gap-2 flex-1 w-full sm:w-auto\">\n          <IconAlertOctagon size={16} className=\"text-white shrink-0\" />\n          <span className=\"paragraph-xsmall-semibold text-white\">\n            Assinatura cancelada! Suas páginas foram retiradas do ar.\n          </span>\n        </div>\n        <div className=\"flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start\">\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center p-1.5 cursor-pointer\"\n            onClick={onReactivate}\n          >\n            <span className=\"paragraph-xsmall-semibold text-white underline\">\n              Escolher um novo plano\n            </span>\n          </button>\n          <button type=\"button\" className=\"cursor-pointer shrink-0\" onClick={dismiss}>\n            <IconX size={18} className=\"text-red-200\" />\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAuCQ,SACE,KADF;AArCR,SAAS,UAAU,WAAW,mBAAmB;AACjD,SAAS,kBAAkB,aAAa;AACxC,SAAS,6BAA6B;AACtC,SAAS,sBAAsB;AAC/B,SAAS,iCAAiC;AAMnC,SAAS,4BAA4B,EAAE,aAAa,GAAqC;AAC9F,QAAM,EAAE,MAAM,EAAE,MAAM,CAAC,YAAY,IAAI,CAAC,EAAE,IAAI,CAAC,EAAE,IAAI,sBAAsB;AAC3E,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAC3C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,YAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,YAAY,IAAI,GAAG,EAAE;AACpD,WAAO,MAAM,aAAa,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAAY,MAAM,WAAW,KAAK,GAAG,CAAC,CAAC;AAEvD,MAAI,CAAC,QAAS,QAAO;AACrB,MAAI,cAAc,SAAS,UAAU,cAAc,SAAS,QAAS,QAAO;AAE5E,QAAM,QAAQ,eAAe,oBAAI,KAAK,CAAC;AACvC,QAAM,aAAa,0BAA0B,YAAY;AAGzD,MAAI,CAAC,SAAS,CAAC,cAAc,CAAC,cAAc,kBAAmB,QAAO;AACtE,MAAI,MAAM,QAAQ,IAAI,WAAW,QAAQ,EAAG,QAAO;AAEnD,SACE,oBAAC,SAAI,WAAU,wGACb;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,8NAA8N,WAAW,mCAAmC,mBAAmB;AAAA,MAE1S;AAAA,6BAAC,SAAI,WAAU,mDACb;AAAA,8BAAC,oBAAiB,MAAM,IAAI,WAAU,uBAAsB;AAAA,UAC5D,oBAAC,UAAK,WAAU,wCAAuC,0EAEvD;AAAA,WACF;AAAA,QACA,qBAAC,SAAI,WAAU,+EACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAET,8BAAC,UAAK,WAAU,kDAAiD,oCAEjE;AAAA;AAAA,UACF;AAAA,UACA,oBAAC,YAAO,MAAK,UAAS,WAAU,2BAA0B,SAAS,SACjE,8BAAC,SAAM,MAAM,IAAI,WAAU,gBAAe,GAC5C;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/navigation/CancelledSubscriptionBanner.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect, useCallback } from 'react';\nimport { IconAlertOctagon, IconX } from '@tabler/icons-react';\nimport { useActiveSubscription } from '../../modules/subscriptions/hooks/find-active-subscription.hook';\nimport { toCalendarDate } from '../../infra/utils/date';\nimport { getSubscriptionExpiryDate } from '../../modules/subscriptions/utils/get-subscription-expiry-date';\nimport { useTranslations } from 'next-intl';\n\ninterface CancelledSubscriptionBannerProps {\n  onReactivate?: () => void;\n}\n\nexport function CancelledSubscriptionBanner({ onReactivate }: CancelledSubscriptionBannerProps) {\n  const translate = useTranslations();\n  const { data: { data: [subscription] = [] } = {} } = useActiveSubscription();\n  const [visible, setVisible] = useState(true);\n  const [animated, setAnimated] = useState(false);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setAnimated(true), 50);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const dismiss = useCallback(() => setVisible(false), []);\n\n  if (!visible) return null;\n  if (subscription?.type === 'free' || subscription?.type === 'trial') return null;\n\n  const today = toCalendarDate(new Date());\n  const expiryDate = getSubscriptionExpiryDate(subscription);\n\n  // Só mostra se há cancelamento E o período (com grace, no caso de client) já terminou.\n  if (!today || !expiryDate || !subscription?.date_cancellation) return null;\n  if (today.getTime() < expiryDate.getTime()) return null;\n\n  return (\n    <div className=\"fixed top-[80px] md:top-0 left-0 right-0 z-[60] flex justify-center pointer-events-none px-4 lg:px-0\">\n      <div\n        className={`flex flex-col sm:flex-row items-start sm:items-center justify-between bg-red-500 rounded-lg px-3 py-2 sm:py-1 w-full lg:w-[805px] max-w-full pointer-events-auto transition-transform duration-500 ease-out gap-2 sm:gap-0 ${animated ? 'translate-y-0 md:translate-y-9' : '-translate-y-full'}`}\n      >\n        <div className=\"flex items-center gap-2 flex-1 w-full sm:w-auto\">\n          <IconAlertOctagon size={16} className=\"text-white shrink-0\" />\n          <span className=\"paragraph-xsmall-semibold text-white\">\n            {translate('common.navigation.banners.cancelled.message')}\n          </span>\n        </div>\n        <div className=\"flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start\">\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center p-1.5 cursor-pointer\"\n            onClick={onReactivate}\n          >\n            <span className=\"paragraph-xsmall-semibold text-white underline\">\n              {translate('common.navigation.banners.cancelled.choosePlan')}\n            </span>\n          </button>\n          <button type=\"button\" className=\"cursor-pointer shrink-0\" onClick={dismiss}>\n            <IconX size={18} className=\"text-red-200\" />\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAyCQ,SACE,KADF;AAvCR,SAAS,UAAU,WAAW,mBAAmB;AACjD,SAAS,kBAAkB,aAAa;AACxC,SAAS,6BAA6B;AACtC,SAAS,sBAAsB;AAC/B,SAAS,iCAAiC;AAC1C,SAAS,uBAAuB;AAMzB,SAAS,4BAA4B,EAAE,aAAa,GAAqC;AAC9F,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,MAAM,EAAE,MAAM,CAAC,YAAY,IAAI,CAAC,EAAE,IAAI,CAAC,EAAE,IAAI,sBAAsB;AAC3E,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAC3C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,YAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,YAAY,IAAI,GAAG,EAAE;AACpD,WAAO,MAAM,aAAa,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAAY,MAAM,WAAW,KAAK,GAAG,CAAC,CAAC;AAEvD,MAAI,CAAC,QAAS,QAAO;AACrB,MAAI,cAAc,SAAS,UAAU,cAAc,SAAS,QAAS,QAAO;AAE5E,QAAM,QAAQ,eAAe,oBAAI,KAAK,CAAC;AACvC,QAAM,aAAa,0BAA0B,YAAY;AAGzD,MAAI,CAAC,SAAS,CAAC,cAAc,CAAC,cAAc,kBAAmB,QAAO;AACtE,MAAI,MAAM,QAAQ,IAAI,WAAW,QAAQ,EAAG,QAAO;AAEnD,SACE,oBAAC,SAAI,WAAU,wGACb;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,8NAA8N,WAAW,mCAAmC,mBAAmB;AAAA,MAE1S;AAAA,6BAAC,SAAI,WAAU,mDACb;AAAA,8BAAC,oBAAiB,MAAM,IAAI,WAAU,uBAAsB;AAAA,UAC5D,oBAAC,UAAK,WAAU,wCACb,oBAAU,6CAA6C,GAC1D;AAAA,WACF;AAAA,QACA,qBAAC,SAAI,WAAU,+EACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAET,8BAAC,UAAK,WAAU,kDACb,oBAAU,gDAAgD,GAC7D;AAAA;AAAA,UACF;AAAA,UACA,oBAAC,YAAO,MAAK,UAAS,WAAU,2BAA0B,SAAS,SACjE,8BAAC,SAAM,MAAM,IAAI,WAAU,gBAAe,GAC5C;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}

package/dist/components/navigation/OverdueInvoiceBanner.mjs

@@ -2,7 +2,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useCallback } from "react";
 import { IconAlertTriangle, IconX } from "@tabler/icons-react";
+import { useTranslations } from "next-intl";
 function OverdueInvoiceBanner({ onDetails }) {
+  const translate = useTranslations();
   const [visible, setVisible] = useState(true);
   const [animated, setAnimated] = useState(false);
   useEffect(() => {
@@ -18,7 +20,7 @@ function OverdueInvoiceBanner({ onDetails }) {
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1 w-full sm:w-auto", children: [
           /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16, className: "text-white shrink-0" }),
-          /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white", children: "Sua assinatura est\xE1 atrasada e suas p\xE1ginas podem ser retiradas do ar a qualquer momento." })
+          /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white", children: translate("common.navigation.banners.overdue.message") })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start", children: [
           /* @__PURE__ */ jsx(
@@ -27,7 +29,7 @@ function OverdueInvoiceBanner({ onDetails }) {
               type: "button",
               className: "flex items-center justify-center p-1.5 cursor-pointer",
               onClick: onDetails,
-              children: /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white underline", children: "Detalhes" })
+              children: /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white underline", children: translate("common.navigation.banners.overdue.details") })
             }
           ),
           /* @__PURE__ */ jsx("button", { type: "button", className: "cursor-pointer shrink-0", onClick: dismiss, children: /* @__PURE__ */ jsx(IconX, { size: 18, className: "text-orange-200" }) })

package/dist/components/navigation/OverdueInvoiceBanner.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/navigation/OverdueInvoiceBanner.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect, useCallback } from 'react';\nimport { IconAlertTriangle, IconX } from '@tabler/icons-react';\n\ninterface OverdueInvoiceBannerProps {\n  onDetails?: () => void;\n}\n\nexport function OverdueInvoiceBanner({ onDetails }: OverdueInvoiceBannerProps) {\n  const [visible, setVisible] = useState(true);\n  const [animated, setAnimated] = useState(false);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setAnimated(true), 50);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const dismiss = useCallback(() => setVisible(false), []);\n\n  if (!visible) return null;\n\n  return (\n    <div className=\"fixed top-[80px] md:top-0 left-0 right-0 z-[60] flex justify-center pointer-events-none px-4 lg:px-0\">\n      <div\n        className={`flex flex-col sm:flex-row items-start sm:items-center justify-between bg-orange-500 rounded-lg px-3 py-2 sm:py-1 w-full lg:w-[805px] max-w-full pointer-events-auto transition-transform duration-500 ease-out gap-2 sm:gap-0 ${animated ? 'translate-y-0 md:translate-y-9' : '-translate-y-full'}`}\n      >\n        <div className=\"flex items-center gap-2 flex-1 w-full sm:w-auto\">\n          <IconAlertTriangle size={16} className=\"text-white shrink-0\" />\n          <span className=\"paragraph-xsmall-semibold text-white\">\n            Sua assinatura está atrasada e suas páginas podem ser retiradas do ar a qualquer momento.\n          </span>\n        </div>\n        <div className=\"flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start\">\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center p-1.5 cursor-pointer\"\n            onClick={onDetails}\n          >\n            <span className=\"paragraph-xsmall-semibold text-white underline\">Detalhes</span>\n          </button>\n          <button type=\"button\" className=\"cursor-pointer shrink-0\" onClick={dismiss}>\n            <IconX size={18} className=\"text-orange-200\" />\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA2BQ,SACE,KADF;AAzBR,SAAS,UAAU,WAAW,mBAAmB;AACjD,SAAS,mBAAmB,aAAa;AAMlC,SAAS,qBAAqB,EAAE,UAAU,GAA8B;AAC7E,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAC3C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,YAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,YAAY,IAAI,GAAG,EAAE;AACpD,WAAO,MAAM,aAAa,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAAY,MAAM,WAAW,KAAK,GAAG,CAAC,CAAC;AAEvD,MAAI,CAAC,QAAS,QAAO;AAErB,SACE,oBAAC,SAAI,WAAU,wGACb;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iOAAiO,WAAW,mCAAmC,mBAAmB;AAAA,MAE7S;AAAA,6BAAC,SAAI,WAAU,mDACb;AAAA,8BAAC,qBAAkB,MAAM,IAAI,WAAU,uBAAsB;AAAA,UAC7D,oBAAC,UAAK,WAAU,wCAAuC,6GAEvD;AAAA,WACF;AAAA,QACA,qBAAC,SAAI,WAAU,+EACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAET,8BAAC,UAAK,WAAU,kDAAiD,sBAAQ;AAAA;AAAA,UAC3E;AAAA,UACA,oBAAC,YAAO,MAAK,UAAS,WAAU,2BAA0B,SAAS,SACjE,8BAAC,SAAM,MAAM,IAAI,WAAU,mBAAkB,GAC/C;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/navigation/OverdueInvoiceBanner.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect, useCallback } from 'react';\nimport { IconAlertTriangle, IconX } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\n\ninterface OverdueInvoiceBannerProps {\n  onDetails?: () => void;\n}\n\nexport function OverdueInvoiceBanner({ onDetails }: OverdueInvoiceBannerProps) {\n  const translate = useTranslations();\n  const [visible, setVisible] = useState(true);\n  const [animated, setAnimated] = useState(false);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setAnimated(true), 50);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const dismiss = useCallback(() => setVisible(false), []);\n\n  if (!visible) return null;\n\n  return (\n    <div className=\"fixed top-[80px] md:top-0 left-0 right-0 z-[60] flex justify-center pointer-events-none px-4 lg:px-0\">\n      <div\n        className={`flex flex-col sm:flex-row items-start sm:items-center justify-between bg-orange-500 rounded-lg px-3 py-2 sm:py-1 w-full lg:w-[805px] max-w-full pointer-events-auto transition-transform duration-500 ease-out gap-2 sm:gap-0 ${animated ? 'translate-y-0 md:translate-y-9' : '-translate-y-full'}`}\n      >\n        <div className=\"flex items-center gap-2 flex-1 w-full sm:w-auto\">\n          <IconAlertTriangle size={16} className=\"text-white shrink-0\" />\n          <span className=\"paragraph-xsmall-semibold text-white\">\n            {translate('common.navigation.banners.overdue.message')}\n          </span>\n        </div>\n        <div className=\"flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start\">\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center p-1.5 cursor-pointer\"\n            onClick={onDetails}\n          >\n            <span className=\"paragraph-xsmall-semibold text-white underline\">{translate('common.navigation.banners.overdue.details')}</span>\n          </button>\n          <button type=\"button\" className=\"cursor-pointer shrink-0\" onClick={dismiss}>\n            <IconX size={18} className=\"text-orange-200\" />\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA6BQ,SACE,KADF;AA3BR,SAAS,UAAU,WAAW,mBAAmB;AACjD,SAAS,mBAAmB,aAAa;AACzC,SAAS,uBAAuB;AAMzB,SAAS,qBAAqB,EAAE,UAAU,GAA8B;AAC7E,QAAM,YAAY,gBAAgB;AAClC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAC3C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,YAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,YAAY,IAAI,GAAG,EAAE;AACpD,WAAO,MAAM,aAAa,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAAY,MAAM,WAAW,KAAK,GAAG,CAAC,CAAC;AAEvD,MAAI,CAAC,QAAS,QAAO;AAErB,SACE,oBAAC,SAAI,WAAU,wGACb;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iOAAiO,WAAW,mCAAmC,mBAAmB;AAAA,MAE7S;AAAA,6BAAC,SAAI,WAAU,mDACb;AAAA,8BAAC,qBAAkB,MAAM,IAAI,WAAU,uBAAsB;AAAA,UAC7D,oBAAC,UAAK,WAAU,wCACb,oBAAU,2CAA2C,GACxD;AAAA,WACF;AAAA,QACA,qBAAC,SAAI,WAAU,+EACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAET,8BAAC,UAAK,WAAU,kDAAkD,oBAAU,2CAA2C,GAAE;AAAA;AAAA,UAC3H;AAAA,UACA,oBAAC,YAAO,MAAK,UAAS,WAAU,2BAA0B,SAAS,SACjE,8BAAC,SAAM,MAAM,IAAI,WAAU,mBAAkB,GAC/C;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}

package/dist/components/navigation/PendingCancellationBanner.mjs

@@ -3,10 +3,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useCallback } from "react";
 import { IconAlertTriangle, IconX } from "@tabler/icons-react";
 import { formatShortDate } from "../../infra/utils/date";
+import { useTranslations } from "next-intl";
 function PendingCancellationBanner({
   limitDate,
   onReactivate
 }) {
+  const translate = useTranslations();
   const [visible, setVisible] = useState(true);
   const [animated, setAnimated] = useState(false);
   useEffect(() => {
@@ -23,11 +25,7 @@ function PendingCancellationBanner({
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1 w-full sm:w-auto", children: [
           /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16, className: "text-zinc-950 shrink-0" }),
-          /* @__PURE__ */ jsxs("span", { className: "paragraph-xsmall-semibold text-zinc-950", children: [
-            "Sua assinatura foi cancelada, voc\xEA possui at\xE9 ",
-            formattedLimitDate,
-            " com suas p\xE1ginas online."
-          ] })
+          /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-zinc-950", children: translate("common.navigation.banners.pending.message", { limitDate: formattedLimitDate ?? "" }) })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 w-full sm:w-auto justify-between sm:justify-start", children: [
           /* @__PURE__ */ jsx(
@@ -36,7 +34,7 @@ function PendingCancellationBanner({
               type: "button",
               className: "flex items-center justify-center p-1.5 cursor-pointer",
               onClick: onReactivate,
-              children: /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-zinc-950 underline", children: "Reativar assinatura" })
+              children: /* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-zinc-950 underline", children: translate("common.navigation.banners.pending.reactivate") })
             }
           ),
           /* @__PURE__ */ jsx("button", { type: "button", className: "cursor-pointer shrink-0", onClick: dismiss, children: /* @__PURE__ */ jsx(IconX, { size: 18, className: "text-zinc-700" }) })