@gusto/embedded-react-sdk 0.46.3 → 0.47.0

package/dist/components/Employee/PaymentMethod/management/PaymentMethodCard.js

@@ -0,0 +1,151 @@
+import { jsx as e, jsxs as m, Fragment as g } from "react/jsx-runtime";
+import { useTranslation as D } from "react-i18next";
+import { usePaymentMethodList as N } from "../shared/usePaymentMethodList.js";
+import { useDeleteBankAccount as _ } from "../shared/useDeleteBankAccount.js";
+import { DeleteBankAccountDialog as b } from "../shared/DeleteBankAccountDialog.js";
+import M from "./PaymentMethodCard.module.scss.js";
+import { Flex as k } from "../../../Common/Flex/Flex.js";
+import { Loading as L } from "../../../Common/Loading/Loading.js";
+import { BaseBoundaries as x, BaseLayout as C } from "../../../Base/Base.js";
+import { composeErrorHandler as v } from "../../../../partner-hook-utils/composeErrorHandler.js";
+import { useComponentContext as f } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as H } from "../../../../i18n/I18n.js";
+import { PAYMENT_METHODS as O, componentEvents as h } from "../../../../shared/constants.js";
+import y from "../../../../assets/icons/plus-circle.svg.js";
+import S from "../../../../assets/icons/percent-circle.svg.js";
+import Y from "../../../../assets/icons/trashcan.svg.js";
+import { HamburgerMenu as w } from "../../../Common/HamburgerMenu/HamburgerMenu.js";
+import { useDataView as R } from "../../../Common/DataView/useDataView.js";
+import { DataView as U } from "../../../Common/DataView/DataView.js";
+function ce(n) {
+  return /* @__PURE__ */ e(x, { componentName: "Employee.Management.PaymentMethod", children: /* @__PURE__ */ e(G, { ...n }) });
+}
+function G({ employeeId: n, onEvent: a }) {
+  H("Employee.Management.PaymentMethod");
+  const { t: d } = D("Employee.Management.PaymentMethod"), c = f(), o = N({ employeeId: n }), l = v([o]);
+  return o.isLoading ? /* @__PURE__ */ e(C, { error: l.errors, children: /* @__PURE__ */ e(
+    c.Box,
+    {
+      header: /* @__PURE__ */ e(
+        c.BoxHeader,
+        {
+          title: d("title"),
+          action: /* @__PURE__ */ e("div", { className: M.headerAction, children: /* @__PURE__ */ e(c.Button, { variant: "secondary", icon: /* @__PURE__ */ e(y, {}), isDisabled: !0, children: d("addBankAccountCta") }) })
+        }
+      ),
+      children: /* @__PURE__ */ e(L, {})
+    }
+  ) }) : /* @__PURE__ */ e(
+    V,
+    {
+      employeeId: n,
+      onEvent: a,
+      paymentMethodList: o,
+      errorHandling: l
+    }
+  );
+}
+function V({
+  onEvent: n,
+  paymentMethodList: a,
+  errorHandling: d
+}) {
+  const { paymentMethod: c, bankAccounts: o } = a.data, { deletePendingBankAccountUuid: l } = a.status, { t } = D("Employee.Management.PaymentMethod"), r = f(), { pendingDeleteAccount: s, setPendingDeleteAccount: p, handleConfirmDelete: T } = _(async (i) => {
+    const E = await a.actions.onDelete(i);
+    E && n(
+      h.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_BANK_ACCOUNT_DELETED,
+      E.data
+    );
+  }), { ...B } = R({
+    data: o,
+    columns: [
+      {
+        key: "name",
+        title: t("nicknameColumn"),
+        render: (i) => /* @__PURE__ */ m(g, { children: [
+          i.name,
+          /* @__PURE__ */ e(r.Text, { variant: "supporting", size: "sm", children: i.hiddenAccountNumber })
+        ] })
+      },
+      { key: "routingNumber", title: t("routingNumberColumn") },
+      { key: "accountType", title: t("accountTypeColumn") }
+    ],
+    itemMenu: (i) => /* @__PURE__ */ e(
+      w,
+      {
+        items: [
+          {
+            label: t("deleteBankAccountCta"),
+            onClick: () => {
+              p({
+                uuid: i.uuid,
+                hiddenAccountNumber: i.hiddenAccountNumber
+              });
+            },
+            icon: /* @__PURE__ */ e(Y, { "aria-hidden": !0 })
+          }
+        ],
+        triggerLabel: t("hamburgerTitle")
+      }
+    )
+  }), u = c.type === O.directDeposit, P = /* @__PURE__ */ m("div", { className: M.headerAction, children: [
+    u && o.length > 1 && /* @__PURE__ */ e(
+      r.Button,
+      {
+        variant: "secondary",
+        onClick: () => {
+          n(h.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_SPLIT_REQUESTED);
+        },
+        icon: /* @__PURE__ */ e(S, {}),
+        children: t("splitCta")
+      }
+    ),
+    /* @__PURE__ */ e(
+      r.Button,
+      {
+        variant: "secondary",
+        onClick: () => {
+          n(h.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_ADD_REQUESTED);
+        },
+        icon: /* @__PURE__ */ e(y, {}),
+        children: o.length > 0 ? t("addAnotherCta") : t("addBankAccountCta")
+      }
+    )
+  ] }), A = u && o.length > 0;
+  return /* @__PURE__ */ m(g, { children: [
+    /* @__PURE__ */ e(C, { error: d.errors, children: /* @__PURE__ */ e(
+      r.Box,
+      {
+        withPadding: !A,
+        header: /* @__PURE__ */ e(r.BoxHeader, { title: t("title"), action: P }),
+        children: A ? /* @__PURE__ */ e(U, { label: t("bankAccountsListLabel"), isWithinBox: !0, ...B }) : /* @__PURE__ */ m(k, { flexDirection: "column", gap: 0, children: [
+          /* @__PURE__ */ e(r.Text, { variant: "supporting", children: t("paymentMethodLabel") }),
+          /* @__PURE__ */ e(r.Text, { children: t(u ? "directDepositLabel" : "checkLabel") })
+        ] })
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      b,
+      {
+        pendingDeleteAccount: s,
+        isPrimaryActionLoading: l === s?.uuid,
+        onClose: () => {
+          p(null);
+        },
+        onConfirm: () => {
+          T();
+        },
+        title: t("deleteBankAccountDialog.title"),
+        description: t("deleteBankAccountDialog.description", {
+          account: s?.hiddenAccountNumber ?? ""
+        }),
+        confirmLabel: t("deleteBankAccountDialog.confirmCta"),
+        cancelLabel: t("deleteBankAccountDialog.cancelCta")
+      }
+    )
+  ] });
+}
+export {
+  ce as PaymentMethodCard
+};
+//# sourceMappingURL=PaymentMethodCard.js.map

package/dist/components/Employee/PaymentMethod/management/PaymentMethodCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodCard.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/PaymentMethodCard.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport {\n  usePaymentMethodList,\n  type UsePaymentMethodListReady,\n} from '../shared/usePaymentMethodList'\nimport { useDeleteBankAccount } from '../shared/useDeleteBankAccount'\nimport { DeleteBankAccountDialog } from '../shared/DeleteBankAccountDialog'\nimport styles from './PaymentMethodCard.module.scss'\nimport { DataView, useDataView, Loading } from '@/components/Common'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base/Base'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, PAYMENT_METHODS, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport PlusCircleIcon from '@/assets/icons/plus-circle.svg?react'\nimport PercentCircleIcon from '@/assets/icons/percent-circle.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\n\nexport interface PaymentMethodCardProps {\n  employeeId: string\n  onEvent: OnEventType<EventType, unknown>\n}\n\n/**\n * Standalone \"Payment\" card. Owns its own data fetch via\n * {@link usePaymentMethodList} and emits the management block's scoped events\n * (`EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_*`) when the user clicks the card's\n * CTAs or confirms a bank-account deletion. The card has no alert API — alert\n * rendering is the orchestrator's responsibility (the block's\n * `PaymentMethodCardContextual` for standalone consumption; the dashboard\n * chrome for dashboard consumption).\n */\nexport function PaymentMethodCard(props: PaymentMethodCardProps) {\n  return (\n    <BaseBoundaries componentName=\"Employee.Management.PaymentMethod\">\n      <PaymentMethodCardContent {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction PaymentMethodCardContent({ employeeId, onEvent }: PaymentMethodCardProps) {\n  useI18n('Employee.Management.PaymentMethod')\n  const { t } = useTranslation('Employee.Management.PaymentMethod')\n  const Components = useComponentContext()\n  const paymentMethodList = usePaymentMethodList({ employeeId })\n\n  const errorHandling = composeErrorHandler([paymentMethodList])\n\n  if (paymentMethodList.isLoading) {\n    return (\n      <BaseLayout error={errorHandling.errors}>\n        <Components.Box\n          header={\n            <Components.BoxHeader\n              title={t('title')}\n              action={\n                <div className={styles.headerAction}>\n                  <Components.Button variant=\"secondary\" icon={<PlusCircleIcon />} isDisabled>\n                    {t('addBankAccountCta')}\n                  </Components.Button>\n                </div>\n              }\n            />\n          }\n        >\n          <Loading />\n        </Components.Box>\n      </BaseLayout>\n    )\n  }\n\n  return (\n    <PaymentMethodCardReady\n      employeeId={employeeId}\n      onEvent={onEvent}\n      paymentMethodList={paymentMethodList}\n      errorHandling={errorHandling}\n    />\n  )\n}\n\ninterface PaymentMethodCardReadyProps extends PaymentMethodCardProps {\n  paymentMethodList: UsePaymentMethodListReady\n  errorHandling: ReturnType<typeof composeErrorHandler>\n}\n\nfunction PaymentMethodCardReady({\n  onEvent,\n  paymentMethodList,\n  errorHandling,\n}: PaymentMethodCardReadyProps) {\n  const { paymentMethod, bankAccounts } = paymentMethodList.data\n  const { deletePendingBankAccountUuid } = paymentMethodList.status\n  const { t } = useTranslation('Employee.Management.PaymentMethod')\n  const Components = useComponentContext()\n\n  const { pendingDeleteAccount, setPendingDeleteAccount, handleConfirmDelete } =\n    useDeleteBankAccount(async uuid => {\n      const result = await paymentMethodList.actions.onDelete(uuid)\n      if (result) {\n        onEvent(\n          componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_BANK_ACCOUNT_DELETED,\n          result.data,\n        )\n      }\n    })\n\n  const { ...dataViewProps } = useDataView({\n    data: bankAccounts,\n    columns: [\n      {\n        key: 'name',\n        title: t('nicknameColumn'),\n        render: bankAccount => (\n          <>\n            {bankAccount.name}\n            <Components.Text variant=\"supporting\" size=\"sm\">\n              {bankAccount.hiddenAccountNumber}\n            </Components.Text>\n          </>\n        ),\n      },\n      { key: 'routingNumber', title: t('routingNumberColumn') },\n      { key: 'accountType', title: t('accountTypeColumn') },\n    ],\n    itemMenu: bankAccount => (\n      <HamburgerMenu\n        items={[\n          {\n            label: t('deleteBankAccountCta'),\n            onClick: () => {\n              setPendingDeleteAccount({\n                uuid: bankAccount.uuid,\n                hiddenAccountNumber: bankAccount.hiddenAccountNumber,\n              })\n            },\n            icon: <TrashCanSvg aria-hidden />,\n          },\n        ]}\n        triggerLabel={t('hamburgerTitle')}\n      />\n    ),\n  })\n\n  const isDirectDeposit = paymentMethod.type === PAYMENT_METHODS.directDeposit\n\n  const headerAction = (\n    <div className={styles.headerAction}>\n      {isDirectDeposit && bankAccounts.length > 1 && (\n        <Components.Button\n          variant=\"secondary\"\n          onClick={() => {\n            onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_SPLIT_REQUESTED)\n          }}\n          icon={<PercentCircleIcon />}\n        >\n          {t('splitCta')}\n        </Components.Button>\n      )}\n      <Components.Button\n        variant=\"secondary\"\n        onClick={() => {\n          onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_ADD_REQUESTED)\n        }}\n        icon={<PlusCircleIcon />}\n      >\n        {bankAccounts.length > 0 ? t('addAnotherCta') : t('addBankAccountCta')}\n      </Components.Button>\n    </div>\n  )\n\n  const isShowingBankAccountTable = isDirectDeposit && bankAccounts.length > 0\n\n  return (\n    <>\n      <BaseLayout error={errorHandling.errors}>\n        <Components.Box\n          withPadding={!isShowingBankAccountTable}\n          header={<Components.BoxHeader title={t('title')} action={headerAction} />}\n        >\n          {isShowingBankAccountTable ? (\n            <DataView label={t('bankAccountsListLabel')} isWithinBox {...dataViewProps} />\n          ) : (\n            <Flex flexDirection=\"column\" gap={0}>\n              <Components.Text variant=\"supporting\">{t('paymentMethodLabel')}</Components.Text>\n              <Components.Text>\n                {isDirectDeposit ? t('directDepositLabel') : t('checkLabel')}\n              </Components.Text>\n            </Flex>\n          )}\n        </Components.Box>\n      </BaseLayout>\n      <DeleteBankAccountDialog\n        pendingDeleteAccount={pendingDeleteAccount}\n        isPrimaryActionLoading={deletePendingBankAccountUuid === pendingDeleteAccount?.uuid}\n        onClose={() => {\n          setPendingDeleteAccount(null)\n        }}\n        onConfirm={() => {\n          void handleConfirmDelete()\n        }}\n        title={t('deleteBankAccountDialog.title')}\n        description={t('deleteBankAccountDialog.description', {\n          account: pendingDeleteAccount?.hiddenAccountNumber ?? '',\n        })}\n        confirmLabel={t('deleteBankAccountDialog.confirmCta')}\n        cancelLabel={t('deleteBankAccountDialog.cancelCta')}\n      />\n    </>\n  )\n}\n"],"names":["PaymentMethodCard","props","jsx","BaseBoundaries","PaymentMethodCardContent","employeeId","onEvent","useI18n","t","useTranslation","Components","useComponentContext","paymentMethodList","usePaymentMethodList","errorHandling","composeErrorHandler","BaseLayout","styles","PlusCircleIcon","Loading","PaymentMethodCardReady","paymentMethod","bankAccounts","deletePendingBankAccountUuid","pendingDeleteAccount","setPendingDeleteAccount","handleConfirmDelete","useDeleteBankAccount","uuid","result","componentEvents","dataViewProps","useDataView","jsxs","Fragment","bankAccount","HamburgerMenu","TrashCanSvg","isDirectDeposit","PAYMENT_METHODS","headerAction","PercentCircleIcon","isShowingBankAccountTable","DataView","Flex","DeleteBankAccountDialog"],"mappings":"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"}

package/dist/components/Employee/PaymentMethod/management/PaymentMethodCard.module.scss.js

@@ -0,0 +1,8 @@
+const e = "_headerAction_1dh24_1", t = {
+  headerAction: e
+};
+export {
+  t as default,
+  e as headerAction
+};
+//# sourceMappingURL=PaymentMethodCard.module.scss.js.map

package/dist/components/Employee/PaymentMethod/management/PaymentMethodCard.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodCard.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/Employee/PaymentMethod/management/PaymentMethodComponents.d.ts

@@ -1,8 +1,10 @@
 import { FlowContextInterface } from '../../../Flow/useFlow';
+export type PaymentMethodSuccessAlertCode = 'bankAccountAdded' | 'bankAccountDeleted' | 'splitUpdated';
 export interface PaymentMethodContextInterface extends FlowContextInterface {
     employeeId: string;
     isAdmin: boolean;
+    successAlert?: PaymentMethodSuccessAlertCode | null;
 }
-export declare function ListViewContextual(): import("react/jsx-runtime").JSX.Element;
-export declare function BankFormContextual(): import("react/jsx-runtime").JSX.Element;
-export declare function SplitViewContextual(): import("react/jsx-runtime").JSX.Element;
+export declare function PaymentMethodCardContextual(): import("react").JSX.Element;
+export declare function PaymentMethodBankFormContextual(): import("react").JSX.Element;
+export declare function PaymentMethodSplitFormContextual(): import("react").JSX.Element;

package/dist/components/Employee/PaymentMethod/management/PaymentMethodComponents.js

@@ -1,23 +1,39 @@
-import { jsx as e } from "react/jsx-runtime";
-import { BankForm as r } from "../onboarding/BankForm.js";
-import { SplitView as i } from "../onboarding/SplitView.js";
-import { ListView as m } from "./ListView.js";
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { useTranslation as a } from "react-i18next";
+import { PaymentMethodBankForm as i } from "./PaymentMethodBankForm.js";
+import { PaymentMethodSplitForm as p } from "./PaymentMethodSplitForm.js";
+import { PaymentMethodCard as u } from "./PaymentMethodCard.js";
+import { Flex as c } from "../../../Common/Flex/Flex.js";
 import { useFlow as n } from "../../../Flow/useFlow.js";
-function c() {
-  const { employeeId: o, onEvent: t } = n();
-  return /* @__PURE__ */ e(m, { employeeId: o, onEvent: t });
+import { useComponentContext as E } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { componentEvents as M } from "../../../../shared/constants.js";
+function D() {
+  const { employeeId: o, onEvent: t, successAlert: m } = n(), { t: r } = a("Employee.Management.PaymentMethod"), s = E();
+  return /* @__PURE__ */ l(c, { flexDirection: "column", gap: 16, children: [
+    m ? /* @__PURE__ */ e(
+      s.Alert,
+      {
+        status: "success",
+        label: r(`alerts.${m}`),
+        onDismiss: () => {
+          t(M.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_ALERT_DISMISSED, null);
+        }
+      }
+    ) : null,
+    /* @__PURE__ */ e(u, { employeeId: o, onEvent: t })
+  ] });
 }
-function a() {
+function I() {
   const { employeeId: o, onEvent: t } = n();
-  return /* @__PURE__ */ e(r, { employeeId: o, onEvent: t });
+  return /* @__PURE__ */ e(i, { employeeId: o, onEvent: t });
 }
-function w() {
+function S() {
   const { employeeId: o, onEvent: t } = n();
-  return /* @__PURE__ */ e(i, { employeeId: o, onEvent: t });
+  return /* @__PURE__ */ e(p, { employeeId: o, onEvent: t });
 }
 export {
-  a as BankFormContextual,
-  c as ListViewContextual,
-  w as SplitViewContextual
+  I as PaymentMethodBankFormContextual,
+  D as PaymentMethodCardContextual,
+  S as PaymentMethodSplitFormContextual
 };
 //# sourceMappingURL=PaymentMethodComponents.js.map

package/dist/components/Employee/PaymentMethod/management/PaymentMethodComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodComponents.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/PaymentMethodComponents.tsx"],"sourcesContent":["import { BankForm } from '../onboarding/BankForm'\nimport { SplitView } from '../onboarding/SplitView'\nimport { ListView } from './ListView'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport type { FlowContextInterface } from '@/components/Flow/useFlow'\n\nexport interface PaymentMethodContextInterface extends FlowContextInterface {\n  employeeId: string\n  isAdmin: boolean\n}\n\nexport function ListViewContextual() {\n  const { employeeId, onEvent } = useFlow<PaymentMethodContextInterface>()\n  return <ListView employeeId={employeeId} onEvent={onEvent} />\n}\n\nexport function BankFormContextual() {\n  const { employeeId, onEvent } = useFlow<PaymentMethodContextInterface>()\n  return <BankForm employeeId={employeeId} onEvent={onEvent} />\n}\n\nexport function SplitViewContextual() {\n  const { employeeId, onEvent } = useFlow<PaymentMethodContextInterface>()\n  return <SplitView employeeId={employeeId} onEvent={onEvent} />\n}\n"],"names":["ListViewContextual","employeeId","onEvent","useFlow","jsx","ListView","BankFormContextual","BankForm","SplitViewContextual","SplitView"],"mappings":";;;;;AAWO,SAASA,IAAqB;AACnC,QAAM,EAAE,YAAAC,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,SAAO,gBAAAC,EAACC,GAAA,EAAS,YAAAJ,GAAwB,SAAAC,EAAA,CAAkB;AAC7D;AAEO,SAASI,IAAqB;AACnC,QAAM,EAAE,YAAAL,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,SAAO,gBAAAC,EAACG,GAAA,EAAS,YAAAN,GAAwB,SAAAC,EAAA,CAAkB;AAC7D;AAEO,SAASM,IAAsB;AACpC,QAAM,EAAE,YAAAP,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,SAAO,gBAAAC,EAACK,GAAA,EAAU,YAAAR,GAAwB,SAAAC,EAAA,CAAkB;AAC9D;"}
+{"version":3,"file":"PaymentMethodComponents.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/PaymentMethodComponents.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { PaymentMethodBankForm } from './PaymentMethodBankForm'\nimport { PaymentMethodSplitForm } from './PaymentMethodSplitForm'\nimport { PaymentMethodCard } from './PaymentMethodCard'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { componentEvents } from '@/shared/constants'\n\nexport type PaymentMethodSuccessAlertCode =\n  | 'bankAccountAdded'\n  | 'bankAccountDeleted'\n  | 'splitUpdated'\n\nexport interface PaymentMethodContextInterface extends FlowContextInterface {\n  employeeId: string\n  isAdmin: boolean\n  successAlert?: PaymentMethodSuccessAlertCode | null\n}\n\nexport function PaymentMethodCardContextual() {\n  const { employeeId, onEvent, successAlert } = useFlow<PaymentMethodContextInterface>()\n  const { t } = useTranslation('Employee.Management.PaymentMethod')\n  const Components = useComponentContext()\n  return (\n    <Flex flexDirection=\"column\" gap={16}>\n      {successAlert ? (\n        <Components.Alert\n          status=\"success\"\n          label={t(`alerts.${successAlert}`)}\n          onDismiss={() => {\n            onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_ALERT_DISMISSED, null)\n          }}\n        />\n      ) : null}\n      <PaymentMethodCard employeeId={employeeId} onEvent={onEvent} />\n    </Flex>\n  )\n}\n\nexport function PaymentMethodBankFormContextual() {\n  const { employeeId, onEvent } = useFlow<PaymentMethodContextInterface>()\n  return <PaymentMethodBankForm employeeId={employeeId} onEvent={onEvent} />\n}\n\nexport function PaymentMethodSplitFormContextual() {\n  const { employeeId, onEvent } = useFlow<PaymentMethodContextInterface>()\n  return <PaymentMethodSplitForm employeeId={employeeId} onEvent={onEvent} />\n}\n"],"names":["PaymentMethodCardContextual","employeeId","onEvent","successAlert","useFlow","t","useTranslation","Components","useComponentContext","jsxs","Flex","jsx","componentEvents","PaymentMethodCard","PaymentMethodBankFormContextual","PaymentMethodBankForm","PaymentMethodSplitFormContextual","PaymentMethodSplitForm"],"mappings":";;;;;;;;;AAoBO,SAASA,IAA8B;AAC5C,QAAM,EAAE,YAAAC,GAAY,SAAAC,GAAS,cAAAC,EAAA,IAAiBC,EAAA,GACxC,EAAE,GAAAC,EAAA,IAAMC,EAAe,mCAAmC,GAC1DC,IAAaC,EAAA;AACnB,SACE,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAC/B,UAAA;AAAA,IAAAP,IACC,gBAAAQ;AAAA,MAACJ,EAAW;AAAA,MAAX;AAAA,QACC,QAAO;AAAA,QACP,OAAOF,EAAE,UAAUF,CAAY,EAAE;AAAA,QACjC,WAAW,MAAM;AACf,UAAAD,EAAQU,EAAgB,oDAAoD,IAAI;AAAA,QAClF;AAAA,MAAA;AAAA,IAAA,IAEA;AAAA,IACJ,gBAAAD,EAACE,GAAA,EAAkB,YAAAZ,GAAwB,SAAAC,EAAA,CAAkB;AAAA,EAAA,GAC/D;AAEJ;AAEO,SAASY,IAAkC;AAChD,QAAM,EAAE,YAAAb,GAAY,SAAAC,EAAA,IAAYE,EAAA;AAChC,SAAO,gBAAAO,EAACI,GAAA,EAAsB,YAAAd,GAAwB,SAAAC,EAAA,CAAkB;AAC1E;AAEO,SAASc,IAAmC;AACjD,QAAM,EAAE,YAAAf,GAAY,SAAAC,EAAA,IAAYE,EAAA;AAChC,SAAO,gBAAAO,EAACM,GAAA,EAAuB,YAAAhB,GAAwB,SAAAC,EAAA,CAAkB;AAC3E;"}

package/dist/components/Employee/PaymentMethod/management/PaymentMethodSplitForm.d.ts

@@ -0,0 +1,16 @@
+import { UseSplitPaymentsFormProps } from '../shared/useSplitPaymentsForm';
+import { EventType } from '../../../../shared/constants';
+import { OnEventType } from '../../../Base/useBase';
+export interface PaymentMethodSplitFormProps extends Omit<UseSplitPaymentsFormProps, 'employeeId'> {
+    employeeId: string;
+    onEvent: OnEventType<EventType, unknown>;
+}
+/**
+ * Standalone split-paycheck form for the management flow. Renders the shared
+ * {@link SplitPaymentsFormBody} and emits the per-component scoped events
+ * `EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_SUBMITTED` and
+ * `EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_CANCELLED`. Reads its copy from
+ * the dedicated `Employee.Management.PaymentMethodSplitForm` namespace so partner
+ * overrides on the management split form don't leak into the onboarding form.
+ */
+export declare function PaymentMethodSplitForm({ employeeId, onEvent, ...hookProps }: PaymentMethodSplitFormProps): import("react").JSX.Element;

package/dist/components/Employee/PaymentMethod/management/PaymentMethodSplitForm.js

@@ -0,0 +1,29 @@
+import { jsx as n } from "react/jsx-runtime";
+import { useManagementSplitFormDictionary as i } from "./useFormDictionary.js";
+import { componentEvents as t } from "../../../../shared/constants.js";
+import { SplitPaymentsFormBody as _ } from "../shared/SplitPaymentsFormBody/SplitPaymentsFormBody.js";
+function P({
+  employeeId: E,
+  onEvent: o,
+  ...r
+}) {
+  const m = i();
+  return /* @__PURE__ */ n(
+    _,
+    {
+      employeeId: E,
+      dictionary: m,
+      onSaved: (M) => {
+        o(t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_SUBMITTED, M);
+      },
+      onCancel: () => {
+        o(t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_CANCELLED);
+      },
+      ...r
+    }
+  );
+}
+export {
+  P as PaymentMethodSplitForm
+};
+//# sourceMappingURL=PaymentMethodSplitForm.js.map

package/dist/components/Employee/PaymentMethod/management/PaymentMethodSplitForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodSplitForm.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/PaymentMethodSplitForm.tsx"],"sourcesContent":["import { SplitPaymentsFormBody } from '../shared/SplitPaymentsFormBody'\nimport type { UseSplitPaymentsFormProps } from '../shared/useSplitPaymentsForm'\nimport { useManagementSplitFormDictionary } from './useFormDictionary'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\n\nexport interface PaymentMethodSplitFormProps extends Omit<UseSplitPaymentsFormProps, 'employeeId'> {\n  employeeId: string\n  onEvent: OnEventType<EventType, unknown>\n}\n\n/**\n * Standalone split-paycheck form for the management flow. Renders the shared\n * {@link SplitPaymentsFormBody} and emits the per-component scoped events\n * `EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_SUBMITTED` and\n * `EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_CANCELLED`. Reads its copy from\n * the dedicated `Employee.Management.PaymentMethodSplitForm` namespace so partner\n * overrides on the management split form don't leak into the onboarding form.\n */\nexport function PaymentMethodSplitForm({\n  employeeId,\n  onEvent,\n  ...hookProps\n}: PaymentMethodSplitFormProps) {\n  const dictionary = useManagementSplitFormDictionary()\n\n  return (\n    <SplitPaymentsFormBody\n      employeeId={employeeId}\n      dictionary={dictionary}\n      onSaved={data => {\n        onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_SUBMITTED, data)\n      }}\n      onCancel={() => {\n        onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_CANCELLED)\n      }}\n      {...hookProps}\n    />\n  )\n}\n"],"names":["PaymentMethodSplitForm","employeeId","onEvent","hookProps","dictionary","useManagementSplitFormDictionary","jsx","SplitPaymentsFormBody","data","componentEvents"],"mappings":";;;;AAmBO,SAASA,EAAuB;AAAA,EACrC,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GAAgC;AAC9B,QAAMC,IAAaC,EAAA;AAEnB,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,YAAAN;AAAA,MACA,YAAAG;AAAA,MACA,SAAS,CAAAI,MAAQ;AACf,QAAAN,EAAQO,EAAgB,yDAAyDD,CAAI;AAAA,MACvF;AAAA,MACA,UAAU,MAAM;AACd,QAAAN,EAAQO,EAAgB,uDAAuD;AAAA,MACjF;AAAA,MACC,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/components/Employee/PaymentMethod/management/index.d.ts

@@ -1,4 +1,9 @@
 import "./types/i18next.d.ts"
-export { ListView } from './ListView';
+export { PaymentMethodCard } from './PaymentMethodCard';
+export type { PaymentMethodCardProps } from './PaymentMethodCard';
+export { PaymentMethodBankForm } from './PaymentMethodBankForm';
+export type { PaymentMethodBankFormProps } from './PaymentMethodBankForm';
+export { PaymentMethodSplitForm } from './PaymentMethodSplitForm';
+export type { PaymentMethodSplitFormProps } from './PaymentMethodSplitForm';
 export { PaymentMethod } from './PaymentMethod';
 export type { PaymentMethodProps } from './PaymentMethod';

package/dist/components/Employee/PaymentMethod/management/paymentMethodStateMachine.js

@@ -1,75 +1,79 @@
-import { state as i, transition as o, reduce as n } from "robot3";
-import { ListViewContextual as e, BankFormContextual as m, SplitViewContextual as p } from "./PaymentMethodComponents.js";
-import { componentEvents as E } from "../../../../shared/constants.js";
-const l = {
-  list: i(
-    o(
-      E.EMPLOYEE_BANK_ACCOUNT_CREATE,
+import { state as A, transition as E, reduce as _ } from "robot3";
+import { PaymentMethodBankFormContextual as s, PaymentMethodSplitFormContextual as N, PaymentMethodCardContextual as n } from "./PaymentMethodComponents.js";
+import { componentEvents as t } from "../../../../shared/constants.js";
+const e = _(
+  (M) => ({
+    ...M,
+    component: n,
+    successAlert: null
+  })
+), T = (M) => _(
+  (o) => ({
+    ...o,
+    component: n,
+    successAlert: M
+  })
+), P = {
+  list: A(
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_ADD_REQUESTED,
       "add",
-      n(
-        (t) => ({
-          ...t,
-          component: m
+      _(
+        (M) => ({
+          ...M,
+          component: s,
+          successAlert: null
         })
       )
     ),
-    o(
-      E.EMPLOYEE_SPLIT_PAYCHECK,
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_SPLIT_REQUESTED,
       "split",
-      n(
-        (t) => ({
-          ...t,
-          component: p
+      _(
+        (M) => ({
+          ...M,
+          component: N,
+          successAlert: null
         })
       )
+    ),
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_BANK_ACCOUNT_DELETED,
+      "list",
+      T("bankAccountDeleted")
+    ),
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_ALERT_DISMISSED,
+      "list",
+      e
     )
   ),
-  add: i(
-    o(
-      E.EMPLOYEE_BANK_ACCOUNT_CREATED,
+  add: A(
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_BANK_FORM_SUBMITTED,
       "list",
-      n(
-        (t) => ({
-          ...t,
-          component: e
-        })
-      )
+      T("bankAccountAdded")
     ),
-    o(
-      E.CANCEL,
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_BANK_FORM_CANCELLED,
       "list",
-      n(
-        (t) => ({
-          ...t,
-          component: e
-        })
-      )
+      e
     )
   ),
-  split: i(
-    o(
-      E.EMPLOYEE_PAYMENT_METHOD_UPDATED,
+  split: A(
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_SUBMITTED,
       "list",
-      n(
-        (t) => ({
-          ...t,
-          component: e
-        })
-      )
+      T("splitUpdated")
     ),
-    o(
-      E.CANCEL,
+    E(
+      t.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_CANCELLED,
       "list",
-      n(
-        (t) => ({
-          ...t,
-          component: e
-        })
-      )
+      e
     )
   )
 };
 export {
-  l as paymentMethodStateMachine
+  P as paymentMethodStateMachine
 };
 //# sourceMappingURL=paymentMethodStateMachine.js.map

package/dist/components/Employee/PaymentMethod/management/paymentMethodStateMachine.js.map

@@ -1 +1 @@
-{"version":3,"file":"paymentMethodStateMachine.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/paymentMethodStateMachine.ts"],"sourcesContent":["import { reduce, state, transition } from 'robot3'\nimport type { ComponentType } from 'react'\nimport type { PaymentMethodContextInterface } from './PaymentMethodComponents'\nimport {\n  ListViewContextual,\n  BankFormContextual,\n  SplitViewContextual,\n} from './PaymentMethodComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineTransition } from '@/types/Helpers'\n\nexport const paymentMethodStateMachine = {\n  list: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_BANK_ACCOUNT_CREATE,\n      'add',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: BankFormContextual as ComponentType,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_SPLIT_PAYCHECK,\n      'split',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: SplitViewContextual as ComponentType,\n        }),\n      ),\n    ),\n  ),\n  add: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_BANK_ACCOUNT_CREATED,\n      'list',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: ListViewContextual as ComponentType,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.CANCEL,\n      'list',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: ListViewContextual as ComponentType,\n        }),\n      ),\n    ),\n  ),\n  split: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_PAYMENT_METHOD_UPDATED,\n      'list',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: ListViewContextual as ComponentType,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.CANCEL,\n      'list',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: ListViewContextual as ComponentType,\n        }),\n      ),\n    ),\n  ),\n}\n"],"names":["paymentMethodStateMachine","state","transition","componentEvents","reduce","ctx","BankFormContextual","SplitViewContextual","ListViewContextual"],"mappings":";;;AAWO,MAAMA,IAA4B;AAAA,EACvC,MAAMC;AAAA,IACJC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWC;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,IAEFJ;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWE;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAAA,EAEF,KAAKN;AAAA,IACHC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWG;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,IAEFN;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWG;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAAA,EAEF,OAAOP;AAAA,IACLC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWG;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,IAEFN;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWG;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"paymentMethodStateMachine.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/paymentMethodStateMachine.ts"],"sourcesContent":["import { reduce, state, transition } from 'robot3'\nimport type { ComponentType } from 'react'\nimport type {\n  PaymentMethodContextInterface,\n  PaymentMethodSuccessAlertCode,\n} from './PaymentMethodComponents'\nimport {\n  PaymentMethodCardContextual,\n  PaymentMethodBankFormContextual,\n  PaymentMethodSplitFormContextual,\n} from './PaymentMethodComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineTransition } from '@/types/Helpers'\n\nconst returnToList = reduce(\n  (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n    ...ctx,\n    component: PaymentMethodCardContextual as ComponentType,\n    successAlert: null,\n  }),\n)\n\nconst returnToListWithAlert = (alert: PaymentMethodSuccessAlertCode) =>\n  reduce(\n    (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n      ...ctx,\n      component: PaymentMethodCardContextual as ComponentType,\n      successAlert: alert,\n    }),\n  )\n\nexport const paymentMethodStateMachine = {\n  list: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_ADD_REQUESTED,\n      'add',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: PaymentMethodBankFormContextual as ComponentType,\n          successAlert: null,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_SPLIT_REQUESTED,\n      'split',\n      reduce(\n        (ctx: PaymentMethodContextInterface): PaymentMethodContextInterface => ({\n          ...ctx,\n          component: PaymentMethodSplitFormContextual as ComponentType,\n          successAlert: null,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_CARD_BANK_ACCOUNT_DELETED,\n      'list',\n      returnToListWithAlert('bankAccountDeleted'),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_ALERT_DISMISSED,\n      'list',\n      returnToList,\n    ),\n  ),\n  add: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_BANK_FORM_SUBMITTED,\n      'list',\n      returnToListWithAlert('bankAccountAdded'),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_BANK_FORM_CANCELLED,\n      'list',\n      returnToList,\n    ),\n  ),\n  split: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_SUBMITTED,\n      'list',\n      returnToListWithAlert('splitUpdated'),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_MANAGEMENT_PAYMENT_METHOD_SPLIT_FORM_CANCELLED,\n      'list',\n      returnToList,\n    ),\n  ),\n}\n"],"names":["returnToList","reduce","ctx","PaymentMethodCardContextual","returnToListWithAlert","alert","paymentMethodStateMachine","state","transition","componentEvents","PaymentMethodBankFormContextual","PaymentMethodSplitFormContextual"],"mappings":";;;AAcA,MAAMA,IAAeC;AAAA,EACnB,CAACC,OAAuE;AAAA,IACtE,GAAGA;AAAA,IACH,WAAWC;AAAA,IACX,cAAc;AAAA,EAAA;AAElB,GAEMC,IAAwB,CAACC,MAC7BJ;AAAA,EACE,CAACC,OAAuE;AAAA,IACtE,GAAGA;AAAA,IACH,WAAWC;AAAA,IACX,cAAcE;AAAA,EAAA;AAElB,GAEWC,IAA4B;AAAA,EACvC,MAAMC;AAAA,IACJC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAR;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWQ;AAAA,UACX,cAAc;AAAA,QAAA;AAAA,MAChB;AAAA,IACF;AAAA,IAEFF;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAR;AAAA,QACE,CAACC,OAAuE;AAAA,UACtE,GAAGA;AAAA,UACH,WAAWS;AAAA,UACX,cAAc;AAAA,QAAA;AAAA,MAChB;AAAA,IACF;AAAA,IAEFH;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAL,EAAsB,oBAAoB;AAAA,IAAA;AAAA,IAE5CI;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAT;AAAA,IAAA;AAAA,EACF;AAAA,EAEF,KAAKO;AAAA,IACHC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAL,EAAsB,kBAAkB;AAAA,IAAA;AAAA,IAE1CI;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAT;AAAA,IAAA;AAAA,EACF;AAAA,EAEF,OAAOO;AAAA,IACLC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAL,EAAsB,cAAc;AAAA,IAAA;AAAA,IAEtCI;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAT;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/components/Employee/PaymentMethod/management/useFormDictionary.d.ts

@@ -0,0 +1,17 @@
+import { BankFormBodyDictionary } from '../shared/BankFormBody';
+import { SplitPaymentsFormBodyDictionary } from '../shared/SplitPaymentsFormBody';
+/**
+ * Resolves the shared `BankFormBody`'s text against management's dedicated
+ * `Employee.Management.PaymentMethodBankForm` namespace, so partner overrides on
+ * the management bank form don't leak into the onboarding form.
+ */
+export declare function useManagementBankFormDictionary(): BankFormBodyDictionary;
+/**
+ * Resolves the shared `SplitPaymentsFormBody`'s text against management's
+ * dedicated `Employee.Management.PaymentMethodSplitForm` namespace, so partner
+ * overrides on the management split form don't leak into the onboarding form.
+ * Interpolated templates (`splitAmountLabel`,
+ * `validations.percentageErrorWithTotal`) are passed through unresolved so the
+ * body interpolates them at render time.
+ */
+export declare function useManagementSplitFormDictionary(): SplitPaymentsFormBodyDictionary;

package/dist/components/Employee/PaymentMethod/management/useFormDictionary.js

@@ -0,0 +1,60 @@
+import { useMemo as a } from "react";
+import { useTranslation as t } from "react-i18next";
+import { useI18n as n } from "../../../../i18n/I18n.js";
+function m() {
+  n("Employee.Management.PaymentMethodBankForm");
+  const { t: e } = t("Employee.Management.PaymentMethodBankForm");
+  return a(
+    () => ({
+      en: {
+        nameLabel: e("nameLabel"),
+        routingNumberLabel: e("routingNumberLabel"),
+        routingNumberDescription: e("routingNumberDescription"),
+        accountNumberLabel: e("accountNumberLabel"),
+        accountTypeLabel: e("accountTypeLabel"),
+        accountTypeChecking: e("accountTypeChecking"),
+        accountTypeSavings: e("accountTypeSavings"),
+        cancelCta: e("cancelCta"),
+        saveCta: e("saveCta"),
+        validations: {
+          accountName: e("validations.accountName"),
+          routingNumber: e("validations.routingNumber"),
+          accountNumber: e("validations.accountNumber"),
+          accountNumberFormat: e("validations.accountNumberFormat")
+        }
+      }
+    }),
+    [e]
+  );
+}
+function c() {
+  n("Employee.Management.PaymentMethodSplitForm");
+  const { t: e } = t("Employee.Management.PaymentMethodSplitForm");
+  return a(
+    () => ({
+      en: {
+        title: e("title"),
+        splitDescription: e("splitDescription"),
+        splitByLabel: e("splitByLabel"),
+        percentageLabel: e("percentageLabel"),
+        amountLabel: e("amountLabel"),
+        splitAmountLabel: e("splitAmountLabel"),
+        draggableListLabel: e("draggableListLabel"),
+        remainderLabel: e("remainderLabel"),
+        cancelCta: e("cancelCta"),
+        saveCta: e("saveCta"),
+        validations: {
+          percentageErrorWithTotal: e("validations.percentageErrorWithTotal"),
+          amountError: e("validations.amountError"),
+          percentageAmountError: e("validations.percentageAmountError")
+        }
+      }
+    }),
+    [e]
+  );
+}
+export {
+  m as useManagementBankFormDictionary,
+  c as useManagementSplitFormDictionary
+};
+//# sourceMappingURL=useFormDictionary.js.map

package/dist/components/Employee/PaymentMethod/management/useFormDictionary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormDictionary.js","sources":["../../../../../src/components/Employee/PaymentMethod/management/useFormDictionary.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { BankFormBodyDictionary } from '../shared/BankFormBody'\nimport type { SplitPaymentsFormBodyDictionary } from '../shared/SplitPaymentsFormBody'\nimport { useI18n } from '@/i18n'\n\n/**\n * Resolves the shared `BankFormBody`'s text against management's dedicated\n * `Employee.Management.PaymentMethodBankForm` namespace, so partner overrides on\n * the management bank form don't leak into the onboarding form.\n */\nexport function useManagementBankFormDictionary(): BankFormBodyDictionary {\n  useI18n('Employee.Management.PaymentMethodBankForm')\n  const { t } = useTranslation('Employee.Management.PaymentMethodBankForm')\n\n  return useMemo<BankFormBodyDictionary>(\n    () => ({\n      en: {\n        nameLabel: t('nameLabel'),\n        routingNumberLabel: t('routingNumberLabel'),\n        routingNumberDescription: t('routingNumberDescription'),\n        accountNumberLabel: t('accountNumberLabel'),\n        accountTypeLabel: t('accountTypeLabel'),\n        accountTypeChecking: t('accountTypeChecking'),\n        accountTypeSavings: t('accountTypeSavings'),\n        cancelCta: t('cancelCta'),\n        saveCta: t('saveCta'),\n        validations: {\n          accountName: t('validations.accountName'),\n          routingNumber: t('validations.routingNumber'),\n          accountNumber: t('validations.accountNumber'),\n          accountNumberFormat: t('validations.accountNumberFormat'),\n        },\n      },\n    }),\n    [t],\n  )\n}\n\n/**\n * Resolves the shared `SplitPaymentsFormBody`'s text against management's\n * dedicated `Employee.Management.PaymentMethodSplitForm` namespace, so partner\n * overrides on the management split form don't leak into the onboarding form.\n * Interpolated templates (`splitAmountLabel`,\n * `validations.percentageErrorWithTotal`) are passed through unresolved so the\n * body interpolates them at render time.\n */\nexport function useManagementSplitFormDictionary(): SplitPaymentsFormBodyDictionary {\n  useI18n('Employee.Management.PaymentMethodSplitForm')\n  const { t } = useTranslation('Employee.Management.PaymentMethodSplitForm')\n\n  return useMemo<SplitPaymentsFormBodyDictionary>(\n    () => ({\n      en: {\n        title: t('title'),\n        splitDescription: t('splitDescription'),\n        splitByLabel: t('splitByLabel'),\n        percentageLabel: t('percentageLabel'),\n        amountLabel: t('amountLabel'),\n        splitAmountLabel: t('splitAmountLabel'),\n        draggableListLabel: t('draggableListLabel'),\n        remainderLabel: t('remainderLabel'),\n        cancelCta: t('cancelCta'),\n        saveCta: t('saveCta'),\n        validations: {\n          percentageErrorWithTotal: t('validations.percentageErrorWithTotal'),\n          amountError: t('validations.amountError'),\n          percentageAmountError: t('validations.percentageAmountError'),\n        },\n      },\n    }),\n    [t],\n  )\n}\n"],"names":["useManagementBankFormDictionary","useI18n","t","useTranslation","useMemo","useManagementSplitFormDictionary"],"mappings":";;;AAWO,SAASA,IAA0D;AACxE,EAAAC,EAAQ,2CAA2C;AACnD,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,2CAA2C;AAExE,SAAOC;AAAA,IACL,OAAO;AAAA,MACL,IAAI;AAAA,QACF,WAAWF,EAAE,WAAW;AAAA,QACxB,oBAAoBA,EAAE,oBAAoB;AAAA,QAC1C,0BAA0BA,EAAE,0BAA0B;AAAA,QACtD,oBAAoBA,EAAE,oBAAoB;AAAA,QAC1C,kBAAkBA,EAAE,kBAAkB;AAAA,QACtC,qBAAqBA,EAAE,qBAAqB;AAAA,QAC5C,oBAAoBA,EAAE,oBAAoB;AAAA,QAC1C,WAAWA,EAAE,WAAW;AAAA,QACxB,SAASA,EAAE,SAAS;AAAA,QACpB,aAAa;AAAA,UACX,aAAaA,EAAE,yBAAyB;AAAA,UACxC,eAAeA,EAAE,2BAA2B;AAAA,UAC5C,eAAeA,EAAE,2BAA2B;AAAA,UAC5C,qBAAqBA,EAAE,iCAAiC;AAAA,QAAA;AAAA,MAC1D;AAAA,IACF;AAAA,IAEF,CAACA,CAAC;AAAA,EAAA;AAEN;AAUO,SAASG,IAAoE;AAClF,EAAAJ,EAAQ,4CAA4C;AACpD,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,4CAA4C;AAEzE,SAAOC;AAAA,IACL,OAAO;AAAA,MACL,IAAI;AAAA,QACF,OAAOF,EAAE,OAAO;AAAA,QAChB,kBAAkBA,EAAE,kBAAkB;AAAA,QACtC,cAAcA,EAAE,cAAc;AAAA,QAC9B,iBAAiBA,EAAE,iBAAiB;AAAA,QACpC,aAAaA,EAAE,aAAa;AAAA,QAC5B,kBAAkBA,EAAE,kBAAkB;AAAA,QACtC,oBAAoBA,EAAE,oBAAoB;AAAA,QAC1C,gBAAgBA,EAAE,gBAAgB;AAAA,QAClC,WAAWA,EAAE,WAAW;AAAA,QACxB,SAASA,EAAE,SAAS;AAAA,QACpB,aAAa;AAAA,UACX,0BAA0BA,EAAE,sCAAsC;AAAA,UAClE,aAAaA,EAAE,yBAAyB;AAAA,UACxC,uBAAuBA,EAAE,mCAAmC;AAAA,QAAA;AAAA,MAC9D;AAAA,IACF;AAAA,IAEF,CAACA,CAAC;AAAA,EAAA;AAEN;"}

package/dist/components/Employee/PaymentMethod/onboarding/BankForm.d.ts

@@ -5,4 +5,4 @@ export interface BankFormProps extends Omit<UseBankFormProps, 'employeeId'> {
     employeeId: string;
     onEvent: OnEventType<EventType, unknown>;
 }
-export declare function BankForm({ employeeId, onEvent, ...hookProps }: BankFormProps): import("react/jsx-runtime").JSX.Element;
+export declare function BankForm({ employeeId, onEvent, ...hookProps }: BankFormProps): import("react").JSX.Element;