@gusto/embedded-react-sdk 0.44.1 → 0.45.0

package/dist/components/Employee/Dashboard/hooks/useEmployeeCompensation.js

@@ -1,52 +1,76 @@
-import { useMemo as u } from "react";
-import { useEmployeesGetSuspense as L } from "@gusto/embedded-api/react-query/employeesGet";
-import { useEmployeePaymentMethodGetSuspense as k } from "@gusto/embedded-api/react-query/employeePaymentMethodGet";
-import { useEmployeePaymentMethodsGetBankAccountsSuspense as A } from "@gusto/embedded-api/react-query/employeePaymentMethodsGetBankAccounts";
-import { useGarnishmentsListSuspense as E } from "@gusto/embedded-api/react-query/garnishmentsList";
-import { usePayrollsGetPayStubsSuspense as G } from "@gusto/embedded-api/react-query/payrollsGetPayStubs";
-import { composeErrorHandler as Q } from "../../../../partner-hook-utils/composeErrorHandler.js";
-import { usePagination as j } from "../../../../hooks/usePagination/usePagination.js";
-function w({
-  employeeId: e
+import { useMemo as a, useCallback as v } from "react";
+import { useEmployeesGetSuspense as A } from "@gusto/embedded-api/react-query/employeesGet";
+import { useJobsAndCompensationsDeleteCompensationMutation as D } from "@gusto/embedded-api/react-query/jobsAndCompensationsDeleteCompensation";
+import { usePayrollsGetPayStubsSuspense as H } from "@gusto/embedded-api/react-query/payrollsGetPayStubs";
+import { getPendingCompensationChanges as q } from "../getPendingCompensationChanges.js";
+import { derivePrimaryFlsaStatus as w } from "../../Compensation/shared/derivePrimaryFlsaStatus.js";
+import { useBaseSubmit as G } from "../../../Base/useBaseSubmit.js";
+import { composeErrorHandler as I } from "../../../../partner-hook-utils/composeErrorHandler.js";
+import { usePagination as N } from "../../../../hooks/usePagination/usePagination.js";
+function T({
+  employeeId: m
 }) {
-  const { currentPage: h, itemsPerPage: d, getPaginationProps: p } = j({
+  const { currentPage: g, itemsPerPage: b, getPaginationProps: p } = N({
     defaultItemsPerPage: 10
-  }), s = L({ employeeId: e }), n = k({ employeeId: e }), o = A({ employeeId: e }), a = E({ employeeId: e }), t = G({
-    employeeId: e,
-    page: h,
-    per: d
-  }), r = s.data.employee, P = n.data.employeePaymentMethod, c = o.data, l = a.data.garnishments, i = t.data, b = u(() => r?.jobs?.find((m) => m.primary === !0), [r?.jobs]), f = u(() => c.employeeBankAccounts || [], [c]), S = i.employeePayStubsList || [], M = u(() => {
-    const m = i.httpMeta.response.headers;
-    return p(m, t.isFetching);
-  }, [i.httpMeta.response.headers, t.isFetching, p]), y = s.isFetching || n.isFetching || o.isFetching || a.isFetching || t.isFetching, F = !r && y, g = Q([
-    s,
-    n,
-    o,
-    a,
-    t
-  ]);
-  return F ? {
+  }), i = A({
+    employeeId: m,
+    include: ["all_compensations"]
+  }), s = H({
+    employeeId: m,
+    page: g,
+    per: b
+  }), o = D(), {
+    baseSubmitHandler: u,
+    error: y,
+    setError: P
+  } = G("Employee.Dashboard.JobAndPay.Compensation"), e = i.data.employee, r = s.data, t = a(() => e?.jobs ?? [], [e?.jobs]), f = a(() => t.find((n) => n.primary === !0), [t]), h = a(() => w(t), [t]), S = t.length > 1, C = a(
+    () => q(e?.jobs),
+    [e?.jobs]
+  ), E = r.employeePayStubsList || [], F = a(() => {
+    const n = r.httpMeta.response.headers;
+    return p(n, s.isFetching);
+  }, [r.httpMeta.response.headers, s.isFetching, p]), M = o.isPending ? o.variables.request.compensationId : null, j = v(
+    async (n) => {
+      let d;
+      return await u(n, async ({ compensationUuid: L }) => {
+        d = { mode: "update", data: await o.mutateAsync({
+          request: { compensationId: L }
+        }) };
+      }), d;
+    },
+    [u, o]
+  ), c = i.isFetching || s.isFetching || o.isPending, J = !e && c, l = I([i, s], {
+    submitError: y,
+    setSubmitError: P
+  });
+  return J ? {
     isLoading: !0,
-    errorHandling: g
+    errorHandling: l
   } : {
     isLoading: !1,
     data: {
-      primaryJob: b,
-      employeePaymentMethod: P || void 0,
-      bankAccounts: f,
-      garnishmentList: l || [],
-      payStubs: S
+      jobs: t,
+      primaryJob: f,
+      primaryFlsaStatus: h,
+      hasMultipleJobs: S,
+      pendingChanges: C,
+      payStubs: E,
+      employeeFirstName: e?.firstName ?? void 0
     },
     status: {
-      isPending: y
+      isPending: c,
+      cancellingCompensationUuid: M
     },
     pagination: {
-      payStubs: M
+      payStubs: F
+    },
+    actions: {
+      cancelPendingChange: j
     },
-    errorHandling: g
+    errorHandling: l
   };
 }
 export {
-  w as useEmployeeCompensation
+  T as useEmployeeCompensation
 };
 //# sourceMappingURL=useEmployeeCompensation.js.map

package/dist/components/Employee/Dashboard/hooks/useEmployeeCompensation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEmployeeCompensation.js","sources":["../../../../../src/components/Employee/Dashboard/hooks/useEmployeeCompensation.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport { useEmployeePaymentMethodGetSuspense } from '@gusto/embedded-api/react-query/employeePaymentMethodGet'\nimport { useEmployeePaymentMethodsGetBankAccountsSuspense } from '@gusto/embedded-api/react-query/employeePaymentMethodsGetBankAccounts'\nimport { useGarnishmentsListSuspense } from '@gusto/embedded-api/react-query/garnishmentsList'\nimport { usePayrollsGetPayStubsSuspense } from '@gusto/embedded-api/react-query/payrollsGetPayStubs'\nimport type { Job } from '@gusto/embedded-api/models/components/job'\nimport type { Garnishment } from '@gusto/embedded-api/models/components/garnishment'\nimport type { GetV1EmployeesEmployeeIdPaymentMethodResponse } from '@gusto/embedded-api/models/operations/getv1employeesemployeeidpaymentmethod'\nimport type { GetV1EmployeesEmployeeIdBankAccountsResponse } from '@gusto/embedded-api/models/operations/getv1employeesemployeeidbankaccounts'\nimport type { GetV1EmployeesEmployeeUuidPayStubsResponse } from '@gusto/embedded-api/models/operations/getv1employeesemployeeuuidpaystubs'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { usePagination } from '@/hooks/usePagination/usePagination'\nimport type { HookLoadingResult, BaseHookReady } from '@/partner-hook-utils/types'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\n\n// Derive types from operations responses\ntype EmployeeBankAccount = NonNullable<\n  GetV1EmployeesEmployeeIdBankAccountsResponse['employeeBankAccounts']\n>[number]\ntype EmployeePayStub = NonNullable<\n  GetV1EmployeesEmployeeUuidPayStubsResponse['employeePayStubsList']\n>[number]\n\nexport interface UseEmployeeCompensationProps {\n  employeeId: string\n}\n\ninterface UseEmployeeCompensationReady extends BaseHookReady<\n  {\n    primaryJob?: Job\n    employeePaymentMethod?: NonNullable<\n      GetV1EmployeesEmployeeIdPaymentMethodResponse['employeePaymentMethod']\n    >\n    bankAccounts: EmployeeBankAccount[]\n    garnishmentList: Garnishment[]\n    payStubs: EmployeePayStub[]\n  },\n  { isPending: boolean }\n> {\n  pagination: {\n    payStubs?: PaginationControlProps\n  }\n}\n\nexport type UseEmployeeCompensationResult = HookLoadingResult | UseEmployeeCompensationReady\n\nexport function useEmployeeCompensation({\n  employeeId,\n}: UseEmployeeCompensationProps): UseEmployeeCompensationResult {\n  const { currentPage, itemsPerPage, getPaginationProps } = usePagination({\n    defaultItemsPerPage: 10,\n  })\n\n  const employeeQuery = useEmployeesGetSuspense({ employeeId })\n  const paymentMethodQuery = useEmployeePaymentMethodGetSuspense({ employeeId })\n  const bankAccountsQuery = useEmployeePaymentMethodsGetBankAccountsSuspense({ employeeId })\n  const garnishmentsQuery = useGarnishmentsListSuspense({ employeeId })\n  const payStubsQuery = usePayrollsGetPayStubsSuspense({\n    employeeId,\n    page: currentPage,\n    per: itemsPerPage,\n  })\n\n  const employee = employeeQuery.data.employee\n  const employeePaymentMethod = paymentMethodQuery.data.employeePaymentMethod\n  const bankAccountsData = bankAccountsQuery.data\n  const garnishmentList = garnishmentsQuery.data.garnishments\n  const payStubsData = payStubsQuery.data\n\n  // Derive primary job\n  const primaryJob = useMemo(() => {\n    return employee?.jobs?.find(job => job.primary === true)\n  }, [employee?.jobs])\n\n  // Derive bank accounts\n  const bankAccounts = useMemo(() => {\n    return bankAccountsData.employeeBankAccounts || []\n  }, [bankAccountsData])\n\n  // Extract paystubs from response\n  const payStubs = payStubsData.employeePayStubsList || []\n\n  // Extract pagination from API response headers\n  const payStubsPagination = useMemo(() => {\n    const headers = payStubsData.httpMeta.response.headers\n    return getPaginationProps(headers, payStubsQuery.isFetching)\n  }, [payStubsData.httpMeta.response.headers, payStubsQuery.isFetching, getPaginationProps])\n\n  const isPending =\n    employeeQuery.isFetching ||\n    paymentMethodQuery.isFetching ||\n    bankAccountsQuery.isFetching ||\n    garnishmentsQuery.isFetching ||\n    payStubsQuery.isFetching\n\n  const isLoading = !employee && isPending\n\n  const errorHandling = composeErrorHandler([\n    employeeQuery,\n    paymentMethodQuery,\n    bankAccountsQuery,\n    garnishmentsQuery,\n    payStubsQuery,\n  ])\n\n  if (isLoading) {\n    return {\n      isLoading: true,\n      errorHandling,\n    }\n  }\n\n  return {\n    isLoading: false,\n    data: {\n      primaryJob,\n      employeePaymentMethod: employeePaymentMethod || undefined,\n      bankAccounts,\n      garnishmentList: garnishmentList || [],\n      payStubs,\n    },\n    status: {\n      isPending,\n    },\n    pagination: {\n      payStubs: payStubsPagination,\n    },\n    errorHandling,\n  }\n}\n"],"names":["useEmployeeCompensation","employeeId","currentPage","itemsPerPage","getPaginationProps","usePagination","employeeQuery","useEmployeesGetSuspense","paymentMethodQuery","useEmployeePaymentMethodGetSuspense","bankAccountsQuery","useEmployeePaymentMethodsGetBankAccountsSuspense","garnishmentsQuery","useGarnishmentsListSuspense","payStubsQuery","usePayrollsGetPayStubsSuspense","employee","employeePaymentMethod","bankAccountsData","garnishmentList","payStubsData","primaryJob","useMemo","job","bankAccounts","payStubs","payStubsPagination","headers","isPending","isLoading","errorHandling","composeErrorHandler"],"mappings":";;;;;;;;AA+CO,SAASA,EAAwB;AAAA,EACtC,YAAAC;AACF,GAAgE;AAC9D,QAAM,EAAE,aAAAC,GAAa,cAAAC,GAAc,oBAAAC,EAAA,IAAuBC,EAAc;AAAA,IACtE,qBAAqB;AAAA,EAAA,CACtB,GAEKC,IAAgBC,EAAwB,EAAE,YAAAN,GAAY,GACtDO,IAAqBC,EAAoC,EAAE,YAAAR,GAAY,GACvES,IAAoBC,EAAiD,EAAE,YAAAV,GAAY,GACnFW,IAAoBC,EAA4B,EAAE,YAAAZ,GAAY,GAC9Da,IAAgBC,EAA+B;AAAA,IACnD,YAAAd;AAAA,IACA,MAAMC;AAAA,IACN,KAAKC;AAAA,EAAA,CACN,GAEKa,IAAWV,EAAc,KAAK,UAC9BW,IAAwBT,EAAmB,KAAK,uBAChDU,IAAmBR,EAAkB,MACrCS,IAAkBP,EAAkB,KAAK,cACzCQ,IAAeN,EAAc,MAG7BO,IAAaC,EAAQ,MAClBN,GAAU,MAAM,KAAK,CAAAO,MAAOA,EAAI,YAAY,EAAI,GACtD,CAACP,GAAU,IAAI,CAAC,GAGbQ,IAAeF,EAAQ,MACpBJ,EAAiB,wBAAwB,CAAA,GAC/C,CAACA,CAAgB,CAAC,GAGfO,IAAWL,EAAa,wBAAwB,CAAA,GAGhDM,IAAqBJ,EAAQ,MAAM;AACvC,UAAMK,IAAUP,EAAa,SAAS,SAAS;AAC/C,WAAOhB,EAAmBuB,GAASb,EAAc,UAAU;AAAA,EAC7D,GAAG,CAACM,EAAa,SAAS,SAAS,SAASN,EAAc,YAAYV,CAAkB,CAAC,GAEnFwB,IACJtB,EAAc,cACdE,EAAmB,cACnBE,EAAkB,cAClBE,EAAkB,cAClBE,EAAc,YAEVe,IAAY,CAACb,KAAYY,GAEzBE,IAAgBC,EAAoB;AAAA,IACxCzB;AAAA,IACAE;AAAA,IACAE;AAAA,IACAE;AAAA,IACAE;AAAA,EAAA,CACD;AAED,SAAIe,IACK;AAAA,IACL,WAAW;AAAA,IACX,eAAAC;AAAA,EAAA,IAIG;AAAA,IACL,WAAW;AAAA,IACX,MAAM;AAAA,MACJ,YAAAT;AAAA,MACA,uBAAuBJ,KAAyB;AAAA,MAChD,cAAAO;AAAA,MACA,iBAAiBL,KAAmB,CAAA;AAAA,MACpC,UAAAM;AAAA,IAAA;AAAA,IAEF,QAAQ;AAAA,MACN,WAAAG;AAAA,IAAA;AAAA,IAEF,YAAY;AAAA,MACV,UAAUF;AAAA,IAAA;AAAA,IAEZ,eAAAI;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useEmployeeCompensation.js","sources":["../../../../../src/components/Employee/Dashboard/hooks/useEmployeeCompensation.tsx"],"sourcesContent":["import { useCallback, useMemo } from 'react'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport { useJobsAndCompensationsDeleteCompensationMutation } from '@gusto/embedded-api/react-query/jobsAndCompensationsDeleteCompensation'\nimport { usePayrollsGetPayStubsSuspense } from '@gusto/embedded-api/react-query/payrollsGetPayStubs'\nimport type { Job } from '@gusto/embedded-api/models/components/job'\nimport type { GetV1EmployeesEmployeeUuidPayStubsResponse } from '@gusto/embedded-api/models/operations/getv1employeesemployeeuuidpaystubs'\nimport {\n  getPendingCompensationChanges,\n  type PendingCompensationChange,\n} from '../getPendingCompensationChanges'\nimport { derivePrimaryFlsaStatus } from '@/components/Employee/Compensation/shared/derivePrimaryFlsaStatus'\nimport { useBaseSubmit } from '@/components/Base/useBaseSubmit'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { usePagination } from '@/hooks/usePagination/usePagination'\nimport type { BaseHookReady, HookLoadingResult, HookSubmitResult } from '@/partner-hook-utils/types'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\n\ntype EmployeePayStub = NonNullable<\n  GetV1EmployeesEmployeeUuidPayStubsResponse['employeePayStubsList']\n>[number]\n\nexport interface UseEmployeeCompensationProps {\n  employeeId: string\n}\n\ninterface UseEmployeeCompensationReady extends BaseHookReady<\n  {\n    jobs: Job[]\n    primaryJob?: Job\n    primaryFlsaStatus?: string\n    hasMultipleJobs: boolean\n    pendingChanges: PendingCompensationChange[]\n    payStubs: EmployeePayStub[]\n    /** First name from the shared employee fetch; useful for cosmetic copy\n     *  in alerts (e.g. \"Heads up, Jane has pending changes\"). Optional\n     *  because the employee record can omit it. */\n    employeeFirstName?: string\n  },\n  { isPending: boolean; cancellingCompensationUuid: string | null }\n> {\n  pagination: {\n    payStubs?: PaginationControlProps\n  }\n  actions: {\n    cancelPendingChange: (\n      pendingChange: PendingCompensationChange,\n    ) => Promise<HookSubmitResult<unknown> | undefined>\n  }\n}\n\nexport type UseEmployeeCompensationResult = HookLoadingResult | UseEmployeeCompensationReady\n\nexport function useEmployeeCompensation({\n  employeeId,\n}: UseEmployeeCompensationProps): UseEmployeeCompensationResult {\n  const { currentPage, itemsPerPage, getPaginationProps } = usePagination({\n    defaultItemsPerPage: 10,\n  })\n\n  const employeeQuery = useEmployeesGetSuspense({\n    employeeId,\n    include: ['all_compensations'],\n  })\n  const payStubsQuery = usePayrollsGetPayStubsSuspense({\n    employeeId,\n    page: currentPage,\n    per: itemsPerPage,\n  })\n  const cancelCompensationMutation = useJobsAndCompensationsDeleteCompensationMutation()\n  const {\n    baseSubmitHandler,\n    error: submitError,\n    setError: setSubmitError,\n  } = useBaseSubmit('Employee.Dashboard.JobAndPay.Compensation')\n\n  const employee = employeeQuery.data.employee\n  const payStubsData = payStubsQuery.data\n\n  const jobs = useMemo(() => employee?.jobs ?? [], [employee?.jobs])\n  const primaryJob = useMemo(() => jobs.find(job => job.primary === true), [jobs])\n  const primaryFlsaStatus = useMemo(() => derivePrimaryFlsaStatus(jobs), [jobs])\n  const hasMultipleJobs = jobs.length > 1\n\n  const pendingChanges = useMemo(\n    () => getPendingCompensationChanges(employee?.jobs),\n    [employee?.jobs],\n  )\n\n  const payStubs = payStubsData.employeePayStubsList || []\n\n  const payStubsPagination = useMemo(() => {\n    const headers = payStubsData.httpMeta.response.headers\n    return getPaginationProps(headers, payStubsQuery.isFetching)\n  }, [payStubsData.httpMeta.response.headers, payStubsQuery.isFetching, getPaginationProps])\n\n  const cancellingCompensationUuid = cancelCompensationMutation.isPending\n    ? cancelCompensationMutation.variables.request.compensationId\n    : null\n\n  const cancelPendingChange = useCallback(\n    async (\n      pendingChange: PendingCompensationChange,\n    ): Promise<HookSubmitResult<unknown> | undefined> => {\n      let submitResult: HookSubmitResult<unknown> | undefined\n      await baseSubmitHandler(pendingChange, async ({ compensationUuid }) => {\n        const data = await cancelCompensationMutation.mutateAsync({\n          request: { compensationId: compensationUuid },\n        })\n        submitResult = { mode: 'update', data }\n      })\n      return submitResult\n    },\n    [baseSubmitHandler, cancelCompensationMutation],\n  )\n\n  const isPending =\n    employeeQuery.isFetching || payStubsQuery.isFetching || cancelCompensationMutation.isPending\n\n  const isLoading = !employee && isPending\n\n  const errorHandling = composeErrorHandler([employeeQuery, payStubsQuery], {\n    submitError,\n    setSubmitError,\n  })\n\n  if (isLoading) {\n    return {\n      isLoading: true,\n      errorHandling,\n    }\n  }\n\n  return {\n    isLoading: false,\n    data: {\n      jobs,\n      primaryJob,\n      primaryFlsaStatus,\n      hasMultipleJobs,\n      pendingChanges,\n      payStubs,\n      employeeFirstName: employee?.firstName ?? undefined,\n    },\n    status: {\n      isPending,\n      cancellingCompensationUuid,\n    },\n    pagination: {\n      payStubs: payStubsPagination,\n    },\n    actions: {\n      cancelPendingChange,\n    },\n    errorHandling,\n  }\n}\n"],"names":["useEmployeeCompensation","employeeId","currentPage","itemsPerPage","getPaginationProps","usePagination","employeeQuery","useEmployeesGetSuspense","payStubsQuery","usePayrollsGetPayStubsSuspense","cancelCompensationMutation","useJobsAndCompensationsDeleteCompensationMutation","baseSubmitHandler","submitError","setSubmitError","useBaseSubmit","employee","payStubsData","jobs","useMemo","primaryJob","job","primaryFlsaStatus","derivePrimaryFlsaStatus","hasMultipleJobs","pendingChanges","getPendingCompensationChanges","payStubs","payStubsPagination","headers","cancellingCompensationUuid","cancelPendingChange","useCallback","pendingChange","submitResult","compensationUuid","isPending","isLoading","errorHandling","composeErrorHandler"],"mappings":";;;;;;;;;AAoDO,SAASA,EAAwB;AAAA,EACtC,YAAAC;AACF,GAAgE;AAC9D,QAAM,EAAE,aAAAC,GAAa,cAAAC,GAAc,oBAAAC,EAAA,IAAuBC,EAAc;AAAA,IACtE,qBAAqB;AAAA,EAAA,CACtB,GAEKC,IAAgBC,EAAwB;AAAA,IAC5C,YAAAN;AAAA,IACA,SAAS,CAAC,mBAAmB;AAAA,EAAA,CAC9B,GACKO,IAAgBC,EAA+B;AAAA,IACnD,YAAAR;AAAA,IACA,MAAMC;AAAA,IACN,KAAKC;AAAA,EAAA,CACN,GACKO,IAA6BC,EAAA,GAC7B;AAAA,IACJ,mBAAAC;AAAA,IACA,OAAOC;AAAA,IACP,UAAUC;AAAA,EAAA,IACRC,EAAc,2CAA2C,GAEvDC,IAAWV,EAAc,KAAK,UAC9BW,IAAeT,EAAc,MAE7BU,IAAOC,EAAQ,MAAMH,GAAU,QAAQ,IAAI,CAACA,GAAU,IAAI,CAAC,GAC3DI,IAAaD,EAAQ,MAAMD,EAAK,KAAK,CAAAG,MAAOA,EAAI,YAAY,EAAI,GAAG,CAACH,CAAI,CAAC,GACzEI,IAAoBH,EAAQ,MAAMI,EAAwBL,CAAI,GAAG,CAACA,CAAI,CAAC,GACvEM,IAAkBN,EAAK,SAAS,GAEhCO,IAAiBN;AAAA,IACrB,MAAMO,EAA8BV,GAAU,IAAI;AAAA,IAClD,CAACA,GAAU,IAAI;AAAA,EAAA,GAGXW,IAAWV,EAAa,wBAAwB,CAAA,GAEhDW,IAAqBT,EAAQ,MAAM;AACvC,UAAMU,IAAUZ,EAAa,SAAS,SAAS;AAC/C,WAAOb,EAAmByB,GAASrB,EAAc,UAAU;AAAA,EAC7D,GAAG,CAACS,EAAa,SAAS,SAAS,SAAST,EAAc,YAAYJ,CAAkB,CAAC,GAEnF0B,IAA6BpB,EAA2B,YAC1DA,EAA2B,UAAU,QAAQ,iBAC7C,MAEEqB,IAAsBC;AAAA,IAC1B,OACEC,MACmD;AACnD,UAAIC;AACJ,mBAAMtB,EAAkBqB,GAAe,OAAO,EAAE,kBAAAE,QAAuB;AAIrE,QAAAD,IAAe,EAAE,MAAM,UAAU,MAHpB,MAAMxB,EAA2B,YAAY;AAAA,UACxD,SAAS,EAAE,gBAAgByB,EAAA;AAAA,QAAiB,CAC7C,EACgC;AAAA,MACnC,CAAC,GACMD;AAAA,IACT;AAAA,IACA,CAACtB,GAAmBF,CAA0B;AAAA,EAAA,GAG1C0B,IACJ9B,EAAc,cAAcE,EAAc,cAAcE,EAA2B,WAE/E2B,IAAY,CAACrB,KAAYoB,GAEzBE,IAAgBC,EAAoB,CAACjC,GAAeE,CAAa,GAAG;AAAA,IACxE,aAAAK;AAAA,IACA,gBAAAC;AAAA,EAAA,CACD;AAED,SAAIuB,IACK;AAAA,IACL,WAAW;AAAA,IACX,eAAAC;AAAA,EAAA,IAIG;AAAA,IACL,WAAW;AAAA,IACX,MAAM;AAAA,MACJ,MAAApB;AAAA,MACA,YAAAE;AAAA,MACA,mBAAAE;AAAA,MACA,iBAAAE;AAAA,MACA,gBAAAC;AAAA,MACA,UAAAE;AAAA,MACA,mBAAmBX,GAAU,aAAa;AAAA,IAAA;AAAA,IAE5C,QAAQ;AAAA,MACN,WAAAoB;AAAA,MACA,4BAAAN;AAAA,IAAA;AAAA,IAEF,YAAY;AAAA,MACV,UAAUF;AAAA,IAAA;AAAA,IAEZ,SAAS;AAAA,MACP,qBAAAG;AAAA,IAAA;AAAA,IAEF,eAAAO;AAAA,EAAA;AAEJ;"}

package/dist/components/Employee/Dashboard/usePendingChangeDetailRenderer.d.ts

@@ -0,0 +1,8 @@
+import { PendingChangeDetail } from './getPendingCompensationChanges';
+/**
+ * Renders a single `PendingChangeDetail` produced by `getPendingCompensationChanges`
+ * into the user-facing bullet string. Resolves FLSA enum values to their human
+ * labels via the Compensation namespace and formats pay/min-wage rates with the
+ * shared `useFormatPayRate` helper so the copy matches the form.
+ */
+export declare function usePendingChangeDetailRenderer(employeeFirstName: string | null | undefined): (detail: PendingChangeDetail) => string;

package/dist/components/Employee/Dashboard/usePendingChangeDetailRenderer.js

@@ -0,0 +1,61 @@
+import { useTranslation as g } from "react-i18next";
+import { useFormatCompensationRate as p } from "../../../helpers/formattedStrings.js";
+function c(r) {
+  const { t: e } = g("Employee.Dashboard"), { t: m } = g("Employee.Compensation"), t = p(), o = r ?? "";
+  return (n) => {
+    const a = { interpolation: { escapeValue: !1 } };
+    switch (n.kind) {
+      case "titleChange":
+        return e("jobAndPay.compensation.pendingChange.details.titleChange", {
+          title: n.title,
+          ...a
+        });
+      case "payChange":
+        return e("jobAndPay.compensation.pendingChange.details.payChange", {
+          formattedRate: t(n.rate, n.paymentUnit),
+          ...a
+        });
+      case "flsaChange":
+        return e("jobAndPay.compensation.pendingChange.details.flsaChange", {
+          flsaLabel: m(`flsaStatusLabels.${n.flsaStatus}`),
+          ...a
+        });
+      case "newJob": {
+        const i = n.rate !== null && n.paymentUnit !== null, s = i ? t(n.rate, n.paymentUnit) : null;
+        return n.title && i ? e("jobAndPay.compensation.pendingChange.details.newJob", {
+          name: o,
+          title: n.title,
+          formattedRate: s,
+          ...a
+        }) : i ? e("jobAndPay.compensation.pendingChange.details.newJobNoTitle", {
+          name: o,
+          formattedRate: s,
+          ...a
+        }) : n.title ? e("jobAndPay.compensation.pendingChange.details.newJobNoRate", {
+          name: o,
+          title: n.title,
+          ...a
+        }) : e("jobAndPay.compensation.pendingChange.details.newJobMinimal", {
+          name: o,
+          ...a
+        });
+      }
+      case "minWageEnabled":
+        return n.wage ? e("jobAndPay.compensation.pendingChange.details.minWageEnabled", {
+          formattedWage: t(Number(n.wage), "Hour"),
+          ...a
+        }) : e("jobAndPay.compensation.pendingChange.details.minWageEnabledNoRate");
+      case "minWageDisabled":
+        return e("jobAndPay.compensation.pendingChange.details.minWageDisabled");
+      case "minWageChanged":
+        return n.wage ? e("jobAndPay.compensation.pendingChange.details.minWageChanged", {
+          formattedWage: t(Number(n.wage), "Hour"),
+          ...a
+        }) : e("jobAndPay.compensation.pendingChange.details.minWageChangedNoRate");
+    }
+  };
+}
+export {
+  c as usePendingChangeDetailRenderer
+};
+//# sourceMappingURL=usePendingChangeDetailRenderer.js.map

package/dist/components/Employee/Dashboard/usePendingChangeDetailRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePendingChangeDetailRenderer.js","sources":["../../../../src/components/Employee/Dashboard/usePendingChangeDetailRenderer.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { PendingChangeDetail } from './getPendingCompensationChanges'\nimport { useFormatCompensationRate } from '@/helpers/formattedStrings'\n\n/**\n * Renders a single `PendingChangeDetail` produced by `getPendingCompensationChanges`\n * into the user-facing bullet string. Resolves FLSA enum values to their human\n * labels via the Compensation namespace and formats pay/min-wage rates with the\n * shared `useFormatPayRate` helper so the copy matches the form.\n */\nexport function usePendingChangeDetailRenderer(employeeFirstName: string | null | undefined) {\n  const { t: tDashboard } = useTranslation('Employee.Dashboard')\n  const { t: tCompensation } = useTranslation('Employee.Compensation')\n  const formatCompensationRate = useFormatCompensationRate()\n  const name = employeeFirstName ?? ''\n\n  return (detail: PendingChangeDetail): string => {\n    const interpolation = { interpolation: { escapeValue: false } }\n    switch (detail.kind) {\n      case 'titleChange':\n        return tDashboard('jobAndPay.compensation.pendingChange.details.titleChange', {\n          title: detail.title,\n          ...interpolation,\n        })\n      case 'payChange':\n        return tDashboard('jobAndPay.compensation.pendingChange.details.payChange', {\n          formattedRate: formatCompensationRate(detail.rate, detail.paymentUnit),\n          ...interpolation,\n        })\n      case 'flsaChange':\n        return tDashboard('jobAndPay.compensation.pendingChange.details.flsaChange', {\n          flsaLabel: tCompensation(`flsaStatusLabels.${detail.flsaStatus}`),\n          ...interpolation,\n        })\n      case 'newJob': {\n        const hasRate = detail.rate !== null && detail.paymentUnit !== null\n        const formattedRate = hasRate\n          ? formatCompensationRate(detail.rate!, detail.paymentUnit!)\n          : null\n        if (detail.title && hasRate) {\n          return tDashboard('jobAndPay.compensation.pendingChange.details.newJob', {\n            name,\n            title: detail.title,\n            formattedRate,\n            ...interpolation,\n          })\n        }\n        if (hasRate) {\n          return tDashboard('jobAndPay.compensation.pendingChange.details.newJobNoTitle', {\n            name,\n            formattedRate,\n            ...interpolation,\n          })\n        }\n        if (detail.title) {\n          return tDashboard('jobAndPay.compensation.pendingChange.details.newJobNoRate', {\n            name,\n            title: detail.title,\n            ...interpolation,\n          })\n        }\n        return tDashboard('jobAndPay.compensation.pendingChange.details.newJobMinimal', {\n          name,\n          ...interpolation,\n        })\n      }\n      case 'minWageEnabled':\n        return detail.wage\n          ? tDashboard('jobAndPay.compensation.pendingChange.details.minWageEnabled', {\n              formattedWage: formatCompensationRate(Number(detail.wage), 'Hour'),\n              ...interpolation,\n            })\n          : tDashboard('jobAndPay.compensation.pendingChange.details.minWageEnabledNoRate')\n      case 'minWageDisabled':\n        return tDashboard('jobAndPay.compensation.pendingChange.details.minWageDisabled')\n      case 'minWageChanged':\n        return detail.wage\n          ? tDashboard('jobAndPay.compensation.pendingChange.details.minWageChanged', {\n              formattedWage: formatCompensationRate(Number(detail.wage), 'Hour'),\n              ...interpolation,\n            })\n          : tDashboard('jobAndPay.compensation.pendingChange.details.minWageChangedNoRate')\n    }\n  }\n}\n"],"names":["usePendingChangeDetailRenderer","employeeFirstName","tDashboard","useTranslation","tCompensation","formatCompensationRate","useFormatCompensationRate","name","detail","interpolation","hasRate","formattedRate"],"mappings":";;AAUO,SAASA,EAA+BC,GAA8C;AAC3F,QAAM,EAAE,GAAGC,MAAeC,EAAe,oBAAoB,GACvD,EAAE,GAAGC,MAAkBD,EAAe,uBAAuB,GAC7DE,IAAyBC,EAAA,GACzBC,IAAON,KAAqB;AAElC,SAAO,CAACO,MAAwC;AAC9C,UAAMC,IAAgB,EAAE,eAAe,EAAE,aAAa,KAAM;AAC5D,YAAQD,EAAO,MAAA;AAAA,MACb,KAAK;AACH,eAAON,EAAW,4DAA4D;AAAA,UAC5E,OAAOM,EAAO;AAAA,UACd,GAAGC;AAAA,QAAA,CACJ;AAAA,MACH,KAAK;AACH,eAAOP,EAAW,0DAA0D;AAAA,UAC1E,eAAeG,EAAuBG,EAAO,MAAMA,EAAO,WAAW;AAAA,UACrE,GAAGC;AAAA,QAAA,CACJ;AAAA,MACH,KAAK;AACH,eAAOP,EAAW,2DAA2D;AAAA,UAC3E,WAAWE,EAAc,oBAAoBI,EAAO,UAAU,EAAE;AAAA,UAChE,GAAGC;AAAA,QAAA,CACJ;AAAA,MACH,KAAK,UAAU;AACb,cAAMC,IAAUF,EAAO,SAAS,QAAQA,EAAO,gBAAgB,MACzDG,IAAgBD,IAClBL,EAAuBG,EAAO,MAAOA,EAAO,WAAY,IACxD;AACJ,eAAIA,EAAO,SAASE,IACXR,EAAW,uDAAuD;AAAA,UACvE,MAAAK;AAAA,UACA,OAAOC,EAAO;AAAA,UACd,eAAAG;AAAA,UACA,GAAGF;AAAA,QAAA,CACJ,IAECC,IACKR,EAAW,8DAA8D;AAAA,UAC9E,MAAAK;AAAA,UACA,eAAAI;AAAA,UACA,GAAGF;AAAA,QAAA,CACJ,IAECD,EAAO,QACFN,EAAW,6DAA6D;AAAA,UAC7E,MAAAK;AAAA,UACA,OAAOC,EAAO;AAAA,UACd,GAAGC;AAAA,QAAA,CACJ,IAEIP,EAAW,8DAA8D;AAAA,UAC9E,MAAAK;AAAA,UACA,GAAGE;AAAA,QAAA,CACJ;AAAA,MACH;AAAA,MACA,KAAK;AACH,eAAOD,EAAO,OACVN,EAAW,+DAA+D;AAAA,UACxE,eAAeG,EAAuB,OAAOG,EAAO,IAAI,GAAG,MAAM;AAAA,UACjE,GAAGC;AAAA,QAAA,CACJ,IACDP,EAAW,mEAAmE;AAAA,MACpF,KAAK;AACH,eAAOA,EAAW,8DAA8D;AAAA,MAClF,KAAK;AACH,eAAOM,EAAO,OACVN,EAAW,+DAA+D;AAAA,UACxE,eAAeG,EAAuB,OAAOG,EAAO,IAAI,GAAG,MAAM;AAAA,UACjE,GAAGC;AAAA,QAAA,CACJ,IACDP,EAAW,mEAAmE;AAAA,IAAA;AAAA,EAExF;AACF;"}

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

@@ -1,11 +1,5 @@
-import { BaseComponentInterface } from '../../Base';
+import { BaseComponentInterface } from '../../Base/Base';
 export interface DeductionsProps extends BaseComponentInterface<'Employee.Deductions'> {
     employeeId: string;
 }
-export declare function Deductions(props: DeductionsProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace Deductions {
-    var IncludeDeductions: typeof import("./IncludeDeductions/IncludeDeductions").IncludeDeductions;
-    var DeductionsForm: typeof import("./DeductionsForm/DeductionsForm").DeductionsForm;
-    var DeductionsList: typeof import("./DeductionsList/DeductionsList").DeductionsList;
-}
-export declare const DeductionsContextual: () => import("react/jsx-runtime").JSX.Element;
+export declare function Deductions({ employeeId, dictionary, onEvent }: DeductionsProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,59 +1,32 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useTranslation as l } from "react-i18next";
-import { createMachine as D } from "robot3";
-import { useGarnishmentsListSuspense as f } from "@gusto/embedded-api/react-query/garnishmentsList";
-import { useMemo as d } from "react";
-import { DeductionsListContextual as h, IncludeDeductionsFormContextual as w } from "./DeductionsComponents.js";
-import { deductionsStateMachine as x } from "./stateMachine.js";
-import { DeductionsForm as C } from "./DeductionsForm/DeductionsForm.js";
-import { DeductionsList as F } from "./DeductionsList/DeductionsList.js";
-import { IncludeDeductions as g } from "./IncludeDeductions/IncludeDeductions.js";
-import { Flow as v } from "../../Flow/Flow.js";
-import { BaseComponent as E } from "../../Base/Base.js";
-import "../../Base/useBase.js";
-import { useComponentDictionary as I } from "../../../i18n/I18n.js";
-import { useFlow as L } from "../../Flow/useFlow.js";
-function M({ employeeId: o, onEvent: i, dictionary: r }) {
-  I("Employee.Deductions", r);
-  const { data: a } = f({ employeeId: o }), c = a.garnishments.filter((s) => s.active), t = d(
-    () => c.length > 0,
-    [c.length]
-  ), m = t ? "viewDeductions" : "includeDeductions", u = t ? h : w, p = d(
-    () => D(
-      m,
-      x,
-      (s) => ({
-        ...s,
-        component: u,
-        employeeId: o,
-        currentDeductionId: null,
-        hasExistingDeductions: t
+import { jsx as s } from "react/jsx-runtime";
+import { createMachine as c } from "robot3";
+import { useMemo as u } from "react";
+import { useGarnishmentsListSuspense as a } from "@gusto/embedded-api/react-query/garnishmentsList";
+import { DeductionsListContextual as p, IncludeDeductionsContextual as d } from "./deductionsContextualComponents.js";
+import { deductionsMachine as f } from "./stateMachine.js";
+import { Flow as D } from "../../Flow/Flow.js";
+import { BaseBoundaries as l } from "../../Base/Base.js";
+import { useComponentDictionary as h, useI18n as x } from "../../../i18n/I18n.js";
+function A({ employeeId: o, dictionary: t, onEvent: e }) {
+  return /* @__PURE__ */ s(l, { componentName: "Employee.Deductions", children: /* @__PURE__ */ s(C, { employeeId: o, dictionary: t, onEvent: e }) });
+}
+function C({ employeeId: o, dictionary: t, onEvent: e }) {
+  h("Employee.Deductions", t), x("Employee.Deductions");
+  const { data: r } = a({ employeeId: o }), n = (r.garnishments ?? []).some((i) => i.active), m = u(
+    () => c(
+      n ? "list" : "include",
+      f,
+      (i) => ({
+        ...i,
+        component: n ? p : d,
+        employeeId: o
       })
     ),
-    [m, u, o, t]
+    [o, n]
   );
-  return /* @__PURE__ */ n(v, { machine: p, onEvent: i });
-}
-function e(o) {
-  return /* @__PURE__ */ n(E, { ...o, children: /* @__PURE__ */ n(M, { ...o }) });
+  return /* @__PURE__ */ s(D, { machine: m, onEvent: e });
 }
-const N = () => {
-  const { employeeId: o, onEvent: i } = L(), { t: r } = l("common");
-  if (!o)
-    throw new Error(
-      r("errors.missingParamsOrContext", {
-        component: "Deductions",
-        param: "employeeId",
-        provider: "FlowProvider"
-      })
-    );
-  return /* @__PURE__ */ n(e, { employeeId: o, onEvent: i });
-};
-e.IncludeDeductions = g;
-e.DeductionsForm = C;
-e.DeductionsList = F;
 export {
-  e as Deductions,
-  N as DeductionsContextual
+  A as Deductions
 };
 //# sourceMappingURL=Deductions.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Deductions.js","sources":["../../../../src/components/Employee/Deductions/Deductions.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { createMachine } from 'robot3'\nimport { useGarnishmentsListSuspense } from '@gusto/embedded-api/react-query/garnishmentsList'\nimport { useMemo } from 'react'\nimport type { OnboardingContextInterface } from '../OnboardingFlow/OnboardingFlowComponents'\nimport {\n  IncludeDeductionsFormContextual,\n  type DeductionsContextInterface,\n  DeductionsListContextual,\n} from './DeductionsComponents'\nimport { deductionsStateMachine } from './stateMachine'\nimport { DeductionsForm } from './DeductionsForm/DeductionsForm'\nimport { DeductionsList } from './DeductionsList/DeductionsList'\nimport { IncludeDeductions } from './IncludeDeductions/IncludeDeductions'\nimport { Flow } from '@/components/Flow/Flow'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { useFlow } from '@/components/Flow/useFlow'\n\nexport interface DeductionsProps extends BaseComponentInterface<'Employee.Deductions'> {\n  employeeId: string\n}\nfunction DeductionsFlow({ employeeId, onEvent, dictionary }: DeductionsProps) {\n  useComponentDictionary('Employee.Deductions', dictionary)\n  const { data } = useGarnishmentsListSuspense({ employeeId })\n  const deductions = data.garnishments!\n  const activeDeductions = deductions.filter(deduction => deduction.active)\n  const hasExistingDeductions = useMemo(\n    () => activeDeductions.length > 0,\n    [activeDeductions.length],\n  )\n\n  // Determine initial state based on existing deductions\n  const initialState: 'includeDeductions' | 'viewDeductions' = hasExistingDeductions\n    ? 'viewDeductions'\n    : 'includeDeductions'\n\n  const initialComponent: React.ComponentType = hasExistingDeductions\n    ? DeductionsListContextual\n    : IncludeDeductionsFormContextual\n\n  const manageDeductions = useMemo(\n    () =>\n      createMachine(\n        initialState,\n        deductionsStateMachine,\n        (initialContext: DeductionsContextInterface) => ({\n          ...initialContext,\n          component: initialComponent,\n          employeeId,\n          currentDeductionId: null,\n          hasExistingDeductions,\n        }),\n      ),\n    [initialState, initialComponent, employeeId, hasExistingDeductions],\n  )\n\n  return <Flow machine={manageDeductions} onEvent={onEvent} />\n}\n\nexport function Deductions(props: DeductionsProps) {\n  return (\n    <BaseComponent {...props}>\n      <DeductionsFlow {...props} />\n    </BaseComponent>\n  )\n}\n\nexport const DeductionsContextual = () => {\n  const { employeeId, onEvent } = useFlow<OnboardingContextInterface>()\n  const { t } = useTranslation('common')\n\n  if (!employeeId) {\n    throw new Error(\n      t('errors.missingParamsOrContext', {\n        component: 'Deductions',\n        param: 'employeeId',\n        provider: 'FlowProvider',\n      }),\n    )\n  }\n  return <Deductions employeeId={employeeId} onEvent={onEvent} />\n}\n\nDeductions.IncludeDeductions = IncludeDeductions\nDeductions.DeductionsForm = DeductionsForm\nDeductions.DeductionsList = DeductionsList\n"],"names":["DeductionsFlow","employeeId","onEvent","dictionary","useComponentDictionary","data","useGarnishmentsListSuspense","activeDeductions","deduction","hasExistingDeductions","useMemo","initialState","initialComponent","DeductionsListContextual","IncludeDeductionsFormContextual","manageDeductions","createMachine","deductionsStateMachine","initialContext","jsx","Flow","Deductions","props","BaseComponent","DeductionsContextual","useFlow","t","useTranslation","IncludeDeductions","DeductionsForm","DeductionsList"],"mappings":";;;;;;;;;;;;;;;AAsBA,SAASA,EAAe,EAAE,YAAAC,GAAY,SAAAC,GAAS,YAAAC,KAA+B;AAC5E,EAAAC,EAAuB,uBAAuBD,CAAU;AACxD,QAAM,EAAE,MAAAE,EAAA,IAASC,EAA4B,EAAE,YAAAL,GAAY,GAErDM,IADaF,EAAK,aACY,OAAO,CAAAG,MAAaA,EAAU,MAAM,GAClEC,IAAwBC;AAAA,IAC5B,MAAMH,EAAiB,SAAS;AAAA,IAChC,CAACA,EAAiB,MAAM;AAAA,EAAA,GAIpBI,IAAuDF,IACzD,mBACA,qBAEEG,IAAwCH,IAC1CI,IACAC,GAEEC,IAAmBL;AAAA,IACvB,MACEM;AAAA,MACEL;AAAA,MACAM;AAAA,MACA,CAACC,OAAgD;AAAA,QAC/C,GAAGA;AAAA,QACH,WAAWN;AAAA,QACX,YAAAX;AAAA,QACA,oBAAoB;AAAA,QACpB,uBAAAQ;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACE,GAAcC,GAAkBX,GAAYQ,CAAqB;AAAA,EAAA;AAGpE,SAAO,gBAAAU,EAACC,GAAA,EAAK,SAASL,GAAkB,SAAAb,EAAA,CAAkB;AAC5D;AAEO,SAASmB,EAAWC,GAAwB;AACjD,SACE,gBAAAH,EAACI,KAAe,GAAGD,GACjB,4BAACtB,GAAA,EAAgB,GAAGsB,GAAO,EAAA,CAC7B;AAEJ;AAEO,MAAME,IAAuB,MAAM;AACxC,QAAM,EAAE,YAAAvB,GAAY,SAAAC,EAAA,IAAYuB,EAAA,GAC1B,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ;AAErC,MAAI,CAAC1B;AACH,UAAM,IAAI;AAAA,MACRyB,EAAE,iCAAiC;AAAA,QACjC,WAAW;AAAA,QACX,OAAO;AAAA,QACP,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAGL,SAAO,gBAAAP,EAACE,GAAA,EAAW,YAAApB,GAAwB,SAAAC,EAAA,CAAkB;AAC/D;AAEAmB,EAAW,oBAAoBO;AAC/BP,EAAW,iBAAiBQ;AAC5BR,EAAW,iBAAiBS;"}
+{"version":3,"file":"Deductions.js","sources":["../../../../src/components/Employee/Deductions/Deductions.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport { useGarnishmentsListSuspense } from '@gusto/embedded-api/react-query/garnishmentsList'\nimport {\n  IncludeDeductionsContextual,\n  DeductionsListContextual,\n  type DeductionsContextInterface,\n} from './deductionsContextualComponents'\nimport { deductionsMachine } from './stateMachine'\nimport { Flow } from '@/components/Flow/Flow'\nimport { BaseBoundaries, type BaseComponentInterface } from '@/components/Base/Base'\nimport { useComponentDictionary, useI18n } from '@/i18n'\n\nexport interface DeductionsProps extends BaseComponentInterface<'Employee.Deductions'> {\n  employeeId: string\n}\n\nexport function Deductions({ employeeId, dictionary, onEvent }: DeductionsProps) {\n  return (\n    <BaseBoundaries componentName=\"Employee.Deductions\">\n      <DeductionsRoot employeeId={employeeId} dictionary={dictionary} onEvent={onEvent} />\n    </BaseBoundaries>\n  )\n}\n\nfunction DeductionsRoot({ employeeId, dictionary, onEvent }: DeductionsProps) {\n  useComponentDictionary('Employee.Deductions', dictionary)\n  useI18n('Employee.Deductions')\n\n  // Used only to pick the machine's initial state. The list rendered inside\n  // each contextual wrapper uses a non-suspense hook (React Query dedupes).\n  const { data } = useGarnishmentsListSuspense({ employeeId })\n  const hasActiveDeductions = (data.garnishments ?? []).some(g => g.active)\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        hasActiveDeductions ? 'list' : 'include',\n        deductionsMachine,\n        (initialContext: DeductionsContextInterface) => ({\n          ...initialContext,\n          component: hasActiveDeductions ? DeductionsListContextual : IncludeDeductionsContextual,\n          employeeId,\n        }),\n      ),\n    [employeeId, hasActiveDeductions],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["Deductions","employeeId","dictionary","onEvent","jsx","BaseBoundaries","DeductionsRoot","useComponentDictionary","useI18n","data","useGarnishmentsListSuspense","hasActiveDeductions","g","machine","useMemo","createMachine","deductionsMachine","initialContext","DeductionsListContextual","IncludeDeductionsContextual","Flow"],"mappings":";;;;;;;;;AAiBO,SAASA,EAAW,EAAE,YAAAC,GAAY,YAAAC,GAAY,SAAAC,KAA4B;AAC/E,SACE,gBAAAC,EAACC,KAAe,eAAc,uBAC5B,4BAACC,GAAA,EAAe,YAAAL,GAAwB,YAAAC,GAAwB,SAAAC,EAAA,CAAkB,EAAA,CACpF;AAEJ;AAEA,SAASG,EAAe,EAAE,YAAAL,GAAY,YAAAC,GAAY,SAAAC,KAA4B;AAC5E,EAAAI,EAAuB,uBAAuBL,CAAU,GACxDM,EAAQ,qBAAqB;AAI7B,QAAM,EAAE,MAAAC,EAAA,IAASC,EAA4B,EAAE,YAAAT,GAAY,GACrDU,KAAuBF,EAAK,gBAAgB,CAAA,GAAI,KAAK,CAAAG,MAAKA,EAAE,MAAM,GAElEC,IAAUC;AAAA,IACd,MACEC;AAAA,MACEJ,IAAsB,SAAS;AAAA,MAC/BK;AAAA,MACA,CAACC,OAAgD;AAAA,QAC/C,GAAGA;AAAA,QACH,WAAWN,IAAsBO,IAA2BC;AAAA,QAC5D,YAAAlB;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACA,GAAYU,CAAmB;AAAA,EAAA;AAGlC,SAAO,gBAAAP,EAACgB,GAAA,EAAK,SAAAP,GAAkB,SAAAV,EAAA,CAAkB;AACnD;"}

package/dist/components/Employee/Deductions/DeductionsForm/ChildSupportFormView.d.ts

@@ -0,0 +1,9 @@
+import { Garnishment } from '@gusto/embedded-api/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 {};

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ChildSupportFormView.js","sources":["../../../../../src/components/Employee/Deductions/DeductionsForm/ChildSupportFormView.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { Garnishment } from '@gusto/embedded-api/models/components/garnishment'\nimport type { PaymentPeriod } from '@gusto/embedded-api/models/components/garnishmentchildsupport'\nimport { useChildSupportGarnishmentForm } from '../shared/useChildSupportGarnishmentForm'\nimport type { StateFieldEntry, CountyEntry } from '../shared/useChildSupportGarnishmentForm'\nimport { Form } from '@/components/Common/Form'\nimport { ActionsLayout } from '@/components/Common'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { BaseLayout } from '@/components/Base/Base'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\ninterface ChildSupportFormViewProps {\n  employeeId: string\n  deduction: Garnishment | null\n  onSaved: (deduction: Garnishment, mode: 'create' | 'update') => void\n  onCancel: () => void\n}\n\nexport function ChildSupportFormView({\n  employeeId,\n  deduction,\n  onSaved,\n  onCancel,\n}: ChildSupportFormViewProps) {\n  const { t } = useTranslation('Employee.Deductions')\n  const Components = useComponentContext()\n\n  const form = useChildSupportGarnishmentForm({\n    employeeId,\n    garnishmentId: deduction?.uuid,\n  })\n\n  if (form.isLoading) {\n    return <BaseLayout isLoading error={form.errorHandling.errors} />\n  }\n\n  const { Fields } = form.form\n  const hasSelection = form.status.selectedAgency !== null\n\n  const handleSubmit = async () => {\n    const result = await form.actions.onSubmit()\n    if (result) onSaved(result.data, result.mode)\n  }\n\n  return (\n    <BaseLayout error={form.errorHandling.errors}>\n      <SDKFormProvider formHookResult={form}>\n        <Form onSubmit={handleSubmit}>\n          <Flex flexDirection=\"column\" gap={32}>\n            <Components.Heading as=\"h3\">{t('childSupportTitle')}</Components.Heading>\n\n            <Flex flexDirection=\"column\" gap={20}>\n              <Fields.State\n                label={t('agency')}\n                description={t('agencyDescription')}\n                getOptionLabel={(entry: StateFieldEntry) => entry.name}\n                validationMessages={{ REQUIRED: t('agencyRequired') }}\n              />\n\n              {form.status.isManualPaymentRequired && (\n                <Components.Alert status=\"warning\" label={t('manualPaymentRequired')} />\n              )}\n\n              {hasSelection && (\n                <Flex flexDirection=\"column\" gap={20}>\n                  {Fields.FipsCode && (\n                    <Fields.FipsCode\n                      label={t('county')}\n                      description={t('countyDescription')}\n                      getOptionLabel={(entry: CountyEntry) => entry.county ?? t('allCounties')}\n                      validationMessages={{ REQUIRED: t('countyRequired') }}\n                    />\n                  )}\n                  {Fields.CaseNumber && (\n                    <Fields.CaseNumber\n                      label={requiredAttrLabel(form.status.selectedAgency, 'case_number')}\n                      description={t('caseNumberDescription')}\n                      validationMessages={{ REQUIRED: t('caseNumberRequired') }}\n                    />\n                  )}\n                  {Fields.OrderNumber && (\n                    <Fields.OrderNumber\n                      label={requiredAttrLabel(form.status.selectedAgency, 'order_number')}\n                      description={t('orderNumberDescription')}\n                      validationMessages={{ REQUIRED: t('orderNumberRequired') }}\n                    />\n                  )}\n                  {Fields.RemittanceNumber && (\n                    <Fields.RemittanceNumber\n                      label={requiredAttrLabel(form.status.selectedAgency, 'remittance_number')}\n                      description={t('remittanceNumberDescription')}\n                      validationMessages={{ REQUIRED: t('remittanceNumberRequired') }}\n                    />\n                  )}\n                  <Fields.PayPeriodMaximum\n                    label={t('totalAmountWithheld')}\n                    description={t('totalAmountWithheldDescription')}\n                    format=\"currency\"\n                    min={0}\n                    validationMessages={{\n                      REQUIRED: t('payPeriodMaximumRequired'),\n                      NEGATIVE_AMOUNT: t('amountNonNegative'),\n                    }}\n                  />\n                  <Fields.Amount\n                    label={t('maxPaycheckPercentage')}\n                    description={t('maxPaycheckPercentageDescription')}\n                    format=\"percent\"\n                    min={0}\n                    max={100}\n                    validationMessages={{\n                      REQUIRED: t('amountRequired'),\n                      PERCENT_OUT_OF_RANGE: t('percentOutOfRange'),\n                    }}\n                  />\n                  <Fields.PaymentPeriod\n                    label={t('per')}\n                    description={t('perDescription')}\n                    getOptionLabel={(value: PaymentPeriod) => paymentPeriodLabel(t, value)}\n                    validationMessages={{ REQUIRED: t('paymentPeriodRequired') }}\n                  />\n                </Flex>\n              )}\n            </Flex>\n            <ActionsLayout>\n              <Components.Button variant=\"secondary\" type=\"button\" onClick={onCancel}>\n                {t('cancelCta')}\n              </Components.Button>\n              {hasSelection && (\n                <Components.Button type=\"submit\" isLoading={form.status.isPending}>\n                  {t('saveCta')}\n                </Components.Button>\n              )}\n            </ActionsLayout>\n          </Flex>\n        </Form>\n      </SDKFormProvider>\n    </BaseLayout>\n  )\n}\n\nfunction requiredAttrLabel(\n  selectedAgency: { requiredAttributes?: Array<{ key?: string; label?: string }> } | null,\n  key: 'case_number' | 'order_number' | 'remittance_number',\n): string {\n  const match = selectedAgency?.requiredAttributes?.find(a => a.key === key)\n  return match?.label ?? key\n}\n\nfunction paymentPeriodLabel(\n  t: ReturnType<typeof useTranslation<'Employee.Deductions'>>['t'],\n  value: PaymentPeriod,\n): string {\n  switch (value) {\n    case 'Every week':\n      return t('everyWeek')\n    case 'Every other week':\n      return t('everyOtherWeek')\n    case 'Twice per month':\n      return t('twicePerMonth')\n    case 'Monthly':\n      return t('monthly')\n  }\n}\n"],"names":["ChildSupportFormView","employeeId","deduction","onSaved","onCancel","t","useTranslation","Components","useComponentContext","form","useChildSupportGarnishmentForm","BaseLayout","Fields","hasSelection","handleSubmit","result","SDKFormProvider","jsx","Form","jsxs","Flex","entry","requiredAttrLabel","value","paymentPeriodLabel","ActionsLayout","selectedAgency","key","a"],"mappings":"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"}

package/dist/components/Employee/Deductions/DeductionsForm/DeductionsForm.d.ts

@@ -1,7 +1,11 @@
-import { BaseComponentInterface, CommonComponentInterface } from '../../../Base';
-interface DeductionsFormProps extends CommonComponentInterface<'Employee.Deductions'> {
+import { Garnishment } from '@gusto/embedded-api/models/components/garnishment';
+export interface DeductionsFormProps {
+    className?: string;
     employeeId: string;
-    deductionId?: string | null;
+    /** When provided, the form is in edit mode and the deduction's existing
+     *  garnishment type selects the inline form variant. Omit for add mode. */
+    deduction?: Garnishment | null;
+    onSaved: (deduction: Garnishment, mode: 'create' | 'update') => void;
+    onCancel: () => void;
 }
-export declare function DeductionsForm(props: DeductionsFormProps & BaseComponentInterface): import("react/jsx-runtime").JSX.Element;
-export {};
+export declare function DeductionsForm({ className, employeeId, deduction, onSaved, onCancel, }: DeductionsFormProps): import("react/jsx-runtime").JSX.Element;