@greatapps/common 1.1.792 → 1.1.794

package/dist/components/account/AccountHubLinkHandler.mjs

@@ -3,9 +3,13 @@ import { useEffect, useRef } from "react";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import useAccountHubActions from "./hooks/useAccountHubActions";
 import {
+  ACCOUNT_HUB_CHARGE_PARAM,
   ACCOUNT_HUB_COUPON_PARAM,
   ACCOUNT_HUB_FLOW_PARAM,
-  ACCOUNT_HUB_SECTION_PARAM
+  ACCOUNT_HUB_PERIOD_PARAM,
+  ACCOUNT_HUB_PLAN_PARAM,
+  ACCOUNT_HUB_SECTION_PARAM,
+  ACCOUNT_HUB_TOTAL_PARAM
 } from "../../modules/accounts/constants/account-hub-link.constants";
 import { parseAccountHubLink } from "../../modules/accounts/utils/parse-account-hub-link";
 function AccountHubLinkHandler() {
@@ -22,9 +26,17 @@ function AccountHubLinkHandler() {
     if (!link) return;
     openLink(link);
     const remaining = new URLSearchParams(query);
-    remaining.delete(ACCOUNT_HUB_SECTION_PARAM);
-    remaining.delete(ACCOUNT_HUB_FLOW_PARAM);
-    remaining.delete(ACCOUNT_HUB_COUPON_PARAM);
+    for (const param of [
+      ACCOUNT_HUB_SECTION_PARAM,
+      ACCOUNT_HUB_FLOW_PARAM,
+      ACCOUNT_HUB_COUPON_PARAM,
+      ACCOUNT_HUB_PLAN_PARAM,
+      ACCOUNT_HUB_TOTAL_PARAM,
+      ACCOUNT_HUB_PERIOD_PARAM,
+      ACCOUNT_HUB_CHARGE_PARAM
+    ]) {
+      remaining.delete(param);
+    }
     const remainingQuery = remaining.toString();
     router.replace(remainingQuery ? `${pathname}?${remainingQuery}` : pathname, { scroll: false });
   }, [query, pathname, router, openLink]);

package/dist/components/account/AccountHubLinkHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/account/AccountHubLinkHandler.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef } from 'react';\nimport { usePathname, useRouter, useSearchParams } from 'next/navigation';\nimport useAccountHubActions from './hooks/useAccountHubActions';\nimport {\n  ACCOUNT_HUB_COUPON_PARAM,\n  ACCOUNT_HUB_FLOW_PARAM,\n  ACCOUNT_HUB_SECTION_PARAM,\n} from '../../modules/accounts/constants/account-hub-link.constants';\nimport { parseAccountHubLink } from '../../modules/accounts/utils/parse-account-hub-link';\n\nexport function AccountHubLinkHandler() {\n  const searchParams = useSearchParams();\n  const pathname = usePathname();\n  const router = useRouter();\n  const { openLink } = useAccountHubActions();\n  const handledQueryRef = useRef<string | null>(null);\n  const query = searchParams.toString();\n\n  useEffect(() => {\n    if (handledQueryRef.current === query) return;\n    handledQueryRef.current = query;\n\n    const link = parseAccountHubLink(new URLSearchParams(query));\n    if (!link) return;\n\n    openLink(link);\n\n    const remaining = new URLSearchParams(query);\n    remaining.delete(ACCOUNT_HUB_SECTION_PARAM);\n    remaining.delete(ACCOUNT_HUB_FLOW_PARAM);\n    remaining.delete(ACCOUNT_HUB_COUPON_PARAM);\n    const remainingQuery = remaining.toString();\n    router.replace(remainingQuery ? `${pathname}?${remainingQuery}` : pathname, { scroll: false });\n  }, [query, pathname, router, openLink]);\n\n  return null;\n}\n"],"mappings":";AAEA,SAAS,WAAW,cAAc;AAClC,SAAS,aAAa,WAAW,uBAAuB;AACxD,OAAO,0BAA0B;AACjC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,2BAA2B;AAE7B,SAAS,wBAAwB;AACtC,QAAM,eAAe,gBAAgB;AACrC,QAAM,WAAW,YAAY;AAC7B,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,SAAS,IAAI,qBAAqB;AAC1C,QAAM,kBAAkB,OAAsB,IAAI;AAClD,QAAM,QAAQ,aAAa,SAAS;AAEpC,YAAU,MAAM;AACd,QAAI,gBAAgB,YAAY,MAAO;AACvC,oBAAgB,UAAU;AAE1B,UAAM,OAAO,oBAAoB,IAAI,gBAAgB,KAAK,CAAC;AAC3D,QAAI,CAAC,KAAM;AAEX,aAAS,IAAI;AAEb,UAAM,YAAY,IAAI,gBAAgB,KAAK;AAC3C,cAAU,OAAO,yBAAyB;AAC1C,cAAU,OAAO,sBAAsB;AACvC,cAAU,OAAO,wBAAwB;AACzC,UAAM,iBAAiB,UAAU,SAAS;AAC1C,WAAO,QAAQ,iBAAiB,GAAG,QAAQ,IAAI,cAAc,KAAK,UAAU,EAAE,QAAQ,MAAM,CAAC;AAAA,EAC/F,GAAG,CAAC,OAAO,UAAU,QAAQ,QAAQ,CAAC;AAEtC,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/components/account/AccountHubLinkHandler.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef } from 'react';\nimport { usePathname, useRouter, useSearchParams } from 'next/navigation';\nimport useAccountHubActions from './hooks/useAccountHubActions';\nimport {\n  ACCOUNT_HUB_CHARGE_PARAM,\n  ACCOUNT_HUB_COUPON_PARAM,\n  ACCOUNT_HUB_FLOW_PARAM,\n  ACCOUNT_HUB_PERIOD_PARAM,\n  ACCOUNT_HUB_PLAN_PARAM,\n  ACCOUNT_HUB_SECTION_PARAM,\n  ACCOUNT_HUB_TOTAL_PARAM,\n} from '../../modules/accounts/constants/account-hub-link.constants';\nimport { parseAccountHubLink } from '../../modules/accounts/utils/parse-account-hub-link';\n\nexport function AccountHubLinkHandler() {\n  const searchParams = useSearchParams();\n  const pathname = usePathname();\n  const router = useRouter();\n  const { openLink } = useAccountHubActions();\n  const handledQueryRef = useRef<string | null>(null);\n  const query = searchParams.toString();\n\n  useEffect(() => {\n    if (handledQueryRef.current === query) return;\n    handledQueryRef.current = query;\n\n    const link = parseAccountHubLink(new URLSearchParams(query));\n    if (!link) return;\n\n    openLink(link);\n\n    const remaining = new URLSearchParams(query);\n    for (const param of [\n      ACCOUNT_HUB_SECTION_PARAM,\n      ACCOUNT_HUB_FLOW_PARAM,\n      ACCOUNT_HUB_COUPON_PARAM,\n      ACCOUNT_HUB_PLAN_PARAM,\n      ACCOUNT_HUB_TOTAL_PARAM,\n      ACCOUNT_HUB_PERIOD_PARAM,\n      ACCOUNT_HUB_CHARGE_PARAM,\n    ]) {\n      remaining.delete(param);\n    }\n    const remainingQuery = remaining.toString();\n    router.replace(remainingQuery ? `${pathname}?${remainingQuery}` : pathname, { scroll: false });\n  }, [query, pathname, router, openLink]);\n\n  return null;\n}\n"],"mappings":";AAEA,SAAS,WAAW,cAAc;AAClC,SAAS,aAAa,WAAW,uBAAuB;AACxD,OAAO,0BAA0B;AACjC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,2BAA2B;AAE7B,SAAS,wBAAwB;AACtC,QAAM,eAAe,gBAAgB;AACrC,QAAM,WAAW,YAAY;AAC7B,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,SAAS,IAAI,qBAAqB;AAC1C,QAAM,kBAAkB,OAAsB,IAAI;AAClD,QAAM,QAAQ,aAAa,SAAS;AAEpC,YAAU,MAAM;AACd,QAAI,gBAAgB,YAAY,MAAO;AACvC,oBAAgB,UAAU;AAE1B,UAAM,OAAO,oBAAoB,IAAI,gBAAgB,KAAK,CAAC;AAC3D,QAAI,CAAC,KAAM;AAEX,aAAS,IAAI;AAEb,UAAM,YAAY,IAAI,gBAAgB,KAAK;AAC3C,eAAW,SAAS;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,GAAG;AACD,gBAAU,OAAO,KAAK;AAAA,IACxB;AACA,UAAM,iBAAiB,UAAU,SAAS;AAC1C,WAAO,QAAQ,iBAAiB,GAAG,QAAQ,IAAI,cAAc,KAAK,UAAU,EAAE,QAAQ,MAAM,CAAC;AAAA,EAC/F,GAAG,CAAC,OAAO,UAAU,QAAQ,QAAQ,CAAC;AAEtC,SAAO;AACT;","names":[]}

package/dist/components/account/hooks/useAccountHubActions.mjs

@@ -1,8 +1,10 @@
 "use client";
 import { AccountHubFlow } from "../../../enums/AccountHubFlow";
 import { WorkspaceSectionType } from "../../../enums/WorkspaceSectionType";
+import { useTranslations } from "next-intl";
 import { useCouponByCode } from "../../../modules/coupons/hooks/use-coupon-by-code.hook";
 import { isAccountSectionType } from "../../../modules/accounts/utils/is-account-section";
+import { getBillingPeriodSuffix } from "../../../modules/subscriptions/utils/periodicity";
 import { useExternalContracting } from "../../../providers/whitelabel.provider";
 import { useAccountModals } from "../../../store/useAccountModals";
 import { useProjectFlows } from "../../../store/useProjectFlows";
@@ -16,7 +18,9 @@ function useAccountHubActions() {
   const requestOverdueReceipt = useSubscriptionFlows((state) => state.requestOverdueReceipt);
   const openCreateProjectFlow = useProjectFlows((state) => state.openCreateProject);
   const openAddUserFlow = useTeamFlows((state) => state.openAddUser);
+  const openPaymentConfirmationFlow = useSubscriptionFlows((state) => state.openPaymentConfirmation);
   const { redirectToExternal } = useExternalContracting();
+  const translate = useTranslations();
   const { mutate: findCouponByCode } = useCouponByCode();
   const openSection = (section) => {
     if (isAccountSectionType(section)) {
@@ -59,6 +63,15 @@ function useAccountHubActions() {
     openWorkspace(WorkspaceSectionType.TEAM);
     openAddUserFlow();
   };
+  const openPaymentConfirmation = (purchase) => {
+    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);
+    openPaymentConfirmationFlow({
+      planName: purchase.planName,
+      total: purchase.total,
+      periodLabel: getBillingPeriodSuffix(purchase.billingPeriod, translate),
+      immediateChargeTotal: purchase.immediateChargeTotal
+    });
+  };
   const openLink = (link) => {
     if (link.flow === AccountHubFlow.PLANS) return openPlansCatalog(link.couponCode);
     if (link.flow === AccountHubFlow.ADDONS) return openAddons();
@@ -66,6 +79,7 @@ function useAccountHubActions() {
     if (link.flow === AccountHubFlow.RECEIPT) return openOverdueReceipt();
     if (link.flow === AccountHubFlow.CREATE_PROJECT) return openCreateProject();
     if (link.flow === AccountHubFlow.ADD_USER) return openAddUser();
+    if (link.flow === AccountHubFlow.CONFIRMATION && link.purchase) return openPaymentConfirmation(link.purchase);
     openSection(link.section);
   };
   return {
@@ -76,6 +90,7 @@ function useAccountHubActions() {
     openOverdueReceipt,
     openCreateProject,
     openAddUser,
+    openPaymentConfirmation,
     openLink
   };
 }

package/dist/components/account/hooks/useAccountHubActions.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/account/hooks/useAccountHubActions.ts"],"sourcesContent":["'use client';\n\nimport { AccountHubFlow } from '../../../enums/AccountHubFlow';\nimport { WorkspaceSectionType } from '../../../enums/WorkspaceSectionType';\nimport { useCouponByCode } from '../../../modules/coupons/hooks/use-coupon-by-code.hook';\nimport { isAccountSectionType } from '../../../modules/accounts/utils/is-account-section';\nimport type { AccountHubLink } from '../../../modules/accounts/types/account-hub-link.type';\nimport { useExternalContracting } from '../../../providers/whitelabel.provider';\nimport { useAccountModals, type MyAccountSection } from '../../../store/useAccountModals';\nimport { useProjectFlows } from '../../../store/useProjectFlows';\nimport { useSubscriptionFlows } from '../../../store/useSubscriptionFlows';\nimport { useTeamFlows } from '../../../store/useTeamFlows';\n\nexport default function useAccountHubActions() {\n  const openConfigurations = useAccountModals((state) => state.openConfigurations);\n  const openWorkspace = useAccountModals((state) => state.openWorkspace);\n  const openChangePlan = useSubscriptionFlows((state) => state.openChangePlan);\n  const openPlansCatalogFlow = useSubscriptionFlows((state) => state.openPlansCatalog);\n  const requestOverdueReceipt = useSubscriptionFlows((state) => state.requestOverdueReceipt);\n  const openCreateProjectFlow = useProjectFlows((state) => state.openCreateProject);\n  const openAddUserFlow = useTeamFlows((state) => state.openAddUser);\n  const { redirectToExternal } = useExternalContracting();\n  const { mutate: findCouponByCode } = useCouponByCode();\n\n  const openSection = (section: MyAccountSection) => {\n    if (isAccountSectionType(section)) {\n      openConfigurations(section);\n      return;\n    }\n    openWorkspace(section);\n  };\n\n  const openPlansCatalog = (couponCode?: string) => {\n    if (redirectToExternal('plans')) return;\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n\n    if (!couponCode) {\n      openPlansCatalogFlow();\n      return;\n    }\n\n    findCouponByCode(couponCode, {\n      onSuccess: (coupon) => openPlansCatalogFlow({ appliedCouponStripeData: coupon?.stripe_data }),\n      onError: () => openPlansCatalogFlow(),\n    });\n  };\n\n  const openAddons = () => {\n    if (redirectToExternal('contracting')) return;\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    openChangePlan();\n  };\n\n  const openReactivate = () => {\n    if (redirectToExternal('contracting')) return;\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    openChangePlan({ isReactivation: true });\n  };\n\n  const openOverdueReceipt = () => {\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    requestOverdueReceipt();\n  };\n\n  const openCreateProject = () => {\n    openWorkspace(WorkspaceSectionType.PROJECTS);\n    openCreateProjectFlow();\n  };\n\n  const openAddUser = () => {\n    openWorkspace(WorkspaceSectionType.TEAM);\n    openAddUserFlow();\n  };\n\n  const openLink = (link: AccountHubLink) => {\n    if (link.flow === AccountHubFlow.PLANS) return openPlansCatalog(link.couponCode);\n    if (link.flow === AccountHubFlow.ADDONS) return openAddons();\n    if (link.flow === AccountHubFlow.REACTIVATE) return openReactivate();\n    if (link.flow === AccountHubFlow.RECEIPT) return openOverdueReceipt();\n    if (link.flow === AccountHubFlow.CREATE_PROJECT) return openCreateProject();\n    if (link.flow === AccountHubFlow.ADD_USER) return openAddUser();\n    openSection(link.section);\n  };\n\n  return {\n    openSection,\n    openPlansCatalog,\n    openAddons,\n    openReactivate,\n    openOverdueReceipt,\n    openCreateProject,\n    openAddUser,\n    openLink,\n  };\n}\n"],"mappings":";AAEA,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AACrC,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AAErC,SAAS,8BAA8B;AACvC,SAAS,wBAA+C;AACxD,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,oBAAoB;AAEd,SAAR,uBAAwC;AAC7C,QAAM,qBAAqB,iBAAiB,CAAC,UAAU,MAAM,kBAAkB;AAC/E,QAAM,gBAAgB,iBAAiB,CAAC,UAAU,MAAM,aAAa;AACrE,QAAM,iBAAiB,qBAAqB,CAAC,UAAU,MAAM,cAAc;AAC3E,QAAM,uBAAuB,qBAAqB,CAAC,UAAU,MAAM,gBAAgB;AACnF,QAAM,wBAAwB,qBAAqB,CAAC,UAAU,MAAM,qBAAqB;AACzF,QAAM,wBAAwB,gBAAgB,CAAC,UAAU,MAAM,iBAAiB;AAChF,QAAM,kBAAkB,aAAa,CAAC,UAAU,MAAM,WAAW;AACjE,QAAM,EAAE,mBAAmB,IAAI,uBAAuB;AACtD,QAAM,EAAE,QAAQ,iBAAiB,IAAI,gBAAgB;AAErD,QAAM,cAAc,CAAC,YAA8B;AACjD,QAAI,qBAAqB,OAAO,GAAG;AACjC,yBAAmB,OAAO;AAC1B;AAAA,IACF;AACA,kBAAc,OAAO;AAAA,EACvB;AAEA,QAAM,mBAAmB,CAAC,eAAwB;AAChD,QAAI,mBAAmB,OAAO,EAAG;AACjC,kBAAc,qBAAqB,YAAY;AAE/C,QAAI,CAAC,YAAY;AACf,2BAAqB;AACrB;AAAA,IACF;AAEA,qBAAiB,YAAY;AAAA,MAC3B,WAAW,CAAC,WAAW,qBAAqB,EAAE,yBAAyB,QAAQ,YAAY,CAAC;AAAA,MAC5F,SAAS,MAAM,qBAAqB;AAAA,IACtC,CAAC;AAAA,EACH;AAEA,QAAM,aAAa,MAAM;AACvB,QAAI,mBAAmB,aAAa,EAAG;AACvC,kBAAc,qBAAqB,YAAY;AAC/C,mBAAe;AAAA,EACjB;AAEA,QAAM,iBAAiB,MAAM;AAC3B,QAAI,mBAAmB,aAAa,EAAG;AACvC,kBAAc,qBAAqB,YAAY;AAC/C,mBAAe,EAAE,gBAAgB,KAAK,CAAC;AAAA,EACzC;AAEA,QAAM,qBAAqB,MAAM;AAC/B,kBAAc,qBAAqB,YAAY;AAC/C,0BAAsB;AAAA,EACxB;AAEA,QAAM,oBAAoB,MAAM;AAC9B,kBAAc,qBAAqB,QAAQ;AAC3C,0BAAsB;AAAA,EACxB;AAEA,QAAM,cAAc,MAAM;AACxB,kBAAc,qBAAqB,IAAI;AACvC,oBAAgB;AAAA,EAClB;AAEA,QAAM,WAAW,CAAC,SAAyB;AACzC,QAAI,KAAK,SAAS,eAAe,MAAO,QAAO,iBAAiB,KAAK,UAAU;AAC/E,QAAI,KAAK,SAAS,eAAe,OAAQ,QAAO,WAAW;AAC3D,QAAI,KAAK,SAAS,eAAe,WAAY,QAAO,eAAe;AACnE,QAAI,KAAK,SAAS,eAAe,QAAS,QAAO,mBAAmB;AACpE,QAAI,KAAK,SAAS,eAAe,eAAgB,QAAO,kBAAkB;AAC1E,QAAI,KAAK,SAAS,eAAe,SAAU,QAAO,YAAY;AAC9D,gBAAY,KAAK,OAAO;AAAA,EAC1B;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../../src/components/account/hooks/useAccountHubActions.ts"],"sourcesContent":["'use client';\n\nimport { AccountHubFlow } from '../../../enums/AccountHubFlow';\nimport { WorkspaceSectionType } from '../../../enums/WorkspaceSectionType';\nimport { useTranslations } from 'next-intl';\nimport { useCouponByCode } from '../../../modules/coupons/hooks/use-coupon-by-code.hook';\nimport { isAccountSectionType } from '../../../modules/accounts/utils/is-account-section';\nimport type { AccountHubLink, AccountHubPurchase } from '../../../modules/accounts/types/account-hub-link.type';\nimport { getBillingPeriodSuffix } from '../../../modules/subscriptions/utils/periodicity';\nimport { useExternalContracting } from '../../../providers/whitelabel.provider';\nimport { useAccountModals, type MyAccountSection } from '../../../store/useAccountModals';\nimport { useProjectFlows } from '../../../store/useProjectFlows';\nimport { useSubscriptionFlows } from '../../../store/useSubscriptionFlows';\nimport { useTeamFlows } from '../../../store/useTeamFlows';\n\nexport default function useAccountHubActions() {\n  const openConfigurations = useAccountModals((state) => state.openConfigurations);\n  const openWorkspace = useAccountModals((state) => state.openWorkspace);\n  const openChangePlan = useSubscriptionFlows((state) => state.openChangePlan);\n  const openPlansCatalogFlow = useSubscriptionFlows((state) => state.openPlansCatalog);\n  const requestOverdueReceipt = useSubscriptionFlows((state) => state.requestOverdueReceipt);\n  const openCreateProjectFlow = useProjectFlows((state) => state.openCreateProject);\n  const openAddUserFlow = useTeamFlows((state) => state.openAddUser);\n  const openPaymentConfirmationFlow = useSubscriptionFlows((state) => state.openPaymentConfirmation);\n  const { redirectToExternal } = useExternalContracting();\n  const translate = useTranslations();\n  const { mutate: findCouponByCode } = useCouponByCode();\n\n  const openSection = (section: MyAccountSection) => {\n    if (isAccountSectionType(section)) {\n      openConfigurations(section);\n      return;\n    }\n    openWorkspace(section);\n  };\n\n  const openPlansCatalog = (couponCode?: string) => {\n    if (redirectToExternal('plans')) return;\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n\n    if (!couponCode) {\n      openPlansCatalogFlow();\n      return;\n    }\n\n    findCouponByCode(couponCode, {\n      onSuccess: (coupon) => openPlansCatalogFlow({ appliedCouponStripeData: coupon?.stripe_data }),\n      onError: () => openPlansCatalogFlow(),\n    });\n  };\n\n  const openAddons = () => {\n    if (redirectToExternal('contracting')) return;\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    openChangePlan();\n  };\n\n  const openReactivate = () => {\n    if (redirectToExternal('contracting')) return;\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    openChangePlan({ isReactivation: true });\n  };\n\n  const openOverdueReceipt = () => {\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    requestOverdueReceipt();\n  };\n\n  const openCreateProject = () => {\n    openWorkspace(WorkspaceSectionType.PROJECTS);\n    openCreateProjectFlow();\n  };\n\n  const openAddUser = () => {\n    openWorkspace(WorkspaceSectionType.TEAM);\n    openAddUserFlow();\n  };\n\n  const openPaymentConfirmation = (purchase: AccountHubPurchase) => {\n    openWorkspace(WorkspaceSectionType.SUBSCRIPTION);\n    openPaymentConfirmationFlow({\n      planName: purchase.planName,\n      total: purchase.total,\n      periodLabel: getBillingPeriodSuffix(purchase.billingPeriod, translate),\n      immediateChargeTotal: purchase.immediateChargeTotal,\n    });\n  };\n\n  const openLink = (link: AccountHubLink) => {\n    if (link.flow === AccountHubFlow.PLANS) return openPlansCatalog(link.couponCode);\n    if (link.flow === AccountHubFlow.ADDONS) return openAddons();\n    if (link.flow === AccountHubFlow.REACTIVATE) return openReactivate();\n    if (link.flow === AccountHubFlow.RECEIPT) return openOverdueReceipt();\n    if (link.flow === AccountHubFlow.CREATE_PROJECT) return openCreateProject();\n    if (link.flow === AccountHubFlow.ADD_USER) return openAddUser();\n    if (link.flow === AccountHubFlow.CONFIRMATION && link.purchase) return openPaymentConfirmation(link.purchase);\n    openSection(link.section);\n  };\n\n  return {\n    openSection,\n    openPlansCatalog,\n    openAddons,\n    openReactivate,\n    openOverdueReceipt,\n    openCreateProject,\n    openAddUser,\n    openPaymentConfirmation,\n    openLink,\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/components/account/sections/subscription/PaymentConfirmationDialog.mjs

@@ -1,8 +1,9 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { IconCircleCheckFilled, IconInfoCircle } from "@tabler/icons-react";
+import { IconInfoCircle } from "@tabler/icons-react";
 import { useTranslations } from "next-intl";
 import { Dialog, DialogContent, DialogTitle } from "../../../ui/overlay/Dialog";
+import { SuccessConfettiIcon } from "../../../ui/data-display/SuccessConfettiIcon";
 import { useCurrencyFormatter } from "../../../../modules/accounts/hooks/use-currency-formatter.hook";
 import { useIsDefaultWhitelabel } from "../../../../providers/whitelabel.provider";
 import { cn } from "../../../../infra/utils/clsx";
@@ -18,7 +19,7 @@ function PaymentConfirmationDialog() {
   const immediateChargeTotal = confirmation?.immediateChargeTotal;
   const hasImmediateCharge = immediateChargeTotal != null && immediateChargeTotal > 0;
   return /* @__PURE__ */ jsx(Dialog, { open: !!confirmation, onOpenChange: (nextOpen) => !nextOpen && close(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "flex flex-col p-4 lg:p-6 gap-4 items-center max-w-[calc(100%-32px)]! h-auto! rounded-lg border top-[50%]! left-[50%]! right-auto! bottom-auto! translate-x-[-50%]! translate-y-[-50%]! lg:max-w-[386px]!", children: [
-    /* @__PURE__ */ jsx(IconCircleCheckFilled, { size: 56, className: "text-green-500" }),
+    /* @__PURE__ */ jsx(SuccessConfettiIcon, {}),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 text-center", children: [
       /* @__PURE__ */ jsx(DialogTitle, { className: "paragraph-medium-semibold text-zinc-950", children: translate("subscriptionConfirmed") }),
       /* @__PURE__ */ jsxs("p", { className: "paragraph-small-regular text-zinc-500", children: [

package/dist/components/account/sections/subscription/PaymentConfirmationDialog.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/account/sections/subscription/PaymentConfirmationDialog.tsx"],"sourcesContent":["'use client';\n\nimport { IconCircleCheckFilled, IconInfoCircle } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { Dialog, DialogContent, DialogTitle } from '../../../ui/overlay/Dialog';\nimport { useCurrencyFormatter } from '../../../../modules/accounts/hooks/use-currency-formatter.hook';\nimport { useIsDefaultWhitelabel } from '../../../../providers/whitelabel.provider';\nimport { cn } from '../../../../infra/utils/clsx';\nimport { useSubscriptionFlows } from '../../../../store/useSubscriptionFlows';\n\n/** Confirmação depois da cobrança no cartão da troca de plano. */\nexport function PaymentConfirmationDialog() {\n  const translate = useTranslations('common.account.workspace.subscription.paymentConfirmation');\n  const { formatCurrencyNumber } = useCurrencyFormatter();\n  const isDefaultWhitelabel = useIsDefaultWhitelabel();\n\n  const confirmation = useSubscriptionFlows((state) => state.paymentConfirmation);\n  const close = useSubscriptionFlows((state) => state.closePaymentConfirmation);\n\n  const formattedTotal = formatCurrencyNumber(confirmation?.total ?? 0);\n  const priceDisplay = confirmation?.periodLabel\n    ? `${formattedTotal}${confirmation.periodLabel}`\n    : formattedTotal;\n  const immediateChargeTotal = confirmation?.immediateChargeTotal;\n  const hasImmediateCharge = immediateChargeTotal != null && immediateChargeTotal > 0;\n\n  return (\n    <Dialog open={!!confirmation} onOpenChange={(nextOpen) => !nextOpen && close()}>\n      <DialogContent className=\"flex flex-col p-4 lg:p-6 gap-4 items-center max-w-[calc(100%-32px)]! h-auto! rounded-lg border top-[50%]! left-[50%]! right-auto! bottom-auto! translate-x-[-50%]! translate-y-[-50%]! lg:max-w-[386px]!\">\n        <IconCircleCheckFilled size={56} className=\"text-green-500\" />\n\n        <div className=\"flex flex-col gap-2 text-center\">\n          <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n            {translate('subscriptionConfirmed')}\n          </DialogTitle>\n          <p className=\"paragraph-small-regular text-zinc-500\">\n            {translate.rich('youSubscribed', {\n              planName: confirmation?.planName ?? '',\n              b: (chunks) => <span className=\"font-semibold text-zinc-950\">{chunks}</span>,\n            })}\n            <br />\n            {translate.rich('price', {\n              price: priceDisplay,\n              b: (chunks) => <span className=\"font-semibold text-zinc-950\">{chunks}</span>,\n            })}\n            {hasImmediateCharge && (\n              <>\n                <br />\n                {translate.rich('immediateCharge', {\n                  amount: formatCurrencyNumber(immediateChargeTotal),\n                  b: (chunks) => <span className=\"font-semibold text-zinc-950\">{chunks}</span>,\n                })}\n              </>\n            )}\n          </p>\n        </div>\n\n        <div\n          className={cn(\n            'flex items-center gap-3 p-4 rounded-lg w-full',\n            isDefaultWhitelabel ? 'bg-cyan-50' : 'bg-zinc-50'\n          )}\n        >\n          <IconInfoCircle size={16} className=\"shrink-0 text-zinc-950\" />\n          <p className=\"paragraph-small-regular text-zinc-950\">{translate('manageInfo')}</p>\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";AA6BQ,SAiBM,UAjBN,KAiBM,YAjBN;AA3BR,SAAS,uBAAuB,sBAAsB;AACtD,SAAS,uBAAuB;AAChC,SAAS,QAAQ,eAAe,mBAAmB;AACnD,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AACvC,SAAS,UAAU;AACnB,SAAS,4BAA4B;AAG9B,SAAS,4BAA4B;AAC1C,QAAM,YAAY,gBAAgB,2DAA2D;AAC7F,QAAM,EAAE,qBAAqB,IAAI,qBAAqB;AACtD,QAAM,sBAAsB,uBAAuB;AAEnD,QAAM,eAAe,qBAAqB,CAAC,UAAU,MAAM,mBAAmB;AAC9E,QAAM,QAAQ,qBAAqB,CAAC,UAAU,MAAM,wBAAwB;AAE5E,QAAM,iBAAiB,qBAAqB,cAAc,SAAS,CAAC;AACpE,QAAM,eAAe,cAAc,cAC/B,GAAG,cAAc,GAAG,aAAa,WAAW,KAC5C;AACJ,QAAM,uBAAuB,cAAc;AAC3C,QAAM,qBAAqB,wBAAwB,QAAQ,uBAAuB;AAElF,SACE,oBAAC,UAAO,MAAM,CAAC,CAAC,cAAc,cAAc,CAAC,aAAa,CAAC,YAAY,MAAM,GAC3E,+BAAC,iBAAc,WAAU,4MACvB;AAAA,wBAAC,yBAAsB,MAAM,IAAI,WAAU,kBAAiB;AAAA,IAE5D,qBAAC,SAAI,WAAU,mCACb;AAAA,0BAAC,eAAY,WAAU,2CACpB,oBAAU,uBAAuB,GACpC;AAAA,MACA,qBAAC,OAAE,WAAU,yCACV;AAAA,kBAAU,KAAK,iBAAiB;AAAA,UAC/B,UAAU,cAAc,YAAY;AAAA,UACpC,GAAG,CAAC,WAAW,oBAAC,UAAK,WAAU,+BAA+B,kBAAO;AAAA,QACvE,CAAC;AAAA,QACD,oBAAC,QAAG;AAAA,QACH,UAAU,KAAK,SAAS;AAAA,UACvB,OAAO;AAAA,UACP,GAAG,CAAC,WAAW,oBAAC,UAAK,WAAU,+BAA+B,kBAAO;AAAA,QACvE,CAAC;AAAA,QACA,sBACC,iCACE;AAAA,8BAAC,QAAG;AAAA,UACH,UAAU,KAAK,mBAAmB;AAAA,YACjC,QAAQ,qBAAqB,oBAAoB;AAAA,YACjD,GAAG,CAAC,WAAW,oBAAC,UAAK,WAAU,+BAA+B,kBAAO;AAAA,UACvE,CAAC;AAAA,WACH;AAAA,SAEJ;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,sBAAsB,eAAe;AAAA,QACvC;AAAA,QAEA;AAAA,8BAAC,kBAAe,MAAM,IAAI,WAAU,0BAAyB;AAAA,UAC7D,oBAAC,OAAE,WAAU,yCAAyC,oBAAU,YAAY,GAAE;AAAA;AAAA;AAAA,IAChF;AAAA,KACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../../../src/components/account/sections/subscription/PaymentConfirmationDialog.tsx"],"sourcesContent":["'use client';\n\nimport { IconInfoCircle } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { Dialog, DialogContent, DialogTitle } from '../../../ui/overlay/Dialog';\nimport { SuccessConfettiIcon } from '../../../ui/data-display/SuccessConfettiIcon';\nimport { useCurrencyFormatter } from '../../../../modules/accounts/hooks/use-currency-formatter.hook';\nimport { useIsDefaultWhitelabel } from '../../../../providers/whitelabel.provider';\nimport { cn } from '../../../../infra/utils/clsx';\nimport { useSubscriptionFlows } from '../../../../store/useSubscriptionFlows';\n\n/** Confirmação depois da cobrança no cartão da troca de plano. */\nexport function PaymentConfirmationDialog() {\n  const translate = useTranslations('common.account.workspace.subscription.paymentConfirmation');\n  const { formatCurrencyNumber } = useCurrencyFormatter();\n  const isDefaultWhitelabel = useIsDefaultWhitelabel();\n\n  const confirmation = useSubscriptionFlows((state) => state.paymentConfirmation);\n  const close = useSubscriptionFlows((state) => state.closePaymentConfirmation);\n\n  const formattedTotal = formatCurrencyNumber(confirmation?.total ?? 0);\n  const priceDisplay = confirmation?.periodLabel\n    ? `${formattedTotal}${confirmation.periodLabel}`\n    : formattedTotal;\n  const immediateChargeTotal = confirmation?.immediateChargeTotal;\n  const hasImmediateCharge = immediateChargeTotal != null && immediateChargeTotal > 0;\n\n  return (\n    <Dialog open={!!confirmation} onOpenChange={(nextOpen) => !nextOpen && close()}>\n      <DialogContent className=\"flex flex-col p-4 lg:p-6 gap-4 items-center max-w-[calc(100%-32px)]! h-auto! rounded-lg border top-[50%]! left-[50%]! right-auto! bottom-auto! translate-x-[-50%]! translate-y-[-50%]! lg:max-w-[386px]!\">\n        <SuccessConfettiIcon />\n\n        <div className=\"flex flex-col gap-2 text-center\">\n          <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n            {translate('subscriptionConfirmed')}\n          </DialogTitle>\n          <p className=\"paragraph-small-regular text-zinc-500\">\n            {translate.rich('youSubscribed', {\n              planName: confirmation?.planName ?? '',\n              b: (chunks) => <span className=\"font-semibold text-zinc-950\">{chunks}</span>,\n            })}\n            <br />\n            {translate.rich('price', {\n              price: priceDisplay,\n              b: (chunks) => <span className=\"font-semibold text-zinc-950\">{chunks}</span>,\n            })}\n            {hasImmediateCharge && (\n              <>\n                <br />\n                {translate.rich('immediateCharge', {\n                  amount: formatCurrencyNumber(immediateChargeTotal),\n                  b: (chunks) => <span className=\"font-semibold text-zinc-950\">{chunks}</span>,\n                })}\n              </>\n            )}\n          </p>\n        </div>\n\n        <div\n          className={cn(\n            'flex items-center gap-3 p-4 rounded-lg w-full',\n            isDefaultWhitelabel ? 'bg-cyan-50' : 'bg-zinc-50'\n          )}\n        >\n          <IconInfoCircle size={16} className=\"shrink-0 text-zinc-950\" />\n          <p className=\"paragraph-small-regular text-zinc-950\">{translate('manageInfo')}</p>\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";AA8BQ,SAiBM,UAjBN,KAiBM,YAjBN;AA5BR,SAAS,sBAAsB;AAC/B,SAAS,uBAAuB;AAChC,SAAS,QAAQ,eAAe,mBAAmB;AACnD,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AACvC,SAAS,UAAU;AACnB,SAAS,4BAA4B;AAG9B,SAAS,4BAA4B;AAC1C,QAAM,YAAY,gBAAgB,2DAA2D;AAC7F,QAAM,EAAE,qBAAqB,IAAI,qBAAqB;AACtD,QAAM,sBAAsB,uBAAuB;AAEnD,QAAM,eAAe,qBAAqB,CAAC,UAAU,MAAM,mBAAmB;AAC9E,QAAM,QAAQ,qBAAqB,CAAC,UAAU,MAAM,wBAAwB;AAE5E,QAAM,iBAAiB,qBAAqB,cAAc,SAAS,CAAC;AACpE,QAAM,eAAe,cAAc,cAC/B,GAAG,cAAc,GAAG,aAAa,WAAW,KAC5C;AACJ,QAAM,uBAAuB,cAAc;AAC3C,QAAM,qBAAqB,wBAAwB,QAAQ,uBAAuB;AAElF,SACE,oBAAC,UAAO,MAAM,CAAC,CAAC,cAAc,cAAc,CAAC,aAAa,CAAC,YAAY,MAAM,GAC3E,+BAAC,iBAAc,WAAU,4MACvB;AAAA,wBAAC,uBAAoB;AAAA,IAErB,qBAAC,SAAI,WAAU,mCACb;AAAA,0BAAC,eAAY,WAAU,2CACpB,oBAAU,uBAAuB,GACpC;AAAA,MACA,qBAAC,OAAE,WAAU,yCACV;AAAA,kBAAU,KAAK,iBAAiB;AAAA,UAC/B,UAAU,cAAc,YAAY;AAAA,UACpC,GAAG,CAAC,WAAW,oBAAC,UAAK,WAAU,+BAA+B,kBAAO;AAAA,QACvE,CAAC;AAAA,QACD,oBAAC,QAAG;AAAA,QACH,UAAU,KAAK,SAAS;AAAA,UACvB,OAAO;AAAA,UACP,GAAG,CAAC,WAAW,oBAAC,UAAK,WAAU,+BAA+B,kBAAO;AAAA,QACvE,CAAC;AAAA,QACA,sBACC,iCACE;AAAA,8BAAC,QAAG;AAAA,UACH,UAAU,KAAK,mBAAmB;AAAA,YACjC,QAAQ,qBAAqB,oBAAoB;AAAA,YACjD,GAAG,CAAC,WAAW,oBAAC,UAAK,WAAU,+BAA+B,kBAAO;AAAA,UACvE,CAAC;AAAA,WACH;AAAA,SAEJ;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,sBAAsB,eAAe;AAAA,QACvC;AAAA,QAEA;AAAA,8BAAC,kBAAe,MAAM,IAAI,WAAU,0BAAyB;AAAA,UAC7D,oBAAC,OAAE,WAAU,yCAAyC,oBAAU,YAAY,GAAE;AAAA;AAAA;AAAA,IAChF;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/components/ui/data-display/SuccessConfettiIcon.mjs

@@ -0,0 +1,148 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+const ANIMATION_CSS = `
+.gp-confetti {
+  --gp-confetti-spring: linear(0, 0.009, 0.035 2.1%, 0.141, 0.281 6.7%, 0.723 12.9%, 0.938 16.7%,
+    1.017, 1.077, 1.121, 1.149 24.3%, 1.159, 1.163, 1.161, 1.154 29.9%, 1.129 32.8%,
+    1.051 39.6%, 1.017 43.1%, 0.991, 0.977 51%, 0.974 53.8%, 0.975 57.1%, 0.997 69.8%,
+    1.003 76.9%, 1.004 83.8%, 1);
+  --gp-confetti-out: cubic-bezier(0.22, 1, 0.36, 1);
+  overflow: visible;
+}
+@supports not (animation-timing-function: linear(0, 1)) {
+  .gp-confetti { --gp-confetti-spring: cubic-bezier(0.34, 1.56, 0.64, 1); }
+}
+.gp-confetti path {
+  stroke-dasharray: var(--gp-len) calc(var(--gp-len) + 4px);
+  stroke-dashoffset: calc(var(--gp-len) + 2px);
+  transform-box: fill-box;
+  transform-origin: center;
+  opacity: 0;
+}
+.gp-confetti-seal {
+  transform-box: fill-box;
+  transform-origin: center;
+  opacity: 0;
+  transform: scale(0.4);
+}
+.gp-confetti--play .gp-confetti-seal {
+  animation:
+    gp-confetti-seal-pop 670ms var(--gp-confetti-spring) 80ms both,
+    gp-confetti-seal-breathe 3600ms ease-in-out 930ms infinite alternate;
+}
+.gp-confetti--play .gp-confetti-seal path { opacity: 1; }
+.gp-confetti--play .gp-confetti-badge {
+  animation: gp-confetti-draw 470ms var(--gp-confetti-out) 95ms both;
+}
+.gp-confetti--play .gp-confetti-check {
+  animation: gp-confetti-draw 320ms var(--gp-confetti-out) 310ms both;
+}
+.gp-confetti-piece {
+  --gp-confetti-delay: calc(375ms + var(--gp-i, 0) * 28ms);
+  --gp-confetti-drawtime: 350ms;
+}
+.gp-confetti-squiggle { --gp-confetti-drawtime: 600ms; }
+.gp-confetti--play .gp-confetti-piece {
+  animation:
+    gp-confetti-pop 735ms var(--gp-confetti-spring) var(--gp-confetti-delay) both,
+    gp-confetti-draw var(--gp-confetti-drawtime) var(--gp-confetti-out) var(--gp-confetti-delay) both,
+    gp-confetti-float var(--gp-fd, 3200ms) ease-in-out calc(var(--gp-confetti-delay) + 735ms) infinite alternate;
+}
+@keyframes gp-confetti-seal-pop { to { opacity: 1; transform: scale(1); } }
+@keyframes gp-confetti-seal-breathe { from { transform: scale(1); } to { transform: scale(1.025); } }
+@keyframes gp-confetti-draw { to { stroke-dashoffset: 0; } }
+@keyframes gp-confetti-pop {
+  from { opacity: 0; transform: translate(var(--gp-tx, 0px), var(--gp-ty, 0px)) scale(0.2) rotate(var(--gp-rot0, 0deg)); }
+  to   { opacity: var(--gp-op, 1); transform: translate(0, 0) scale(1) rotate(0deg); }
+}
+@keyframes gp-confetti-float {
+  from { opacity: var(--gp-op, 1); transform: translate(0, 0) rotate(0deg); }
+  to   { opacity: calc(var(--gp-op, 1) * 0.55); transform: translate(var(--gp-fx, 0px), var(--gp-fy, 0px)) rotate(var(--gp-fr, 0deg)); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .gp-confetti path,
+  .gp-confetti-seal { animation: none !important; }
+  .gp-confetti-seal { opacity: 1 !important; transform: none !important; }
+  .gp-confetti path {
+    opacity: var(--gp-op, 1) !important;
+    stroke-dashoffset: 0 !important;
+    transform: none !important;
+  }
+}
+`;
+const CENTER = { x: 74.5, y: 41.5 };
+const rand = (min, max) => min + Math.random() * (max - min);
+function SuccessConfettiIcon({ className }) {
+  const ref = useRef(null);
+  const [play, setPlay] = useState(false);
+  useEffect(() => {
+    const svg = ref.current;
+    if (!svg) return;
+    try {
+      svg.querySelectorAll("path").forEach((path) => {
+        path.style.setProperty("--gp-len", `${path.getTotalLength().toFixed(2)}px`);
+      });
+      Array.from(svg.querySelectorAll(".gp-confetti-piece")).map((path) => {
+        const box = path.getBBox();
+        const dx = box.x + box.width / 2 - CENTER.x;
+        const dy = box.y + box.height / 2 - CENTER.y;
+        return { path, dx, dy, dist: Math.hypot(dx, dy) };
+      }).sort((a, b) => a.dist - b.dist).forEach(({ path, dx, dy }, i) => {
+        path.style.setProperty("--gp-i", String(i));
+        path.style.setProperty("--gp-tx", `${(-dx * 0.55).toFixed(2)}px`);
+        path.style.setProperty("--gp-ty", `${(-dy * 0.55).toFixed(2)}px`);
+        path.style.setProperty("--gp-rot0", `${rand(-60, 60).toFixed(1)}deg`);
+        path.style.setProperty("--gp-fx", `${rand(-2.2, 2.2).toFixed(2)}px`);
+        path.style.setProperty("--gp-fy", `${rand(-2.6, 2.6).toFixed(2)}px`);
+        path.style.setProperty("--gp-fr", `${rand(-16, 16).toFixed(1)}deg`);
+        path.style.setProperty("--gp-fd", `${Math.round(rand(2400, 4200))}ms`);
+      });
+    } catch {
+    }
+    setPlay(true);
+  }, []);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("style", { children: ANIMATION_CSS }),
+    /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        ref,
+        width: "149",
+        height: "83",
+        viewBox: "0 0 149 83",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className: ["gp-confetti", play && "gp-confetti--play", className].filter(Boolean).join(" "),
+        "aria-hidden": true,
+        children: [
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M18.6348 28.4102C18.6348 30.574 19.9096 30.8716 21.7838 31.1393", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M109.117 41.4266C110.106 41.3745 110.639 40.9023 110.797 39.957", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M64.6035 75.1963C62.2234 77.2378 61.7986 79.4524 63.2302 82.1283", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M108.953 6.33984C106.531 6.40444 105.075 7.59006 104.965 10.072C104.898 11.5735 105.114 12.692 103.285 13.0577", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M131.021 51.2682C130.631 53.6598 129.26 54.9429 126.786 54.7178C125.289 54.5817 124.21 54.217 123.601 55.9798", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M34.1753 59.0104C33.2963 61.0245 32.8213 61.1372 30.7893 61.1213C29.7394 61.1131 28.0011 61.8028 27.5653 62.8448", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 1 }, d: "M112.314 25.2715L113.514 24.7026", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 1 }, d: "M51.492 49.2344C51.0065 49.3838 50.6337 49.7823 50.2324 50.0741", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M77.8867 9.72656C77.4011 9.87596 77.3223 10.0019 77.3223 10.0019", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M10.7246 56.0059C10.239 56.1553 10.1602 56.2812 10.1602 56.2812", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M28.3302 80.1108C28.6726 79.7356 28.6766 79.587 28.6766 79.587", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M128.043 49.0421C127.77 48.6138 127.627 48.5713 127.627 48.5713", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M135.461 29.4915C134.972 29.6314 134.891 29.7558 134.891 29.7558", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 0.4 }, d: "M52.3396 22.1222C52.0664 21.6939 51.924 21.6514 51.924 21.6514", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece", style: { "--gp-op": 1 }, d: "M45.9383 40.1115L45.1508 39.1744", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece gp-confetti-squiggle", style: { "--gp-op": 0.8 }, d: "M97.7421 69.0733C97.1523 69.9712 97.989 71.6124 98.5913 72.3132C99.7005 73.6036 100.945 73.8145 102.199 73.9149C103.234 73.9977 105.21 73.5621 105.476 72.3174C105.948 71.1367 104.935 69.8432 103.934 70.3872C102.571 71.1277 103.112 72.7192 103.73 73.7787C104.604 75.2776 105.879 76.6545 107.249 77.7108C108.333 78.5474 109.732 79.029 110.308 79.0142", stroke: "#12B76A", strokeWidth: "1.41098", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsx("path", { className: "gp-confetti-piece gp-confetti-squiggle", style: { "--gp-op": 1 }, d: "M55.1022 11.4613C55.7297 11.187 55.8499 9.89737 55.7699 9.24592C55.6225 8.04626 55.0286 7.4129 54.3908 6.83895C53.8646 6.36537 52.6539 5.803 52.0797 6.41026C51.4175 6.89618 51.5122 8.05793 52.2377 8.15673C53.2253 8.2912 53.4868 7.15184 53.5227 6.28731C53.5734 5.06421 53.367 3.74644 52.9989 2.5746C52.7073 1.64647 52.1242 0.793399 51.8104 0.565035", stroke: "#12B76A", strokeWidth: "1.12879", strokeLinecap: "round" }),
+          /* @__PURE__ */ jsxs("g", { className: "gp-confetti-seal", children: [
+            /* @__PURE__ */ jsx("path", { className: "gp-confetti-badge", fillRule: "evenodd", clipRule: "evenodd", d: "M58.1139 44.0572L60.4163 47.0706L60.9134 50.8219C61.1889 52.9028 62.8247 54.5405 64.9056 54.818L68.6666 55.3208L71.678 57.6214C73.3446 58.8949 75.6548 58.8949 77.3214 57.6214L80.3348 55.3189H80.3309L84.0842 54.8218C86.1651 54.5463 87.8028 52.9105 88.0802 50.8297L88.5812 47.0687C88.5812 47.0706 89.7449 45.5466 90.8836 44.0572C92.1572 42.3906 92.1553 40.0805 90.8836 38.4138L88.585 35.3985L88.0879 31.6472C87.8124 29.5663 86.1766 27.9286 84.0958 27.6512L80.3329 27.1502L77.3214 24.8497C75.6548 23.5761 73.3446 23.5761 71.678 24.8497L68.6646 27.1502H68.6685L64.9152 27.6492C62.8344 27.9248 61.1966 29.5605 60.9192 31.6414L60.4163 35.4024C60.4163 35.4004 59.2526 36.9245 58.1139 38.4138C56.8422 40.0785 56.8422 42.3906 58.1139 44.0572V44.0572Z", stroke: "#12B76A", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
+            /* @__PURE__ */ jsx("path", { className: "gp-confetti-check", d: "M79.9009 38.541L73.1554 45.2865L69.1035 41.2384", stroke: "#12B76A", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  SuccessConfettiIcon
+};
+//# sourceMappingURL=SuccessConfettiIcon.mjs.map

package/dist/components/ui/data-display/SuccessConfettiIcon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ui/data-display/SuccessConfettiIcon.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\n\n/**\n * Selo de sucesso com confetes — a arte de sempre, agora animada.\n *\n * A cada mount o selo entra com spring enquanto o contorno se desenha, o check risca em\n * seguida e os confetes explodem do centro pra fora (os mais próximos primeiro), desenhando\n * o traço no voo; depois ficam flutuando devagar, cada um no seu ritmo.\n *\n * ANIMAÇÃO: CSS puro injetado pelo próprio componente (mesmo padrão do `ImageCropModal`), e\n * não classes vindas do `globals.css` de cada app como no `AiCreditsOfferModal`. Aqui isso\n * importa: é um ícone folha que qualquer app pode renderizar, então carregar o CSS junto\n * evita ter que replicar um bloco de keyframes nos quatro consumidores e mantê-los em sincronia.\n *\n * Comprimento de traço e vetor de explosão dependem da geometria de cada path, então são\n * medidos no cliente (`getTotalLength`/`getBBox`) e injetados como CSS vars por elemento. Só\n * ligamos a classe de play depois de medir — antes disso os traços ficam invisíveis, o que\n * também deixa o `useEffect` (em vez de `useLayoutEffect`) seguro: não há flash de conteúdo\n * não animado, e a lib não precisa supor se o consumidor renderiza no servidor.\n */\n\nconst ANIMATION_CSS = `\n.gp-confetti {\n  --gp-confetti-spring: linear(0, 0.009, 0.035 2.1%, 0.141, 0.281 6.7%, 0.723 12.9%, 0.938 16.7%,\n    1.017, 1.077, 1.121, 1.149 24.3%, 1.159, 1.163, 1.161, 1.154 29.9%, 1.129 32.8%,\n    1.051 39.6%, 1.017 43.1%, 0.991, 0.977 51%, 0.974 53.8%, 0.975 57.1%, 0.997 69.8%,\n    1.003 76.9%, 1.004 83.8%, 1);\n  --gp-confetti-out: cubic-bezier(0.22, 1, 0.36, 1);\n  overflow: visible;\n}\n@supports not (animation-timing-function: linear(0, 1)) {\n  .gp-confetti { --gp-confetti-spring: cubic-bezier(0.34, 1.56, 0.64, 1); }\n}\n.gp-confetti path {\n  stroke-dasharray: var(--gp-len) calc(var(--gp-len) + 4px);\n  stroke-dashoffset: calc(var(--gp-len) + 2px);\n  transform-box: fill-box;\n  transform-origin: center;\n  opacity: 0;\n}\n.gp-confetti-seal {\n  transform-box: fill-box;\n  transform-origin: center;\n  opacity: 0;\n  transform: scale(0.4);\n}\n.gp-confetti--play .gp-confetti-seal {\n  animation:\n    gp-confetti-seal-pop 670ms var(--gp-confetti-spring) 80ms both,\n    gp-confetti-seal-breathe 3600ms ease-in-out 930ms infinite alternate;\n}\n.gp-confetti--play .gp-confetti-seal path { opacity: 1; }\n.gp-confetti--play .gp-confetti-badge {\n  animation: gp-confetti-draw 470ms var(--gp-confetti-out) 95ms both;\n}\n.gp-confetti--play .gp-confetti-check {\n  animation: gp-confetti-draw 320ms var(--gp-confetti-out) 310ms both;\n}\n.gp-confetti-piece {\n  --gp-confetti-delay: calc(375ms + var(--gp-i, 0) * 28ms);\n  --gp-confetti-drawtime: 350ms;\n}\n.gp-confetti-squiggle { --gp-confetti-drawtime: 600ms; }\n.gp-confetti--play .gp-confetti-piece {\n  animation:\n    gp-confetti-pop 735ms var(--gp-confetti-spring) var(--gp-confetti-delay) both,\n    gp-confetti-draw var(--gp-confetti-drawtime) var(--gp-confetti-out) var(--gp-confetti-delay) both,\n    gp-confetti-float var(--gp-fd, 3200ms) ease-in-out calc(var(--gp-confetti-delay) + 735ms) infinite alternate;\n}\n@keyframes gp-confetti-seal-pop { to { opacity: 1; transform: scale(1); } }\n@keyframes gp-confetti-seal-breathe { from { transform: scale(1); } to { transform: scale(1.025); } }\n@keyframes gp-confetti-draw { to { stroke-dashoffset: 0; } }\n@keyframes gp-confetti-pop {\n  from { opacity: 0; transform: translate(var(--gp-tx, 0px), var(--gp-ty, 0px)) scale(0.2) rotate(var(--gp-rot0, 0deg)); }\n  to   { opacity: var(--gp-op, 1); transform: translate(0, 0) scale(1) rotate(0deg); }\n}\n@keyframes gp-confetti-float {\n  from { opacity: var(--gp-op, 1); transform: translate(0, 0) rotate(0deg); }\n  to   { opacity: calc(var(--gp-op, 1) * 0.55); transform: translate(var(--gp-fx, 0px), var(--gp-fy, 0px)) rotate(var(--gp-fr, 0deg)); }\n}\n@media (prefers-reduced-motion: reduce) {\n  .gp-confetti path,\n  .gp-confetti-seal { animation: none !important; }\n  .gp-confetti-seal { opacity: 1 !important; transform: none !important; }\n  .gp-confetti path {\n    opacity: var(--gp-op, 1) !important;\n    stroke-dashoffset: 0 !important;\n    transform: none !important;\n  }\n}\n`;\n\n/** Centro do selo no viewBox — os confetes explodem a partir daqui. */\nconst CENTER = { x: 74.5, y: 41.5 };\n\nconst rand = (min: number, max: number) => min + Math.random() * (max - min);\n\nexport function SuccessConfettiIcon({ className }: { className?: string }) {\n  const ref = useRef<SVGSVGElement>(null);\n  const [play, setPlay] = useState(false);\n\n  useEffect(() => {\n    const svg = ref.current;\n    if (!svg) return;\n\n    try {\n      svg.querySelectorAll<SVGPathElement>('path').forEach((path) => {\n        path.style.setProperty('--gp-len', `${path.getTotalLength().toFixed(2)}px`);\n      });\n\n      Array.from(svg.querySelectorAll<SVGPathElement>('.gp-confetti-piece'))\n        .map((path) => {\n          const box = path.getBBox();\n          const dx = box.x + box.width / 2 - CENTER.x;\n          const dy = box.y + box.height / 2 - CENTER.y;\n          return { path, dx, dy, dist: Math.hypot(dx, dy) };\n        })\n        .sort((a, b) => a.dist - b.dist)\n        .forEach(({ path, dx, dy }, i) => {\n          path.style.setProperty('--gp-i', String(i));\n          // começa mais perto do selo e voa pra posição final\n          path.style.setProperty('--gp-tx', `${(-dx * 0.55).toFixed(2)}px`);\n          path.style.setProperty('--gp-ty', `${(-dy * 0.55).toFixed(2)}px`);\n          path.style.setProperty('--gp-rot0', `${rand(-60, 60).toFixed(1)}deg`);\n          // deriva idle: pequena, lenta e diferente pra cada peça\n          path.style.setProperty('--gp-fx', `${rand(-2.2, 2.2).toFixed(2)}px`);\n          path.style.setProperty('--gp-fy', `${rand(-2.6, 2.6).toFixed(2)}px`);\n          path.style.setProperty('--gp-fr', `${rand(-16, 16).toFixed(1)}deg`);\n          path.style.setProperty('--gp-fd', `${Math.round(rand(2400, 4200))}ms`);\n        });\n    } catch {\n      // svg sem layout (display:none) — sem medidas o CSS cai pro traço inteiro, só anima pop/float\n    }\n\n    setPlay(true);\n  }, []);\n\n  return (\n    <>\n      <style>{ANIMATION_CSS}</style>\n      <svg\n        ref={ref}\n        width=\"149\"\n        height=\"83\"\n        viewBox=\"0 0 149 83\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        className={['gp-confetti', play && 'gp-confetti--play', className].filter(Boolean).join(' ')}\n        aria-hidden\n      >\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M18.6348 28.4102C18.6348 30.574 19.9096 30.8716 21.7838 31.1393\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M109.117 41.4266C110.106 41.3745 110.639 40.9023 110.797 39.957\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M64.6035 75.1963C62.2234 77.2378 61.7986 79.4524 63.2302 82.1283\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M108.953 6.33984C106.531 6.40444 105.075 7.59006 104.965 10.072C104.898 11.5735 105.114 12.692 103.285 13.0577\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M131.021 51.2682C130.631 53.6598 129.26 54.9429 126.786 54.7178C125.289 54.5817 124.21 54.217 123.601 55.9798\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M34.1753 59.0104C33.2963 61.0245 32.8213 61.1372 30.7893 61.1213C29.7394 61.1131 28.0011 61.8028 27.5653 62.8448\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 1 } as React.CSSProperties} d=\"M112.314 25.2715L113.514 24.7026\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 1 } as React.CSSProperties} d=\"M51.492 49.2344C51.0065 49.3838 50.6337 49.7823 50.2324 50.0741\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M77.8867 9.72656C77.4011 9.87596 77.3223 10.0019 77.3223 10.0019\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M10.7246 56.0059C10.239 56.1553 10.1602 56.2812 10.1602 56.2812\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M28.3302 80.1108C28.6726 79.7356 28.6766 79.587 28.6766 79.587\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M128.043 49.0421C127.77 48.6138 127.627 48.5713 127.627 48.5713\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M135.461 29.4915C134.972 29.6314 134.891 29.7558 134.891 29.7558\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 0.4 } as React.CSSProperties} d=\"M52.3396 22.1222C52.0664 21.6939 51.924 21.6514 51.924 21.6514\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece\" style={{ '--gp-op': 1 } as React.CSSProperties} d=\"M45.9383 40.1115L45.1508 39.1744\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece gp-confetti-squiggle\" style={{ '--gp-op': 0.8 } as React.CSSProperties} d=\"M97.7421 69.0733C97.1523 69.9712 97.989 71.6124 98.5913 72.3132C99.7005 73.6036 100.945 73.8145 102.199 73.9149C103.234 73.9977 105.21 73.5621 105.476 72.3174C105.948 71.1367 104.935 69.8432 103.934 70.3872C102.571 71.1277 103.112 72.7192 103.73 73.7787C104.604 75.2776 105.879 76.6545 107.249 77.7108C108.333 78.5474 109.732 79.029 110.308 79.0142\" stroke=\"#12B76A\" strokeWidth=\"1.41098\" strokeLinecap=\"round\"/>\n        <path className=\"gp-confetti-piece gp-confetti-squiggle\" style={{ '--gp-op': 1 } as React.CSSProperties} d=\"M55.1022 11.4613C55.7297 11.187 55.8499 9.89737 55.7699 9.24592C55.6225 8.04626 55.0286 7.4129 54.3908 6.83895C53.8646 6.36537 52.6539 5.803 52.0797 6.41026C51.4175 6.89618 51.5122 8.05793 52.2377 8.15673C53.2253 8.2912 53.4868 7.15184 53.5227 6.28731C53.5734 5.06421 53.367 3.74644 52.9989 2.5746C52.7073 1.64647 52.1242 0.793399 51.8104 0.565035\" stroke=\"#12B76A\" strokeWidth=\"1.12879\" strokeLinecap=\"round\"/>\n        <g className=\"gp-confetti-seal\">\n          <path className=\"gp-confetti-badge\" fillRule=\"evenodd\" clipRule=\"evenodd\" d=\"M58.1139 44.0572L60.4163 47.0706L60.9134 50.8219C61.1889 52.9028 62.8247 54.5405 64.9056 54.818L68.6666 55.3208L71.678 57.6214C73.3446 58.8949 75.6548 58.8949 77.3214 57.6214L80.3348 55.3189H80.3309L84.0842 54.8218C86.1651 54.5463 87.8028 52.9105 88.0802 50.8297L88.5812 47.0687C88.5812 47.0706 89.7449 45.5466 90.8836 44.0572C92.1572 42.3906 92.1553 40.0805 90.8836 38.4138L88.585 35.3985L88.0879 31.6472C87.8124 29.5663 86.1766 27.9286 84.0958 27.6512L80.3329 27.1502L77.3214 24.8497C75.6548 23.5761 73.3446 23.5761 71.678 24.8497L68.6646 27.1502H68.6685L64.9152 27.6492C62.8344 27.9248 61.1966 29.5605 60.9192 31.6414L60.4163 35.4024C60.4163 35.4004 59.2526 36.9245 58.1139 38.4138C56.8422 40.0785 56.8422 42.3906 58.1139 44.0572V44.0572Z\" stroke=\"#12B76A\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n          <path className=\"gp-confetti-check\" d=\"M79.9009 38.541L73.1554 45.2865L69.1035 41.2384\" stroke=\"#12B76A\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n        </g>\n      </svg>\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/enums/AccountHubFlow.mjs

@@ -5,6 +5,7 @@ var AccountHubFlow = /* @__PURE__ */ ((AccountHubFlow2) => {
   AccountHubFlow2["RECEIPT"] = "receipt";
   AccountHubFlow2["CREATE_PROJECT"] = "create-project";
   AccountHubFlow2["ADD_USER"] = "add-user";
+  AccountHubFlow2["CONFIRMATION"] = "confirmation";
   return AccountHubFlow2;
 })(AccountHubFlow || {});
 export {

package/dist/enums/AccountHubFlow.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/enums/AccountHubFlow.ts"],"sourcesContent":["export enum AccountHubFlow {\n  PLANS = 'plans',\n  ADDONS = 'addons',\n  REACTIVATE = 'reactivate',\n  RECEIPT = 'receipt',\n  CREATE_PROJECT = 'create-project',\n  ADD_USER = 'add-user',\n}\n"],"mappings":"AAAO,IAAK,iBAAL,kBAAKA,oBAAL;AACL,EAAAA,gBAAA,WAAQ;AACR,EAAAA,gBAAA,YAAS;AACT,EAAAA,gBAAA,gBAAa;AACb,EAAAA,gBAAA,aAAU;AACV,EAAAA,gBAAA,oBAAiB;AACjB,EAAAA,gBAAA,cAAW;AAND,SAAAA;AAAA,GAAA;","names":["AccountHubFlow"]}
+{"version":3,"sources":["../../src/enums/AccountHubFlow.ts"],"sourcesContent":["export enum AccountHubFlow {\n  PLANS = 'plans',\n  ADDONS = 'addons',\n  REACTIVATE = 'reactivate',\n  RECEIPT = 'receipt',\n  CREATE_PROJECT = 'create-project',\n  ADD_USER = 'add-user',\n  CONFIRMATION = 'confirmation',\n}\n"],"mappings":"AAAO,IAAK,iBAAL,kBAAKA,oBAAL;AACL,EAAAA,gBAAA,WAAQ;AACR,EAAAA,gBAAA,YAAS;AACT,EAAAA,gBAAA,gBAAa;AACb,EAAAA,gBAAA,aAAU;AACV,EAAAA,gBAAA,oBAAiB;AACjB,EAAAA,gBAAA,cAAW;AACX,EAAAA,gBAAA,kBAAe;AAPL,SAAAA;AAAA,GAAA;","names":["AccountHubFlow"]}

package/dist/index.mjs

@@ -479,7 +479,11 @@ import { AccountHubFlow } from "./enums/AccountHubFlow";
 import {
   ACCOUNT_HUB_SECTION_PARAM,
   ACCOUNT_HUB_FLOW_PARAM,
-  ACCOUNT_HUB_COUPON_PARAM
+  ACCOUNT_HUB_COUPON_PARAM,
+  ACCOUNT_HUB_PLAN_PARAM,
+  ACCOUNT_HUB_TOTAL_PARAM,
+  ACCOUNT_HUB_PERIOD_PARAM,
+  ACCOUNT_HUB_CHARGE_PARAM
 } from "./modules/accounts/constants/account-hub-link.constants";
 import { LEGACY_ACCOUNT_ROUTES } from "./modules/accounts/constants/legacy-account-routes.constants";
 import { parseAccountHubLink } from "./modules/accounts/utils/parse-account-hub-link";
@@ -534,9 +538,13 @@ export {
   ACCEPTED_IMAGE_FORMATS,
   ACCEPTED_IMAGE_FORMATS_STRING,
   ACCOUNT_FREEZE_AFTER_DAYS,
+  ACCOUNT_HUB_CHARGE_PARAM,
   ACCOUNT_HUB_COUPON_PARAM,
   ACCOUNT_HUB_FLOW_PARAM,
+  ACCOUNT_HUB_PERIOD_PARAM,
+  ACCOUNT_HUB_PLAN_PARAM,
   ACCOUNT_HUB_SECTION_PARAM,
+  ACCOUNT_HUB_TOTAL_PARAM,
   ACCOUNT_QUERY_KEY,
   ACCOUNT_USERS_QUERY_KEY,
   ADDON_IDS,