@gusto/embedded-react-sdk 0.55.1 → 0.55.3

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/List.js

@@ -1,21 +1,24 @@
-import { jsx as o } from "react/jsx-runtime";
-import { useTranslation as m } from "react-i18next";
-import { useDocumentList as s } from "./useDocumentList.js";
+import { jsx as n } from "react/jsx-runtime";
+import { useTranslation as s } from "react-i18next";
+import { useDocumentList as m } from "./useDocumentList.js";
 import l from "./List.module.scss.js";
 import { Flex as u } from "../../../../../Common/Flex/Flex.js";
 import { DocumentList as c } from "../../../../../Common/DocumentList/DocumentList.js";
-function f() {
-  const { employeeForms: i, handleRequestFormToSign: n, documentListError: r } = s(), { t: e } = m("Employee.DocumentSigner");
-  return /* @__PURE__ */ o("section", { className: l.root, children: /* @__PURE__ */ o(u, { flexDirection: "column", gap: 32, children: /* @__PURE__ */ o(
+function a(t, i) {
+  return t.name && i(`forms.${t.name}.description`, { defaultValue: "" }) || t.description;
+}
+function D() {
+  const { employeeForms: t, handleRequestFormToSign: i, documentListError: r } = m(), { t: e } = s("Employee.DocumentSigner");
+  return /* @__PURE__ */ n("section", { className: l.root, children: /* @__PURE__ */ n(u, { flexDirection: "column", gap: 32, children: /* @__PURE__ */ n(
     c,
     {
-      forms: i.map((t) => ({
-        uuid: t.uuid,
-        title: t.title,
-        description: t.description,
-        requires_signing: t.requiresSigning
+      forms: t.map((o) => ({
+        uuid: o.uuid,
+        title: o.title,
+        description: a(o, e),
+        requires_signing: o.requiresSigning
       })),
-      onRequestSign: n,
+      onRequestSign: i,
       withError: !!r,
       label: e("documentListLabel"),
       columnLabels: {
@@ -33,6 +36,6 @@ function f() {
   ) }) });
 }
 export {
-  f as List
+  D as List
 };
 //# sourceMappingURL=List.js.map

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/List.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useDocumentList } from './useDocumentList'\nimport styles from './List.module.scss'\nimport { Flex, DocumentList as SharedDocumentList } from '@/components/Common'\n\n/** @internal */\nexport function List() {\n  const { employeeForms, handleRequestFormToSign, documentListError } = useDocumentList()\n  const { t } = useTranslation('Employee.DocumentSigner')\n\n  return (\n    <section className={styles.root}>\n      <Flex flexDirection=\"column\" gap={32}>\n        <SharedDocumentList\n          forms={employeeForms.map(form => ({\n            uuid: form.uuid,\n            title: form.title,\n            description: form.description,\n            requires_signing: form.requiresSigning,\n          }))}\n          onRequestSign={handleRequestFormToSign}\n          withError={!!documentListError}\n          label={t('documentListLabel')}\n          columnLabels={{\n            form: t('formColumnLabel'),\n            action: t('actionColumnLabel'),\n          }}\n          statusLabels={{\n            signCta: t('signDocumentCta'),\n            notSigned: t('notSigned'),\n            complete: t('signDocumentComplete'),\n          }}\n          emptyStateLabel={t('emptyTableTitle')}\n          errorLabel={t('documentListError')}\n        />\n      </Flex>\n    </section>\n  )\n}\n"],"names":["List","employeeForms","handleRequestFormToSign","documentListError","useDocumentList","t","useTranslation","jsx","styles","Flex","SharedDocumentList","form"],"mappings":";;;;;;AAMO,SAASA,IAAO;AACrB,QAAM,EAAE,eAAAC,GAAe,yBAAAC,GAAyB,mBAAAC,EAAA,IAAsBC,EAAA,GAChE,EAAE,GAAAC,EAAA,IAAMC,EAAe,yBAAyB;AAEtD,SACE,gBAAAC,EAAC,WAAA,EAAQ,WAAWC,EAAO,MACzB,4BAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA,gBAAAF;AAAA,IAACG;AAAAA,IAAA;AAAA,MACC,OAAOT,EAAc,IAAI,CAAAU,OAAS;AAAA,QAChC,MAAMA,EAAK;AAAA,QACX,OAAOA,EAAK;AAAA,QACZ,aAAaA,EAAK;AAAA,QAClB,kBAAkBA,EAAK;AAAA,MAAA,EACvB;AAAA,MACF,eAAeT;AAAA,MACf,WAAW,CAAC,CAACC;AAAA,MACb,OAAOE,EAAE,mBAAmB;AAAA,MAC5B,cAAc;AAAA,QACZ,MAAMA,EAAE,iBAAiB;AAAA,QACzB,QAAQA,EAAE,mBAAmB;AAAA,MAAA;AAAA,MAE/B,cAAc;AAAA,QACZ,SAASA,EAAE,iBAAiB;AAAA,QAC5B,WAAWA,EAAE,WAAW;AAAA,QACxB,UAAUA,EAAE,sBAAsB;AAAA,MAAA;AAAA,MAEpC,iBAAiBA,EAAE,iBAAiB;AAAA,MACpC,YAAYA,EAAE,mBAAmB;AAAA,IAAA;AAAA,EAAA,GAErC,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"List.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/List.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { TFunction } from 'i18next'\nimport type { Form as FormSchema } from '@gusto/embedded-api/models/components/form'\nimport { useDocumentList } from './useDocumentList'\nimport styles from './List.module.scss'\nimport { Flex, DocumentList as SharedDocumentList } from '@/components/Common'\n\n/**\n * Resolves a form's rendered description, preferring a partner-provided\n * `forms.<name>.description` dictionary override over the API-provided text.\n * Falls back to the API text when no override exists (including for form\n * names outside the SDK's known catalog).\n */\nfunction resolveFormDescription(form: FormSchema, t: TFunction<'Employee.DocumentSigner'>) {\n  if (!form.name) return form.description\n  const override = t(`forms.${form.name}.description` as never, { defaultValue: '' }) as string\n  return override || form.description\n}\n\n/** @internal */\nexport function List() {\n  const { employeeForms, handleRequestFormToSign, documentListError } = useDocumentList()\n  const { t } = useTranslation('Employee.DocumentSigner')\n\n  return (\n    <section className={styles.root}>\n      <Flex flexDirection=\"column\" gap={32}>\n        <SharedDocumentList\n          forms={employeeForms.map(form => ({\n            uuid: form.uuid,\n            title: form.title,\n            description: resolveFormDescription(form, t),\n            requires_signing: form.requiresSigning,\n          }))}\n          onRequestSign={handleRequestFormToSign}\n          withError={!!documentListError}\n          label={t('documentListLabel')}\n          columnLabels={{\n            form: t('formColumnLabel'),\n            action: t('actionColumnLabel'),\n          }}\n          statusLabels={{\n            signCta: t('signDocumentCta'),\n            notSigned: t('notSigned'),\n            complete: t('signDocumentComplete'),\n          }}\n          emptyStateLabel={t('emptyTableTitle')}\n          errorLabel={t('documentListError')}\n        />\n      </Flex>\n    </section>\n  )\n}\n"],"names":["resolveFormDescription","form","t","List","employeeForms","handleRequestFormToSign","documentListError","useDocumentList","useTranslation","jsx","styles","Flex","SharedDocumentList"],"mappings":";;;;;;AAaA,SAASA,EAAuBC,GAAkBC,GAAyC;AACzF,SAAKD,EAAK,QACOC,EAAE,SAASD,EAAK,IAAI,gBAAyB,EAAE,cAAc,IAAI,KAC/DA,EAAK;AAC1B;AAGO,SAASE,IAAO;AACrB,QAAM,EAAE,eAAAC,GAAe,yBAAAC,GAAyB,mBAAAC,EAAA,IAAsBC,EAAA,GAChE,EAAE,GAAAL,EAAA,IAAMM,EAAe,yBAAyB;AAEtD,SACE,gBAAAC,EAAC,WAAA,EAAQ,WAAWC,EAAO,MACzB,4BAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA,gBAAAF;AAAA,IAACG;AAAAA,IAAA;AAAA,MACC,OAAOR,EAAc,IAAI,CAAAH,OAAS;AAAA,QAChC,MAAMA,EAAK;AAAA,QACX,OAAOA,EAAK;AAAA,QACZ,aAAaD,EAAuBC,GAAMC,CAAC;AAAA,QAC3C,kBAAkBD,EAAK;AAAA,MAAA,EACvB;AAAA,MACF,eAAeI;AAAA,MACf,WAAW,CAAC,CAACC;AAAA,MACb,OAAOJ,EAAE,mBAAmB;AAAA,MAC5B,cAAc;AAAA,QACZ,MAAMA,EAAE,iBAAiB;AAAA,QACzB,QAAQA,EAAE,mBAAmB;AAAA,MAAA;AAAA,MAE/B,cAAc;AAAA,QACZ,SAASA,EAAE,iBAAiB;AAAA,QAC5B,WAAWA,EAAE,WAAW;AAAA,QACxB,UAAUA,EAAE,sBAAsB;AAAA,MAAA;AAAA,MAEpC,iBAAiBA,EAAE,iBAAiB;AAAA,MACpC,YAAYA,EAAE,mBAAmB;AAAA,IAAA;AAAA,EAAA,GAErC,EAAA,CACF;AAEJ;"}

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.js

@@ -9,12 +9,15 @@ import "@gusto/embedded-api/models/errors/gustoembeddederror";
 import "@gusto/embedded-api/models/errors/sdkvalidationerror";
 import "@gusto/embedded-api/models/errors/unprocessableentityerror";
 import "@gusto/embedded-api/models/errors/httpclienterrors";
+import "dompurify";
+import "../../../../../../contexts/LocaleProvider/useLocale.js";
 import "../../../../../../shared/constants.js";
 import "../../../../../../contexts/ComponentAdapter/useComponentContext.js";
+import "../../../../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { createCompoundContext as t } from "../../../../../Base/createCompoundContext.js";
-const [d, a] = t("DocumentListContext");
+const [v, P] = t("DocumentListContext");
 export {
-  a as DocumentListProvider,
-  d as useDocumentList
+  P as DocumentListProvider,
+  v as useDocumentList
 };
 //# sourceMappingURL=useDocumentList.js.map

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDocumentList.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.ts"],"sourcesContent":["import type { Form } from '@gusto/embedded-api/models/components/form'\nimport { createCompoundContext } from '@/components/Base'\n\ntype DocumentListContextType = {\n  employeeForms: Form[]\n  hasSignedAllForms: boolean\n  handleContinue: () => void\n  handleRequestFormToSign: (form: Form) => void\n  documentListError: Error | null\n  formToSign?: Form\n}\n\nconst [useDocumentList, DocumentListProvider] =\n  createCompoundContext<DocumentListContextType>('DocumentListContext')\nexport { useDocumentList, DocumentListProvider }\n"],"names":["useDocumentList","DocumentListProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;AAYA,MAAM,CAACA,GAAiBC,CAAoB,IAC1CC,EAA+C,qBAAqB;"}
+{"version":3,"file":"useDocumentList.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.ts"],"sourcesContent":["import type { Form } from '@gusto/embedded-api/models/components/form'\nimport { createCompoundContext } from '@/components/Base'\n\ntype DocumentListContextType = {\n  employeeForms: Form[]\n  hasSignedAllForms: boolean\n  handleContinue: () => void\n  handleRequestFormToSign: (form: Form) => void\n  documentListError: Error | null\n  formToSign?: Form\n}\n\nconst [useDocumentList, DocumentListProvider] =\n  createCompoundContext<DocumentListContextType>('DocumentListContext')\nexport { useDocumentList, DocumentListProvider }\n"],"names":["useDocumentList","DocumentListProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;;;;AAYA,MAAM,CAACA,GAAiBC,CAAoB,IAC1CC,EAA+C,qBAAqB;"}

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentSigner.d.ts

@@ -19,6 +19,10 @@ export interface DocumentSignerProps extends BaseComponentInterface<'Employee.Do
  * signed, the flow starts on the I-9 employment eligibility step before
  * presenting the document list.
  *
+ * Each form's description is rendered as returned by the API, unless the `dictionary` prop
+ * supplies a `forms.<name>.description` override for that form's `name` (e.g.
+ * `forms.employee_direct_deposit.description`).
+ *
  * @events
  * | Event | Description | Data |
  * | ----- | ----------- | ---- |

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentSigner.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocumentSigner.js","sources":["../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentSigner.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport { useEmployeeFormsListSuspense } from '@gusto/embedded-api/react-query/employeeFormsList'\nimport {\n  DocumentListContextual,\n  EmploymentEligibilityContextual,\n  type DocumentSignerContextInterface,\n} from './documentSignerStateMachine'\nimport { documentSignerMachine } from './stateMachine'\nimport { Flow } from '@/components/Flow/Flow'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { I9_FORM_NAME } from '@/shared/constants'\n\n/**\n * Props for {@link DocumentSigner}.\n *\n * @public\n */\nexport interface DocumentSignerProps extends BaseComponentInterface<'Employee.DocumentSigner'> {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** When `true`, the flow routes through I-9 employment eligibility before listing documents for signing. Defaults to `false`. */\n  withEmployeeI9?: boolean\n}\n\n/**\n * Onboarding step for signing employee documents.\n *\n * @remarks\n * Lists the employee's pending forms and routes through the signing UI for each\n * one. When `withEmployeeI9` is `true` and the employee's I-9 has not been\n * signed, the flow starts on the I-9 employment eligibility step before\n * presenting the document list.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/employmentEligibility/done` | Fired after I-9 employment eligibility is captured | The updated I-9 authorization |\n * | `employee/forms/view` | Fired when a form's \"Sign\" action is selected from the document list | `{ uuid: string; name?: string }` |\n * | `employee/forms/sign` | Fired after a form is successfully signed | {@link APIModels.Form} |\n * | `employee/employmentEligibility/change` | Fired when the user requests to change their I-9 eligibility status | — |\n * | `employee/forms/done` | Fired when all required forms have been signed and the parent flow can advance | — |\n * | `cancel` | Fired when the user cancels signing a form and returns to the document list | — |\n *\n * @components\n * - {@link EmploymentEligibility}\n * - {@link I9SignatureForm}\n * - {@link DocumentList}\n * - {@link SignatureForm}\n *\n * @param props - See {@link DocumentSignerProps}.\n * @returns The document signer flow.\n * @public\n */\nexport function DocumentSigner(props: DocumentSignerProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ employeeId, onEvent, dictionary, withEmployeeI9 = false }: DocumentSignerProps) {\n  useComponentDictionary('Employee.DocumentSigner', dictionary)\n\n  const { data: employeeData } = useEmployeesGetSuspense({ employeeId })\n  const { data: formsData } = useEmployeeFormsListSuspense({ employeeId })\n\n  const employeeHasI9Enabled = employeeData.employee?.onboardingDocumentsConfig?.i9Document === true\n\n  const i9Form = formsData.forms?.find(form => form.name === I9_FORM_NAME)\n  const needsI9Form =\n    withEmployeeI9 && employeeHasI9Enabled && (!i9Form || i9Form.requiresSigning === true)\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        needsI9Form ? 'employmentEligibility' : 'index',\n        documentSignerMachine,\n        (initialContext: DocumentSignerContextInterface) => ({\n          ...initialContext,\n          component: needsI9Form ? EmploymentEligibilityContextual : DocumentListContextual,\n          employeeId,\n          withEmployeeI9,\n        }),\n      ),\n    [employeeId, withEmployeeI9],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["DocumentSigner","props","jsx","BaseComponent","Root","employeeId","onEvent","dictionary","withEmployeeI9","useComponentDictionary","employeeData","useEmployeesGetSuspense","formsData","useEmployeeFormsListSuspense","employeeHasI9Enabled","i9Form","form","I9_FORM_NAME","needsI9Form","machine","useMemo","createMachine","documentSignerMachine","initialContext","EmploymentEligibilityContextual","DocumentListContextual","Flow"],"mappings":";;;;;;;;;;;;AAwDO,SAASA,EAAeC,GAA4B;AACzD,SACE,gBAAAC,EAACC,KAAe,GAAGF,GACjB,4BAACG,GAAA,EAAM,GAAGH,GAAO,EAAA,CACnB;AAEJ;AAEA,SAASG,EAAK,EAAE,YAAAC,GAAY,SAAAC,GAAS,YAAAC,GAAY,gBAAAC,IAAiB,MAA8B;AAC9F,EAAAC,EAAuB,2BAA2BF,CAAU;AAE5D,QAAM,EAAE,MAAMG,EAAA,IAAiBC,EAAwB,EAAE,YAAAN,GAAY,GAC/D,EAAE,MAAMO,EAAA,IAAcC,EAA6B,EAAE,YAAAR,GAAY,GAEjES,IAAuBJ,EAAa,UAAU,2BAA2B,eAAe,IAExFK,IAASH,EAAU,OAAO,KAAK,CAAAI,MAAQA,EAAK,SAASC,CAAY,GACjEC,IACJV,KAAkBM,MAAyB,CAACC,KAAUA,EAAO,oBAAoB,KAE7EI,IAAUC;AAAA,IACd,MACEC;AAAA,MACEH,IAAc,0BAA0B;AAAA,MACxCI;AAAA,MACA,CAACC,OAAoD;AAAA,QACnD,GAAGA;AAAA,QACH,WAAWL,IAAcM,IAAkCC;AAAA,QAC3D,YAAApB;AAAA,QACA,gBAAAG;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACH,GAAYG,CAAc;AAAA,EAAA;AAG7B,SAAO,gBAAAN,EAACwB,GAAA,EAAK,SAAAP,GAAkB,SAAAb,EAAA,CAAkB;AACnD;"}
+{"version":3,"file":"DocumentSigner.js","sources":["../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentSigner.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport { useEmployeeFormsListSuspense } from '@gusto/embedded-api/react-query/employeeFormsList'\nimport {\n  DocumentListContextual,\n  EmploymentEligibilityContextual,\n  type DocumentSignerContextInterface,\n} from './documentSignerStateMachine'\nimport { documentSignerMachine } from './stateMachine'\nimport { Flow } from '@/components/Flow/Flow'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { I9_FORM_NAME } from '@/shared/constants'\n\n/**\n * Props for {@link DocumentSigner}.\n *\n * @public\n */\nexport interface DocumentSignerProps extends BaseComponentInterface<'Employee.DocumentSigner'> {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** When `true`, the flow routes through I-9 employment eligibility before listing documents for signing. Defaults to `false`. */\n  withEmployeeI9?: boolean\n}\n\n/**\n * Onboarding step for signing employee documents.\n *\n * @remarks\n * Lists the employee's pending forms and routes through the signing UI for each\n * one. When `withEmployeeI9` is `true` and the employee's I-9 has not been\n * signed, the flow starts on the I-9 employment eligibility step before\n * presenting the document list.\n *\n * Each form's description is rendered as returned by the API, unless the `dictionary` prop\n * supplies a `forms.<name>.description` override for that form's `name` (e.g.\n * `forms.employee_direct_deposit.description`).\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/employmentEligibility/done` | Fired after I-9 employment eligibility is captured | The updated I-9 authorization |\n * | `employee/forms/view` | Fired when a form's \"Sign\" action is selected from the document list | `{ uuid: string; name?: string }` |\n * | `employee/forms/sign` | Fired after a form is successfully signed | {@link APIModels.Form} |\n * | `employee/employmentEligibility/change` | Fired when the user requests to change their I-9 eligibility status | — |\n * | `employee/forms/done` | Fired when all required forms have been signed and the parent flow can advance | — |\n * | `cancel` | Fired when the user cancels signing a form and returns to the document list | — |\n *\n * @components\n * - {@link EmploymentEligibility}\n * - {@link I9SignatureForm}\n * - {@link DocumentList}\n * - {@link SignatureForm}\n *\n * @param props - See {@link DocumentSignerProps}.\n * @returns The document signer flow.\n * @public\n */\nexport function DocumentSigner(props: DocumentSignerProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ employeeId, onEvent, dictionary, withEmployeeI9 = false }: DocumentSignerProps) {\n  useComponentDictionary('Employee.DocumentSigner', dictionary)\n\n  const { data: employeeData } = useEmployeesGetSuspense({ employeeId })\n  const { data: formsData } = useEmployeeFormsListSuspense({ employeeId })\n\n  const employeeHasI9Enabled = employeeData.employee?.onboardingDocumentsConfig?.i9Document === true\n\n  const i9Form = formsData.forms?.find(form => form.name === I9_FORM_NAME)\n  const needsI9Form =\n    withEmployeeI9 && employeeHasI9Enabled && (!i9Form || i9Form.requiresSigning === true)\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        needsI9Form ? 'employmentEligibility' : 'index',\n        documentSignerMachine,\n        (initialContext: DocumentSignerContextInterface) => ({\n          ...initialContext,\n          component: needsI9Form ? EmploymentEligibilityContextual : DocumentListContextual,\n          employeeId,\n          withEmployeeI9,\n        }),\n      ),\n    [employeeId, withEmployeeI9],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["DocumentSigner","props","jsx","BaseComponent","Root","employeeId","onEvent","dictionary","withEmployeeI9","useComponentDictionary","employeeData","useEmployeesGetSuspense","formsData","useEmployeeFormsListSuspense","employeeHasI9Enabled","i9Form","form","I9_FORM_NAME","needsI9Form","machine","useMemo","createMachine","documentSignerMachine","initialContext","EmploymentEligibilityContextual","DocumentListContextual","Flow"],"mappings":";;;;;;;;;;;;AA4DO,SAASA,EAAeC,GAA4B;AACzD,SACE,gBAAAC,EAACC,KAAe,GAAGF,GACjB,4BAACG,GAAA,EAAM,GAAGH,GAAO,EAAA,CACnB;AAEJ;AAEA,SAASG,EAAK,EAAE,YAAAC,GAAY,SAAAC,GAAS,YAAAC,GAAY,gBAAAC,IAAiB,MAA8B;AAC9F,EAAAC,EAAuB,2BAA2BF,CAAU;AAE5D,QAAM,EAAE,MAAMG,EAAA,IAAiBC,EAAwB,EAAE,YAAAN,GAAY,GAC/D,EAAE,MAAMO,EAAA,IAAcC,EAA6B,EAAE,YAAAR,GAAY,GAEjES,IAAuBJ,EAAa,UAAU,2BAA2B,eAAe,IAExFK,IAASH,EAAU,OAAO,KAAK,CAAAI,MAAQA,EAAK,SAASC,CAAY,GACjEC,IACJV,KAAkBM,MAAyB,CAACC,KAAUA,EAAO,oBAAoB,KAE7EI,IAAUC;AAAA,IACd,MACEC;AAAA,MACEH,IAAc,0BAA0B;AAAA,MACxCI;AAAA,MACA,CAACC,OAAoD;AAAA,QACnD,GAAGA;AAAA,QACH,WAAWL,IAAcM,IAAkCC;AAAA,QAC3D,YAAApB;AAAA,QACA,gBAAAG;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACH,GAAYG,CAAc;AAAA,EAAA;AAG7B,SAAO,gBAAAN,EAACwB,GAAA,EAAK,SAAAP,GAAkB,SAAAb,EAAA,CAAkB;AACnD;"}

package/dist/components/Employee/FederalTaxes/shared/FederalTaxesView.js

@@ -3,10 +3,10 @@ import { useTranslation as x, Trans as s } from "react-i18next";
 import { BaseLayout as b } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
 import { Form as I } from "../../../Common/Form/Form.js";
-import { Flex as l } from "../../../Common/Flex/Flex.js";
 import { SDKFormProvider as R } from "../../../../partner-hook-utils/form/SDKFormProvider.js";
 import { useComponentContext as D } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as F, useComponentDictionary as S } from "../../../../i18n/I18n.js";
+import { Flex as l } from "../../../Common/Flex/Flex.js";
 function Q({
   federalTaxes: r,
   onSubmit: d,

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

@@ -1,17 +1,17 @@
 import { jsxs as M, jsx as n } from "react/jsx-runtime";
 import { useTranslation as s } from "react-i18next";
 import { useManagementBankFormDictionary as p } from "./useFormDictionary.js";
-import { Flex as c } from "../../../Common/Flex/Flex.js";
-import { useComponentContext as _ } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentContext as c } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { componentEvents as t } from "../../../../shared/constants.js";
+import { Flex as _ } from "../../../Common/Flex/Flex.js";
 import { BankFormBody as l } from "../shared/BankFormBody/BankFormBody.js";
 function F({
   employeeId: e,
   onEvent: o,
   ...m
 }) {
-  const r = p(), { t: a } = s("Employee.Management.PaymentMethodBankForm"), i = _();
-  return /* @__PURE__ */ M(c, { flexDirection: "column", gap: 32, children: [
+  const r = p(), { t: a } = s("Employee.Management.PaymentMethodBankForm"), i = c();
+  return /* @__PURE__ */ M(_, { flexDirection: "column", gap: 32, children: [
     /* @__PURE__ */ n(i.Heading, { as: "h1", styledAs: "h2", children: a("title") }),
     /* @__PURE__ */ n(
       l,

package/dist/components/Employee/PaymentMethod/onboarding/BankForm.js

@@ -1,13 +1,13 @@
 import { jsxs as c, jsx as n } from "react/jsx-runtime";
 import { useTranslation as p } from "react-i18next";
 import { useOnboardingBankFormDictionary as d } from "./useFormDictionary.js";
-import { Flex as l } from "../../../Common/Flex/Flex.js";
-import { useComponentContext as f } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentContext as l } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { componentEvents as r } from "../../../../shared/constants.js";
+import { Flex as f } from "../../../Common/Flex/Flex.js";
 import { BankFormBody as C } from "../shared/BankFormBody/BankFormBody.js";
 function F({ employeeId: t, onEvent: o, ...m }) {
-  const e = d(), { t: i } = p("Employee.PaymentMethod"), a = f();
-  return /* @__PURE__ */ c(l, { flexDirection: "column", gap: 32, children: [
+  const e = d(), { t: i } = p("Employee.PaymentMethod"), a = l();
+  return /* @__PURE__ */ c(f, { flexDirection: "column", gap: 32, children: [
     /* @__PURE__ */ n(a.Heading, { as: "h1", styledAs: "h2", children: i("addBankAccountFormTitle") }),
     /* @__PURE__ */ n(
       C,

package/dist/components/Flow/Flow.js

@@ -1,10 +1,10 @@
 import { jsx as o, jsxs as f } from "react/jsx-runtime";
 import { Suspense as u } from "react";
 import { useMachine as h } from "react-robot";
-import { Flex as s } from "../Common/Flex/Flex.js";
 import { FlowContext as x } from "./useFlow.js";
 import { FlowHeader as F } from "./FlowHeader.js";
 import { useLoadingIndicator as v } from "../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
+import { Flex as s } from "../Common/Flex/Flex.js";
 const E = 40;
 function H() {
   const { LoadingIndicator: n } = v();

package/dist/components/Payroll/GrossUpModal/GrossUpModal.js

@@ -18,12 +18,13 @@ import "@gusto/embedded-api/models/errors/httpclienterrors";
 import { formatNumberAsCurrency as L } from "../../../helpers/formattedStrings.js";
 import "../../../shared/constants.js";
 import { useComponentContext as V } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import "../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { useI18n as E } from "../../../i18n/I18n.js";
 import { NumberInputField as T } from "../../Common/Fields/NumberInputField/NumberInputField.js";
 const q = P.object({
   netPay: P.number().positive()
 });
-function pe({ isOpen: n, onCalculateGrossUp: w, onApply: A, onCancel: d }) {
+function fe({ isOpen: n, onCalculateGrossUp: w, onApply: A, onCancel: d }) {
   E("Payroll.GrossUpModal");
   const { t: r } = k("Payroll.GrossUpModal"), { Modal: M, Heading: u, Text: p, Button: i, Alert: f } = V(), { baseSubmitHandler: y } = H(), N = R(null), [l, c] = o(null), [h, m] = o(null), [g, b] = o(!1), [x, v] = o(!1), s = U({
     resolver: z(q),
@@ -110,6 +111,6 @@ function pe({ isOpen: n, onCalculateGrossUp: w, onApply: A, onCancel: d }) {
   );
 }
 export {
-  pe as GrossUpModal
+  fe as GrossUpModal
 };
 //# sourceMappingURL=GrossUpModal.js.map

package/dist/components/Payroll/GrossUpModal/GrossUpModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"GrossUpModal.js","sources":["../../../../src/components/Payroll/GrossUpModal/GrossUpModal.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport type { GrossUpModalProps } from './GrossUpModalTypes'\nimport styles from './GrossUpModal.module.scss'\nimport { ActionsLayout, Flex, NumberInputField } from '@/components/Common'\nimport { useBase } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\n\nconst GrossUpFormSchema = z.object({\n  netPay: z.number().positive(),\n})\n\ntype GrossUpFormValues = z.infer<typeof GrossUpFormSchema>\n\n/** @internal */\nexport function GrossUpModal({ isOpen, onCalculateGrossUp, onApply, onCancel }: GrossUpModalProps) {\n  useI18n('Payroll.GrossUpModal')\n  const { t } = useTranslation('Payroll.GrossUpModal')\n  const { Modal, Heading, Text, Button, Alert } = useComponentContext()\n  const { baseSubmitHandler } = useBase()\n  const modalContainerRef = useRef<HTMLDivElement>(null)\n\n  const [calculatedGrossUp, setCalculatedGrossUp] = useState<string | null>(null)\n  const [errorMessage, setErrorMessage] = useState<string | null>(null)\n  const [isCalculating, setIsCalculating] = useState(false)\n  const [isApplying, setIsApplying] = useState(false)\n\n  const formHandlers = useForm<GrossUpFormValues>({\n    resolver: zodResolver(GrossUpFormSchema),\n    defaultValues: { netPay: 0 },\n  })\n\n  useEffect(() => {\n    if (!isOpen) {\n      formHandlers.reset({ netPay: 0 })\n      setCalculatedGrossUp(null)\n      setErrorMessage(null)\n    }\n  }, [isOpen, formHandlers.reset])\n\n  const handleCalculate = async (data: GrossUpFormValues) => {\n    setErrorMessage(null)\n    setCalculatedGrossUp(null)\n    setIsCalculating(true)\n\n    await baseSubmitHandler(null, async () => {\n      try {\n        const result = await onCalculateGrossUp(data.netPay)\n\n        if (result) {\n          setCalculatedGrossUp(result)\n        } else {\n          setErrorMessage(t('errorMessage'))\n        }\n      } finally {\n        setIsCalculating(false)\n      }\n    })\n  }\n\n  const handleApply = async () => {\n    if (calculatedGrossUp) {\n      setIsApplying(true)\n      await baseSubmitHandler(null, async () => {\n        try {\n          await onApply(calculatedGrossUp)\n        } finally {\n          setIsApplying(false)\n        }\n      })\n    }\n  }\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onClose={onCancel}\n      containerRef={modalContainerRef}\n      footer={\n        <ActionsLayout>\n          <Button\n            variant=\"primary\"\n            isDisabled={!calculatedGrossUp}\n            onClick={handleApply}\n            isLoading={isApplying}\n          >\n            {t('applyCta')}\n          </Button>\n          <Button variant=\"secondary\" onClick={onCancel}>\n            {t('cancelCta')}\n          </Button>\n        </ActionsLayout>\n      }\n    >\n      <FormProvider {...formHandlers}>\n        <div className={styles.header}>\n          <Heading as=\"h2\" styledAs=\"h3\">\n            {t('title')}\n          </Heading>\n          <Text variant=\"supporting\" as=\"p\">\n            {t('description')}\n          </Text>\n        </div>\n\n        <div className={styles.content}>\n          {errorMessage && (\n            <div className={styles.alert}>\n              <Alert label={errorMessage} status=\"error\" disableScrollIntoView />\n            </div>\n          )}\n\n          <div className={styles.alert}>\n            <Alert label={t('warning')} status=\"warning\" disableScrollIntoView />\n          </div>\n\n          <Flex flexDirection=\"row\" gap={8}>\n            <NumberInputField\n              name=\"netPay\"\n              label={t('netPayLabel')}\n              format=\"currency\"\n              errorMessage={t('validations.netPay')}\n              min={0}\n              isRequired\n            />\n            <Button\n              variant=\"secondary\"\n              className={styles.calculateButton}\n              isDisabled={isCalculating}\n              onClick={formHandlers.handleSubmit(handleCalculate)}\n            >\n              {isCalculating ? t('calculatingCta') : t('calculateCta')}\n            </Button>\n          </Flex>\n\n          {calculatedGrossUp && (\n            <>\n              <div className={styles.result}>\n                <Text size=\"sm\" variant=\"supporting\" weight=\"semibold\">\n                  {t('grossPayResult')}\n                </Text>\n                <Heading as=\"h3\">{formatNumberAsCurrency(parseFloat(calculatedGrossUp))}</Heading>\n              </div>\n            </>\n          )}\n        </div>\n      </FormProvider>\n    </Modal>\n  )\n}\n"],"names":["GrossUpFormSchema","z","GrossUpModal","isOpen","onCalculateGrossUp","onApply","onCancel","useI18n","t","useTranslation","Modal","Heading","Text","Button","Alert","useComponentContext","baseSubmitHandler","useBase","modalContainerRef","useRef","calculatedGrossUp","setCalculatedGrossUp","useState","errorMessage","setErrorMessage","isCalculating","setIsCalculating","isApplying","setIsApplying","formHandlers","useForm","zodResolver","useEffect","handleCalculate","data","result","jsx","ActionsLayout","jsxs","FormProvider","styles","Flex","NumberInputField","Fragment"],"mappings":"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"}
+{"version":3,"file":"GrossUpModal.js","sources":["../../../../src/components/Payroll/GrossUpModal/GrossUpModal.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport type { GrossUpModalProps } from './GrossUpModalTypes'\nimport styles from './GrossUpModal.module.scss'\nimport { ActionsLayout, Flex, NumberInputField } from '@/components/Common'\nimport { useBase } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\n\nconst GrossUpFormSchema = z.object({\n  netPay: z.number().positive(),\n})\n\ntype GrossUpFormValues = z.infer<typeof GrossUpFormSchema>\n\n/** @internal */\nexport function GrossUpModal({ isOpen, onCalculateGrossUp, onApply, onCancel }: GrossUpModalProps) {\n  useI18n('Payroll.GrossUpModal')\n  const { t } = useTranslation('Payroll.GrossUpModal')\n  const { Modal, Heading, Text, Button, Alert } = useComponentContext()\n  const { baseSubmitHandler } = useBase()\n  const modalContainerRef = useRef<HTMLDivElement>(null)\n\n  const [calculatedGrossUp, setCalculatedGrossUp] = useState<string | null>(null)\n  const [errorMessage, setErrorMessage] = useState<string | null>(null)\n  const [isCalculating, setIsCalculating] = useState(false)\n  const [isApplying, setIsApplying] = useState(false)\n\n  const formHandlers = useForm<GrossUpFormValues>({\n    resolver: zodResolver(GrossUpFormSchema),\n    defaultValues: { netPay: 0 },\n  })\n\n  useEffect(() => {\n    if (!isOpen) {\n      formHandlers.reset({ netPay: 0 })\n      setCalculatedGrossUp(null)\n      setErrorMessage(null)\n    }\n  }, [isOpen, formHandlers.reset])\n\n  const handleCalculate = async (data: GrossUpFormValues) => {\n    setErrorMessage(null)\n    setCalculatedGrossUp(null)\n    setIsCalculating(true)\n\n    await baseSubmitHandler(null, async () => {\n      try {\n        const result = await onCalculateGrossUp(data.netPay)\n\n        if (result) {\n          setCalculatedGrossUp(result)\n        } else {\n          setErrorMessage(t('errorMessage'))\n        }\n      } finally {\n        setIsCalculating(false)\n      }\n    })\n  }\n\n  const handleApply = async () => {\n    if (calculatedGrossUp) {\n      setIsApplying(true)\n      await baseSubmitHandler(null, async () => {\n        try {\n          await onApply(calculatedGrossUp)\n        } finally {\n          setIsApplying(false)\n        }\n      })\n    }\n  }\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onClose={onCancel}\n      containerRef={modalContainerRef}\n      footer={\n        <ActionsLayout>\n          <Button\n            variant=\"primary\"\n            isDisabled={!calculatedGrossUp}\n            onClick={handleApply}\n            isLoading={isApplying}\n          >\n            {t('applyCta')}\n          </Button>\n          <Button variant=\"secondary\" onClick={onCancel}>\n            {t('cancelCta')}\n          </Button>\n        </ActionsLayout>\n      }\n    >\n      <FormProvider {...formHandlers}>\n        <div className={styles.header}>\n          <Heading as=\"h2\" styledAs=\"h3\">\n            {t('title')}\n          </Heading>\n          <Text variant=\"supporting\" as=\"p\">\n            {t('description')}\n          </Text>\n        </div>\n\n        <div className={styles.content}>\n          {errorMessage && (\n            <div className={styles.alert}>\n              <Alert label={errorMessage} status=\"error\" disableScrollIntoView />\n            </div>\n          )}\n\n          <div className={styles.alert}>\n            <Alert label={t('warning')} status=\"warning\" disableScrollIntoView />\n          </div>\n\n          <Flex flexDirection=\"row\" gap={8}>\n            <NumberInputField\n              name=\"netPay\"\n              label={t('netPayLabel')}\n              format=\"currency\"\n              errorMessage={t('validations.netPay')}\n              min={0}\n              isRequired\n            />\n            <Button\n              variant=\"secondary\"\n              className={styles.calculateButton}\n              isDisabled={isCalculating}\n              onClick={formHandlers.handleSubmit(handleCalculate)}\n            >\n              {isCalculating ? t('calculatingCta') : t('calculateCta')}\n            </Button>\n          </Flex>\n\n          {calculatedGrossUp && (\n            <>\n              <div className={styles.result}>\n                <Text size=\"sm\" variant=\"supporting\" weight=\"semibold\">\n                  {t('grossPayResult')}\n                </Text>\n                <Heading as=\"h3\">{formatNumberAsCurrency(parseFloat(calculatedGrossUp))}</Heading>\n              </div>\n            </>\n          )}\n        </div>\n      </FormProvider>\n    </Modal>\n  )\n}\n"],"names":["GrossUpFormSchema","z","GrossUpModal","isOpen","onCalculateGrossUp","onApply","onCancel","useI18n","t","useTranslation","Modal","Heading","Text","Button","Alert","useComponentContext","baseSubmitHandler","useBase","modalContainerRef","useRef","calculatedGrossUp","setCalculatedGrossUp","useState","errorMessage","setErrorMessage","isCalculating","setIsCalculating","isApplying","setIsApplying","formHandlers","useForm","zodResolver","useEffect","handleCalculate","data","result","jsx","ActionsLayout","jsxs","FormProvider","styles","Flex","NumberInputField","Fragment"],"mappings":"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"}

package/dist/components/Payroll/OffCycleCreation/OffCycleCreation.js

@@ -1,11 +1,11 @@
-import { jsx as a } from "react/jsx-runtime";
-import { useState as T, useCallback as P, useMemo as z, useEffect as Y } from "react";
-import { useForm as H, FormProvider as K } from "react-hook-form";
-import { zodResolver as Z } from "@hookform/resolvers/zod";
-import { z as n } from "zod";
-import { useTranslation as b } from "react-i18next";
-import { usePayrollsCreateOffCycleMutation as G } from "@gusto/embedded-api/react-query/payrollsCreateOffCycle";
-import { WithholdingPayPeriod as J, OffCycleReason as x } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
+import { jsx as c } from "react/jsx-runtime";
+import { useState as b, useCallback as P, useMemo as z, useEffect as Y } from "react";
+import { useForm as H, FormProvider as J } from "react-hook-form";
+import { zodResolver as K } from "@hookform/resolvers/zod";
+import { z as s } from "zod";
+import { useTranslation as T } from "react-i18next";
+import { usePayrollsCreateOffCycleMutation as Z } from "@gusto/embedded-api/react-query/payrollsCreateOffCycle";
+import { WithholdingPayPeriod as G, OffCycleReason as v } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
 import { RFCDate as g } from "@gusto/embedded-api/types/rfcdate";
 import { useEmployeesListSuspense as Q } from "@gusto/embedded-api/react-query/employeesList";
 import { createOffCyclePayPeriodDateFormSchema as X } from "../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormTypes.js";
@@ -14,61 +14,65 @@ import { OffCycleCreationPresentation as ee } from "./OffCycleCreationPresentati
 import { useCompanyPaymentSpeed as oe } from "../../../hooks/useCompanyPaymentSpeed.js";
 import { BaseComponent as te } from "../../Base/Base.js";
 import { useBase as ne } from "../../Base/useBase.js";
-import { useComponentDictionary as le, useI18n as i } from "../../../i18n/I18n.js";
-import { componentEvents as se } from "../../../shared/constants.js";
-import { SDKInternalError as re } from "../../../types/sdkError.js";
-import { Form as ie } from "../../Common/Form/Form.js";
-import { OFF_CYCLE_REASON_DEFAULTS as u } from "../OffCycleReasonSelection/types.js";
+import { useComponentDictionary as se, useI18n as a } from "../../../i18n/I18n.js";
+import { componentEvents as le } from "../../../shared/constants.js";
+import { SDKInternalError as ie } from "../../../types/sdkError.js";
+import { Form as re } from "../../Common/Form/Form.js";
+import { OFF_CYCLE_REASON_DEFAULTS as f } from "../OffCycleReasonSelection/types.js";
 const ae = {
-  bonus: x.Bonus,
-  correction: x.Correction
+  bonus: v.Bonus,
+  correction: v.Correction
 };
-function Ae(c) {
-  return /* @__PURE__ */ a(te, { ...c, children: /* @__PURE__ */ a(ce, { ...c }) });
+function Ae(d) {
+  return /* @__PURE__ */ c(te, { ...d, children: /* @__PURE__ */ c(ce, { ...d }) });
 }
-function ce({ dictionary: c, companyId: f, payrollType: m = "bonus" }) {
-  le("Payroll.OffCycleCreation", c), i("Payroll.OffCycleCreation"), i("Payroll.OffCycleReasonSelection"), i("Payroll.OffCyclePayPeriodDateForm"), i("Payroll.OffCycleDeductionsSetting"), i("Payroll.EmployeeSelection");
-  const { t: W } = b("Payroll.OffCyclePayPeriodDateForm"), { t: D } = b("Payroll.OffCycleCreation"), { onEvent: v, baseSubmitHandler: A } = ne(), { paymentSpeedDays: E } = oe(f), { minCheckDate: F, today: U } = $(E), { mutateAsync: N, isPending: L } = G(), [y, O] = T({
-    withholdingPayPeriod: J.EveryOtherWeek,
-    withholdingRate: u[m].withholdingType
-  }), [M, h] = T(!1), _ = P(() => {
-    h(!0);
-  }, []), B = P((e) => {
-    O(e), h(!1);
-  }, []), I = P(() => {
-    h(!1);
+function ce({ dictionary: d, companyId: y, payrollType: m = "bonus" }) {
+  se("Payroll.OffCycleCreation", d), a("Payroll.OffCycleCreation"), a("Payroll.OffCycleReasonSelection"), a("Payroll.OffCyclePayPeriodDateForm"), a("Payroll.OffCycleDeductionsSetting"), a("Payroll.EmployeeSelection");
+  const { t: x } = T("Payroll.OffCyclePayPeriodDateForm"), { t: D } = T("Payroll.OffCycleCreation"), { onEvent: W, baseSubmitHandler: A } = ne(), { paymentSpeedDays: E } = oe(y), { minCheckDate: F, today: U } = $(E), { mutateAsync: N, isPending: L } = Z(), [h, O] = b({
+    withholdingPayPeriod: G.EveryOtherWeek,
+    withholdingRate: f[m].withholdingType
+  }), [M, p] = b(!1), _ = P(() => {
+    p(!0);
+  }, []), j = P((e) => {
+    O(e), p(!1);
+  }, []), B = P(() => {
+    p(!1);
   }, []), { data: R } = Q({
-    companyId: f,
+    companyId: y,
     onboardedActive: !0
   }), k = z(() => [...R.showEmployees ?? []].sort((o, t) => {
-    const l = o.lastName.localeCompare(t.lastName);
-    return l !== 0 ? l : o.firstName.localeCompare(t.firstName);
-  }).map((o) => ({
-    label: [o.firstName, o.lastName].filter(Boolean).join(" "),
-    value: o.uuid
-  })), [R]), V = (e, o) => (
+    const n = o.lastName.localeCompare(t.lastName);
+    return n !== 0 ? n : o.firstName.localeCompare(t.firstName);
+  }).map((o) => {
+    const t = [o.firstName, o.lastName].filter(Boolean).join(" "), n = o.jobs?.find((r) => r.primary) ?? o.jobs?.[0];
+    return {
+      label: t,
+      value: o.uuid,
+      description: n?.title || void 0
+    };
+  }), [R]), I = (e, o) => (
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    W(e, o)
-  ), r = H({
+    x(e, o)
+  ), i = H({
     resolver: (e, o, t) => {
-      const l = e.reason, C = e.isCheckOnly, s = X(
-        V,
-        l === "correction" ? "correction" : m,
-        C ? U : F,
+      const n = e.reason, r = e.isCheckOnly, l = X(
+        I,
+        n === "correction" ? "correction" : m,
+        r ? U : F,
         E
-      ), d = n.object({
-        reason: n.enum(["bonus", "correction"]),
-        skipRegularDeductions: n.boolean(),
-        includeAllEmployees: n.boolean(),
-        selectedEmployeeUuids: n.array(n.string())
-      }).and(s).superRefine((S, q) => {
+      ), u = s.object({
+        reason: s.enum(["bonus", "correction"]),
+        skipRegularDeductions: s.boolean(),
+        includeAllEmployees: s.boolean(),
+        selectedEmployeeUuids: s.array(s.string())
+      }).and(l).superRefine((S, q) => {
         !S.includeAllEmployees && S.selectedEmployeeUuids.length === 0 && q.addIssue({
-          code: n.ZodIssueCode.custom,
+          code: s.ZodIssueCode.custom,
           path: ["selectedEmployeeUuids"],
           message: D("errors.noEmployeesSelected")
         });
       });
-      return Z(d)(e, o, t);
+      return K(u)(e, o, t);
     },
     defaultValues: {
       reason: m,
@@ -76,55 +80,55 @@ function ce({ dictionary: c, companyId: f, payrollType: m = "bonus" }) {
       startDate: null,
       endDate: null,
       checkDate: null,
-      skipRegularDeductions: u[m].skipDeductions,
+      skipRegularDeductions: f[m].skipDeductions,
       includeAllEmployees: !1,
       selectedEmployeeUuids: []
     }
-  }), p = r.watch("reason");
+  }), C = i.watch("reason");
   Y(() => {
-    r.setValue(
+    i.setValue(
       "skipRegularDeductions",
-      u[p].skipDeductions
+      f[C].skipDeductions
     ), O((e) => ({
       ...e,
-      withholdingRate: u[p].withholdingType
+      withholdingRate: f[C].withholdingType
     }));
-  }, [p, r]);
-  const j = async (e) => {
-    const o = e.reason, t = e.checkDate, l = e.startDate, C = e.endDate, w = e.includeAllEmployees ? k.map((s) => s.value) : e.selectedEmployeeUuids.length > 0 ? e.selectedEmployeeUuids : void 0;
+  }, [C, i]);
+  const V = async (e) => {
+    const o = e.reason, t = e.checkDate, n = e.startDate, r = e.endDate, w = e.includeAllEmployees ? k.map((l) => l.value) : e.selectedEmployeeUuids.length > 0 ? e.selectedEmployeeUuids : void 0;
     await A(e, async () => {
-      const s = await N({
+      const l = await N({
         request: {
-          companyId: f,
+          companyId: y,
           requestBody: {
             offCycle: !0,
             offCycleReason: ae[o],
-            startDate: new g(l),
-            endDate: new g(C),
+            startDate: new g(n),
+            endDate: new g(r),
             checkDate: new g(t),
             skipRegularDeductions: e.skipRegularDeductions,
             isCheckOnlyPayroll: e.isCheckOnly,
             employeeUuids: w,
-            withholdingPayPeriod: y.withholdingPayPeriod,
-            fixedWithholdingRate: y.withholdingRate === "supplemental"
+            withholdingPayPeriod: h.withholdingPayPeriod,
+            fixedWithholdingRate: h.withholdingRate === "supplemental"
           }
         }
-      }), d = s.payrollUnprocessed?.payrollUuid ?? s.payrollUnprocessed?.uuid;
-      if (!d)
-        throw new re(D("errors.missingPayrollId"));
-      v(se.OFF_CYCLE_CREATED, { payrollUuid: d });
+      }), u = l.payrollUnprocessed?.payrollUuid ?? l.payrollUnprocessed?.uuid;
+      if (!u)
+        throw new ie(D("errors.missingPayrollId"));
+      W(le.OFF_CYCLE_CREATED, { payrollUuid: u });
     });
   };
-  return /* @__PURE__ */ a(K, { ...r, children: /* @__PURE__ */ a(ie, { onSubmit: r.handleSubmit(j), children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ c(J, { ...i, children: /* @__PURE__ */ c(re, { onSubmit: i.handleSubmit(V), children: /* @__PURE__ */ c(
     ee,
     {
       employees: k,
       isPending: L,
-      taxWithholdingConfig: y,
+      taxWithholdingConfig: h,
       isTaxWithholdingModalOpen: M,
       onTaxWithholdingEditClick: _,
-      onTaxWithholdingModalDone: B,
-      onTaxWithholdingModalCancel: I
+      onTaxWithholdingModalDone: j,
+      onTaxWithholdingModalCancel: B
     }
   ) }) });
 }

package/dist/components/Payroll/OffCycleCreation/OffCycleCreation.js.map

@@ -1 +1 @@
-{"version":3,"file":"OffCycleCreation.js","sources":["../../../../src/components/Payroll/OffCycleCreation/OffCycleCreation.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react'\nimport { FormProvider, useForm, type Resolver } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { useTranslation } from 'react-i18next'\nimport { usePayrollsCreateOffCycleMutation } from '@gusto/embedded-api/react-query/payrollsCreateOffCycle'\nimport {\n  OffCycleReason as ApiOffCycleReason,\n  WithholdingPayPeriod,\n} from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport { OFF_CYCLE_REASON_DEFAULTS, type OffCycleReason } from '../OffCycleReasonSelection'\nimport {\n  createOffCyclePayPeriodDateFormSchema,\n  type OffCyclePayrollDateType,\n} from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormTypes'\nimport { useOffCyclePayPeriodDateValidation } from '../OffCyclePayPeriodDateForm/useOffCyclePayPeriodDateValidation'\nimport type { OffCycleTaxWithholdingConfig } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type { OffCycleCreationFormData, OffCycleCreationProps } from './OffCycleCreationTypes'\nimport { OffCycleCreationPresentation } from './OffCycleCreationPresentation'\nimport { useCompanyPaymentSpeed } from '@/hooks/useCompanyPaymentSpeed'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { SDKInternalError } from '@/types/sdkError'\nimport { Form } from '@/components/Common/Form'\nimport type { MultiSelectComboBoxOption } from '@/components/Common/UI/MultiSelectComboBox/MultiSelectComboBoxTypes'\n\nconst LOCAL_TO_API_REASON: Record<OffCycleReason, ApiOffCycleReason> = {\n  bonus: ApiOffCycleReason.Bonus,\n  correction: ApiOffCycleReason.Correction,\n}\n\n/**\n * Creation form for off-cycle (bonus or correction) payrolls.\n *\n * Walks the user through configuring pay period dates, selecting a reason, choosing\n * employees, and setting deduction and tax withholding preferences, then submits the\n * resulting payroll for execution.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `offCycle/created` | The off-cycle payroll has been created | `{ payrollUuid: string }` |\n *\n * Changing the reason updates the deduction and withholding defaults — `'bonus'` skips\n * regular deductions and uses the supplemental withholding rate; `'correction'` includes\n * regular deductions and uses the regular rate.\n *\n * @param props - {@link OffCycleCreationProps} plus base component props.\n * @returns The off-cycle payroll creation form.\n * @public\n */\nexport function OffCycleCreation(props: OffCycleCreationProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ dictionary, companyId, payrollType = 'bonus' }: OffCycleCreationProps) {\n  useComponentDictionary('Payroll.OffCycleCreation', dictionary)\n  useI18n('Payroll.OffCycleCreation')\n  useI18n('Payroll.OffCycleReasonSelection')\n  useI18n('Payroll.OffCyclePayPeriodDateForm')\n  useI18n('Payroll.OffCycleDeductionsSetting')\n  useI18n('Payroll.EmployeeSelection')\n\n  const { t } = useTranslation('Payroll.OffCyclePayPeriodDateForm')\n  const { t: tCreation } = useTranslation('Payroll.OffCycleCreation')\n  const { onEvent, baseSubmitHandler } = useBase()\n\n  const { paymentSpeedDays } = useCompanyPaymentSpeed(companyId)\n\n  const { minCheckDate, today } = useOffCyclePayPeriodDateValidation(paymentSpeedDays)\n  const { mutateAsync: createOffCyclePayroll, isPending } = usePayrollsCreateOffCycleMutation()\n\n  const [taxWithholdingConfig, setTaxWithholdingConfig] = useState<OffCycleTaxWithholdingConfig>({\n    withholdingPayPeriod: WithholdingPayPeriod.EveryOtherWeek,\n    withholdingRate: OFF_CYCLE_REASON_DEFAULTS[payrollType].withholdingType,\n  })\n  const [isTaxWithholdingModalOpen, setIsTaxWithholdingModalOpen] = useState(false)\n\n  const handleTaxWithholdingEditClick = useCallback(() => {\n    setIsTaxWithholdingModalOpen(true)\n  }, [])\n\n  const handleTaxWithholdingModalDone = useCallback((config: OffCycleTaxWithholdingConfig) => {\n    setTaxWithholdingConfig(config)\n    setIsTaxWithholdingModalOpen(false)\n  }, [])\n\n  const handleTaxWithholdingModalCancel = useCallback(() => {\n    setIsTaxWithholdingModalOpen(false)\n  }, [])\n\n  const { data: employeesData } = useEmployeesListSuspense({\n    companyId,\n    onboardedActive: true,\n  })\n\n  const employees: MultiSelectComboBoxOption[] = useMemo(() => {\n    const employeeList = employeesData.showEmployees ?? []\n    return [...employeeList]\n      .sort((a, b) => {\n        const lastNameComparison = a.lastName.localeCompare(b.lastName)\n        if (lastNameComparison !== 0) return lastNameComparison\n        return a.firstName.localeCompare(b.firstName)\n      })\n      .map(employee => {\n        const fullName = [employee.firstName, employee.lastName].filter(Boolean).join(' ')\n        return {\n          label: fullName,\n          value: employee.uuid,\n        }\n      })\n  }, [employeesData])\n\n  const translateValidation = (key: string, options?: Record<string, unknown>): string =>\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    t(key as any, options as any) as string\n\n  const dynamicResolver: Resolver<OffCycleCreationFormData> = (values, context, options) => {\n    const reason = values.reason\n    const isCheckOnly = values.isCheckOnly\n    const resolvedPayrollType: OffCyclePayrollDateType =\n      reason === 'correction' ? 'correction' : payrollType\n\n    const dateSchema = createOffCyclePayPeriodDateFormSchema(\n      translateValidation,\n      resolvedPayrollType,\n      isCheckOnly ? today : minCheckDate,\n      paymentSpeedDays,\n    )\n    const schema = z\n      .object({\n        reason: z.enum(['bonus', 'correction']),\n        skipRegularDeductions: z.boolean(),\n        includeAllEmployees: z.boolean(),\n        selectedEmployeeUuids: z.array(z.string()),\n      })\n      .and(dateSchema)\n      .superRefine((data, ctx) => {\n        if (!data.includeAllEmployees && data.selectedEmployeeUuids.length === 0) {\n          ctx.addIssue({\n            code: z.ZodIssueCode.custom,\n            path: ['selectedEmployeeUuids'],\n            message: tCreation('errors.noEmployeesSelected'),\n          })\n        }\n      })\n\n    return zodResolver(schema)(values, context, options)\n  }\n\n  const methods = useForm<OffCycleCreationFormData>({\n    resolver: dynamicResolver,\n    defaultValues: {\n      reason: payrollType,\n      isCheckOnly: false,\n      startDate: null,\n      endDate: null,\n      checkDate: null,\n      skipRegularDeductions: OFF_CYCLE_REASON_DEFAULTS[payrollType].skipDeductions,\n      includeAllEmployees: false,\n      selectedEmployeeUuids: [],\n    },\n  })\n\n  const watchedReason = methods.watch('reason')\n\n  useEffect(() => {\n    methods.setValue(\n      'skipRegularDeductions',\n      OFF_CYCLE_REASON_DEFAULTS[watchedReason].skipDeductions,\n    )\n    setTaxWithholdingConfig(prev => ({\n      ...prev,\n      withholdingRate: OFF_CYCLE_REASON_DEFAULTS[watchedReason].withholdingType,\n    }))\n  }, [watchedReason, methods])\n\n  const onSubmit = async (data: OffCycleCreationFormData) => {\n    const reason = data.reason\n    const checkDate = data.checkDate!\n    const startDate = data.startDate!\n    const endDate = data.endDate!\n    const employeeUuids = data.includeAllEmployees\n      ? employees.map(e => e.value)\n      : data.selectedEmployeeUuids.length > 0\n        ? data.selectedEmployeeUuids\n        : undefined\n\n    await baseSubmitHandler(data, async () => {\n      const response = await createOffCyclePayroll({\n        request: {\n          companyId,\n          requestBody: {\n            offCycle: true,\n            offCycleReason: LOCAL_TO_API_REASON[reason],\n            startDate: new RFCDate(startDate),\n            endDate: new RFCDate(endDate),\n            checkDate: new RFCDate(checkDate),\n            skipRegularDeductions: data.skipRegularDeductions,\n            isCheckOnlyPayroll: data.isCheckOnly,\n            employeeUuids,\n            withholdingPayPeriod: taxWithholdingConfig.withholdingPayPeriod,\n            fixedWithholdingRate: taxWithholdingConfig.withholdingRate === 'supplemental',\n          },\n        },\n      })\n\n      const payrollUuid =\n        response.payrollUnprocessed?.payrollUuid ?? response.payrollUnprocessed?.uuid\n\n      if (!payrollUuid) {\n        throw new SDKInternalError(tCreation('errors.missingPayrollId'))\n      }\n\n      onEvent(componentEvents.OFF_CYCLE_CREATED, { payrollUuid })\n    })\n  }\n\n  return (\n    <FormProvider {...methods}>\n      <Form onSubmit={methods.handleSubmit(onSubmit)}>\n        <OffCycleCreationPresentation\n          employees={employees}\n          isPending={isPending}\n          taxWithholdingConfig={taxWithholdingConfig}\n          isTaxWithholdingModalOpen={isTaxWithholdingModalOpen}\n          onTaxWithholdingEditClick={handleTaxWithholdingEditClick}\n          onTaxWithholdingModalDone={handleTaxWithholdingModalDone}\n          onTaxWithholdingModalCancel={handleTaxWithholdingModalCancel}\n        />\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["LOCAL_TO_API_REASON","ApiOffCycleReason","OffCycleCreation","props","jsx","BaseComponent","Root","dictionary","companyId","payrollType","useComponentDictionary","useI18n","t","useTranslation","tCreation","onEvent","baseSubmitHandler","useBase","paymentSpeedDays","useCompanyPaymentSpeed","minCheckDate","today","useOffCyclePayPeriodDateValidation","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","taxWithholdingConfig","setTaxWithholdingConfig","useState","WithholdingPayPeriod","OFF_CYCLE_REASON_DEFAULTS","isTaxWithholdingModalOpen","setIsTaxWithholdingModalOpen","handleTaxWithholdingEditClick","useCallback","handleTaxWithholdingModalDone","config","handleTaxWithholdingModalCancel","employeesData","useEmployeesListSuspense","employees","useMemo","a","b","lastNameComparison","employee","translateValidation","key","options","methods","useForm","values","context","reason","isCheckOnly","dateSchema","createOffCyclePayPeriodDateFormSchema","schema","z","data","ctx","zodResolver","watchedReason","useEffect","prev","onSubmit","checkDate","startDate","endDate","employeeUuids","e","response","RFCDate","payrollUuid","SDKInternalError","componentEvents","FormProvider","Form","OffCycleCreationPresentation"],"mappings":"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"}
+{"version":3,"file":"OffCycleCreation.js","sources":["../../../../src/components/Payroll/OffCycleCreation/OffCycleCreation.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react'\nimport { FormProvider, useForm, type Resolver } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { useTranslation } from 'react-i18next'\nimport { usePayrollsCreateOffCycleMutation } from '@gusto/embedded-api/react-query/payrollsCreateOffCycle'\nimport {\n  OffCycleReason as ApiOffCycleReason,\n  WithholdingPayPeriod,\n} from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport { OFF_CYCLE_REASON_DEFAULTS, type OffCycleReason } from '../OffCycleReasonSelection'\nimport {\n  createOffCyclePayPeriodDateFormSchema,\n  type OffCyclePayrollDateType,\n} from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormTypes'\nimport { useOffCyclePayPeriodDateValidation } from '../OffCyclePayPeriodDateForm/useOffCyclePayPeriodDateValidation'\nimport type { OffCycleTaxWithholdingConfig } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type { OffCycleCreationFormData, OffCycleCreationProps } from './OffCycleCreationTypes'\nimport { OffCycleCreationPresentation } from './OffCycleCreationPresentation'\nimport { useCompanyPaymentSpeed } from '@/hooks/useCompanyPaymentSpeed'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { SDKInternalError } from '@/types/sdkError'\nimport { Form } from '@/components/Common/Form'\nimport type { MultiSelectComboBoxOption } from '@/components/Common/UI/MultiSelectComboBox/MultiSelectComboBoxTypes'\n\nconst LOCAL_TO_API_REASON: Record<OffCycleReason, ApiOffCycleReason> = {\n  bonus: ApiOffCycleReason.Bonus,\n  correction: ApiOffCycleReason.Correction,\n}\n\n/**\n * Creation form for off-cycle (bonus or correction) payrolls.\n *\n * Walks the user through configuring pay period dates, selecting a reason, choosing\n * employees, and setting deduction and tax withholding preferences, then submits the\n * resulting payroll for execution.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `offCycle/created` | The off-cycle payroll has been created | `{ payrollUuid: string }` |\n *\n * Changing the reason updates the deduction and withholding defaults — `'bonus'` skips\n * regular deductions and uses the supplemental withholding rate; `'correction'` includes\n * regular deductions and uses the regular rate.\n *\n * @param props - {@link OffCycleCreationProps} plus base component props.\n * @returns The off-cycle payroll creation form.\n * @public\n */\nexport function OffCycleCreation(props: OffCycleCreationProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ dictionary, companyId, payrollType = 'bonus' }: OffCycleCreationProps) {\n  useComponentDictionary('Payroll.OffCycleCreation', dictionary)\n  useI18n('Payroll.OffCycleCreation')\n  useI18n('Payroll.OffCycleReasonSelection')\n  useI18n('Payroll.OffCyclePayPeriodDateForm')\n  useI18n('Payroll.OffCycleDeductionsSetting')\n  useI18n('Payroll.EmployeeSelection')\n\n  const { t } = useTranslation('Payroll.OffCyclePayPeriodDateForm')\n  const { t: tCreation } = useTranslation('Payroll.OffCycleCreation')\n  const { onEvent, baseSubmitHandler } = useBase()\n\n  const { paymentSpeedDays } = useCompanyPaymentSpeed(companyId)\n\n  const { minCheckDate, today } = useOffCyclePayPeriodDateValidation(paymentSpeedDays)\n  const { mutateAsync: createOffCyclePayroll, isPending } = usePayrollsCreateOffCycleMutation()\n\n  const [taxWithholdingConfig, setTaxWithholdingConfig] = useState<OffCycleTaxWithholdingConfig>({\n    withholdingPayPeriod: WithholdingPayPeriod.EveryOtherWeek,\n    withholdingRate: OFF_CYCLE_REASON_DEFAULTS[payrollType].withholdingType,\n  })\n  const [isTaxWithholdingModalOpen, setIsTaxWithholdingModalOpen] = useState(false)\n\n  const handleTaxWithholdingEditClick = useCallback(() => {\n    setIsTaxWithholdingModalOpen(true)\n  }, [])\n\n  const handleTaxWithholdingModalDone = useCallback((config: OffCycleTaxWithholdingConfig) => {\n    setTaxWithholdingConfig(config)\n    setIsTaxWithholdingModalOpen(false)\n  }, [])\n\n  const handleTaxWithholdingModalCancel = useCallback(() => {\n    setIsTaxWithholdingModalOpen(false)\n  }, [])\n\n  const { data: employeesData } = useEmployeesListSuspense({\n    companyId,\n    onboardedActive: true,\n  })\n\n  const employees: MultiSelectComboBoxOption[] = useMemo(() => {\n    const employeeList = employeesData.showEmployees ?? []\n    return [...employeeList]\n      .sort((a, b) => {\n        const lastNameComparison = a.lastName.localeCompare(b.lastName)\n        if (lastNameComparison !== 0) return lastNameComparison\n        return a.firstName.localeCompare(b.firstName)\n      })\n      .map(employee => {\n        const fullName = [employee.firstName, employee.lastName].filter(Boolean).join(' ')\n        const primaryJob = employee.jobs?.find(job => job.primary) ?? employee.jobs?.[0]\n        return {\n          label: fullName,\n          value: employee.uuid,\n          description: primaryJob?.title || undefined,\n        }\n      })\n  }, [employeesData])\n\n  const translateValidation = (key: string, options?: Record<string, unknown>): string =>\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    t(key as any, options as any) as string\n\n  const dynamicResolver: Resolver<OffCycleCreationFormData> = (values, context, options) => {\n    const reason = values.reason\n    const isCheckOnly = values.isCheckOnly\n    const resolvedPayrollType: OffCyclePayrollDateType =\n      reason === 'correction' ? 'correction' : payrollType\n\n    const dateSchema = createOffCyclePayPeriodDateFormSchema(\n      translateValidation,\n      resolvedPayrollType,\n      isCheckOnly ? today : minCheckDate,\n      paymentSpeedDays,\n    )\n    const schema = z\n      .object({\n        reason: z.enum(['bonus', 'correction']),\n        skipRegularDeductions: z.boolean(),\n        includeAllEmployees: z.boolean(),\n        selectedEmployeeUuids: z.array(z.string()),\n      })\n      .and(dateSchema)\n      .superRefine((data, ctx) => {\n        if (!data.includeAllEmployees && data.selectedEmployeeUuids.length === 0) {\n          ctx.addIssue({\n            code: z.ZodIssueCode.custom,\n            path: ['selectedEmployeeUuids'],\n            message: tCreation('errors.noEmployeesSelected'),\n          })\n        }\n      })\n\n    return zodResolver(schema)(values, context, options)\n  }\n\n  const methods = useForm<OffCycleCreationFormData>({\n    resolver: dynamicResolver,\n    defaultValues: {\n      reason: payrollType,\n      isCheckOnly: false,\n      startDate: null,\n      endDate: null,\n      checkDate: null,\n      skipRegularDeductions: OFF_CYCLE_REASON_DEFAULTS[payrollType].skipDeductions,\n      includeAllEmployees: false,\n      selectedEmployeeUuids: [],\n    },\n  })\n\n  const watchedReason = methods.watch('reason')\n\n  useEffect(() => {\n    methods.setValue(\n      'skipRegularDeductions',\n      OFF_CYCLE_REASON_DEFAULTS[watchedReason].skipDeductions,\n    )\n    setTaxWithholdingConfig(prev => ({\n      ...prev,\n      withholdingRate: OFF_CYCLE_REASON_DEFAULTS[watchedReason].withholdingType,\n    }))\n  }, [watchedReason, methods])\n\n  const onSubmit = async (data: OffCycleCreationFormData) => {\n    const reason = data.reason\n    const checkDate = data.checkDate!\n    const startDate = data.startDate!\n    const endDate = data.endDate!\n    const employeeUuids = data.includeAllEmployees\n      ? employees.map(e => e.value)\n      : data.selectedEmployeeUuids.length > 0\n        ? data.selectedEmployeeUuids\n        : undefined\n\n    await baseSubmitHandler(data, async () => {\n      const response = await createOffCyclePayroll({\n        request: {\n          companyId,\n          requestBody: {\n            offCycle: true,\n            offCycleReason: LOCAL_TO_API_REASON[reason],\n            startDate: new RFCDate(startDate),\n            endDate: new RFCDate(endDate),\n            checkDate: new RFCDate(checkDate),\n            skipRegularDeductions: data.skipRegularDeductions,\n            isCheckOnlyPayroll: data.isCheckOnly,\n            employeeUuids,\n            withholdingPayPeriod: taxWithholdingConfig.withholdingPayPeriod,\n            fixedWithholdingRate: taxWithholdingConfig.withholdingRate === 'supplemental',\n          },\n        },\n      })\n\n      const payrollUuid =\n        response.payrollUnprocessed?.payrollUuid ?? response.payrollUnprocessed?.uuid\n\n      if (!payrollUuid) {\n        throw new SDKInternalError(tCreation('errors.missingPayrollId'))\n      }\n\n      onEvent(componentEvents.OFF_CYCLE_CREATED, { payrollUuid })\n    })\n  }\n\n  return (\n    <FormProvider {...methods}>\n      <Form onSubmit={methods.handleSubmit(onSubmit)}>\n        <OffCycleCreationPresentation\n          employees={employees}\n          isPending={isPending}\n          taxWithholdingConfig={taxWithholdingConfig}\n          isTaxWithholdingModalOpen={isTaxWithholdingModalOpen}\n          onTaxWithholdingEditClick={handleTaxWithholdingEditClick}\n          onTaxWithholdingModalDone={handleTaxWithholdingModalDone}\n          onTaxWithholdingModalCancel={handleTaxWithholdingModalCancel}\n        />\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["LOCAL_TO_API_REASON","ApiOffCycleReason","OffCycleCreation","props","jsx","BaseComponent","Root","dictionary","companyId","payrollType","useComponentDictionary","useI18n","t","useTranslation","tCreation","onEvent","baseSubmitHandler","useBase","paymentSpeedDays","useCompanyPaymentSpeed","minCheckDate","today","useOffCyclePayPeriodDateValidation","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","taxWithholdingConfig","setTaxWithholdingConfig","useState","WithholdingPayPeriod","OFF_CYCLE_REASON_DEFAULTS","isTaxWithholdingModalOpen","setIsTaxWithholdingModalOpen","handleTaxWithholdingEditClick","useCallback","handleTaxWithholdingModalDone","config","handleTaxWithholdingModalCancel","employeesData","useEmployeesListSuspense","employees","useMemo","a","b","lastNameComparison","employee","fullName","primaryJob","job","translateValidation","key","options","methods","useForm","values","context","reason","isCheckOnly","dateSchema","createOffCyclePayPeriodDateFormSchema","schema","z","data","ctx","zodResolver","watchedReason","useEffect","prev","onSubmit","checkDate","startDate","endDate","employeeUuids","e","response","RFCDate","payrollUuid","SDKInternalError","componentEvents","FormProvider","Form","OffCycleCreationPresentation"],"mappings":"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"}

package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.d.ts

@@ -19,6 +19,12 @@ export interface PayrollConfigurationProps extends BaseComponentInterface<'Payro
  * Handles the configuration phase of payroll processing, allowing users to review and modify employee compensation before calculating the payroll.
  *
  * @remarks
+ * If the payroll turns out to already be processed (e.g. another actor submitted it while this
+ * screen was open), this component emits `runPayroll/alreadyProcessed` and then renders
+ * {@link PayrollOverview} in its place — the read-only breakdown with the gated "Cancel payroll"
+ * action — instead of the configuration table. Events from that delegated view (e.g.
+ * `runPayroll/cancelled`) are emitted through this component's own `onEvent`.
+ *
  * Emits the following events:
  *
  * @events
@@ -28,6 +34,7 @@ export interface PayrollConfigurationProps extends BaseComponentInterface<'Payro
  * | `runPayroll/employee/skip` | An employee is skipped or unskipped for this payroll | `{ employeeId }` |
  * | `runPayroll/employee/saved` | Employee compensation changes are persisted | `{ payrollPrepared }` |
  * | `runPayroll/calculated` | Payroll calculation completes successfully | `{ payrollId, alert, payPeriod }` |
+ * | `runPayroll/alreadyProcessed` | The payroll turns out to already be processed while configuring it | `{ payrollId, alert, payPeriod }` |
  * | `runPayroll/processingFailed` | Payroll calculation fails or times out | — |
  * | `runPayroll/blockers/viewAll` | The "view all blockers" affordance is selected | — |
  * | `runPayroll/grossUp/selected` | The set-net-earnings menu item is selected for an employee | `{ employeeUuid }` |