@gusto/embedded-react-sdk 0.55.7 → 0.55.8

package/dist/components/Employee/Documents/onboarding/DocumentSigner/EmploymentEligibility/EmploymentEligibilityPresentation.js

@@ -1,122 +1,123 @@
 import { jsx as t, jsxs as p } from "react/jsx-runtime";
-import { useState as I } from "react";
-import { useTranslation as L, Trans as O } from "react-i18next";
-import { useForm as $, useWatch as d, FormProvider as j } from "react-hook-form";
-import { zodResolver as q } from "@hookform/resolvers/zod";
-import { AuthorizationStatus as w, DocumentType as A } from "@gusto/embedded-api/models/components/i9authorization";
-import { generateEmploymentEligibilitySchema as k } from "./EmploymentEligibilitySchema.js";
-import { COUNTRIES as P } from "./countries.js";
+import { useState as L } from "react";
+import { useTranslation as O, Trans as $ } from "react-i18next";
+import { useForm as j, useWatch as d, FormProvider as q } from "react-hook-form";
+import { zodResolver as w } from "@hookform/resolvers/zod";
+import { AuthorizationStatus as A, DocumentType as k } from "@gusto/embedded-api/models/components/i9authorization";
+import { generateEmploymentEligibilitySchema as P } from "./EmploymentEligibilitySchema.js";
+import { COUNTRIES as V } from "./countries.js";
 import { Flex as b } from "../../../../../Common/Flex/Flex.js";
-import { ActionsLayout as V } from "../../../../../Common/ActionsLayout/ActionsLayout.js";
-import { ComboBoxField as B } from "../../../../../Common/Fields/ComboBoxField/ComboBoxField.js";
-import { Form as H } from "../../../../../Common/Form/Form.js";
-import { useComponentContext as K } from "../../../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as M } from "../../../../../../i18n/I18n.js";
-import { SelectField as G } from "../../../../../Common/Fields/SelectField/SelectField.js";
-import { RadioGroupField as U } from "../../../../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { TextInputField as W } from "../../../../../Common/Fields/TextInputField/TextInputField.js";
-import { DatePickerField as J } from "../../../../../Common/Fields/DatePickerField/DatePickerField.js";
-const Q = {
+import { ActionsLayout as B } from "../../../../../Common/ActionsLayout/ActionsLayout.js";
+import { ComboBoxField as H } from "../../../../../Common/Fields/ComboBoxField/ComboBoxField.js";
+import { Form as K } from "../../../../../Common/Form/Form.js";
+import { useComponentContext as M } from "../../../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as G } from "../../../../../../i18n/I18n.js";
+import { SelectField as U } from "../../../../../Common/Fields/SelectField/SelectField.js";
+import { RadioGroupField as W } from "../../../../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { TextInputField as J } from "../../../../../Common/Fields/TextInputField/TextInputField.js";
+import { DatePickerField as Q } from "../../../../../Common/Fields/DatePickerField/DatePickerField.js";
+const X = {
   citizen: "statusDescriptions.citizen",
   permanent_resident: "statusDescriptions.permanent_resident",
   noncitizen: "statusDescriptions.noncitizen",
   alien: "statusDescriptions.alien"
-}, he = ({
-  onSubmit: h,
-  defaultValues: f,
-  hasDocumentNumber: y,
-  isPending: g
+}, fe = ({
+  className: h,
+  onSubmit: f,
+  defaultValues: y,
+  hasDocumentNumber: g,
+  isPending: D
 }) => {
-  M("Employee.EmploymentEligibility");
-  const { Heading: D, Text: x, Alert: E, Button: z, Link: N } = K(), { t: e } = L("Employee.EmploymentEligibility"), [m, a] = I(!!y), r = $({
-    resolver: q(k(m)),
-    defaultValues: f
-  }), { control: l, setValue: u, clearErrors: c } = r, o = d({ control: l, name: "authorizationStatus" }), s = d({ control: l, name: "documentType" }), _ = Object.values(w).map((i) => ({
+  G("Employee.EmploymentEligibility");
+  const { Heading: x, Text: E, Alert: z, Button: N, Link: _ } = M(), { t: e } = O("Employee.EmploymentEligibility"), [m, a] = L(!!g), r = j({
+    resolver: w(P(m)),
+    defaultValues: y
+  }), { control: l, setValue: u, clearErrors: c } = r, o = d({ control: l, name: "authorizationStatus" }), s = d({ control: l, name: "documentType" }), S = Object.values(A).map((i) => ({
     value: i,
     label: e(`select.options.${i}`)
-  })), S = Object.values(A).map((i) => ({
+  })), T = Object.values(k).map((i) => ({
     value: i,
     label: e(`authorizationDocument.options.${i}`)
-  })), T = () => {
+  })), C = () => {
     u("documentNumber", ""), c("documentNumber"), a(!1);
-  }, C = () => {
+  }, F = () => {
     u("documentNumber", ""), c("documentNumber"), a(!1);
-  }, F = o === "alien", R = o === "permanent_resident" || o === "alien" && !!s, n = o === "permanent_resident" ? "uscis_alien_registration_number" : s, v = {
+  }, R = o === "alien", v = o === "permanent_resident" || o === "alien" && !!s, n = o === "permanent_resident" ? "uscis_alien_registration_number" : s, I = {
     uscis_alien_registration_number: 9,
     form_i94: 11
   };
-  return /* @__PURE__ */ t(j, { ...r, children: /* @__PURE__ */ t(H, { onSubmit: r.handleSubmit(h), children: /* @__PURE__ */ p(b, { flexDirection: "column", gap: 16, children: [
+  return /* @__PURE__ */ t(q, { ...r, children: /* @__PURE__ */ t(K, { className: h, onSubmit: r.handleSubmit(f), children: /* @__PURE__ */ p(b, { flexDirection: "column", gap: 16, children: [
     /* @__PURE__ */ p(b, { flexDirection: "column", gap: 2, children: [
-      /* @__PURE__ */ t(D, { as: "h2", children: e("title") }),
-      /* @__PURE__ */ t(x, { variant: "supporting", children: /* @__PURE__ */ t(
-        O,
+      /* @__PURE__ */ t(x, { as: "h2", children: e("title") }),
+      /* @__PURE__ */ t(E, { variant: "supporting", children: /* @__PURE__ */ t(
+        $,
         {
           i18nKey: "subtitle",
           t: e,
           components: {
-            formI9Link: /* @__PURE__ */ t(N, {})
+            formI9Link: /* @__PURE__ */ t(_, {})
           }
         }
       ) })
     ] }),
     /* @__PURE__ */ t(
-      G,
+      U,
       {
         name: "authorizationStatus",
         label: e("select.label"),
         description: e("select.description"),
         placeholder: e("select.placeholder"),
-        options: _,
+        options: S,
         isRequired: !0,
-        onChange: T
+        onChange: C
       }
     ),
     o && /* @__PURE__ */ t(
-      E,
+      z,
       {
         status: "info",
-        label: e(Q[o]),
+        label: e(X[o]),
         disableScrollIntoView: !0
       }
     ),
-    o === "alien" && /* @__PURE__ */ t(J, { name: "expirationDate", label: e("expirationDate.label") }),
-    F && /* @__PURE__ */ t(
-      U,
+    o === "alien" && /* @__PURE__ */ t(Q, { name: "expirationDate", label: e("expirationDate.label") }),
+    R && /* @__PURE__ */ t(
+      W,
       {
         name: "documentType",
         label: e("authorizationDocument.label"),
-        options: S,
+        options: T,
         isRequired: !0,
-        onChange: C
+        onChange: F
       }
     ),
-    R && n && /* @__PURE__ */ t(
-      W,
+    v && n && /* @__PURE__ */ t(
+      J,
       {
         name: "documentNumber",
         label: e(`documentNumber.${n}.label`),
         description: n !== "foreign_passport" ? e(`documentNumber.${n}.description`) : void 0,
         placeholder: m ? e(`documentNumber.${n}.placeholder`) : void 0,
-        maxLength: v[n],
+        maxLength: I[n],
         isRequired: !0
       }
     ),
     s === "foreign_passport" && o === "alien" && /* @__PURE__ */ t(
-      B,
+      H,
       {
         name: "country",
         label: e("country.label"),
         description: e("country.description"),
-        options: P,
+        options: V,
         placeholder: e("country.placeholder"),
         allowsCustomValue: !0,
         isRequired: !0
       }
     ),
-    /* @__PURE__ */ t(V, { children: /* @__PURE__ */ t(z, { type: "submit", isLoading: g, children: e("submit") }) })
+    /* @__PURE__ */ t(B, { children: /* @__PURE__ */ t(N, { type: "submit", isLoading: D, children: e("submit") }) })
   ] }) }) });
 };
 export {
-  he as EmploymentEligibilityPresentation
+  fe as EmploymentEligibilityPresentation
 };
 //# sourceMappingURL=EmploymentEligibilityPresentation.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EmploymentEligibilityPresentation.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/EmploymentEligibility/EmploymentEligibilityPresentation.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation, Trans } from 'react-i18next'\nimport { FormProvider, useForm, useWatch, type SubmitHandler } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport {\n  AuthorizationStatus,\n  DocumentType as I9AuthorizationDocumentType,\n} from '@gusto/embedded-api/models/components/i9authorization'\nimport {\n  generateEmploymentEligibilitySchema,\n  type EmploymentEligibilityInputs,\n  type EmploymentEligibilityPayload,\n} from './EmploymentEligibilitySchema'\nimport { COUNTRIES } from './countries'\nimport {\n  Flex,\n  SelectField,\n  RadioGroupField,\n  TextInputField,\n  DatePickerField,\n  ActionsLayout,\n} from '@/components/Common'\nimport { ComboBoxField } from '@/components/Common/Fields/ComboBoxField/ComboBoxField'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\ninterface EmploymentEligibilityPresentationProps {\n  onSubmit: SubmitHandler<EmploymentEligibilityPayload>\n  defaultValues?: Partial<EmploymentEligibilityInputs>\n  hasDocumentNumber?: boolean | null\n  isPending?: boolean\n}\n\nconst statusDescriptionKeys = {\n  citizen: 'statusDescriptions.citizen',\n  permanent_resident: 'statusDescriptions.permanent_resident',\n  noncitizen: 'statusDescriptions.noncitizen',\n  alien: 'statusDescriptions.alien',\n} as const satisfies Record<AuthorizationStatus, string>\n\n/** @internal */\nexport const EmploymentEligibilityPresentation = ({\n  onSubmit,\n  defaultValues,\n  hasDocumentNumber,\n  isPending,\n}: EmploymentEligibilityPresentationProps) => {\n  useI18n('Employee.EmploymentEligibility')\n  const { Heading, Text, Alert, Button, Link } = useComponentContext()\n  const { t } = useTranslation('Employee.EmploymentEligibility')\n\n  const [hasExistingDocumentNumber, setHasExistingDocumentNumber] = useState(!!hasDocumentNumber)\n\n  const formMethods = useForm<EmploymentEligibilityInputs, unknown, EmploymentEligibilityPayload>({\n    resolver: zodResolver(generateEmploymentEligibilitySchema(hasExistingDocumentNumber)),\n    defaultValues,\n  })\n\n  const { control, setValue, clearErrors } = formMethods\n  const authorizationStatus = useWatch({ control, name: 'authorizationStatus' })\n  const documentType = useWatch({ control, name: 'documentType' })\n\n  const statusOptions = Object.values(AuthorizationStatus).map(value => ({\n    value,\n    label: t(`select.options.${value}`),\n  }))\n\n  const authorizationDocumentOptions = Object.values(I9AuthorizationDocumentType).map(value => ({\n    value,\n    label: t(`authorizationDocument.options.${value}`),\n  }))\n\n  const handleAuthorizationStatusChange = () => {\n    setValue('documentNumber', '')\n    clearErrors('documentNumber')\n    setHasExistingDocumentNumber(false)\n  }\n\n  const handleDocumentTypeChange = () => {\n    setValue('documentNumber', '')\n    clearErrors('documentNumber')\n    setHasExistingDocumentNumber(false)\n  }\n\n  const showDocumentTypeRadio = authorizationStatus === 'alien'\n  const showDocumentNumberInput =\n    authorizationStatus === 'permanent_resident' ||\n    (authorizationStatus === 'alien' && !!documentType)\n  const activeDocumentType =\n    authorizationStatus === 'permanent_resident' ? 'uscis_alien_registration_number' : documentType\n\n  const documentNumberMaxLength: Partial<Record<I9AuthorizationDocumentType, number>> = {\n    uscis_alien_registration_number: 9,\n    form_i94: 11,\n  }\n\n  return (\n    <FormProvider {...formMethods}>\n      <Form onSubmit={formMethods.handleSubmit(onSubmit)}>\n        <Flex flexDirection=\"column\" gap={16}>\n          <Flex flexDirection=\"column\" gap={2}>\n            <Heading as=\"h2\">{t('title')}</Heading>\n            <Text variant=\"supporting\">\n              <Trans\n                i18nKey={'subtitle'}\n                t={t}\n                components={{\n                  formI9Link: <Link />,\n                }}\n              />\n            </Text>\n          </Flex>\n\n          <SelectField\n            name=\"authorizationStatus\"\n            label={t('select.label')}\n            description={t('select.description')}\n            placeholder={t('select.placeholder')}\n            options={statusOptions}\n            isRequired\n            onChange={handleAuthorizationStatusChange}\n          />\n\n          {authorizationStatus && (\n            <Alert\n              status=\"info\"\n              label={t(statusDescriptionKeys[authorizationStatus])}\n              disableScrollIntoView\n            />\n          )}\n\n          {authorizationStatus === 'alien' && (\n            <DatePickerField name=\"expirationDate\" label={t('expirationDate.label')} />\n          )}\n\n          {showDocumentTypeRadio && (\n            <RadioGroupField\n              name=\"documentType\"\n              label={t('authorizationDocument.label')}\n              options={authorizationDocumentOptions}\n              isRequired\n              onChange={handleDocumentTypeChange}\n            />\n          )}\n\n          {showDocumentNumberInput && activeDocumentType && (\n            <TextInputField\n              name=\"documentNumber\"\n              label={t(`documentNumber.${activeDocumentType}.label`)}\n              description={\n                activeDocumentType !== 'foreign_passport'\n                  ? t(`documentNumber.${activeDocumentType}.description`)\n                  : undefined\n              }\n              placeholder={\n                hasExistingDocumentNumber\n                  ? t(`documentNumber.${activeDocumentType}.placeholder`)\n                  : undefined\n              }\n              maxLength={documentNumberMaxLength[activeDocumentType]}\n              isRequired\n            />\n          )}\n\n          {documentType === 'foreign_passport' && authorizationStatus === 'alien' && (\n            <ComboBoxField\n              name=\"country\"\n              label={t('country.label')}\n              description={t('country.description')}\n              options={COUNTRIES}\n              placeholder={t('country.placeholder')}\n              allowsCustomValue\n              isRequired\n            />\n          )}\n\n          <ActionsLayout>\n            <Button type=\"submit\" isLoading={isPending}>\n              {t('submit')}\n            </Button>\n          </ActionsLayout>\n        </Flex>\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["statusDescriptionKeys","EmploymentEligibilityPresentation","onSubmit","defaultValues","hasDocumentNumber","isPending","useI18n","Heading","Text","Alert","Button","Link","useComponentContext","t","useTranslation","hasExistingDocumentNumber","setHasExistingDocumentNumber","useState","formMethods","useForm","zodResolver","generateEmploymentEligibilitySchema","control","setValue","clearErrors","authorizationStatus","useWatch","documentType","statusOptions","AuthorizationStatus","value","authorizationDocumentOptions","I9AuthorizationDocumentType","handleAuthorizationStatusChange","handleDocumentTypeChange","showDocumentTypeRadio","showDocumentNumberInput","activeDocumentType","documentNumberMaxLength","FormProvider","jsx","Form","jsxs","Flex","Trans","SelectField","DatePickerField","RadioGroupField","TextInputField","ComboBoxField","COUNTRIES","ActionsLayout"],"mappings":"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"}
+{"version":3,"file":"EmploymentEligibilityPresentation.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/EmploymentEligibility/EmploymentEligibilityPresentation.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation, Trans } from 'react-i18next'\nimport { FormProvider, useForm, useWatch, type SubmitHandler } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport {\n  AuthorizationStatus,\n  DocumentType as I9AuthorizationDocumentType,\n} from '@gusto/embedded-api/models/components/i9authorization'\nimport {\n  generateEmploymentEligibilitySchema,\n  type EmploymentEligibilityInputs,\n  type EmploymentEligibilityPayload,\n} from './EmploymentEligibilitySchema'\nimport { COUNTRIES } from './countries'\nimport {\n  Flex,\n  SelectField,\n  RadioGroupField,\n  TextInputField,\n  DatePickerField,\n  ActionsLayout,\n} from '@/components/Common'\nimport { ComboBoxField } from '@/components/Common/Fields/ComboBoxField/ComboBoxField'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\ninterface EmploymentEligibilityPresentationProps {\n  /** CSS class name applied to the root element. */\n  className?: string\n  onSubmit: SubmitHandler<EmploymentEligibilityPayload>\n  defaultValues?: Partial<EmploymentEligibilityInputs>\n  hasDocumentNumber?: boolean | null\n  isPending?: boolean\n}\n\nconst statusDescriptionKeys = {\n  citizen: 'statusDescriptions.citizen',\n  permanent_resident: 'statusDescriptions.permanent_resident',\n  noncitizen: 'statusDescriptions.noncitizen',\n  alien: 'statusDescriptions.alien',\n} as const satisfies Record<AuthorizationStatus, string>\n\n/** @internal */\nexport const EmploymentEligibilityPresentation = ({\n  className,\n  onSubmit,\n  defaultValues,\n  hasDocumentNumber,\n  isPending,\n}: EmploymentEligibilityPresentationProps) => {\n  useI18n('Employee.EmploymentEligibility')\n  const { Heading, Text, Alert, Button, Link } = useComponentContext()\n  const { t } = useTranslation('Employee.EmploymentEligibility')\n\n  const [hasExistingDocumentNumber, setHasExistingDocumentNumber] = useState(!!hasDocumentNumber)\n\n  const formMethods = useForm<EmploymentEligibilityInputs, unknown, EmploymentEligibilityPayload>({\n    resolver: zodResolver(generateEmploymentEligibilitySchema(hasExistingDocumentNumber)),\n    defaultValues,\n  })\n\n  const { control, setValue, clearErrors } = formMethods\n  const authorizationStatus = useWatch({ control, name: 'authorizationStatus' })\n  const documentType = useWatch({ control, name: 'documentType' })\n\n  const statusOptions = Object.values(AuthorizationStatus).map(value => ({\n    value,\n    label: t(`select.options.${value}`),\n  }))\n\n  const authorizationDocumentOptions = Object.values(I9AuthorizationDocumentType).map(value => ({\n    value,\n    label: t(`authorizationDocument.options.${value}`),\n  }))\n\n  const handleAuthorizationStatusChange = () => {\n    setValue('documentNumber', '')\n    clearErrors('documentNumber')\n    setHasExistingDocumentNumber(false)\n  }\n\n  const handleDocumentTypeChange = () => {\n    setValue('documentNumber', '')\n    clearErrors('documentNumber')\n    setHasExistingDocumentNumber(false)\n  }\n\n  const showDocumentTypeRadio = authorizationStatus === 'alien'\n  const showDocumentNumberInput =\n    authorizationStatus === 'permanent_resident' ||\n    (authorizationStatus === 'alien' && !!documentType)\n  const activeDocumentType =\n    authorizationStatus === 'permanent_resident' ? 'uscis_alien_registration_number' : documentType\n\n  const documentNumberMaxLength: Partial<Record<I9AuthorizationDocumentType, number>> = {\n    uscis_alien_registration_number: 9,\n    form_i94: 11,\n  }\n\n  return (\n    <FormProvider {...formMethods}>\n      <Form className={className} onSubmit={formMethods.handleSubmit(onSubmit)}>\n        <Flex flexDirection=\"column\" gap={16}>\n          <Flex flexDirection=\"column\" gap={2}>\n            <Heading as=\"h2\">{t('title')}</Heading>\n            <Text variant=\"supporting\">\n              <Trans\n                i18nKey={'subtitle'}\n                t={t}\n                components={{\n                  formI9Link: <Link />,\n                }}\n              />\n            </Text>\n          </Flex>\n\n          <SelectField\n            name=\"authorizationStatus\"\n            label={t('select.label')}\n            description={t('select.description')}\n            placeholder={t('select.placeholder')}\n            options={statusOptions}\n            isRequired\n            onChange={handleAuthorizationStatusChange}\n          />\n\n          {authorizationStatus && (\n            <Alert\n              status=\"info\"\n              label={t(statusDescriptionKeys[authorizationStatus])}\n              disableScrollIntoView\n            />\n          )}\n\n          {authorizationStatus === 'alien' && (\n            <DatePickerField name=\"expirationDate\" label={t('expirationDate.label')} />\n          )}\n\n          {showDocumentTypeRadio && (\n            <RadioGroupField\n              name=\"documentType\"\n              label={t('authorizationDocument.label')}\n              options={authorizationDocumentOptions}\n              isRequired\n              onChange={handleDocumentTypeChange}\n            />\n          )}\n\n          {showDocumentNumberInput && activeDocumentType && (\n            <TextInputField\n              name=\"documentNumber\"\n              label={t(`documentNumber.${activeDocumentType}.label`)}\n              description={\n                activeDocumentType !== 'foreign_passport'\n                  ? t(`documentNumber.${activeDocumentType}.description`)\n                  : undefined\n              }\n              placeholder={\n                hasExistingDocumentNumber\n                  ? t(`documentNumber.${activeDocumentType}.placeholder`)\n                  : undefined\n              }\n              maxLength={documentNumberMaxLength[activeDocumentType]}\n              isRequired\n            />\n          )}\n\n          {documentType === 'foreign_passport' && authorizationStatus === 'alien' && (\n            <ComboBoxField\n              name=\"country\"\n              label={t('country.label')}\n              description={t('country.description')}\n              options={COUNTRIES}\n              placeholder={t('country.placeholder')}\n              allowsCustomValue\n              isRequired\n            />\n          )}\n\n          <ActionsLayout>\n            <Button type=\"submit\" isLoading={isPending}>\n              {t('submit')}\n            </Button>\n          </ActionsLayout>\n        </Flex>\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["statusDescriptionKeys","EmploymentEligibilityPresentation","className","onSubmit","defaultValues","hasDocumentNumber","isPending","useI18n","Heading","Text","Alert","Button","Link","useComponentContext","t","useTranslation","hasExistingDocumentNumber","setHasExistingDocumentNumber","useState","formMethods","useForm","zodResolver","generateEmploymentEligibilitySchema","control","setValue","clearErrors","authorizationStatus","useWatch","documentType","statusOptions","AuthorizationStatus","value","authorizationDocumentOptions","I9AuthorizationDocumentType","handleAuthorizationStatusChange","handleDocumentTypeChange","showDocumentTypeRadio","showDocumentNumberInput","activeDocumentType","documentNumberMaxLength","FormProvider","jsx","Form","jsxs","Flex","Trans","SelectField","DatePickerField","RadioGroupField","TextInputField","ComboBoxField","COUNTRIES","ActionsLayout"],"mappings":"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"}

package/dist/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocuments.js

@@ -1,30 +1,31 @@
 import { jsx as n } from "react/jsx-runtime";
-import { useIsMutating as D } from "@tanstack/react-query";
-import { useEmployeesGetSuspense as d } from "@gusto/embedded-api/react-query/employeesGet";
-import { useEmployeesUpdateOnboardingDocumentsConfigMutation as y, mutationKeyEmployeesUpdateOnboardingDocumentsConfig as f } from "@gusto/embedded-api/react-query/employeesUpdateOnboardingDocumentsConfig";
-import { EmployeeDocumentsPresentation as g } from "./EmployeeDocumentsPresentation.js";
-import { BaseComponent as O } from "../../../../Base/Base.js";
-import { useBase as S } from "../../../../Base/useBase.js";
-import { useComponentDictionary as b } from "../../../../../i18n/I18n.js";
-import { EmployeeSelfOnboardingStatuses as N, EmployeeOnboardingStatus as C, componentEvents as m } from "../../../../../shared/constants.js";
-import { useFlow as _ } from "../../../../Flow/useFlow.js";
-import { ensureRequired as I } from "../../../../../helpers/ensureRequired.js";
-function M(o) {
-  return /* @__PURE__ */ n(O, { ...o, children: /* @__PURE__ */ n(P, { ...o }) });
+import { useIsMutating as d } from "@tanstack/react-query";
+import { useEmployeesGetSuspense as y } from "@gusto/embedded-api/react-query/employeesGet";
+import { useEmployeesUpdateOnboardingDocumentsConfigMutation as f, mutationKeyEmployeesUpdateOnboardingDocumentsConfig as g } from "@gusto/embedded-api/react-query/employeesUpdateOnboardingDocumentsConfig";
+import { EmployeeDocumentsPresentation as O } from "./EmployeeDocumentsPresentation.js";
+import { BaseComponent as S } from "../../../../Base/Base.js";
+import { useBase as b } from "../../../../Base/useBase.js";
+import { useComponentDictionary as N } from "../../../../../i18n/I18n.js";
+import { EmployeeSelfOnboardingStatuses as C, EmployeeOnboardingStatus as _, componentEvents as m } from "../../../../../shared/constants.js";
+import { useFlow as I } from "../../../../Flow/useFlow.js";
+import { ensureRequired as M } from "../../../../../helpers/ensureRequired.js";
+function P(o) {
+  return /* @__PURE__ */ n(S, { ...o, children: /* @__PURE__ */ n(U, { ...o }) });
 }
-const P = ({ employeeId: o, dictionary: t }) => {
-  b("Employee.EmployeeDocuments", t);
-  const { onEvent: s, baseSubmitHandler: r } = S(), { data: u } = d({ employeeId: o }), e = u.employee, a = e?.onboardingDocumentsConfig?.i9Document ?? !1, c = e?.onboardingStatus ? N.has(e.onboardingStatus) || e.onboardingStatus === C.SELF_ONBOARDING_PENDING_INVITE : !1, { mutateAsync: p } = y(), E = D({
-    mutationKey: f()
+const U = ({ employeeId: o, dictionary: t, className: r }) => {
+  N("Employee.EmployeeDocuments", t);
+  const { onEvent: s, baseSubmitHandler: u } = b(), { data: a } = y({ employeeId: o }), e = a.employee, c = e?.onboardingDocumentsConfig?.i9Document ?? !1, p = e?.onboardingStatus ? C.has(e.onboardingStatus) || e.onboardingStatus === _.SELF_ONBOARDING_PENDING_INVITE : !1, { mutateAsync: E } = f(), l = d({
+    mutationKey: g()
   }) > 0;
   return /* @__PURE__ */ n(
-    g,
+    O,
     {
-      isEmployeeSelfOnboarding: c,
-      currentI9Status: a,
+      className: r,
+      isEmployeeSelfOnboarding: p,
+      currentI9Status: c,
       onSubmit: async (i) => {
-        await r(i, async () => {
-          const l = await p({
+        await u(i, async () => {
+          const D = await E({
             request: {
               employeeId: o,
               employeeOnboardingDocumentsConfigRequest: {
@@ -32,21 +33,21 @@ const P = ({ employeeId: o, dictionary: t }) => {
               }
             }
           });
-          s(m.EMPLOYEE_ONBOARDING_DOCUMENTS_CONFIG_UPDATED, l), s(m.EMPLOYEE_DOCUMENTS_DONE);
+          s(m.EMPLOYEE_ONBOARDING_DOCUMENTS_CONFIG_UPDATED, D), s(m.EMPLOYEE_DOCUMENTS_DONE);
         });
       },
       onDone: () => {
         s(m.EMPLOYEE_DOCUMENTS_DONE);
       },
-      isPending: E
+      isPending: l
     }
   );
-}, K = () => {
-  const { employeeId: o, onEvent: t } = _();
-  return /* @__PURE__ */ n(M, { employeeId: I(o), onEvent: t });
+}, j = () => {
+  const { employeeId: o, onEvent: t } = I();
+  return /* @__PURE__ */ n(P, { employeeId: M(o), onEvent: t });
 };
 export {
-  M as EmployeeDocuments,
-  K as EmployeeDocumentsContextual
+  P as EmployeeDocuments,
+  j as EmployeeDocumentsContextual
 };
 //# sourceMappingURL=EmployeeDocuments.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EmployeeDocuments.js","sources":["../../../../../../src/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocuments.tsx"],"sourcesContent":["import { useIsMutating } from '@tanstack/react-query'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport {\n  useEmployeesUpdateOnboardingDocumentsConfigMutation,\n  mutationKeyEmployeesUpdateOnboardingDocumentsConfig,\n} from '@gusto/embedded-api/react-query/employeesUpdateOnboardingDocumentsConfig'\nimport {\n  EmployeeDocumentsPresentation,\n  type EmployeeDocumentsFormValues,\n} from './EmployeeDocumentsPresentation'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n'\nimport {\n  componentEvents,\n  EmployeeSelfOnboardingStatuses,\n  EmployeeOnboardingStatus,\n} from '@/shared/constants'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport type { OnboardingContextInterface } from '@/components/Employee/OnboardingFlow/OnboardingFlowComponents'\nimport { ensureRequired } from '@/helpers/ensureRequired'\n\n/**\n * Props for {@link EmployeeDocuments}.\n *\n * @public\n */\nexport interface EmployeeDocumentsProps extends BaseComponentInterface<'Employee.EmployeeDocuments'> {\n  /** The associated employee identifier. */\n  employeeId: string\n}\n\n/**\n * Onboarding step for selecting which documents the employee must complete.\n *\n * @remarks\n * Shows the I-9 toggle when the employee is self-onboarding (so the employee\n * can choose whether their employer will collect I-9 verification) and a\n * summary otherwise. Persists the selection to the employee's onboarding\n * documents configuration and advances the parent flow.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/onboardingDocumentsConfig/updated` | Fired after the employee's documents configuration is saved | The updated documents configuration response |\n * | `employee/documents/done` | Fired when the step is complete and the parent flow can advance | — |\n *\n * @param props - Component props including `employeeId` and `onEvent`.\n * @returns The employee documents onboarding step.\n * @public\n */\nexport function EmployeeDocuments(props: EmployeeDocumentsProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ employeeId, dictionary }: EmployeeDocumentsProps) => {\n  useComponentDictionary('Employee.EmployeeDocuments', dictionary)\n  const { onEvent, baseSubmitHandler } = useBase()\n\n  const { data } = useEmployeesGetSuspense({ employeeId })\n  const employee = data.employee\n  const currentI9Status = employee?.onboardingDocumentsConfig?.i9Document ?? false\n\n  const isEmployeeSelfOnboarding = employee?.onboardingStatus\n    ? EmployeeSelfOnboardingStatuses.has(employee.onboardingStatus) ||\n      employee.onboardingStatus === EmployeeOnboardingStatus.SELF_ONBOARDING_PENDING_INVITE\n    : false\n\n  const { mutateAsync: updateOnboardingDocumentsConfig } =\n    useEmployeesUpdateOnboardingDocumentsConfigMutation()\n\n  const isMutating = useIsMutating({\n    mutationKey: mutationKeyEmployeesUpdateOnboardingDocumentsConfig(),\n  })\n  const isPending = isMutating > 0\n\n  const onSubmit = async (formData: EmployeeDocumentsFormValues) => {\n    await baseSubmitHandler(formData, async () => {\n      const response = await updateOnboardingDocumentsConfig({\n        request: {\n          employeeId,\n          employeeOnboardingDocumentsConfigRequest: {\n            i9Document: formData.includeI9,\n          },\n        },\n      })\n\n      onEvent(componentEvents.EMPLOYEE_ONBOARDING_DOCUMENTS_CONFIG_UPDATED, response)\n      onEvent(componentEvents.EMPLOYEE_DOCUMENTS_DONE)\n    })\n  }\n\n  const handleDone = () => {\n    onEvent(componentEvents.EMPLOYEE_DOCUMENTS_DONE)\n  }\n\n  return (\n    <EmployeeDocumentsPresentation\n      isEmployeeSelfOnboarding={isEmployeeSelfOnboarding}\n      currentI9Status={currentI9Status}\n      onSubmit={onSubmit}\n      onDone={handleDone}\n      isPending={isPending}\n    />\n  )\n}\n\n/** @internal */\nexport const EmployeeDocumentsContextual = () => {\n  const { employeeId, onEvent } = useFlow<OnboardingContextInterface>()\n\n  return <EmployeeDocuments employeeId={ensureRequired(employeeId)} onEvent={onEvent} />\n}\n"],"names":["EmployeeDocuments","props","jsx","BaseComponent","Root","employeeId","dictionary","useComponentDictionary","onEvent","baseSubmitHandler","useBase","data","useEmployeesGetSuspense","employee","currentI9Status","isEmployeeSelfOnboarding","EmployeeSelfOnboardingStatuses","EmployeeOnboardingStatus","updateOnboardingDocumentsConfig","useEmployeesUpdateOnboardingDocumentsConfigMutation","isPending","useIsMutating","mutationKeyEmployeesUpdateOnboardingDocumentsConfig","EmployeeDocumentsPresentation","formData","response","componentEvents","EmployeeDocumentsContextual","useFlow","ensureRequired"],"mappings":";;;;;;;;;;;AAkDO,SAASA,EAAkBC,GAA+B;AAC/D,SACE,gBAAAC,EAACC,KAAe,GAAGF,GACjB,4BAACG,GAAA,EAAM,GAAGH,GAAO,EAAA,CACnB;AAEJ;AAEA,MAAMG,IAAO,CAAC,EAAE,YAAAC,GAAY,YAAAC,QAAyC;AACnE,EAAAC,EAAuB,8BAA8BD,CAAU;AAC/D,QAAM,EAAE,SAAAE,GAAS,mBAAAC,EAAA,IAAsBC,EAAA,GAEjC,EAAE,MAAAC,EAAA,IAASC,EAAwB,EAAE,YAAAP,GAAY,GACjDQ,IAAWF,EAAK,UAChBG,IAAkBD,GAAU,2BAA2B,cAAc,IAErEE,IAA2BF,GAAU,mBACvCG,EAA+B,IAAIH,EAAS,gBAAgB,KAC5DA,EAAS,qBAAqBI,EAAyB,iCACvD,IAEE,EAAE,aAAaC,EAAA,IACnBC,EAAA,GAKIC,IAHaC,EAAc;AAAA,IAC/B,aAAaC,EAAA;AAAA,EAAoD,CAClE,IAC8B;AAsB/B,SACE,gBAAApB;AAAA,IAACqB;AAAA,IAAA;AAAA,MACC,0BAAAR;AAAA,MACA,iBAAAD;AAAA,MACA,UAxBa,OAAOU,MAA0C;AAChE,cAAMf,EAAkBe,GAAU,YAAY;AAC5C,gBAAMC,IAAW,MAAMP,EAAgC;AAAA,YACrD,SAAS;AAAA,cACP,YAAAb;AAAA,cACA,0CAA0C;AAAA,gBACxC,YAAYmB,EAAS;AAAA,cAAA;AAAA,YACvB;AAAA,UACF,CACD;AAED,UAAAhB,EAAQkB,EAAgB,8CAA8CD,CAAQ,GAC9EjB,EAAQkB,EAAgB,uBAAuB;AAAA,QACjD,CAAC;AAAA,MACH;AAAA,MAWI,QATe,MAAM;AACvB,QAAAlB,EAAQkB,EAAgB,uBAAuB;AAAA,MACjD;AAAA,MAQI,WAAAN;AAAA,IAAA;AAAA,EAAA;AAGN,GAGaO,IAA8B,MAAM;AAC/C,QAAM,EAAE,YAAAtB,GAAY,SAAAG,EAAA,IAAYoB,EAAA;AAEhC,2BAAQ5B,GAAA,EAAkB,YAAY6B,EAAexB,CAAU,GAAG,SAAAG,GAAkB;AACtF;"}
+{"version":3,"file":"EmployeeDocuments.js","sources":["../../../../../../src/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocuments.tsx"],"sourcesContent":["import { useIsMutating } from '@tanstack/react-query'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport {\n  useEmployeesUpdateOnboardingDocumentsConfigMutation,\n  mutationKeyEmployeesUpdateOnboardingDocumentsConfig,\n} from '@gusto/embedded-api/react-query/employeesUpdateOnboardingDocumentsConfig'\nimport {\n  EmployeeDocumentsPresentation,\n  type EmployeeDocumentsFormValues,\n} from './EmployeeDocumentsPresentation'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n'\nimport {\n  componentEvents,\n  EmployeeSelfOnboardingStatuses,\n  EmployeeOnboardingStatus,\n} from '@/shared/constants'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport type { OnboardingContextInterface } from '@/components/Employee/OnboardingFlow/OnboardingFlowComponents'\nimport { ensureRequired } from '@/helpers/ensureRequired'\n\n/**\n * Props for {@link EmployeeDocuments}.\n *\n * @public\n */\nexport interface EmployeeDocumentsProps extends BaseComponentInterface<'Employee.EmployeeDocuments'> {\n  /** The associated employee identifier. */\n  employeeId: string\n}\n\n/**\n * Onboarding step for selecting which documents the employee must complete.\n *\n * @remarks\n * Shows the I-9 toggle when the employee is self-onboarding (so the employee\n * can choose whether their employer will collect I-9 verification) and a\n * summary otherwise. Persists the selection to the employee's onboarding\n * documents configuration and advances the parent flow.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/onboardingDocumentsConfig/updated` | Fired after the employee's documents configuration is saved | The updated documents configuration response |\n * | `employee/documents/done` | Fired when the step is complete and the parent flow can advance | — |\n *\n * @param props - Component props including `employeeId` and `onEvent`.\n * @returns The employee documents onboarding step.\n * @public\n */\nexport function EmployeeDocuments(props: EmployeeDocumentsProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ employeeId, dictionary, className }: EmployeeDocumentsProps) => {\n  useComponentDictionary('Employee.EmployeeDocuments', dictionary)\n  const { onEvent, baseSubmitHandler } = useBase()\n\n  const { data } = useEmployeesGetSuspense({ employeeId })\n  const employee = data.employee\n  const currentI9Status = employee?.onboardingDocumentsConfig?.i9Document ?? false\n\n  const isEmployeeSelfOnboarding = employee?.onboardingStatus\n    ? EmployeeSelfOnboardingStatuses.has(employee.onboardingStatus) ||\n      employee.onboardingStatus === EmployeeOnboardingStatus.SELF_ONBOARDING_PENDING_INVITE\n    : false\n\n  const { mutateAsync: updateOnboardingDocumentsConfig } =\n    useEmployeesUpdateOnboardingDocumentsConfigMutation()\n\n  const isMutating = useIsMutating({\n    mutationKey: mutationKeyEmployeesUpdateOnboardingDocumentsConfig(),\n  })\n  const isPending = isMutating > 0\n\n  const onSubmit = async (formData: EmployeeDocumentsFormValues) => {\n    await baseSubmitHandler(formData, async () => {\n      const response = await updateOnboardingDocumentsConfig({\n        request: {\n          employeeId,\n          employeeOnboardingDocumentsConfigRequest: {\n            i9Document: formData.includeI9,\n          },\n        },\n      })\n\n      onEvent(componentEvents.EMPLOYEE_ONBOARDING_DOCUMENTS_CONFIG_UPDATED, response)\n      onEvent(componentEvents.EMPLOYEE_DOCUMENTS_DONE)\n    })\n  }\n\n  const handleDone = () => {\n    onEvent(componentEvents.EMPLOYEE_DOCUMENTS_DONE)\n  }\n\n  return (\n    <EmployeeDocumentsPresentation\n      className={className}\n      isEmployeeSelfOnboarding={isEmployeeSelfOnboarding}\n      currentI9Status={currentI9Status}\n      onSubmit={onSubmit}\n      onDone={handleDone}\n      isPending={isPending}\n    />\n  )\n}\n\n/** @internal */\nexport const EmployeeDocumentsContextual = () => {\n  const { employeeId, onEvent } = useFlow<OnboardingContextInterface>()\n\n  return <EmployeeDocuments employeeId={ensureRequired(employeeId)} onEvent={onEvent} />\n}\n"],"names":["EmployeeDocuments","props","jsx","BaseComponent","Root","employeeId","dictionary","className","useComponentDictionary","onEvent","baseSubmitHandler","useBase","data","useEmployeesGetSuspense","employee","currentI9Status","isEmployeeSelfOnboarding","EmployeeSelfOnboardingStatuses","EmployeeOnboardingStatus","updateOnboardingDocumentsConfig","useEmployeesUpdateOnboardingDocumentsConfigMutation","isPending","useIsMutating","mutationKeyEmployeesUpdateOnboardingDocumentsConfig","EmployeeDocumentsPresentation","formData","response","componentEvents","EmployeeDocumentsContextual","useFlow","ensureRequired"],"mappings":";;;;;;;;;;;AAkDO,SAASA,EAAkBC,GAA+B;AAC/D,SACE,gBAAAC,EAACC,KAAe,GAAGF,GACjB,4BAACG,GAAA,EAAM,GAAGH,GAAO,EAAA,CACnB;AAEJ;AAEA,MAAMG,IAAO,CAAC,EAAE,YAAAC,GAAY,YAAAC,GAAY,WAAAC,QAAwC;AAC9E,EAAAC,EAAuB,8BAA8BF,CAAU;AAC/D,QAAM,EAAE,SAAAG,GAAS,mBAAAC,EAAA,IAAsBC,EAAA,GAEjC,EAAE,MAAAC,EAAA,IAASC,EAAwB,EAAE,YAAAR,GAAY,GACjDS,IAAWF,EAAK,UAChBG,IAAkBD,GAAU,2BAA2B,cAAc,IAErEE,IAA2BF,GAAU,mBACvCG,EAA+B,IAAIH,EAAS,gBAAgB,KAC5DA,EAAS,qBAAqBI,EAAyB,iCACvD,IAEE,EAAE,aAAaC,EAAA,IACnBC,EAAA,GAKIC,IAHaC,EAAc;AAAA,IAC/B,aAAaC,EAAA;AAAA,EAAoD,CAClE,IAC8B;AAsB/B,SACE,gBAAArB;AAAA,IAACsB;AAAA,IAAA;AAAA,MACC,WAAAjB;AAAA,MACA,0BAAAS;AAAA,MACA,iBAAAD;AAAA,MACA,UAzBa,OAAOU,MAA0C;AAChE,cAAMf,EAAkBe,GAAU,YAAY;AAC5C,gBAAMC,IAAW,MAAMP,EAAgC;AAAA,YACrD,SAAS;AAAA,cACP,YAAAd;AAAA,cACA,0CAA0C;AAAA,gBACxC,YAAYoB,EAAS;AAAA,cAAA;AAAA,YACvB;AAAA,UACF,CACD;AAED,UAAAhB,EAAQkB,EAAgB,8CAA8CD,CAAQ,GAC9EjB,EAAQkB,EAAgB,uBAAuB;AAAA,QACjD,CAAC;AAAA,MACH;AAAA,MAYI,QAVe,MAAM;AACvB,QAAAlB,EAAQkB,EAAgB,uBAAuB;AAAA,MACjD;AAAA,MASI,WAAAN;AAAA,IAAA;AAAA,EAAA;AAGN,GAGaO,IAA8B,MAAM;AAC/C,QAAM,EAAE,YAAAvB,GAAY,SAAAI,EAAA,IAAYoB,EAAA;AAEhC,2BAAQ7B,GAAA,EAAkB,YAAY8B,EAAezB,CAAU,GAAG,SAAAI,GAAkB;AACtF;"}

package/dist/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocumentsPresentation.js

@@ -1,4 +1,4 @@
-import { jsx as n, Fragment as S, jsxs as r } from "react/jsx-runtime";
+import { jsxs as r, jsx as n } from "react/jsx-runtime";
 import { useTranslation as y, Trans as p } from "react-i18next";
 import { useForm as I, FormProvider as L } from "react-hook-form";
 import { zodResolver as v } from "@hookform/resolvers/zod";
@@ -11,21 +11,22 @@ import { CheckboxField as F } from "../../../../Common/Fields/CheckboxField/Chec
 const g = "gusto-sdk-employee-documents-form", T = u.object({
   includeI9: u.boolean()
 }), V = ({
+  className: h,
   isEmployeeSelfOnboarding: a,
-  currentI9Status: h,
-  onSubmit: f,
-  onDone: b,
-  isPending: O
+  currentI9Status: f,
+  onSubmit: b,
+  onDone: O,
+  isPending: D
 }) => {
   C("Employee.EmployeeDocuments");
-  const { t: e } = y("Employee.EmployeeDocuments"), { Alert: d, Heading: l, Text: i, Button: s, Link: m, UnorderedList: D } = w(), c = I({
+  const { t: e } = y("Employee.EmployeeDocuments"), { Alert: d, Heading: l, Text: i, Button: s, Link: m, UnorderedList: x } = w(), c = I({
     resolver: v(T),
     defaultValues: {
-      includeI9: h
+      includeI9: f
     }
-  }), x = c.watch("includeI9");
-  return /* @__PURE__ */ n(S, { children: /* @__PURE__ */ r(o, { flexDirection: "column", gap: 16, children: [
-    a ? /* @__PURE__ */ n(L, { ...c, children: /* @__PURE__ */ n(E, { id: g, onSubmit: c.handleSubmit(f), children: /* @__PURE__ */ r(o, { flexDirection: "column", gap: 16, children: [
+  }), S = c.watch("includeI9");
+  return /* @__PURE__ */ r(o, { className: h, flexDirection: "column", gap: 16, children: [
+    a ? /* @__PURE__ */ n(L, { ...c, children: /* @__PURE__ */ n(E, { id: g, onSubmit: c.handleSubmit(b), children: /* @__PURE__ */ r(o, { flexDirection: "column", gap: 16, children: [
       /* @__PURE__ */ r(o, { flexDirection: "column", gap: 4, children: [
         /* @__PURE__ */ n(l, { as: "h2", children: e("selfOnboarding.title") }),
         /* @__PURE__ */ n(i, { variant: "supporting", children: e("selfOnboarding.description") })
@@ -48,8 +49,8 @@ const g = "gusto-sdk-employee-documents-form", T = u.object({
           description: e("selfOnboarding.includeI9Description")
         }
       ),
-      x ? /* @__PURE__ */ n(d, { status: "warning", label: e("selfOnboarding.alerts.includedTitle"), children: /* @__PURE__ */ n(
-        D,
+      S ? /* @__PURE__ */ n(d, { status: "warning", label: e("selfOnboarding.alerts.includedTitle"), children: /* @__PURE__ */ n(
+        x,
         {
           items: [
             /* @__PURE__ */ n(
@@ -103,11 +104,11 @@ const g = "gusto-sdk-employee-documents-form", T = u.object({
         variant: "primary",
         type: "submit",
         form: g,
-        isLoading: O,
+        isLoading: D,
         children: e("continueCta")
       }
-    ) : /* @__PURE__ */ n(s, { variant: "primary", onClick: b, children: e("continueCta") }) })
-  ] }) });
+    ) : /* @__PURE__ */ n(s, { variant: "primary", onClick: O, children: e("continueCta") }) })
+  ] });
 };
 export {
   V as EmployeeDocumentsPresentation

package/dist/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocumentsPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmployeeDocumentsPresentation.js","sources":["../../../../../../src/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocumentsPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { Flex, CheckboxField, FlexItem } from '@/components/Common'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nconst EMPLOYEE_DOCUMENTS_FORM_ID = 'gusto-sdk-employee-documents-form'\n\nconst EmployeeDocumentsSchema = z.object({\n  includeI9: z.boolean(),\n})\n\n/** @internal */\nexport type EmployeeDocumentsFormValues = z.infer<typeof EmployeeDocumentsSchema>\n\n/** @internal */\nexport interface EmployeeDocumentsPresentationProps {\n  isEmployeeSelfOnboarding: boolean\n  currentI9Status: boolean\n  onSubmit: (formData: EmployeeDocumentsFormValues) => Promise<void>\n  onDone: () => void\n  isPending: boolean\n}\n\n/** @internal */\nexport const EmployeeDocumentsPresentation = ({\n  isEmployeeSelfOnboarding,\n  currentI9Status,\n  onSubmit,\n  onDone,\n  isPending,\n}: EmployeeDocumentsPresentationProps) => {\n  useI18n('Employee.EmployeeDocuments')\n  const { t } = useTranslation('Employee.EmployeeDocuments')\n  const { Alert, Heading, Text, Button, Link, UnorderedList } = useComponentContext()\n\n  const formMethods = useForm<EmployeeDocumentsFormValues>({\n    resolver: zodResolver(EmployeeDocumentsSchema),\n    defaultValues: {\n      includeI9: currentI9Status,\n    },\n  })\n\n  const includeI9 = formMethods.watch('includeI9')\n\n  const renderSelfOnboarding = () => (\n    <FormProvider {...formMethods}>\n      <Form id={EMPLOYEE_DOCUMENTS_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n        <Flex flexDirection=\"column\" gap={16}>\n          <Flex flexDirection=\"column\" gap={4}>\n            <Heading as=\"h2\">{t('selfOnboarding.title')}</Heading>\n            <Text variant=\"supporting\">{t('selfOnboarding.description')}</Text>\n          </Flex>\n\n          <Heading as=\"h3\">{t('selfOnboarding.documentsIncludedLabel')}</Heading>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.taxWithholdingLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.taxWithholdingDescription')}</Text>\n          </FlexItem>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.directDepositLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.directDepositDescription')}</Text>\n          </FlexItem>\n\n          <Heading as=\"h3\">{t('selfOnboarding.includeI9Heading')}</Heading>\n          <CheckboxField\n            name=\"includeI9\"\n            label={t('selfOnboarding.includeI9Label')}\n            description={t('selfOnboarding.includeI9Description')}\n          />\n\n          {includeI9 ? (\n            <Alert status=\"warning\" label={t('selfOnboarding.alerts.includedTitle')}>\n              <UnorderedList\n                items={[\n                  <Trans\n                    key=\"included-description-1\"\n                    i18nKey={'selfOnboarding.alerts.includedDescription'}\n                    t={t}\n                    components={{\n                      Link: <Link />,\n                    }}\n                  />,\n                  <span key=\"included-description-2\">\n                    {t('selfOnboarding.alerts.includedDescription2')}\n                  </span>,\n                ]}\n              />\n            </Alert>\n          ) : (\n            <Alert status=\"info\" label={t('selfOnboarding.alerts.notIncludedTitle')}>\n              <Trans\n                i18nKey={'selfOnboarding.alerts.notIncludedDescription'}\n                t={t}\n                components={{\n                  Link: <Link />,\n                }}\n              />\n            </Alert>\n          )}\n        </Flex>\n      </Form>\n    </FormProvider>\n  )\n\n  const renderNotSelfOnboarding = () => (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={4}>\n        <Heading as=\"h2\">{t('notSelfOnboarding.title')}</Heading>\n        <Text variant=\"supporting\">{t('notSelfOnboarding.description')}</Text>\n      </Flex>\n      <Flex flexDirection=\"column\" gap={20}>\n        <FlexItem>\n          <Text weight=\"medium\">{t('notSelfOnboarding.employmentEligibilityLabel')}</Text>\n          <Text variant=\"supporting\">\n            {t('notSelfOnboarding.employmentEligibilityDescription')}\n          </Text>\n        </FlexItem>\n\n        <FlexItem>\n          <Text weight=\"medium\">{t('notSelfOnboarding.taxWithholdingLabel')}</Text>\n          <Text variant=\"supporting\">{t('notSelfOnboarding.taxWithholdingDescription')}</Text>\n        </FlexItem>\n        <FlexItem>\n          <Text weight=\"medium\">{t('notSelfOnboarding.directDepositLabel')}</Text>\n          <Text variant=\"supporting\">{t('notSelfOnboarding.directDepositDescription')}</Text>\n        </FlexItem>\n      </Flex>\n      <Alert status=\"info\" label={t('notSelfOnboarding.alertTitle')} disableScrollIntoView></Alert>\n    </Flex>\n  )\n\n  return (\n    <>\n      <Flex flexDirection=\"column\" gap={16}>\n        {isEmployeeSelfOnboarding ? renderSelfOnboarding() : renderNotSelfOnboarding()}\n\n        <Flex justifyContent=\"flex-end\" gap={12}>\n          {isEmployeeSelfOnboarding ? (\n            <Button\n              variant=\"primary\"\n              type=\"submit\"\n              form={EMPLOYEE_DOCUMENTS_FORM_ID}\n              isLoading={isPending}\n            >\n              {t('continueCta')}\n            </Button>\n          ) : (\n            <Button variant=\"primary\" onClick={onDone}>\n              {t('continueCta')}\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n    </>\n  )\n}\n"],"names":["EMPLOYEE_DOCUMENTS_FORM_ID","EmployeeDocumentsSchema","z","EmployeeDocumentsPresentation","isEmployeeSelfOnboarding","currentI9Status","onSubmit","onDone","isPending","useI18n","t","useTranslation","Alert","Heading","Text","Button","Link","UnorderedList","useComponentContext","formMethods","useForm","zodResolver","includeI9","jsxs","Flex","jsx","FormProvider","Form","FlexItem","CheckboxField","Trans"],"mappings":"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"}
+{"version":3,"file":"EmployeeDocumentsPresentation.js","sources":["../../../../../../src/components/Employee/Documents/onboarding/EmployeeDocuments/EmployeeDocumentsPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { Flex, CheckboxField, FlexItem } from '@/components/Common'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nconst EMPLOYEE_DOCUMENTS_FORM_ID = 'gusto-sdk-employee-documents-form'\n\nconst EmployeeDocumentsSchema = z.object({\n  includeI9: z.boolean(),\n})\n\n/** @internal */\nexport type EmployeeDocumentsFormValues = z.infer<typeof EmployeeDocumentsSchema>\n\n/** @internal */\nexport interface EmployeeDocumentsPresentationProps {\n  /** CSS class name applied to the root element. */\n  className?: string\n  isEmployeeSelfOnboarding: boolean\n  currentI9Status: boolean\n  onSubmit: (formData: EmployeeDocumentsFormValues) => Promise<void>\n  onDone: () => void\n  isPending: boolean\n}\n\n/** @internal */\nexport const EmployeeDocumentsPresentation = ({\n  className,\n  isEmployeeSelfOnboarding,\n  currentI9Status,\n  onSubmit,\n  onDone,\n  isPending,\n}: EmployeeDocumentsPresentationProps) => {\n  useI18n('Employee.EmployeeDocuments')\n  const { t } = useTranslation('Employee.EmployeeDocuments')\n  const { Alert, Heading, Text, Button, Link, UnorderedList } = useComponentContext()\n\n  const formMethods = useForm<EmployeeDocumentsFormValues>({\n    resolver: zodResolver(EmployeeDocumentsSchema),\n    defaultValues: {\n      includeI9: currentI9Status,\n    },\n  })\n\n  const includeI9 = formMethods.watch('includeI9')\n\n  const renderSelfOnboarding = () => (\n    <FormProvider {...formMethods}>\n      <Form id={EMPLOYEE_DOCUMENTS_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n        <Flex flexDirection=\"column\" gap={16}>\n          <Flex flexDirection=\"column\" gap={4}>\n            <Heading as=\"h2\">{t('selfOnboarding.title')}</Heading>\n            <Text variant=\"supporting\">{t('selfOnboarding.description')}</Text>\n          </Flex>\n\n          <Heading as=\"h3\">{t('selfOnboarding.documentsIncludedLabel')}</Heading>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.taxWithholdingLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.taxWithholdingDescription')}</Text>\n          </FlexItem>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.directDepositLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.directDepositDescription')}</Text>\n          </FlexItem>\n\n          <Heading as=\"h3\">{t('selfOnboarding.includeI9Heading')}</Heading>\n          <CheckboxField\n            name=\"includeI9\"\n            label={t('selfOnboarding.includeI9Label')}\n            description={t('selfOnboarding.includeI9Description')}\n          />\n\n          {includeI9 ? (\n            <Alert status=\"warning\" label={t('selfOnboarding.alerts.includedTitle')}>\n              <UnorderedList\n                items={[\n                  <Trans\n                    key=\"included-description-1\"\n                    i18nKey={'selfOnboarding.alerts.includedDescription'}\n                    t={t}\n                    components={{\n                      Link: <Link />,\n                    }}\n                  />,\n                  <span key=\"included-description-2\">\n                    {t('selfOnboarding.alerts.includedDescription2')}\n                  </span>,\n                ]}\n              />\n            </Alert>\n          ) : (\n            <Alert status=\"info\" label={t('selfOnboarding.alerts.notIncludedTitle')}>\n              <Trans\n                i18nKey={'selfOnboarding.alerts.notIncludedDescription'}\n                t={t}\n                components={{\n                  Link: <Link />,\n                }}\n              />\n            </Alert>\n          )}\n        </Flex>\n      </Form>\n    </FormProvider>\n  )\n\n  const renderNotSelfOnboarding = () => (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={4}>\n        <Heading as=\"h2\">{t('notSelfOnboarding.title')}</Heading>\n        <Text variant=\"supporting\">{t('notSelfOnboarding.description')}</Text>\n      </Flex>\n      <Flex flexDirection=\"column\" gap={20}>\n        <FlexItem>\n          <Text weight=\"medium\">{t('notSelfOnboarding.employmentEligibilityLabel')}</Text>\n          <Text variant=\"supporting\">\n            {t('notSelfOnboarding.employmentEligibilityDescription')}\n          </Text>\n        </FlexItem>\n\n        <FlexItem>\n          <Text weight=\"medium\">{t('notSelfOnboarding.taxWithholdingLabel')}</Text>\n          <Text variant=\"supporting\">{t('notSelfOnboarding.taxWithholdingDescription')}</Text>\n        </FlexItem>\n        <FlexItem>\n          <Text weight=\"medium\">{t('notSelfOnboarding.directDepositLabel')}</Text>\n          <Text variant=\"supporting\">{t('notSelfOnboarding.directDepositDescription')}</Text>\n        </FlexItem>\n      </Flex>\n      <Alert status=\"info\" label={t('notSelfOnboarding.alertTitle')} disableScrollIntoView></Alert>\n    </Flex>\n  )\n\n  return (\n    <Flex className={className} flexDirection=\"column\" gap={16}>\n      {isEmployeeSelfOnboarding ? renderSelfOnboarding() : renderNotSelfOnboarding()}\n\n      <Flex justifyContent=\"flex-end\" gap={12}>\n        {isEmployeeSelfOnboarding ? (\n          <Button\n            variant=\"primary\"\n            type=\"submit\"\n            form={EMPLOYEE_DOCUMENTS_FORM_ID}\n            isLoading={isPending}\n          >\n            {t('continueCta')}\n          </Button>\n        ) : (\n          <Button variant=\"primary\" onClick={onDone}>\n            {t('continueCta')}\n          </Button>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n"],"names":["EMPLOYEE_DOCUMENTS_FORM_ID","EmployeeDocumentsSchema","z","EmployeeDocumentsPresentation","className","isEmployeeSelfOnboarding","currentI9Status","onSubmit","onDone","isPending","useI18n","t","useTranslation","Alert","Heading","Text","Button","Link","UnorderedList","useComponentContext","formMethods","useForm","zodResolver","includeI9","Flex","jsx","FormProvider","Form","jsxs","FlexItem","CheckboxField","Trans"],"mappings":"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"}

package/dist/components/Employee/EmployeeList/management/ManagementEmployeeList.js

@@ -1,11 +1,11 @@
 import { jsx as s } from "react/jsx-runtime";
-import { useState as L, useMemo as M } from "react";
-import { useEmployeeList as h } from "../shared/useEmployeeList.js";
-import { ManagementEmployeeListView as T } from "./ManagementEmployeeListView.js";
-import { BaseBoundaries as f, BaseLayout as E } from "../../../Base/Base.js";
-import { useI18n as D, useComponentDictionary as b } from "../../../../i18n/I18n.js";
+import { useState as M, useMemo as h } from "react";
+import { useEmployeeList as T } from "../shared/useEmployeeList.js";
+import { ManagementEmployeeListView as f } from "./ManagementEmployeeListView.js";
+import { BaseBoundaries as D, BaseLayout as E } from "../../../Base/Base.js";
+import { useI18n as b, useComponentDictionary as P } from "../../../../i18n/I18n.js";
 import { componentEvents as i } from "../../../../shared/constants.js";
-const P = (n) => {
+const S = (n) => {
   switch (n) {
     case "active":
       return "active";
@@ -15,17 +15,18 @@ const P = (n) => {
       return "terminated";
   }
 };
-function S({
+function A({
   companyId: n,
   initialTab: a = "active",
   onEvent: o,
   dictionary: p,
-  LoaderComponent: m
+  LoaderComponent: m,
+  className: c
 }) {
-  D("Employee.ManagementEmployeeList"), b("Employee.ManagementEmployeeList", p);
-  const [r, c] = L(a), l = M(() => P(r), [r]), e = h({
+  b("Employee.ManagementEmployeeList"), P("Employee.ManagementEmployeeList", p);
+  const [r, l] = M(a), d = h(() => S(r), [r]), e = T({
     companyId: n,
-    employeeType: l
+    employeeType: d
   });
   if (e.isLoading)
     return /* @__PURE__ */ s(
@@ -36,49 +37,50 @@ function S({
         LoaderComponent: m
       }
     );
-  const d = (t) => {
+  const y = (t) => {
     o(i.EMPLOYEE_UPDATE, { employeeId: t });
-  }, y = () => {
+  }, u = () => {
     o(i.EMPLOYEE_CREATE);
-  }, u = (t) => {
-    o(i.EMPLOYEE_DISMISS, { employeeId: t });
   }, g = (t) => {
-    c(t);
+    o(i.EMPLOYEE_DISMISS, { employeeId: t });
+  }, L = (t) => {
+    l(t);
   };
   return /* @__PURE__ */ s(E, { error: e.errorHandling.errors, LoaderComponent: m, children: /* @__PURE__ */ s(
-    T,
+    f,
     {
       selectedTab: r,
-      onTabChange: g,
+      onTabChange: L,
       employees: e.data.employees,
       isFetching: e.status.isFetching,
       pagination: e.pagination,
       status: e.status,
-      onEdit: d,
-      onDismiss: u,
+      onEdit: y,
+      onDismiss: g,
       onDelete: async (t) => {
         await e.actions.onDelete(t), o(i.EMPLOYEE_DELETED, { employeeId: t });
       },
-      onAddEmployee: y
+      onAddEmployee: u,
+      className: c
     }
   ) });
 }
-function C({
+function F({
   FallbackComponent: n,
   LoaderComponent: a,
   ...o
 }) {
   return /* @__PURE__ */ s(
-    f,
+    D,
     {
       componentName: "Employee.ManagementEmployeeList",
       FallbackComponent: n,
       LoaderComponent: a,
-      children: /* @__PURE__ */ s(S, { LoaderComponent: a, ...o })
+      children: /* @__PURE__ */ s(A, { LoaderComponent: a, ...o })
     }
   );
 }
 export {
-  C as ManagementEmployeeList
+  F as ManagementEmployeeList
 };
 //# sourceMappingURL=ManagementEmployeeList.js.map