@gusto/embedded-react-sdk 0.46.2 → 0.47.0

package/dist/components/Employee/Deductions/{DeductionsList → onboarding/DeductionsList}/DeductionsList.js

@@ -1,20 +1,18 @@
 import { jsx as r, jsxs as o } from "react/jsx-runtime";
 import { useTranslation as D } from "react-i18next";
-import { formatDeductionAmount as x } from "../shared/formatDeductionAmount.js";
-import { Flex as c } from "../../../Common/Flex/Flex.js";
-import "classnames";
-import "../../../../shared/constants.js";
-import { ActionsLayout as k } from "../../../Common/ActionsLayout/ActionsLayout.js";
-import m from "../../../../hooks/useNumberFormatter.js";
-import P from "../../../../assets/icons/pencil.svg.js";
-import b from "../../../../assets/icons/trashcan.svg.js";
-import { useComponentContext as T } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as v } from "../../../../i18n/I18n.js";
-import w from "../../../../assets/icons/plus-circle.svg.js";
-import { HamburgerMenu as A } from "../../../Common/HamburgerMenu/HamburgerMenu.js";
-import { useDataView as V } from "../../../Common/DataView/useDataView.js";
-import { DataView as L } from "../../../Common/DataView/DataView.js";
-function Q({
+import { formatDeductionAmount as x } from "../../shared/formatDeductionAmount.js";
+import { Flex as c } from "../../../../Common/Flex/Flex.js";
+import { ActionsLayout as k } from "../../../../Common/ActionsLayout/ActionsLayout.js";
+import m from "../../../../../hooks/useNumberFormatter.js";
+import P from "../../../../../assets/icons/pencil.svg.js";
+import b from "../../../../../assets/icons/trashcan.svg.js";
+import { useComponentContext as T } from "../../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as v } from "../../../../../i18n/I18n.js";
+import w from "../../../../../assets/icons/plus-circle.svg.js";
+import { HamburgerMenu as A } from "../../../../Common/HamburgerMenu/HamburgerMenu.js";
+import { useDataView as V } from "../../../../Common/DataView/useDataView.js";
+import { DataView as L } from "../../../../Common/DataView/DataView.js";
+function K({
   className: a,
   deductionsList: i,
   onAdd: u,
@@ -23,7 +21,7 @@ function Q({
   onContinue: d
 }) {
   v("Employee.Deductions");
-  const { t: e } = D("Employee.Deductions"), n = T(), p = m("currency"), f = m("percent"), { deductions: g } = i.data, C = i.status.isPending, { ...h } = V({
+  const { t: e } = D("Employee.Deductions"), t = T(), p = m("currency"), f = m("percent"), { deductions: g } = i.data, C = i.status.isPending, { ...h } = V({
     data: g,
     columns: [
       {
@@ -33,19 +31,19 @@ function Q({
       {
         key: "recurring",
         title: e("frequencyColumn"),
-        render: (t) => t.recurring ? e("recurringText") : e("nonRecurringText")
+        render: (n) => n.recurring ? e("recurringText") : e("nonRecurringText")
       },
       {
         key: "amount",
         title: e("withheldColumn"),
-        render: (t) => x(t, {
+        render: (n) => x(n, {
           formatCurrency: p,
           formatPercent: f,
           formatPerPaycheck: (y) => e("recurringAmount", { value: y })
         })
       }
     ],
-    itemMenu: (t) => /* @__PURE__ */ r(
+    itemMenu: (n) => /* @__PURE__ */ r(
       A,
       {
         isLoading: C,
@@ -53,14 +51,14 @@ function Q({
           {
             label: e("editCta"),
             onClick: () => {
-              l(t);
+              l(n);
             },
             icon: /* @__PURE__ */ r(P, { "aria-hidden": !0 })
           },
           {
             label: e("deleteCta"),
             onClick: () => {
-              s(t);
+              s(n);
             },
             icon: /* @__PURE__ */ r(b, { "aria-hidden": !0 })
           }
@@ -70,20 +68,20 @@ function Q({
   });
   return /* @__PURE__ */ r("section", { className: a, children: /* @__PURE__ */ o(c, { flexDirection: "column", gap: 32, children: [
     /* @__PURE__ */ o(c, { flexDirection: "column", gap: 2, children: [
-      /* @__PURE__ */ r(n.Heading, { as: "h2", children: e("pageTitle") }),
-      /* @__PURE__ */ r(n.Text, { variant: "supporting", children: e("includeDeductionsDescriptionV2") })
+      /* @__PURE__ */ r(t.Heading, { as: "h2", children: e("pageTitle") }),
+      /* @__PURE__ */ r(t.Text, { variant: "supporting", children: e("includeDeductionsDescriptionV2") })
     ] }),
     /* @__PURE__ */ r(L, { label: e("deductionsTableLabel"), ...h }),
     /* @__PURE__ */ o(k, { children: [
-      /* @__PURE__ */ o(n.Button, { variant: "secondary", onClick: u, children: [
+      /* @__PURE__ */ o(t.Button, { variant: "secondary", onClick: u, children: [
         /* @__PURE__ */ r(w, {}),
         e("addDeductionCta")
       ] }),
-      /* @__PURE__ */ r(n.Button, { onClick: d, children: e("continueCta") })
+      /* @__PURE__ */ r(t.Button, { onClick: d, children: e("continueCta") })
     ] })
   ] }) });
 }
 export {
-  Q as DeductionsList
+  K as DeductionsList
 };
 //# sourceMappingURL=DeductionsList.js.map

package/dist/components/Employee/Deductions/onboarding/DeductionsList/DeductionsList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeductionsList.js","sources":["../../../../../../src/components/Employee/Deductions/onboarding/DeductionsList/DeductionsList.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { Garnishment } from '@gusto/embedded-api-v-2025-11-15/models/components/garnishment'\nimport type { UseDeductionsListReady } from '../../shared/useDeductionsList'\nimport { formatDeductionAmount } from '../../shared/formatDeductionAmount'\nimport { useDataView, DataView } from '@/components/Common'\nimport { ActionsLayout } from '@/components/Common'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport PlusCircleIcon from '@/assets/icons/plus-circle.svg?react'\n\nexport interface DeductionsListProps {\n  className?: string\n  deductionsList: UseDeductionsListReady\n  onAdd: () => void\n  onEdit: (deduction: Garnishment) => void\n  onDelete: (deduction: Garnishment) => void\n  onContinue: () => void\n}\n\nexport function DeductionsList({\n  className,\n  deductionsList,\n  onAdd,\n  onEdit,\n  onDelete,\n  onContinue,\n}: DeductionsListProps) {\n  useI18n('Employee.Deductions')\n  const { t } = useTranslation('Employee.Deductions')\n  const Components = useComponentContext()\n  const formatCurrency = useNumberFormatter('currency')\n  const formatPercent = useNumberFormatter('percent')\n\n  const { deductions } = deductionsList.data\n  const isPendingAny = deductionsList.status.isPending\n\n  const { ...dataViewProps } = useDataView({\n    data: deductions,\n    columns: [\n      {\n        key: 'description',\n        title: t('nameColumn'),\n      },\n      {\n        key: 'recurring',\n        title: t('frequencyColumn'),\n        render: deduction => {\n          return deduction.recurring ? t('recurringText') : t('nonRecurringText')\n        },\n      },\n      {\n        key: 'amount',\n        title: t('withheldColumn'),\n        render: deduction =>\n          formatDeductionAmount(deduction, {\n            formatCurrency,\n            formatPercent,\n            formatPerPaycheck: (value: string) => t('recurringAmount', { value }),\n          }),\n      },\n    ],\n    itemMenu: deduction => {\n      return (\n        <HamburgerMenu\n          isLoading={isPendingAny}\n          items={[\n            {\n              label: t('editCta'),\n              onClick: () => {\n                onEdit(deduction)\n              },\n              icon: <PencilSvg aria-hidden />,\n            },\n            {\n              label: t('deleteCta'),\n              onClick: () => {\n                onDelete(deduction)\n              },\n              icon: <TrashCanSvg aria-hidden />,\n            },\n          ]}\n        />\n      )\n    },\n  })\n\n  return (\n    <section className={className}>\n      <Flex flexDirection=\"column\" gap={32}>\n        <Flex flexDirection=\"column\" gap={2}>\n          <Components.Heading as=\"h2\">{t('pageTitle')}</Components.Heading>\n          <Components.Text variant=\"supporting\">\n            {t('includeDeductionsDescriptionV2')}\n          </Components.Text>\n        </Flex>\n\n        <DataView label={t('deductionsTableLabel')} {...dataViewProps} />\n        <ActionsLayout>\n          <Components.Button variant=\"secondary\" onClick={onAdd}>\n            <PlusCircleIcon />\n            {t('addDeductionCta')}\n          </Components.Button>\n          <Components.Button onClick={onContinue}>{t('continueCta')}</Components.Button>\n        </ActionsLayout>\n      </Flex>\n    </section>\n  )\n}\n"],"names":["DeductionsList","className","deductionsList","onAdd","onEdit","onDelete","onContinue","useI18n","t","useTranslation","Components","useComponentContext","formatCurrency","useNumberFormatter","formatPercent","deductions","isPendingAny","dataViewProps","useDataView","deduction","formatDeductionAmount","value","jsx","HamburgerMenu","PencilSvg","TrashCanSvg","jsxs","Flex","DataView","ActionsLayout","PlusCircleIcon"],"mappings":";;;;;;;;;;;;;;AAwBO,SAASA,EAAe;AAAA,EAC7B,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AACF,GAAwB;AACtB,EAAAC,EAAQ,qBAAqB;AAC7B,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,qBAAqB,GAC5CC,IAAaC,EAAA,GACbC,IAAiBC,EAAmB,UAAU,GAC9CC,IAAgBD,EAAmB,SAAS,GAE5C,EAAE,YAAAE,MAAeb,EAAe,MAChCc,IAAed,EAAe,OAAO,WAErC,EAAE,GAAGe,EAAA,IAAkBC,EAAY;AAAA,IACvC,MAAMH;AAAA,IACN,SAAS;AAAA,MACP;AAAA,QACE,KAAK;AAAA,QACL,OAAOP,EAAE,YAAY;AAAA,MAAA;AAAA,MAEvB;AAAA,QACE,KAAK;AAAA,QACL,OAAOA,EAAE,iBAAiB;AAAA,QAC1B,QAAQ,CAAAW,MACCA,EAAU,YAAYX,EAAE,eAAe,IAAIA,EAAE,kBAAkB;AAAA,MACxE;AAAA,MAEF;AAAA,QACE,KAAK;AAAA,QACL,OAAOA,EAAE,gBAAgB;AAAA,QACzB,QAAQ,CAAAW,MACNC,EAAsBD,GAAW;AAAA,UAC/B,gBAAAP;AAAA,UACA,eAAAE;AAAA,UACA,mBAAmB,CAACO,MAAkBb,EAAE,mBAAmB,EAAE,OAAAa,GAAO;AAAA,QAAA,CACrE;AAAA,MAAA;AAAA,IACL;AAAA,IAEF,UAAU,CAAAF,MAEN,gBAAAG;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWP;AAAA,QACX,OAAO;AAAA,UACL;AAAA,YACE,OAAOR,EAAE,SAAS;AAAA,YAClB,SAAS,MAAM;AACb,cAAAJ,EAAOe,CAAS;AAAA,YAClB;AAAA,YACA,MAAM,gBAAAG,EAACE,GAAA,EAAU,eAAW,GAAA,CAAC;AAAA,UAAA;AAAA,UAE/B;AAAA,YACE,OAAOhB,EAAE,WAAW;AAAA,YACpB,SAAS,MAAM;AACb,cAAAH,EAASc,CAAS;AAAA,YACpB;AAAA,YACA,MAAM,gBAAAG,EAACG,GAAA,EAAY,eAAW,GAAA,CAAC;AAAA,UAAA;AAAA,QACjC;AAAA,MACF;AAAA,IAAA;AAAA,EAGN,CACD;AAED,SACE,gBAAAH,EAAC,aAAQ,WAAArB,GACP,UAAA,gBAAAyB,EAACC,KAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,IAAA,gBAAAD,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAL,EAACZ,EAAW,SAAX,EAAmB,IAAG,MAAM,UAAAF,EAAE,WAAW,GAAE;AAAA,MAC5C,gBAAAc,EAACZ,EAAW,MAAX,EAAgB,SAAQ,cACtB,UAAAF,EAAE,gCAAgC,EAAA,CACrC;AAAA,IAAA,GACF;AAAA,sBAECoB,GAAA,EAAS,OAAOpB,EAAE,sBAAsB,GAAI,GAAGS,GAAe;AAAA,sBAC9DY,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAH,EAAChB,EAAW,QAAX,EAAkB,SAAQ,aAAY,SAASP,GAC9C,UAAA;AAAA,QAAA,gBAAAmB,EAACQ,GAAA,EAAe;AAAA,QACftB,EAAE,iBAAiB;AAAA,MAAA,GACtB;AAAA,MACA,gBAAAc,EAACZ,EAAW,QAAX,EAAkB,SAASJ,GAAa,UAAAE,EAAE,aAAa,EAAA,CAAE;AAAA,IAAA,EAAA,CAC5D;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}

package/dist/components/Employee/Deductions/{IncludeDeductions → onboarding/IncludeDeductions}/IncludeDeductions.d.ts

@@ -3,4 +3,4 @@ export interface IncludeDeductionsProps {
     onAdd: () => void;
     onContinue: () => void;
 }
-export declare function IncludeDeductions({ className, onAdd, onContinue }: IncludeDeductionsProps): import("react/jsx-runtime").JSX.Element;
+export declare function IncludeDeductions({ className, onAdd, onContinue }: IncludeDeductionsProps): import("react").JSX.Element;

package/dist/components/Employee/Deductions/{IncludeDeductions → onboarding/IncludeDeductions}/IncludeDeductions.js

@@ -2,13 +2,13 @@ import { jsx as t, jsxs as o } from "react/jsx-runtime";
 import m from "classnames";
 import { useTranslation as a } from "react-i18next";
 import i from "./IncludeDeductions.module.scss.js";
-import { Grid as d } from "../../../Common/Grid/Grid.js";
-import { Flex as r } from "../../../Common/Flex/Flex.js";
-import { ActionsLayout as u } from "../../../Common/ActionsLayout/ActionsLayout.js";
-import { useComponentContext as p } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as h } from "../../../../i18n/I18n.js";
-import f from "../../../../assets/icons/coins-hand.svg.js";
-import C from "../../../../assets/icons/plus-circle.svg.js";
+import { Grid as d } from "../../../../Common/Grid/Grid.js";
+import { Flex as r } from "../../../../Common/Flex/Flex.js";
+import { ActionsLayout as u } from "../../../../Common/ActionsLayout/ActionsLayout.js";
+import { useComponentContext as p } from "../../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as h } from "../../../../../i18n/I18n.js";
+import f from "../../../../../assets/icons/coins-hand.svg.js";
+import C from "../../../../../assets/icons/plus-circle.svg.js";
 function j({ className: c, onAdd: s, onContinue: l }) {
   h("Employee.Deductions");
   const { t: n } = a("Employee.Deductions"), e = p();

package/dist/components/Employee/Deductions/onboarding/IncludeDeductions/IncludeDeductions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IncludeDeductions.js","sources":["../../../../../../src/components/Employee/Deductions/onboarding/IncludeDeductions/IncludeDeductions.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport styles from './IncludeDeductions.module.scss'\nimport { Grid } from '@/components/Common/Grid/Grid'\nimport { ActionsLayout, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport CoinsHandsIcon from '@/assets/icons/coins-hand.svg?react'\nimport PlusCircleIcon from '@/assets/icons/plus-circle.svg?react'\n\nexport interface IncludeDeductionsProps {\n  className?: string\n  onAdd: () => void\n  onContinue: () => void\n}\n\nexport function IncludeDeductions({ className, onAdd, onContinue }: IncludeDeductionsProps) {\n  useI18n('Employee.Deductions')\n  const { t } = useTranslation('Employee.Deductions')\n  const Components = useComponentContext()\n\n  return (\n    <section className={classNames(styles.container, className)}>\n      <Grid gridTemplateColumns=\"1fr\">\n        <Flex flexDirection=\"column\" gap={2}>\n          <Components.Heading as=\"h2\">{t('pageTitle')}</Components.Heading>\n          <Components.Text variant=\"supporting\">\n            {t('includeDeductionsDescriptionV2')}\n          </Components.Text>\n        </Flex>\n\n        <section className={styles.emptyStateContainer}>\n          <Flex flexDirection=\"column\" gap={16} justifyContent=\"center\" alignItems=\"center\">\n            <div className={styles.coinHandsIconContainer}>\n              <CoinsHandsIcon width={24} height={24} />\n            </div>\n            <Components.Text weight=\"bold\">{t('includeDeductionsEmptyState')}</Components.Text>\n            <Components.Button\n              type=\"button\"\n              variant=\"secondary\"\n              onClick={onAdd}\n              className={styles.addDeductionButton}\n            >\n              <PlusCircleIcon />\n              {t('addDeductionButtonCta')}\n            </Components.Button>\n          </Flex>\n        </section>\n        <ActionsLayout>\n          <Components.Button type=\"button\" onClick={onContinue}>\n            {t('continueCta')}\n          </Components.Button>\n        </ActionsLayout>\n      </Grid>\n    </section>\n  )\n}\n"],"names":["IncludeDeductions","className","onAdd","onContinue","useI18n","t","useTranslation","Components","useComponentContext","jsx","classNames","styles","jsxs","Grid","Flex","CoinsHandsIcon","PlusCircleIcon","ActionsLayout"],"mappings":";;;;;;;;;;;AAgBO,SAASA,EAAkB,EAAE,WAAAC,GAAW,OAAAC,GAAO,YAAAC,KAAsC;AAC1F,EAAAC,EAAQ,qBAAqB;AAC7B,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,qBAAqB,GAC5CC,IAAaC,EAAA;AAEnB,SACE,gBAAAC,EAAC,WAAA,EAAQ,WAAWC,EAAWC,EAAO,WAAWV,CAAS,GACxD,UAAA,gBAAAW,EAACC,GAAA,EAAK,qBAAoB,OACxB,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAL,EAACF,EAAW,SAAX,EAAmB,IAAG,MAAM,UAAAF,EAAE,WAAW,GAAE;AAAA,MAC5C,gBAAAI,EAACF,EAAW,MAAX,EAAgB,SAAQ,cACtB,UAAAF,EAAE,gCAAgC,EAAA,CACrC;AAAA,IAAA,GACF;AAAA,IAEA,gBAAAI,EAAC,WAAA,EAAQ,WAAWE,EAAO,qBACzB,UAAA,gBAAAC,EAACE,GAAA,EAAK,eAAc,UAAS,KAAK,IAAI,gBAAe,UAAS,YAAW,UACvE,UAAA;AAAA,MAAA,gBAAAL,EAAC,OAAA,EAAI,WAAWE,EAAO,wBACrB,UAAA,gBAAAF,EAACM,KAAe,OAAO,IAAI,QAAQ,GAAA,CAAI,EAAA,CACzC;AAAA,MACA,gBAAAN,EAACF,EAAW,MAAX,EAAgB,QAAO,QAAQ,UAAAF,EAAE,6BAA6B,GAAE;AAAA,MACjE,gBAAAO;AAAA,QAACL,EAAW;AAAA,QAAX;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,SAASL;AAAA,UACT,WAAWS,EAAO;AAAA,UAElB,UAAA;AAAA,YAAA,gBAAAF,EAACO,GAAA,EAAe;AAAA,YACfX,EAAE,uBAAuB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC5B,EAAA,CACF,EAAA,CACF;AAAA,IACA,gBAAAI,EAACQ,GAAA,EACC,UAAA,gBAAAR,EAACF,EAAW,QAAX,EAAkB,MAAK,UAAS,SAASJ,GACvC,UAAAE,EAAE,aAAa,GAClB,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}

package/dist/components/Employee/Deductions/{deductionsContextualComponents.d.ts → onboarding/deductionsContextualComponents.d.ts}

@@ -1,6 +1,6 @@
-import { Garnishment } from '@gusto/embedded-api/models/components/garnishment';
-import { FlowContextInterface } from '../../Flow/useFlow';
-import { componentEvents } from '../../../shared/constants';
+import { Garnishment } from '@gusto/embedded-api-v-2025-11-15/models/components/garnishment';
+import { FlowContextInterface } from '../../../Flow/useFlow';
+import { componentEvents } from '../../../../shared/constants';
 export type EventPayloads = {
     [componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_YES]: undefined;
     [componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_NO]: undefined;
@@ -19,6 +19,6 @@ export interface DeductionsContextInterface extends FlowContextInterface {
     /** Set by the EDIT transition; consumed by the form-mode contextual. */
     editingDeductionId?: string;
 }
-export declare function IncludeDeductionsContextual(): import("react/jsx-runtime").JSX.Element;
-export declare function DeductionsListContextual(): import("react/jsx-runtime").JSX.Element;
-export declare function DeductionsFormContextual(): import("react/jsx-runtime").JSX.Element;
+export declare function IncludeDeductionsContextual(): import("react").JSX.Element;
+export declare function DeductionsListContextual(): import("react").JSX.Element;
+export declare function DeductionsFormContextual(): import("react").JSX.Element;

package/dist/components/Employee/Deductions/onboarding/deductionsContextualComponents.js

@@ -0,0 +1,76 @@
+import { jsx as r } from "react/jsx-runtime";
+import { useDeductionsList as O } from "../shared/useDeductionsList.js";
+import { IncludeDeductions as C } from "./IncludeDeductions/IncludeDeductions.js";
+import { DeductionsList as L } from "./DeductionsList/DeductionsList.js";
+import { useOnboardingDeductionsFormDictionary as I } from "./useFormDictionary.js";
+import { BaseLayout as s } from "../../../Base/Base.js";
+import { useFlow as l } from "../../../Flow/useFlow.js";
+import { componentEvents as o } from "../../../../shared/constants.js";
+import { ensureRequired as m } from "../../../../helpers/ensureRequired.js";
+import { DeductionsForm as f } from "../shared/DeductionsForm/DeductionsForm.js";
+function v() {
+  const { onEvent: t } = l();
+  return /* @__PURE__ */ r(s, { children: /* @__PURE__ */ r(C, { onAdd: () => {
+    t(o.EMPLOYEE_DEDUCTION_INCLUDE_YES);
+  }, onContinue: () => {
+    t(o.EMPLOYEE_DEDUCTION_INCLUDE_NO), t(o.EMPLOYEE_DEDUCTION_DONE);
+  } }) });
+}
+function h() {
+  const { employeeId: t, onEvent: n } = l(), e = O({ employeeId: m(t) });
+  if (e.isLoading)
+    return /* @__PURE__ */ r(s, { isLoading: !0, error: e.errorHandling.errors });
+  const i = () => {
+    n(o.EMPLOYEE_DEDUCTION_ADD);
+  }, D = (E) => {
+    n(o.EMPLOYEE_DEDUCTION_EDIT, E);
+  }, c = () => {
+    n(o.EMPLOYEE_DEDUCTION_DONE);
+  }, u = async (E) => {
+    const d = await e.actions.onDelete(E);
+    d && (d.data.remainingActiveCount === 0 ? n(o.EMPLOYEE_DEDUCTION_DELETED_EMPTY) : n(o.EMPLOYEE_DEDUCTION_DELETED, d.data.garnishment));
+  };
+  return /* @__PURE__ */ r(s, { error: e.errorHandling.errors, children: /* @__PURE__ */ r(
+    L,
+    {
+      deductionsList: e,
+      onAdd: i,
+      onEdit: D,
+      onDelete: (E) => {
+        u(E);
+      },
+      onContinue: c
+    }
+  ) });
+}
+function x() {
+  const { employeeId: t, editingDeductionId: n, onEvent: e } = l(), i = O({ employeeId: m(t) }), D = I();
+  if (i.isLoading)
+    return /* @__PURE__ */ r(s, { isLoading: !0, error: i.errorHandling.errors });
+  const c = n ? i.data.deductions.find((a) => a.uuid === n) ?? null : null, u = i.data.deductions.length > 0, E = (a, _) => {
+    e(
+      _ === "create" ? o.EMPLOYEE_DEDUCTION_CREATED : o.EMPLOYEE_DEDUCTION_UPDATED,
+      a
+    );
+  }, d = () => {
+    e(
+      u ? o.EMPLOYEE_DEDUCTION_CANCEL : o.EMPLOYEE_DEDUCTION_CANCEL_EMPTY
+    );
+  };
+  return /* @__PURE__ */ r(s, { error: i.errorHandling.errors, children: /* @__PURE__ */ r(
+    f,
+    {
+      employeeId: m(t),
+      deduction: c,
+      dictionary: D,
+      onSaved: E,
+      onCancel: d
+    }
+  ) });
+}
+export {
+  x as DeductionsFormContextual,
+  h as DeductionsListContextual,
+  v as IncludeDeductionsContextual
+};
+//# sourceMappingURL=deductionsContextualComponents.js.map

package/dist/components/Employee/Deductions/onboarding/deductionsContextualComponents.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"deductionsContextualComponents.js","sources":["../../../../../src/components/Employee/Deductions/onboarding/deductionsContextualComponents.tsx"],"sourcesContent":["import { type Garnishment } from '@gusto/embedded-api-v-2025-11-15/models/components/garnishment'\nimport { useDeductionsList } from '../shared/useDeductionsList'\nimport { DeductionsForm } from '../shared/DeductionsForm'\nimport { IncludeDeductions } from './IncludeDeductions/IncludeDeductions'\nimport { DeductionsList } from './DeductionsList/DeductionsList'\nimport { useOnboardingDeductionsFormDictionary } from './useFormDictionary'\nimport { BaseLayout } from '@/components/Base/Base'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport { componentEvents } from '@/shared/constants'\nimport { ensureRequired } from '@/helpers/ensureRequired'\n\nexport type EventPayloads = {\n  [componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_YES]: undefined\n  [componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_NO]: undefined\n  [componentEvents.EMPLOYEE_DEDUCTION_ADD]: undefined\n  [componentEvents.EMPLOYEE_DEDUCTION_EDIT]: Garnishment\n  [componentEvents.EMPLOYEE_DEDUCTION_CANCEL]: undefined\n  [componentEvents.EMPLOYEE_DEDUCTION_CANCEL_EMPTY]: undefined\n  [componentEvents.EMPLOYEE_DEDUCTION_CREATED]: Garnishment\n  [componentEvents.EMPLOYEE_DEDUCTION_UPDATED]: Garnishment\n  [componentEvents.EMPLOYEE_DEDUCTION_DELETED]: Garnishment\n  [componentEvents.EMPLOYEE_DEDUCTION_DELETED_EMPTY]: undefined\n  [componentEvents.EMPLOYEE_DEDUCTION_DONE]: undefined\n}\n\nexport interface DeductionsContextInterface extends FlowContextInterface {\n  employeeId: string\n  /** Set by the EDIT transition; consumed by the form-mode contextual. */\n  editingDeductionId?: string\n}\n\nexport function IncludeDeductionsContextual() {\n  const { onEvent } = useFlow<DeductionsContextInterface>()\n\n  const onAdd = () => {\n    onEvent(componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_YES)\n  }\n  const onContinue = () => {\n    // The outer onboarding flow advances on DONE; partners also receive\n    // INCLUDE_NO so analytics can distinguish the empty-state confirmation.\n    onEvent(componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_NO)\n    onEvent(componentEvents.EMPLOYEE_DEDUCTION_DONE)\n  }\n\n  // BaseLayout's inner FadeIn (width: 100%) is the canonical \"page\" container\n  // for content rendered inside <Flow>. Without it the outer row-direction\n  // Flex in Flow collapses to the intrinsic content width of its single\n  // child, producing the \"squashed\" layout for narrow content.\n  return (\n    <BaseLayout>\n      <IncludeDeductions onAdd={onAdd} onContinue={onContinue} />\n    </BaseLayout>\n  )\n}\n\nexport function DeductionsListContextual() {\n  const { employeeId, onEvent } = useFlow<DeductionsContextInterface>()\n  const list = useDeductionsList({ employeeId: ensureRequired(employeeId) })\n\n  if (list.isLoading) {\n    return <BaseLayout isLoading error={list.errorHandling.errors} />\n  }\n\n  const onAdd = () => {\n    onEvent(componentEvents.EMPLOYEE_DEDUCTION_ADD)\n  }\n  const onEdit = (deduction: Garnishment) => {\n    onEvent(componentEvents.EMPLOYEE_DEDUCTION_EDIT, deduction)\n  }\n  const onContinue = () => {\n    onEvent(componentEvents.EMPLOYEE_DEDUCTION_DONE)\n  }\n  const onDelete = async (deduction: Garnishment) => {\n    const result = await list.actions.onDelete(deduction)\n    if (!result) return\n    if (result.data.remainingActiveCount === 0) {\n      onEvent(componentEvents.EMPLOYEE_DEDUCTION_DELETED_EMPTY)\n    } else {\n      onEvent(componentEvents.EMPLOYEE_DEDUCTION_DELETED, result.data.garnishment)\n    }\n  }\n\n  return (\n    <BaseLayout error={list.errorHandling.errors}>\n      <DeductionsList\n        deductionsList={list}\n        onAdd={onAdd}\n        onEdit={onEdit}\n        onDelete={(d: Garnishment) => {\n          void onDelete(d)\n        }}\n        onContinue={onContinue}\n      />\n    </BaseLayout>\n  )\n}\n\nexport function DeductionsFormContextual() {\n  const { employeeId, editingDeductionId, onEvent } = useFlow<DeductionsContextInterface>()\n  // The same list query the form hooks use internally — React Query dedupes\n  // so this is the only outstanding request.\n  const list = useDeductionsList({ employeeId: ensureRequired(employeeId) })\n  const formDictionary = useOnboardingDeductionsFormDictionary()\n\n  if (list.isLoading) {\n    return <BaseLayout isLoading error={list.errorHandling.errors} />\n  }\n\n  const deduction = editingDeductionId\n    ? (list.data.deductions.find(d => d.uuid === editingDeductionId) ?? null)\n    : null\n  const hasActiveDeductions = list.data.deductions.length > 0\n\n  const onSaved = (saved: Garnishment, mode: 'create' | 'update') => {\n    onEvent(\n      mode === 'create'\n        ? componentEvents.EMPLOYEE_DEDUCTION_CREATED\n        : componentEvents.EMPLOYEE_DEDUCTION_UPDATED,\n      saved,\n    )\n  }\n  const onCancel = () => {\n    onEvent(\n      hasActiveDeductions\n        ? componentEvents.EMPLOYEE_DEDUCTION_CANCEL\n        : componentEvents.EMPLOYEE_DEDUCTION_CANCEL_EMPTY,\n    )\n  }\n\n  return (\n    <BaseLayout error={list.errorHandling.errors}>\n      <DeductionsForm\n        employeeId={ensureRequired(employeeId)}\n        deduction={deduction}\n        dictionary={formDictionary}\n        onSaved={onSaved}\n        onCancel={onCancel}\n      />\n    </BaseLayout>\n  )\n}\n"],"names":["IncludeDeductionsContextual","onEvent","useFlow","BaseLayout","jsx","IncludeDeductions","componentEvents","DeductionsListContextual","employeeId","list","useDeductionsList","ensureRequired","onAdd","onEdit","deduction","onContinue","onDelete","result","DeductionsList","d","DeductionsFormContextual","editingDeductionId","formDictionary","useOnboardingDeductionsFormDictionary","hasActiveDeductions","onSaved","saved","mode","onCancel","DeductionsForm"],"mappings":";;;;;;;;;;AA+BO,SAASA,IAA8B;AAC5C,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA;AAgBpB,2BACGC,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAAkB,OAhBT,MAAM;AAClB,IAAAJ,EAAQK,EAAgB,8BAA8B;AAAA,EACxD,GAcqC,YAblB,MAAM;AAGvB,IAAAL,EAAQK,EAAgB,6BAA6B,GACrDL,EAAQK,EAAgB,uBAAuB;AAAA,EACjD,GAQ6D,GAC3D;AAEJ;AAEO,SAASC,IAA2B;AACzC,QAAM,EAAE,YAAAC,GAAY,SAAAP,EAAA,IAAYC,EAAA,GAC1BO,IAAOC,EAAkB,EAAE,YAAYC,EAAeH,CAAU,GAAG;AAEzE,MAAIC,EAAK;AACP,6BAAQN,GAAA,EAAW,WAAS,IAAC,OAAOM,EAAK,cAAc,QAAQ;AAGjE,QAAMG,IAAQ,MAAM;AAClB,IAAAX,EAAQK,EAAgB,sBAAsB;AAAA,EAChD,GACMO,IAAS,CAACC,MAA2B;AACzC,IAAAb,EAAQK,EAAgB,yBAAyBQ,CAAS;AAAA,EAC5D,GACMC,IAAa,MAAM;AACvB,IAAAd,EAAQK,EAAgB,uBAAuB;AAAA,EACjD,GACMU,IAAW,OAAOF,MAA2B;AACjD,UAAMG,IAAS,MAAMR,EAAK,QAAQ,SAASK,CAAS;AACpD,IAAKG,MACDA,EAAO,KAAK,yBAAyB,IACvChB,EAAQK,EAAgB,gCAAgC,IAExDL,EAAQK,EAAgB,4BAA4BW,EAAO,KAAK,WAAW;AAAA,EAE/E;AAEA,SACE,gBAAAb,EAACD,GAAA,EAAW,OAAOM,EAAK,cAAc,QACpC,UAAA,gBAAAL;AAAA,IAACc;AAAA,IAAA;AAAA,MACC,gBAAgBT;AAAA,MAChB,OAAAG;AAAA,MACA,QAAAC;AAAA,MACA,UAAU,CAACM,MAAmB;AAC5B,QAAKH,EAASG,CAAC;AAAA,MACjB;AAAA,MACA,YAAAJ;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AAEO,SAASK,IAA2B;AACzC,QAAM,EAAE,YAAAZ,GAAY,oBAAAa,GAAoB,SAAApB,EAAA,IAAYC,EAAA,GAG9CO,IAAOC,EAAkB,EAAE,YAAYC,EAAeH,CAAU,GAAG,GACnEc,IAAiBC,EAAA;AAEvB,MAAId,EAAK;AACP,6BAAQN,GAAA,EAAW,WAAS,IAAC,OAAOM,EAAK,cAAc,QAAQ;AAGjE,QAAMK,IAAYO,IACbZ,EAAK,KAAK,WAAW,KAAK,CAAAU,MAAKA,EAAE,SAASE,CAAkB,KAAK,OAClE,MACEG,IAAsBf,EAAK,KAAK,WAAW,SAAS,GAEpDgB,IAAU,CAACC,GAAoBC,MAA8B;AACjE,IAAA1B;AAAA,MACE0B,MAAS,WACLrB,EAAgB,6BAChBA,EAAgB;AAAA,MACpBoB;AAAA,IAAA;AAAA,EAEJ,GACME,IAAW,MAAM;AACrB,IAAA3B;AAAA,MACEuB,IACIlB,EAAgB,4BAChBA,EAAgB;AAAA,IAAA;AAAA,EAExB;AAEA,SACE,gBAAAF,EAACD,GAAA,EAAW,OAAOM,EAAK,cAAc,QACpC,UAAA,gBAAAL;AAAA,IAACyB;AAAA,IAAA;AAAA,MACC,YAAYlB,EAAeH,CAAU;AAAA,MACrC,WAAAM;AAAA,MACA,YAAYQ;AAAA,MACZ,SAAAG;AAAA,MACA,UAAAG;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/{Common/UI/Badge → Employee/Deductions/onboarding}/index.d.ts

@@ -1,2 +1,2 @@
 import "./types/i18next.d.ts"
-export {};
+export * from './Deductions';

package/dist/components/Employee/Deductions/{stateMachine.js → onboarding/stateMachine.js}

@@ -1,6 +1,6 @@
 import { state as i, transition as E, reduce as t } from "robot3";
 import { DeductionsListContextual as e, IncludeDeductionsContextual as D, DeductionsFormContextual as d } from "./deductionsContextualComponents.js";
-import { componentEvents as n } from "../../../shared/constants.js";
+import { componentEvents as n } from "../../../../shared/constants.js";
 const m = {
   include: i(
     E(

package/dist/components/Employee/Deductions/onboarding/stateMachine.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stateMachine.js","sources":["../../../../../src/components/Employee/Deductions/onboarding/stateMachine.ts"],"sourcesContent":["import { state, transition, reduce, state as final } from 'robot3'\nimport type { DeductionsContextInterface, EventPayloads } from './deductionsContextualComponents'\nimport {\n  IncludeDeductionsContextual,\n  DeductionsListContextual,\n  DeductionsFormContextual,\n} from './deductionsContextualComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\n\nexport const deductionsMachine = {\n  include: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_INCLUDE_YES,\n      'form',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: DeductionsFormContextual,\n          editingDeductionId: undefined,\n        }),\n      ),\n    ),\n    transition(componentEvents.EMPLOYEE_DEDUCTION_DONE, 'done'),\n  ),\n  list: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_ADD,\n      'form',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: DeductionsFormContextual,\n          editingDeductionId: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_EDIT,\n      'form',\n      reduce(\n        (\n          ctx: DeductionsContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.EMPLOYEE_DEDUCTION_EDIT>,\n        ): DeductionsContextInterface => ({\n          ...ctx,\n          component: DeductionsFormContextual,\n          editingDeductionId: ev.payload.uuid,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_DELETED_EMPTY,\n      'include',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: IncludeDeductionsContextual,\n        }),\n      ),\n    ),\n    transition(componentEvents.EMPLOYEE_DEDUCTION_DONE, 'done'),\n  ),\n  form: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_CREATED,\n      'list',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: DeductionsListContextual,\n          editingDeductionId: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_UPDATED,\n      'list',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: DeductionsListContextual,\n          editingDeductionId: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_CANCEL,\n      'list',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: DeductionsListContextual,\n          editingDeductionId: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_CANCEL_EMPTY,\n      'include',\n      reduce(\n        (ctx: DeductionsContextInterface): DeductionsContextInterface => ({\n          ...ctx,\n          component: IncludeDeductionsContextual,\n          editingDeductionId: undefined,\n        }),\n      ),\n    ),\n  ),\n  done: final(),\n}\n"],"names":["deductionsMachine","state","transition","componentEvents","reduce","ctx","DeductionsFormContextual","ev","IncludeDeductionsContextual","DeductionsListContextual","final"],"mappings":";;;AAUO,MAAMA,IAAoB;AAAA,EAC/B,SAASC;AAAA,IACPC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWC;AAAA,UACX,oBAAoB;AAAA,QAAA;AAAA,MACtB;AAAA,IACF;AAAA,IAEFJ,EAAWC,EAAgB,yBAAyB,MAAM;AAAA,EAAA;AAAA,EAE5D,MAAMF;AAAA,IACJC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWC;AAAA,UACX,oBAAoB;AAAA,QAAA;AAAA,MACtB;AAAA,IACF;AAAA,IAEFJ;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEC,GACAE,OACgC;AAAA,UAChC,GAAGF;AAAA,UACH,WAAWC;AAAA,UACX,oBAAoBC,EAAG,QAAQ;AAAA,QAAA;AAAA,MACjC;AAAA,IACF;AAAA,IAEFL;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWG;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,IAEFN,EAAWC,EAAgB,yBAAyB,MAAM;AAAA,EAAA;AAAA,EAE5D,MAAMF;AAAA,IACJC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWI;AAAA,UACX,oBAAoB;AAAA,QAAA;AAAA,MACtB;AAAA,IACF;AAAA,IAEFP;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWI;AAAA,UACX,oBAAoB;AAAA,QAAA;AAAA,MACtB;AAAA,IACF;AAAA,IAEFP;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWI;AAAA,UACX,oBAAoB;AAAA,QAAA;AAAA,MACtB;AAAA,IACF;AAAA,IAEFP;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CAACC,OAAiE;AAAA,UAChE,GAAGA;AAAA,UACH,WAAWG;AAAA,UACX,oBAAoB;AAAA,QAAA;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAAA,EAEF,MAAME,EAAA;AACR;"}

package/dist/components/Employee/Deductions/onboarding/useFormDictionary.d.ts

@@ -0,0 +1,13 @@
+import { DeductionsFormDictionary } from '../shared/DeductionsForm';
+/**
+ * Resolves the shared `DeductionsForm`'s text against onboarding's existing
+ * `Employee.Deductions` namespace.
+ *
+ * The mapping bridges onboarding's historical flat key names
+ * (`addDeductionTitle`, `descriptionLabelV2`, `agency`, `per`, …) onto the
+ * form's nested shape (`addTitle`, `standard.descriptionLabel`,
+ * `childSupport.agencyLabel`, `childSupport.paymentPeriodLabel`, …). Keeping
+ * the source keys unchanged preserves backward compatibility for partners
+ * overriding them through the onboarding block's `dictionary` prop.
+ */
+export declare function useOnboardingDeductionsFormDictionary(): DeductionsFormDictionary;

package/dist/components/Employee/Deductions/onboarding/useFormDictionary.js

@@ -0,0 +1,92 @@
+import { useMemo as t } from "react";
+import { useTranslation as n } from "react-i18next";
+function a() {
+  const { t: e } = n("Employee.Deductions");
+  return t(
+    () => ({
+      en: {
+        addTitle: e("addDeductionTitle"),
+        editTitle: e("editDeductionTitle"),
+        description: e("externalPostTaxDeductionsDescription"),
+        variantLabel: e("deductionTypeLabel"),
+        variantDescription: e("deductionTypeRadioLabel"),
+        garnishmentOption: e("garnishmentOption"),
+        customOption: e("customDeductionOption"),
+        garnishmentTypeLabel: e("garnishmentType"),
+        types: {
+          childSupport: e("childSupportTitle"),
+          federalTaxLien: e("federalTaxLien"),
+          stateTaxLien: e("stateTaxLien"),
+          studentLoan: e("studentLoan"),
+          creditorGarnishment: e("creditorGarnishment"),
+          federalLoan: e("federalLoan"),
+          otherGarnishment: e("otherGarnishment"),
+          custom: e("customDeductionTitle")
+        },
+        standard: {
+          descriptionLabel: e("descriptionLabelV2"),
+          descriptionRequired: e("descriptionRequired"),
+          frequencyLabel: e("frequencyLabel"),
+          frequencyRecurring: e("frequencyRecurringOptionV2"),
+          frequencyOneTime: e("frequencyOneTimeOptionV2"),
+          frequencyRequired: e("frequencyRequired"),
+          typeLabel: e("deductionTypeLabelV2"),
+          typePercentage: e("deductionTypePercentageOptionV2"),
+          typeFixed: e("deductionTypeFixedAmountOption"),
+          typeRequired: e("deductionTypeRequired"),
+          amountLabel: e("deductionAmountLabel"),
+          amountPercentDescription: e("deductionAmountDescriptionPercentage"),
+          amountFixedDescription: e("deductionAmountDescriptionFixed"),
+          amountRequired: e("amountRequired"),
+          amountNonNegative: e("amountNonNegative"),
+          totalAmountLabel: e("totalAmountLabel"),
+          totalAmountDescription: e("totalAmountDescription"),
+          annualMaxLabel: e("annualMaxLabel"),
+          annualMaxDescription: e("annualMaxDescription")
+        },
+        childSupport: {
+          agencyLabel: e("agency"),
+          agencyDescription: e("agencyDescription"),
+          agencyRequired: e("agencyRequired"),
+          manualPaymentRequired: e("manualPaymentRequired"),
+          countyLabel: e("county"),
+          countyDescription: e("countyDescription"),
+          allCounties: e("allCounties"),
+          countyRequired: e("countyRequired"),
+          caseNumberDescription: e("caseNumberDescription"),
+          caseNumberRequired: e("caseNumberRequired"),
+          orderNumberDescription: e("orderNumberDescription"),
+          orderNumberRequired: e("orderNumberRequired"),
+          remittanceNumberDescription: e("remittanceNumberDescription"),
+          remittanceNumberRequired: e("remittanceNumberRequired"),
+          totalAmountWithheld: e("totalAmountWithheld"),
+          totalAmountWithheldDescription: e("totalAmountWithheldDescription"),
+          payPeriodMaximumRequired: e("payPeriodMaximumRequired"),
+          maxPaycheckPercentage: e("maxPaycheckPercentage"),
+          maxPaycheckPercentageDescription: e("maxPaycheckPercentageDescription"),
+          amountRequired: e("amountRequired"),
+          amountNonNegative: e("amountNonNegative"),
+          percentOutOfRange: e("percentOutOfRange"),
+          paymentPeriodLabel: e("per"),
+          paymentPeriodDescription: e("perDescription"),
+          paymentPeriodRequired: e("paymentPeriodRequired"),
+          paymentPeriod: {
+            everyWeek: e("everyWeek"),
+            everyOtherWeek: e("everyOtherWeek"),
+            twicePerMonth: e("twicePerMonth"),
+            monthly: e("monthly")
+          }
+        },
+        actions: {
+          save: e("saveCta"),
+          cancel: e("cancelCta")
+        }
+      }
+    }),
+    [e]
+  );
+}
+export {
+  a as useOnboardingDeductionsFormDictionary
+};
+//# sourceMappingURL=useFormDictionary.js.map

package/dist/components/Employee/Deductions/onboarding/useFormDictionary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormDictionary.js","sources":["../../../../../src/components/Employee/Deductions/onboarding/useFormDictionary.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { DeductionsFormDictionary } from '../shared/DeductionsForm'\n\n/**\n * Resolves the shared `DeductionsForm`'s text against onboarding's existing\n * `Employee.Deductions` namespace.\n *\n * The mapping bridges onboarding's historical flat key names\n * (`addDeductionTitle`, `descriptionLabelV2`, `agency`, `per`, …) onto the\n * form's nested shape (`addTitle`, `standard.descriptionLabel`,\n * `childSupport.agencyLabel`, `childSupport.paymentPeriodLabel`, …). Keeping\n * the source keys unchanged preserves backward compatibility for partners\n * overriding them through the onboarding block's `dictionary` prop.\n */\nexport function useOnboardingDeductionsFormDictionary(): DeductionsFormDictionary {\n  const { t } = useTranslation('Employee.Deductions')\n\n  return useMemo<DeductionsFormDictionary>(\n    () => ({\n      en: {\n        addTitle: t('addDeductionTitle'),\n        editTitle: t('editDeductionTitle'),\n        description: t('externalPostTaxDeductionsDescription'),\n        variantLabel: t('deductionTypeLabel'),\n        variantDescription: t('deductionTypeRadioLabel'),\n        garnishmentOption: t('garnishmentOption'),\n        customOption: t('customDeductionOption'),\n        garnishmentTypeLabel: t('garnishmentType'),\n        types: {\n          childSupport: t('childSupportTitle'),\n          federalTaxLien: t('federalTaxLien'),\n          stateTaxLien: t('stateTaxLien'),\n          studentLoan: t('studentLoan'),\n          creditorGarnishment: t('creditorGarnishment'),\n          federalLoan: t('federalLoan'),\n          otherGarnishment: t('otherGarnishment'),\n          custom: t('customDeductionTitle'),\n        },\n        standard: {\n          descriptionLabel: t('descriptionLabelV2'),\n          descriptionRequired: t('descriptionRequired'),\n          frequencyLabel: t('frequencyLabel'),\n          frequencyRecurring: t('frequencyRecurringOptionV2'),\n          frequencyOneTime: t('frequencyOneTimeOptionV2'),\n          frequencyRequired: t('frequencyRequired'),\n          typeLabel: t('deductionTypeLabelV2'),\n          typePercentage: t('deductionTypePercentageOptionV2'),\n          typeFixed: t('deductionTypeFixedAmountOption'),\n          typeRequired: t('deductionTypeRequired'),\n          amountLabel: t('deductionAmountLabel'),\n          amountPercentDescription: t('deductionAmountDescriptionPercentage'),\n          amountFixedDescription: t('deductionAmountDescriptionFixed'),\n          amountRequired: t('amountRequired'),\n          amountNonNegative: t('amountNonNegative'),\n          totalAmountLabel: t('totalAmountLabel'),\n          totalAmountDescription: t('totalAmountDescription'),\n          annualMaxLabel: t('annualMaxLabel'),\n          annualMaxDescription: t('annualMaxDescription'),\n        },\n        childSupport: {\n          agencyLabel: t('agency'),\n          agencyDescription: t('agencyDescription'),\n          agencyRequired: t('agencyRequired'),\n          manualPaymentRequired: t('manualPaymentRequired'),\n          countyLabel: t('county'),\n          countyDescription: t('countyDescription'),\n          allCounties: t('allCounties'),\n          countyRequired: t('countyRequired'),\n          caseNumberDescription: t('caseNumberDescription'),\n          caseNumberRequired: t('caseNumberRequired'),\n          orderNumberDescription: t('orderNumberDescription'),\n          orderNumberRequired: t('orderNumberRequired'),\n          remittanceNumberDescription: t('remittanceNumberDescription'),\n          remittanceNumberRequired: t('remittanceNumberRequired'),\n          totalAmountWithheld: t('totalAmountWithheld'),\n          totalAmountWithheldDescription: t('totalAmountWithheldDescription'),\n          payPeriodMaximumRequired: t('payPeriodMaximumRequired'),\n          maxPaycheckPercentage: t('maxPaycheckPercentage'),\n          maxPaycheckPercentageDescription: t('maxPaycheckPercentageDescription'),\n          amountRequired: t('amountRequired'),\n          amountNonNegative: t('amountNonNegative'),\n          percentOutOfRange: t('percentOutOfRange'),\n          paymentPeriodLabel: t('per'),\n          paymentPeriodDescription: t('perDescription'),\n          paymentPeriodRequired: t('paymentPeriodRequired'),\n          paymentPeriod: {\n            everyWeek: t('everyWeek'),\n            everyOtherWeek: t('everyOtherWeek'),\n            twicePerMonth: t('twicePerMonth'),\n            monthly: t('monthly'),\n          },\n        },\n        actions: {\n          save: t('saveCta'),\n          cancel: t('cancelCta'),\n        },\n      },\n    }),\n    [t],\n  )\n}\n"],"names":["useOnboardingDeductionsFormDictionary","t","useTranslation","useMemo"],"mappings":"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"}

package/dist/components/Employee/Deductions/{DeductionsForm → shared/DeductionsForm}/ChildSupportFormView.d.ts

@@ -1,9 +1,9 @@
-import { Garnishment } from '@gusto/embedded-api/models/components/garnishment';
+import { Garnishment } from '@gusto/embedded-api-v-2025-11-15/models/components/garnishment';
 interface ChildSupportFormViewProps {
     employeeId: string;
     deduction: Garnishment | null;
     onSaved: (deduction: Garnishment, mode: 'create' | 'update') => void;
     onCancel: () => void;
 }
-export declare function ChildSupportFormView({ employeeId, deduction, onSaved, onCancel, }: ChildSupportFormViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChildSupportFormView({ employeeId, deduction, onSaved, onCancel, }: ChildSupportFormViewProps): import("react").JSX.Element;
 export {};

package/dist/components/Employee/Deductions/shared/DeductionsForm/ChildSupportFormView.js

@@ -0,0 +1,143 @@
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+import { useTranslation as b } from "react-i18next";
+import { useChildSupportGarnishmentForm as S } from "../useChildSupportGarnishmentForm/useChildSupportGarnishmentForm.js";
+import { Form as g } from "../../../../Common/Form/Form.js";
+import { Flex as l } from "../../../../Common/Flex/Flex.js";
+import { ActionsLayout as R } from "../../../../Common/ActionsLayout/ActionsLayout.js";
+import { BaseLayout as h } from "../../../../Base/Base.js";
+import { SDKFormProvider as f } from "../../../../../partner-hook-utils/form/SDKFormProvider.js";
+import { useComponentContext as E } from "../../../../../contexts/ComponentAdapter/useComponentContext.js";
+function O({
+  employeeId: n,
+  deduction: a,
+  onSaved: d,
+  onCancel: u
+}) {
+  const { t: e } = b("Employee.DeductionsForm"), c = E(), r = S({
+    employeeId: n,
+    garnishmentId: a?.uuid
+  });
+  if (r.isLoading)
+    return /* @__PURE__ */ t(h, { isLoading: !0, error: r.errorHandling.errors });
+  const { Fields: i } = r.form, m = r.status.selectedAgency !== null, y = async () => {
+    const o = await r.actions.onSubmit();
+    o && d(o.data, o.mode);
+  };
+  return /* @__PURE__ */ t(h, { error: r.errorHandling.errors, children: /* @__PURE__ */ t(f, { formHookResult: r, children: /* @__PURE__ */ t(g, { onSubmit: y, children: /* @__PURE__ */ p(l, { flexDirection: "column", gap: 32, children: [
+    /* @__PURE__ */ t(c.Heading, { as: "h3", children: e("types.childSupport") }),
+    /* @__PURE__ */ p(l, { flexDirection: "column", gap: 20, children: [
+      /* @__PURE__ */ t(
+        i.State,
+        {
+          label: e("childSupport.agencyLabel"),
+          description: e("childSupport.agencyDescription"),
+          getOptionLabel: (o) => o.name,
+          validationMessages: { REQUIRED: e("childSupport.agencyRequired") }
+        }
+      ),
+      r.status.isManualPaymentRequired && /* @__PURE__ */ t(
+        c.Alert,
+        {
+          status: "warning",
+          label: e("childSupport.manualPaymentRequired")
+        }
+      ),
+      m && /* @__PURE__ */ p(l, { flexDirection: "column", gap: 20, children: [
+        i.FipsCode && /* @__PURE__ */ t(
+          i.FipsCode,
+          {
+            label: e("childSupport.countyLabel"),
+            description: e("childSupport.countyDescription"),
+            getOptionLabel: (o) => o.county ?? e("childSupport.allCounties"),
+            validationMessages: { REQUIRED: e("childSupport.countyRequired") }
+          }
+        ),
+        i.CaseNumber && /* @__PURE__ */ t(
+          i.CaseNumber,
+          {
+            label: s(r.status.selectedAgency, "case_number"),
+            description: e("childSupport.caseNumberDescription"),
+            validationMessages: { REQUIRED: e("childSupport.caseNumberRequired") }
+          }
+        ),
+        i.OrderNumber && /* @__PURE__ */ t(
+          i.OrderNumber,
+          {
+            label: s(r.status.selectedAgency, "order_number"),
+            description: e("childSupport.orderNumberDescription"),
+            validationMessages: { REQUIRED: e("childSupport.orderNumberRequired") }
+          }
+        ),
+        i.RemittanceNumber && /* @__PURE__ */ t(
+          i.RemittanceNumber,
+          {
+            label: s(r.status.selectedAgency, "remittance_number"),
+            description: e("childSupport.remittanceNumberDescription"),
+            validationMessages: {
+              REQUIRED: e("childSupport.remittanceNumberRequired")
+            }
+          }
+        ),
+        /* @__PURE__ */ t(
+          i.PayPeriodMaximum,
+          {
+            label: e("childSupport.totalAmountWithheld"),
+            description: e("childSupport.totalAmountWithheldDescription"),
+            format: "currency",
+            min: 0,
+            validationMessages: {
+              REQUIRED: e("childSupport.payPeriodMaximumRequired"),
+              NEGATIVE_AMOUNT: e("childSupport.amountNonNegative")
+            }
+          }
+        ),
+        /* @__PURE__ */ t(
+          i.Amount,
+          {
+            label: e("childSupport.maxPaycheckPercentage"),
+            description: e("childSupport.maxPaycheckPercentageDescription"),
+            format: "percent",
+            min: 0,
+            max: 100,
+            validationMessages: {
+              REQUIRED: e("childSupport.amountRequired"),
+              PERCENT_OUT_OF_RANGE: e("childSupport.percentOutOfRange")
+            }
+          }
+        ),
+        /* @__PURE__ */ t(
+          i.PaymentPeriod,
+          {
+            label: e("childSupport.paymentPeriodLabel"),
+            description: e("childSupport.paymentPeriodDescription"),
+            getOptionLabel: (o) => P(e, o),
+            validationMessages: { REQUIRED: e("childSupport.paymentPeriodRequired") }
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ p(R, { children: [
+      /* @__PURE__ */ t(c.Button, { variant: "secondary", type: "button", onClick: u, children: e("actions.cancel") }),
+      m && /* @__PURE__ */ t(c.Button, { type: "submit", isLoading: r.status.isPending, children: e("actions.save") })
+    ] })
+  ] }) }) }) });
+}
+function s(n, a) {
+  return n?.requiredAttributes?.find((u) => u.key === a)?.label ?? a;
+}
+function P(n, a) {
+  switch (a) {
+    case "Every week":
+      return n("childSupport.paymentPeriod.everyWeek");
+    case "Every other week":
+      return n("childSupport.paymentPeriod.everyOtherWeek");
+    case "Twice per month":
+      return n("childSupport.paymentPeriod.twicePerMonth");
+    case "Monthly":
+      return n("childSupport.paymentPeriod.monthly");
+  }
+}
+export {
+  O as ChildSupportFormView
+};
+//# sourceMappingURL=ChildSupportFormView.js.map