@gusto/embedded-react-sdk 0.12.0 → 0.12.1

package/dist/components/Contractor/OnboardingFlow/onboardingStateMachine.js

@@ -1,17 +1,29 @@
-import { state as s, transition as o, reduce as r, guard as c } from "robot3";
-import { ContractorListContextual as u, AddressContextual as O, NewHireReportContextual as p, ProfileContextual as d, SubmitContextual as i, PaymentMethodContextual as R } from "./OnboardingFlowComponents.js";
+import { state as s, transition as o, reduce as r, guard as p } from "robot3";
+import { ContractorListContextual as u, AddressContextual as O, NewHireReportContextual as d, ProfileContextual as i, SubmitContextual as l, PaymentMethodContextual as R } from "./OnboardingFlowComponents.js";
 import { componentEvents as n } from "../../../shared/constants.js";
-const a = (t) => (e) => ({
+const c = (t) => (e) => ({
   ...e,
   ...t
-}), T = {
+}), a = () => o(
+  n.CANCEL,
+  "list",
+  r(
+    c({
+      component: u,
+      showProgress: !1,
+      currentStep: 0,
+      contractorId: void 0,
+      successMessage: void 0
+    })
+  )
+), E = {
   list: s(
     o(
       n.CONTRACTOR_CREATE,
       "profile",
       r(
-        a({
-          component: d,
+        c({
+          component: i,
           currentStep: 1,
           showProgress: !0,
           contractorId: void 0,
@@ -25,7 +37,7 @@ const a = (t) => (e) => ({
       r(
         (t, e) => ({
           ...t,
-          component: d,
+          component: i,
           currentStep: 1,
           showProgress: !0,
           contractorId: e.payload.contractorId,
@@ -35,6 +47,7 @@ const a = (t) => (e) => ({
     )
   ),
   profile: s(
+    a(),
     o(
       n.CONTRACTOR_PROFILE_DONE,
       "address",
@@ -47,7 +60,7 @@ const a = (t) => (e) => ({
           selfOnboarding: e.payload.selfOnboarding
         })
       ),
-      c((t, e) => !e.payload.selfOnboarding)
+      p((t, e) => !e.payload.selfOnboarding)
       // Only allow transition to address if not self-onboarding
     ),
     o(
@@ -56,47 +69,52 @@ const a = (t) => (e) => ({
       r(
         (t, e) => ({
           ...t,
-          component: p,
+          component: d,
+          contractorId: e.payload.contractorId,
           currentStep: 2,
           totalSteps: 3
         })
       ),
-      c((t, e) => e.payload.selfOnboarding)
+      p((t, e) => e.payload.selfOnboarding)
       // Only allow transition to new hire report if self-onboarding
     )
   ),
   address: s(
+    a(),
     o(
       n.CONTRACTOR_ADDRESS_DONE,
       "paymentMethod",
-      r(a({ component: R, currentStep: 3 }))
+      r(c({ component: R, currentStep: 3 }))
     )
   ),
   paymentMethod: s(
+    a(),
     o(
       n.CONTRACTOR_PAYMENT_METHOD_DONE,
       "newHireReport",
       r(
-        a({
-          component: p,
+        c({
+          component: d,
           currentStep: 4
         })
       )
     )
   ),
   newHireReport: s(
+    a(),
     o(
       n.CONTRACTOR_NEW_HIRE_REPORT_DONE,
       "submit",
       r(
-        a({
-          component: i,
+        c({
+          component: l,
           currentStep: 5
         })
       )
     )
   ),
   submit: s(
+    a(),
     o(
       n.CONTRACTOR_SUBMIT_DONE,
       "list",
@@ -114,6 +132,6 @@ const a = (t) => (e) => ({
   final: s()
 };
 export {
-  T as onboardingMachine
+  E as onboardingMachine
 };
 //# sourceMappingURL=onboardingStateMachine.js.map

package/dist/components/Contractor/OnboardingFlow/onboardingStateMachine.js.map

@@ -1 +1 @@
-{"version":3,"file":"onboardingStateMachine.js","sources":["../../../../src/components/Contractor/OnboardingFlow/onboardingStateMachine.ts"],"sourcesContent":["import { transition, reduce, state, guard } from 'robot3'\nimport {\n  AddressContextual,\n  ContractorListContextual,\n  NewHireReportContextual,\n  PaymentMethodContextual,\n  ProfileContextual,\n  SubmitContextual,\n  type OnboardingFlowContextInterface,\n} from './OnboardingFlowComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineEventType } from '@/types/Helpers'\n\ntype EventPayloads = {\n  [componentEvents.CONTRACTOR_UPDATE]: {\n    contractorId: string\n  }\n  [componentEvents.CONTRACTOR_PROFILE_DONE]: { contractorId: string; selfOnboarding: boolean }\n  [componentEvents.CONTRACTOR_SUBMIT_DONE]: { message?: string }\n}\n\nconst createReducer = (props: Partial<OnboardingFlowContextInterface>) => {\n  return (ctx: OnboardingFlowContextInterface): OnboardingFlowContextInterface => ({\n    ...ctx,\n    ...props,\n  })\n}\nexport const onboardingMachine = {\n  list: state(\n    transition(\n      componentEvents.CONTRACTOR_CREATE,\n      'profile',\n      reduce(\n        createReducer({\n          component: ProfileContextual,\n          currentStep: 1,\n          showProgress: true,\n          contractorId: undefined,\n          successMessage: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.CONTRACTOR_UPDATE,\n      'profile',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_UPDATE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: ProfileContextual,\n            currentStep: 1,\n            showProgress: true,\n            contractorId: ev.payload.contractorId,\n            successMessage: undefined,\n          }\n        },\n      ),\n    ),\n  ),\n  profile: state(\n    transition(\n      componentEvents.CONTRACTOR_PROFILE_DONE,\n      'address',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_PROFILE_DONE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: AddressContextual,\n            currentStep: 2,\n            contractorId: ev.payload.contractorId,\n            selfOnboarding: ev.payload.selfOnboarding,\n          }\n        },\n      ),\n      guard((ctx, ev) => !ev.payload.selfOnboarding), // Only allow transition to address if not self-onboarding\n    ),\n    transition(\n      componentEvents.CONTRACTOR_PROFILE_DONE,\n      'newHireReport',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_PROFILE_DONE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: NewHireReportContextual,\n            currentStep: 2,\n            totalSteps: 3,\n          }\n        },\n      ),\n      guard((ctx, ev) => ev.payload.selfOnboarding), // Only allow transition to new hire report if self-onboarding\n    ),\n  ),\n  address: state(\n    transition(\n      componentEvents.CONTRACTOR_ADDRESS_DONE,\n      'paymentMethod',\n      reduce(createReducer({ component: PaymentMethodContextual, currentStep: 3 })),\n    ),\n  ),\n  paymentMethod: state(\n    transition(\n      componentEvents.CONTRACTOR_PAYMENT_METHOD_DONE,\n      'newHireReport',\n      reduce(\n        createReducer({\n          component: NewHireReportContextual,\n          currentStep: 4,\n        }),\n      ),\n    ),\n  ),\n  newHireReport: state(\n    transition(\n      componentEvents.CONTRACTOR_NEW_HIRE_REPORT_DONE,\n      'submit',\n      reduce(\n        createReducer({\n          component: SubmitContextual,\n          currentStep: 5,\n        }),\n      ),\n    ),\n  ),\n  submit: state(\n    transition(\n      componentEvents.CONTRACTOR_SUBMIT_DONE,\n      'list',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_SUBMIT_DONE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: ContractorListContextual,\n            currentStep: 0,\n            showProgress: false,\n            successMessage: ev.payload.message,\n          }\n        },\n      ),\n    ),\n  ),\n  final: state(),\n}\n"],"names":["createReducer","props","ctx","onboardingMachine","state","transition","componentEvents","reduce","ProfileContextual","ev","AddressContextual","guard","NewHireReportContextual","PaymentMethodContextual","SubmitContextual","ContractorListContextual"],"mappings":";;;AAqBA,MAAMA,IAAgB,CAACC,MACd,CAACC,OAAyE;AAAA,EAC/E,GAAGA;AAAA,EACH,GAAGD;AAAA,IAGME,IAAoB;AAAA,EAC/B,MAAMC;AAAA,IACJC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACEP,EAAc;AAAA,UACZ,WAAWQ;AAAA,UACX,aAAa;AAAA,UACb,cAAc;AAAA,UACd,cAAc;AAAA,UACd,gBAAgB;AAAA,QAAA,CACjB;AAAA,MAAA;AAAA,IACH;AAAA,IAEFH;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEL,GACAO,OAEO;AAAA,UACL,GAAGP;AAAA,UACH,WAAWM;AAAA,UACX,aAAa;AAAA,UACb,cAAc;AAAA,UACd,cAAcC,EAAG,QAAQ;AAAA,UACzB,gBAAgB;AAAA,QAAA;AAAA,MAEpB;AAAA,IACF;AAAA,EACF;AAAA,EAEF,SAASL;AAAA,IACPC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEL,GACAO,OAEO;AAAA,UACL,GAAGP;AAAA,UACH,WAAWQ;AAAA,UACX,aAAa;AAAA,UACb,cAAcD,EAAG,QAAQ;AAAA,UACzB,gBAAgBA,EAAG,QAAQ;AAAA,QAAA;AAAA,MAE/B;AAAA,MAEFE,EAAM,CAACT,GAAKO,MAAO,CAACA,EAAG,QAAQ,cAAc;AAAA;AAAA,IAAA;AAAA,IAE/CJ;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEL,GACAO,OAEO;AAAA,UACL,GAAGP;AAAA,UACH,WAAWU;AAAA,UACX,aAAa;AAAA,UACb,YAAY;AAAA,QAAA;AAAA,MAEhB;AAAA,MAEFD,EAAM,CAACT,GAAKO,MAAOA,EAAG,QAAQ,cAAc;AAAA;AAAA,IAAA;AAAA,EAC9C;AAAA,EAEF,SAASL;AAAA,IACPC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC,EAAOP,EAAc,EAAE,WAAWa,GAAyB,aAAa,GAAG,CAAC;AAAA,IAAA;AAAA,EAC9E;AAAA,EAEF,eAAeT;AAAA,IACbC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACEP,EAAc;AAAA,UACZ,WAAWY;AAAA,UACX,aAAa;AAAA,QAAA,CACd;AAAA,MAAA;AAAA,IACH;AAAA,EACF;AAAA,EAEF,eAAeR;AAAA,IACbC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACEP,EAAc;AAAA,UACZ,WAAWc;AAAA,UACX,aAAa;AAAA,QAAA,CACd;AAAA,MAAA;AAAA,IACH;AAAA,EACF;AAAA,EAEF,QAAQV;AAAA,IACNC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEL,GACAO,OAEO;AAAA,UACL,GAAGP;AAAA,UACH,WAAWa;AAAA,UACX,aAAa;AAAA,UACb,cAAc;AAAA,UACd,gBAAgBN,EAAG,QAAQ;AAAA,QAAA;AAAA,MAE/B;AAAA,IACF;AAAA,EACF;AAAA,EAEF,OAAOL,EAAA;AACT;"}
+{"version":3,"file":"onboardingStateMachine.js","sources":["../../../../src/components/Contractor/OnboardingFlow/onboardingStateMachine.ts"],"sourcesContent":["import { transition, reduce, state, guard } from 'robot3'\nimport {\n  AddressContextual,\n  ContractorListContextual,\n  NewHireReportContextual,\n  PaymentMethodContextual,\n  ProfileContextual,\n  SubmitContextual,\n  type OnboardingFlowContextInterface,\n} from './OnboardingFlowComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineEventType } from '@/types/Helpers'\n\ntype EventPayloads = {\n  [componentEvents.CONTRACTOR_UPDATE]: {\n    contractorId: string\n  }\n  [componentEvents.CONTRACTOR_PROFILE_DONE]: { contractorId: string; selfOnboarding: boolean }\n  [componentEvents.CONTRACTOR_SUBMIT_DONE]: { message?: string }\n}\n\nconst createReducer = (props: Partial<OnboardingFlowContextInterface>) => {\n  return (ctx: OnboardingFlowContextInterface): OnboardingFlowContextInterface => ({\n    ...ctx,\n    ...props,\n  })\n}\nconst cancelTransition = () =>\n  transition(\n    componentEvents.CANCEL,\n    'list',\n    reduce(\n      createReducer({\n        component: ContractorListContextual,\n        showProgress: false,\n        currentStep: 0,\n        contractorId: undefined,\n        successMessage: undefined,\n      }),\n    ),\n  )\n\nexport const onboardingMachine = {\n  list: state(\n    transition(\n      componentEvents.CONTRACTOR_CREATE,\n      'profile',\n      reduce(\n        createReducer({\n          component: ProfileContextual,\n          currentStep: 1,\n          showProgress: true,\n          contractorId: undefined,\n          successMessage: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.CONTRACTOR_UPDATE,\n      'profile',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_UPDATE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: ProfileContextual,\n            currentStep: 1,\n            showProgress: true,\n            contractorId: ev.payload.contractorId,\n            successMessage: undefined,\n          }\n        },\n      ),\n    ),\n  ),\n  profile: state(\n    cancelTransition(),\n    transition(\n      componentEvents.CONTRACTOR_PROFILE_DONE,\n      'address',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_PROFILE_DONE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: AddressContextual,\n            currentStep: 2,\n            contractorId: ev.payload.contractorId,\n            selfOnboarding: ev.payload.selfOnboarding,\n          }\n        },\n      ),\n      guard((ctx, ev) => !ev.payload.selfOnboarding), // Only allow transition to address if not self-onboarding\n    ),\n    transition(\n      componentEvents.CONTRACTOR_PROFILE_DONE,\n      'newHireReport',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_PROFILE_DONE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: NewHireReportContextual,\n            contractorId: ev.payload.contractorId,\n            currentStep: 2,\n            totalSteps: 3,\n          }\n        },\n      ),\n      guard((ctx, ev) => ev.payload.selfOnboarding), // Only allow transition to new hire report if self-onboarding\n    ),\n  ),\n  address: state(\n    cancelTransition(),\n    transition(\n      componentEvents.CONTRACTOR_ADDRESS_DONE,\n      'paymentMethod',\n      reduce(createReducer({ component: PaymentMethodContextual, currentStep: 3 })),\n    ),\n  ),\n  paymentMethod: state(\n    cancelTransition(),\n    transition(\n      componentEvents.CONTRACTOR_PAYMENT_METHOD_DONE,\n      'newHireReport',\n      reduce(\n        createReducer({\n          component: NewHireReportContextual,\n          currentStep: 4,\n        }),\n      ),\n    ),\n  ),\n  newHireReport: state(\n    cancelTransition(),\n    transition(\n      componentEvents.CONTRACTOR_NEW_HIRE_REPORT_DONE,\n      'submit',\n      reduce(\n        createReducer({\n          component: SubmitContextual,\n          currentStep: 5,\n        }),\n      ),\n    ),\n  ),\n  submit: state(\n    cancelTransition(),\n    transition(\n      componentEvents.CONTRACTOR_SUBMIT_DONE,\n      'list',\n      reduce(\n        (\n          ctx: OnboardingFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_SUBMIT_DONE>,\n        ): OnboardingFlowContextInterface => {\n          return {\n            ...ctx,\n            component: ContractorListContextual,\n            currentStep: 0,\n            showProgress: false,\n            successMessage: ev.payload.message,\n          }\n        },\n      ),\n    ),\n  ),\n  final: state(),\n}\n"],"names":["createReducer","props","ctx","cancelTransition","transition","componentEvents","reduce","ContractorListContextual","onboardingMachine","state","ProfileContextual","ev","AddressContextual","guard","NewHireReportContextual","PaymentMethodContextual","SubmitContextual"],"mappings":"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"}

package/dist/components/Contractor/PaymentMethod/BankAccountForm.js

@@ -1,9 +1,8 @@
 import { jsxs as n, Fragment as o, jsx as r } from "react/jsx-runtime";
 import { useTranslation as t } from "react-i18next";
-import "classnames";
 import { TextInputField as a } from "../../Common/Fields/TextInputField/TextInputField.js";
 import { RadioGroupField as i } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-function p({ bankAccount: u }) {
+function b({ bankAccount: u }) {
   const { t: e } = t("Contractor.PaymentMethod", { keyPrefix: "bankAccountForm" });
   return /* @__PURE__ */ n(o, { children: [
     /* @__PURE__ */ r(
@@ -49,6 +48,6 @@ function p({ bankAccount: u }) {
   ] });
 }
 export {
-  p as BankAccountForm
+  b as BankAccountForm
 };
 //# sourceMappingURL=BankAccountForm.js.map

package/dist/components/Contractor/PaymentMethod/BankAccountForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"BankAccountForm.js","sources":["../../../../src/components/Contractor/PaymentMethod/BankAccountForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { BankAccountFormProps } from './types'\nimport { RadioGroupField, TextInputField } from '@/components/Common'\n\nexport function BankAccountForm({ bankAccount }: BankAccountFormProps) {\n  const { t } = useTranslation('Contractor.PaymentMethod', { keyPrefix: 'bankAccountForm' })\n\n  return (\n    <>\n      <TextInputField\n        name=\"name\"\n        isRequired\n        label={t('nameLabel')}\n        errorMessage={t('validations.accountName')}\n      />\n\n      <TextInputField\n        name=\"routingNumber\"\n        label={t('routingNumberLabel')}\n        isRequired\n        description={t('routingNumberDescription')}\n        errorMessage={t('validations.routingNumber')}\n      />\n\n      <TextInputField\n        name=\"accountNumber\"\n        label={t('accountNumberLabel')}\n        errorMessage={t('validations.accountNumber')}\n        isRequired\n      />\n\n      <RadioGroupField\n        name=\"accountType\"\n        isRequired\n        label={t('accountTypeLabel')}\n        options={[\n          { value: 'Checking', label: t('accountTypeChecking') },\n          { value: 'Savings', label: t('accountTypeSavings') },\n        ]}\n      />\n    </>\n  )\n}\n"],"names":["BankAccountForm","bankAccount","t","useTranslation","jsxs","Fragment","jsx","TextInputField","RadioGroupField"],"mappings":";;;;;AAIO,SAASA,EAAgB,EAAE,aAAAC,KAAqC;AACrE,QAAM,EAAE,GAAAC,MAAMC,EAAe,4BAA4B,EAAE,WAAW,mBAAmB;AAEzF,SACE,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,YAAU;AAAA,QACV,OAAOL,EAAE,WAAW;AAAA,QACpB,cAAcA,EAAE,yBAAyB;AAAA,MAAA;AAAA,IAAA;AAAA,IAG3C,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAOL,EAAE,oBAAoB;AAAA,QAC7B,YAAU;AAAA,QACV,aAAaA,EAAE,0BAA0B;AAAA,QACzC,cAAcA,EAAE,2BAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,IAG7C,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAOL,EAAE,oBAAoB;AAAA,QAC7B,cAAcA,EAAE,2BAA2B;AAAA,QAC3C,YAAU;AAAA,MAAA;AAAA,IAAA;AAAA,IAGZ,gBAAAI;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,YAAU;AAAA,QACV,OAAON,EAAE,kBAAkB;AAAA,QAC3B,SAAS;AAAA,UACP,EAAE,OAAO,YAAY,OAAOA,EAAE,qBAAqB,EAAA;AAAA,UACnD,EAAE,OAAO,WAAW,OAAOA,EAAE,oBAAoB,EAAA;AAAA,QAAE;AAAA,MACrD;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}
+{"version":3,"file":"BankAccountForm.js","sources":["../../../../src/components/Contractor/PaymentMethod/BankAccountForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { BankAccountFormProps } from './types'\nimport { RadioGroupField, TextInputField } from '@/components/Common'\n\nexport function BankAccountForm({ bankAccount }: BankAccountFormProps) {\n  const { t } = useTranslation('Contractor.PaymentMethod', { keyPrefix: 'bankAccountForm' })\n\n  return (\n    <>\n      <TextInputField\n        name=\"name\"\n        isRequired\n        label={t('nameLabel')}\n        errorMessage={t('validations.accountName')}\n      />\n\n      <TextInputField\n        name=\"routingNumber\"\n        label={t('routingNumberLabel')}\n        isRequired\n        description={t('routingNumberDescription')}\n        errorMessage={t('validations.routingNumber')}\n      />\n\n      <TextInputField\n        name=\"accountNumber\"\n        label={t('accountNumberLabel')}\n        errorMessage={t('validations.accountNumber')}\n        isRequired\n      />\n\n      <RadioGroupField\n        name=\"accountType\"\n        isRequired\n        label={t('accountTypeLabel')}\n        options={[\n          { value: 'Checking', label: t('accountTypeChecking') },\n          { value: 'Savings', label: t('accountTypeSavings') },\n        ]}\n      />\n    </>\n  )\n}\n"],"names":["BankAccountForm","bankAccount","t","useTranslation","jsxs","Fragment","jsx","TextInputField","RadioGroupField"],"mappings":";;;;AAIO,SAASA,EAAgB,EAAE,aAAAC,KAAqC;AACrE,QAAM,EAAE,GAAAC,MAAMC,EAAe,4BAA4B,EAAE,WAAW,mBAAmB;AAEzF,SACE,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,YAAU;AAAA,QACV,OAAOL,EAAE,WAAW;AAAA,QACpB,cAAcA,EAAE,yBAAyB;AAAA,MAAA;AAAA,IAAA;AAAA,IAG3C,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAOL,EAAE,oBAAoB;AAAA,QAC7B,YAAU;AAAA,QACV,aAAaA,EAAE,0BAA0B;AAAA,QACzC,cAAcA,EAAE,2BAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,IAG7C,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAOL,EAAE,oBAAoB;AAAA,QAC7B,cAAcA,EAAE,2BAA2B;AAAA,QAC3C,YAAU;AAAA,MAAA;AAAA,IAAA;AAAA,IAGZ,gBAAAI;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,YAAU;AAAA,QACV,OAAON,EAAE,kBAAkB;AAAA,QAC3B,SAAS;AAAA,UACP,EAAE,OAAO,YAAY,OAAOA,EAAE,qBAAqB,EAAA;AAAA,UACnD,EAAE,OAAO,WAAW,OAAOA,EAAE,oBAAoB,EAAA;AAAA,QAAE;AAAA,MACrD;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}

package/dist/components/Contractor/PaymentMethod/PaymentMethod.js

@@ -18,7 +18,6 @@ import { Form as X } from "../../Common/Form/Form.js";
 import { PAYMENT_METHODS as i, componentEvents as s } from "../../../shared/constants.js";
 import { ActionsLayout as Z } from "../../Common/ActionsLayout/ActionsLayout.js";
 import { Flex as $ } from "../../Common/Flex/Flex.js";
-import "classnames";
 import { routingNumberValidation as I, accountNumberValidation as tt } from "../../../helpers/validations.js";
 const et = r.discriminatedUnion("type", [
   r.object({
@@ -33,7 +32,7 @@ const et = r.discriminatedUnion("type", [
     type: r.literal("Check")
   })
 ]);
-function kt(n) {
+function Dt(n) {
   return /* @__PURE__ */ t(W, { ...n, children: /* @__PURE__ */ t(ot, { ...n, children: n.children }) });
 }
 function ot({ contractorId: n, className: y, dictionary: f }) {
@@ -112,6 +111,6 @@ function ot({ contractorId: n, className: y, dictionary: f }) {
   ] }) }) }) });
 }
 export {
-  kt as PaymentMethod
+  Dt as PaymentMethod
 };
 //# sourceMappingURL=PaymentMethod.js.map

package/dist/components/Contractor/PaymentMethod/PaymentMethod.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethod.js","sources":["../../../../src/components/Contractor/PaymentMethod/PaymentMethod.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { SubmitHandler } from 'react-hook-form'\nimport { FormProvider, useForm, useWatch } from 'react-hook-form'\nimport { useContractorPaymentMethodGetSuspense } from '@gusto/embedded-api/react-query/contractorPaymentMethodGet'\nimport { useContractorPaymentMethodGetBankAccountsSuspense } from '@gusto/embedded-api/react-query/contractorPaymentMethodGetBankAccounts'\nimport { useContractorPaymentMethodsCreateBankAccountMutation } from '@gusto/embedded-api/react-query/contractorPaymentMethodsCreateBankAccount'\nimport { useMemo } from 'react'\nimport z from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useContractorPaymentMethodUpdateMutation } from '@gusto/embedded-api/react-query/contractorPaymentMethodUpdate'\nimport type { PaymentMethodProps } from './types'\nimport { BankAccountForm } from './BankAccountForm'\nimport { PaymentTypeForm } from './PaymentTypeForm'\nimport { useI18n } from '@/i18n'\nimport { BaseComponent, useBase } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { componentEvents, PAYMENT_METHODS } from '@/shared/constants'\nimport { ActionsLayout } from '@/components/Common/ActionsLayout'\nimport { Flex } from '@/components/Common'\nimport { accountNumberValidation, routingNumberValidation } from '@/helpers/validations'\n\nconst PaymentMethodSchema = z.discriminatedUnion('type', [\n  z.object({\n    type: z.literal('Direct Deposit'),\n    name: z.string().min(1),\n    routingNumber: routingNumberValidation,\n    accountNumber: z.any(), //Explicitely setting account number as most permissive\n    accountType: z.enum(['Checking', 'Savings']),\n  }),\n  z.object({\n    type: z.literal('Check'),\n  }),\n])\n\nexport type PaymentMethodSchemaInputs = z.input<typeof PaymentMethodSchema>\nexport type PaymentMethodSchemaOutputs = z.output<typeof PaymentMethodSchema>\n\nexport function PaymentMethod(props: PaymentMethodProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nfunction Root({ contractorId, className, dictionary }: PaymentMethodProps) {\n  useComponentDictionary('Contractor.PaymentMethod', dictionary)\n  useI18n('Contractor.PaymentMethod')\n  const { t } = useTranslation('Contractor.PaymentMethod')\n  const { onEvent, baseSubmitHandler } = useBase()\n  const Components = useComponentContext()\n\n  const {\n    data: { contractorPaymentMethod },\n  } = useContractorPaymentMethodGetSuspense({ contractorUuid: contractorId })\n  const paymentMethod = contractorPaymentMethod!\n\n  const {\n    data: { contractorBankAccountList },\n  } = useContractorPaymentMethodGetBankAccountsSuspense({\n    contractorUuid: contractorId,\n  })\n  const bankAccount = contractorBankAccountList?.[0] || undefined\n\n  const { mutateAsync: updatePaymentMethod, isPending: paymentMethodPending } =\n    useContractorPaymentMethodUpdateMutation()\n  const { mutateAsync: createBankAccount, isPending: bankAccountPending } =\n    useContractorPaymentMethodsCreateBankAccountMutation()\n\n  const defaultValues = useMemo(\n    () => ({\n      type: paymentMethod.type || PAYMENT_METHODS.check,\n      name: bankAccount?.name || '',\n      routingNumber: bankAccount?.routingNumber || '',\n      accountNumber: bankAccount?.hiddenAccountNumber || '',\n      accountType: bankAccount?.accountType || 'Checking',\n    }),\n    [paymentMethod, bankAccount],\n  )\n\n  const formMethods = useForm({\n    resolver: zodResolver(PaymentMethodSchema),\n    defaultValues: defaultValues,\n  })\n\n  const watchedType = useWatch({ control: formMethods.control, name: 'type' })\n  const onSubmit: SubmitHandler<PaymentMethodSchemaInputs> = async data => {\n    await baseSubmitHandler(data, async payload => {\n      let permitBankSubmission = true\n\n      if (payload.type === PAYMENT_METHODS.directDeposit) {\n        /** Custom validation logic for accountNumber - because masked account value is used as default value, it is only validated when any of the bank-related fields are modified*/\n        const { name, accountNumber, routingNumber, accountType } = payload\n        if (\n          name !== bankAccount?.name ||\n          routingNumber !== bankAccount.routingNumber ||\n          accountType !== bankAccount.accountType ||\n          accountNumber !== bankAccount.hiddenAccountNumber\n        ) {\n          const res = accountNumberValidation.safeParse(payload.accountNumber)\n          if (!res.success) {\n            formMethods.setError('accountNumber', { type: 'validate' })\n            return\n          }\n        } else {\n          //Edgecase: bank fields are untouched, but we don't want to resubmit with masked account number\n          permitBankSubmission = false\n        }\n      }\n      const paymentMethodResponse = await updatePaymentMethod({\n        request: {\n          contractorUuid: contractorId,\n          requestBody: {\n            type: payload.type,\n\n            version: paymentMethod.version as string,\n          },\n        },\n      })\n      onEvent(componentEvents.CONTRACTOR_PAYMENT_METHOD_UPDATED, paymentMethodResponse)\n\n      //This update has to follow payment method update because it changes version of paymentMethod\n      if (payload.type === PAYMENT_METHODS.directDeposit && permitBankSubmission) {\n        const bankAccountResponse = await createBankAccount({\n          request: {\n            contractorUuid: contractorId,\n            requestBody: {\n              name: payload.name,\n              routingNumber: payload.routingNumber,\n              accountNumber: payload.accountNumber,\n              accountType: payload.accountType,\n            },\n          },\n        })\n        onEvent(componentEvents.CONTRACTOR_BANK_ACCOUNT_CREATED, bankAccountResponse)\n      }\n      onEvent(componentEvents.CONTRACTOR_PAYMENT_METHOD_DONE)\n    })\n  }\n\n  const showBankAccountForm = watchedType === PAYMENT_METHODS.directDeposit\n\n  return (\n    <section className={className}>\n      <FormProvider {...formMethods}>\n        <Form onSubmit={formMethods.handleSubmit(onSubmit)}>\n          <Flex gap={32} flexDirection={'column'}>\n            <Components.Heading as=\"h2\">{t('title')}</Components.Heading>\n            <PaymentTypeForm />\n            <hr />\n            {showBankAccountForm && <BankAccountForm bankAccount={bankAccount} />}\n            <ActionsLayout>\n              <Components.Button\n                type=\"submit\"\n                variant=\"primary\"\n                isDisabled={paymentMethodPending || bankAccountPending}\n              >\n                {t('continueCta')}\n              </Components.Button>\n            </ActionsLayout>\n          </Flex>\n        </Form>\n      </FormProvider>\n    </section>\n  )\n}\n"],"names":["PaymentMethodSchema","z","routingNumberValidation","PaymentMethod","props","jsx","BaseComponent","Root","contractorId","className","dictionary","useComponentDictionary","useI18n","t","useTranslation","onEvent","baseSubmitHandler","useBase","Components","useComponentContext","contractorPaymentMethod","useContractorPaymentMethodGetSuspense","paymentMethod","contractorBankAccountList","useContractorPaymentMethodGetBankAccountsSuspense","bankAccount","updatePaymentMethod","paymentMethodPending","useContractorPaymentMethodUpdateMutation","createBankAccount","bankAccountPending","useContractorPaymentMethodsCreateBankAccountMutation","defaultValues","useMemo","PAYMENT_METHODS","formMethods","useForm","zodResolver","watchedType","useWatch","onSubmit","data","payload","permitBankSubmission","name","accountNumber","routingNumber","accountType","accountNumberValidation","paymentMethodResponse","componentEvents","bankAccountResponse","showBankAccountForm","FormProvider","Form","jsxs","Flex","PaymentTypeForm","BankAccountForm","ActionsLayout"],"mappings":"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"}
+{"version":3,"file":"PaymentMethod.js","sources":["../../../../src/components/Contractor/PaymentMethod/PaymentMethod.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { SubmitHandler } from 'react-hook-form'\nimport { FormProvider, useForm, useWatch } from 'react-hook-form'\nimport { useContractorPaymentMethodGetSuspense } from '@gusto/embedded-api/react-query/contractorPaymentMethodGet'\nimport { useContractorPaymentMethodGetBankAccountsSuspense } from '@gusto/embedded-api/react-query/contractorPaymentMethodGetBankAccounts'\nimport { useContractorPaymentMethodsCreateBankAccountMutation } from '@gusto/embedded-api/react-query/contractorPaymentMethodsCreateBankAccount'\nimport { useMemo } from 'react'\nimport z from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useContractorPaymentMethodUpdateMutation } from '@gusto/embedded-api/react-query/contractorPaymentMethodUpdate'\nimport type { PaymentMethodProps } from './types'\nimport { BankAccountForm } from './BankAccountForm'\nimport { PaymentTypeForm } from './PaymentTypeForm'\nimport { useI18n } from '@/i18n'\nimport { BaseComponent, useBase } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { componentEvents, PAYMENT_METHODS } from '@/shared/constants'\nimport { ActionsLayout } from '@/components/Common/ActionsLayout'\nimport { Flex } from '@/components/Common'\nimport { accountNumberValidation, routingNumberValidation } from '@/helpers/validations'\n\nconst PaymentMethodSchema = z.discriminatedUnion('type', [\n  z.object({\n    type: z.literal('Direct Deposit'),\n    name: z.string().min(1),\n    routingNumber: routingNumberValidation,\n    accountNumber: z.any(), //Explicitely setting account number as most permissive\n    accountType: z.enum(['Checking', 'Savings']),\n  }),\n  z.object({\n    type: z.literal('Check'),\n  }),\n])\n\nexport type PaymentMethodSchemaInputs = z.input<typeof PaymentMethodSchema>\nexport type PaymentMethodSchemaOutputs = z.output<typeof PaymentMethodSchema>\n\nexport function PaymentMethod(props: PaymentMethodProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nfunction Root({ contractorId, className, dictionary }: PaymentMethodProps) {\n  useComponentDictionary('Contractor.PaymentMethod', dictionary)\n  useI18n('Contractor.PaymentMethod')\n  const { t } = useTranslation('Contractor.PaymentMethod')\n  const { onEvent, baseSubmitHandler } = useBase()\n  const Components = useComponentContext()\n\n  const {\n    data: { contractorPaymentMethod },\n  } = useContractorPaymentMethodGetSuspense({ contractorUuid: contractorId })\n  const paymentMethod = contractorPaymentMethod!\n\n  const {\n    data: { contractorBankAccountList },\n  } = useContractorPaymentMethodGetBankAccountsSuspense({\n    contractorUuid: contractorId,\n  })\n  const bankAccount = contractorBankAccountList?.[0] || undefined\n\n  const { mutateAsync: updatePaymentMethod, isPending: paymentMethodPending } =\n    useContractorPaymentMethodUpdateMutation()\n  const { mutateAsync: createBankAccount, isPending: bankAccountPending } =\n    useContractorPaymentMethodsCreateBankAccountMutation()\n\n  const defaultValues = useMemo(\n    () => ({\n      type: paymentMethod.type || PAYMENT_METHODS.check,\n      name: bankAccount?.name || '',\n      routingNumber: bankAccount?.routingNumber || '',\n      accountNumber: bankAccount?.hiddenAccountNumber || '',\n      accountType: bankAccount?.accountType || 'Checking',\n    }),\n    [paymentMethod, bankAccount],\n  )\n\n  const formMethods = useForm({\n    resolver: zodResolver(PaymentMethodSchema),\n    defaultValues: defaultValues,\n  })\n\n  const watchedType = useWatch({ control: formMethods.control, name: 'type' })\n  const onSubmit: SubmitHandler<PaymentMethodSchemaInputs> = async data => {\n    await baseSubmitHandler(data, async payload => {\n      let permitBankSubmission = true\n\n      if (payload.type === PAYMENT_METHODS.directDeposit) {\n        /** Custom validation logic for accountNumber - because masked account value is used as default value, it is only validated when any of the bank-related fields are modified*/\n        const { name, accountNumber, routingNumber, accountType } = payload\n        if (\n          name !== bankAccount?.name ||\n          routingNumber !== bankAccount.routingNumber ||\n          accountType !== bankAccount.accountType ||\n          accountNumber !== bankAccount.hiddenAccountNumber\n        ) {\n          const res = accountNumberValidation.safeParse(payload.accountNumber)\n          if (!res.success) {\n            formMethods.setError('accountNumber', { type: 'validate' })\n            return\n          }\n        } else {\n          //Edgecase: bank fields are untouched, but we don't want to resubmit with masked account number\n          permitBankSubmission = false\n        }\n      }\n      const paymentMethodResponse = await updatePaymentMethod({\n        request: {\n          contractorUuid: contractorId,\n          requestBody: {\n            type: payload.type,\n\n            version: paymentMethod.version as string,\n          },\n        },\n      })\n      onEvent(componentEvents.CONTRACTOR_PAYMENT_METHOD_UPDATED, paymentMethodResponse)\n\n      //This update has to follow payment method update because it changes version of paymentMethod\n      if (payload.type === PAYMENT_METHODS.directDeposit && permitBankSubmission) {\n        const bankAccountResponse = await createBankAccount({\n          request: {\n            contractorUuid: contractorId,\n            requestBody: {\n              name: payload.name,\n              routingNumber: payload.routingNumber,\n              accountNumber: payload.accountNumber,\n              accountType: payload.accountType,\n            },\n          },\n        })\n        onEvent(componentEvents.CONTRACTOR_BANK_ACCOUNT_CREATED, bankAccountResponse)\n      }\n      onEvent(componentEvents.CONTRACTOR_PAYMENT_METHOD_DONE)\n    })\n  }\n\n  const showBankAccountForm = watchedType === PAYMENT_METHODS.directDeposit\n\n  return (\n    <section className={className}>\n      <FormProvider {...formMethods}>\n        <Form onSubmit={formMethods.handleSubmit(onSubmit)}>\n          <Flex gap={32} flexDirection={'column'}>\n            <Components.Heading as=\"h2\">{t('title')}</Components.Heading>\n            <PaymentTypeForm />\n            <hr />\n            {showBankAccountForm && <BankAccountForm bankAccount={bankAccount} />}\n            <ActionsLayout>\n              <Components.Button\n                type=\"submit\"\n                variant=\"primary\"\n                isDisabled={paymentMethodPending || bankAccountPending}\n              >\n                {t('continueCta')}\n              </Components.Button>\n            </ActionsLayout>\n          </Flex>\n        </Form>\n      </FormProvider>\n    </section>\n  )\n}\n"],"names":["PaymentMethodSchema","z","routingNumberValidation","PaymentMethod","props","jsx","BaseComponent","Root","contractorId","className","dictionary","useComponentDictionary","useI18n","t","useTranslation","onEvent","baseSubmitHandler","useBase","Components","useComponentContext","contractorPaymentMethod","useContractorPaymentMethodGetSuspense","paymentMethod","contractorBankAccountList","useContractorPaymentMethodGetBankAccountsSuspense","bankAccount","updatePaymentMethod","paymentMethodPending","useContractorPaymentMethodUpdateMutation","createBankAccount","bankAccountPending","useContractorPaymentMethodsCreateBankAccountMutation","defaultValues","useMemo","PAYMENT_METHODS","formMethods","useForm","zodResolver","watchedType","useWatch","onSubmit","data","payload","permitBankSubmission","name","accountNumber","routingNumber","accountType","accountNumberValidation","paymentMethodResponse","componentEvents","bankAccountResponse","showBankAccountForm","FormProvider","Form","jsxs","Flex","PaymentTypeForm","BankAccountForm","ActionsLayout"],"mappings":"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"}

package/dist/components/Contractor/PaymentMethod/PaymentTypeForm.js

@@ -1,13 +1,12 @@
 import { jsx as i } from "react/jsx-runtime";
 import { useTranslation as r } from "react-i18next";
 import { z as t } from "zod";
-import "classnames";
 import { PAYMENT_METHODS as o } from "../../../shared/constants.js";
 import { RadioGroupField as p } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
 t.object({
   type: t.enum(["Check", "Direct Deposit"])
 });
-function d() {
+function s() {
   const { t: e } = r("Contractor.PaymentMethod");
   return /* @__PURE__ */ i(
     p,
@@ -31,6 +30,6 @@ function d() {
   );
 }
 export {
-  d as PaymentTypeForm
+  s as PaymentTypeForm
 };
 //# sourceMappingURL=PaymentTypeForm.js.map

package/dist/components/Contractor/PaymentMethod/PaymentTypeForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentTypeForm.js","sources":["../../../../src/components/Contractor/PaymentMethod/PaymentTypeForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { RadioGroupField } from '@/components/Common'\nimport { PAYMENT_METHODS } from '@/shared/constants'\n\nexport const PaymentTypeSchema = z.object({\n  type: z.enum(['Check', 'Direct Deposit']),\n})\nexport type PaymentTypeInputs = z.input<typeof PaymentTypeSchema>\nexport type PaymentTypePayload = z.output<typeof PaymentTypeSchema>\n\nexport function PaymentTypeForm() {\n  const { t } = useTranslation('Contractor.PaymentMethod')\n  return (\n    <RadioGroupField\n      name=\"type\"\n      label={t('paymentFieldsetLegend')}\n      shouldVisuallyHideLabel\n      options={[\n        {\n          value: PAYMENT_METHODS.directDeposit,\n          label: t('directDepositLabel'),\n          description: t('directDepositDescription'),\n        },\n        {\n          value: PAYMENT_METHODS.check,\n          label: t('checkLabel'),\n          description: t('checkDescription'),\n        },\n      ]}\n    />\n  )\n}\n"],"names":["z","PaymentTypeForm","t","useTranslation","jsx","RadioGroupField","PAYMENT_METHODS"],"mappings":";;;;;;AAKiCA,EAAE,OAAO;AAAA,EACxC,MAAMA,EAAE,KAAK,CAAC,SAAS,gBAAgB,CAAC;AAC1C,CAAC;AAIM,SAASC,IAAkB;AAChC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,0BAA0B;AACvD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,OAAOH,EAAE,uBAAuB;AAAA,MAChC,yBAAuB;AAAA,MACvB,SAAS;AAAA,QACP;AAAA,UACE,OAAOI,EAAgB;AAAA,UACvB,OAAOJ,EAAE,oBAAoB;AAAA,UAC7B,aAAaA,EAAE,0BAA0B;AAAA,QAAA;AAAA,QAE3C;AAAA,UACE,OAAOI,EAAgB;AAAA,UACvB,OAAOJ,EAAE,YAAY;AAAA,UACrB,aAAaA,EAAE,kBAAkB;AAAA,QAAA;AAAA,MACnC;AAAA,IACF;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"PaymentTypeForm.js","sources":["../../../../src/components/Contractor/PaymentMethod/PaymentTypeForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { RadioGroupField } from '@/components/Common'\nimport { PAYMENT_METHODS } from '@/shared/constants'\n\nexport const PaymentTypeSchema = z.object({\n  type: z.enum(['Check', 'Direct Deposit']),\n})\nexport type PaymentTypeInputs = z.input<typeof PaymentTypeSchema>\nexport type PaymentTypePayload = z.output<typeof PaymentTypeSchema>\n\nexport function PaymentTypeForm() {\n  const { t } = useTranslation('Contractor.PaymentMethod')\n  return (\n    <RadioGroupField\n      name=\"type\"\n      label={t('paymentFieldsetLegend')}\n      shouldVisuallyHideLabel\n      options={[\n        {\n          value: PAYMENT_METHODS.directDeposit,\n          label: t('directDepositLabel'),\n          description: t('directDepositDescription'),\n        },\n        {\n          value: PAYMENT_METHODS.check,\n          label: t('checkLabel'),\n          description: t('checkDescription'),\n        },\n      ]}\n    />\n  )\n}\n"],"names":["z","PaymentTypeForm","t","useTranslation","jsx","RadioGroupField","PAYMENT_METHODS"],"mappings":";;;;;AAKiCA,EAAE,OAAO;AAAA,EACxC,MAAMA,EAAE,KAAK,CAAC,SAAS,gBAAgB,CAAC;AAC1C,CAAC;AAIM,SAASC,IAAkB;AAChC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,0BAA0B;AACvD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,OAAOH,EAAE,uBAAuB;AAAA,MAChC,yBAAuB;AAAA,MACvB,SAAS;AAAA,QACP;AAAA,UACE,OAAOI,EAAgB;AAAA,UACvB,OAAOJ,EAAE,oBAAoB;AAAA,UAC7B,aAAaA,EAAE,0BAA0B;AAAA,QAAA;AAAA,QAE3C;AAAA,UACE,OAAOI,EAAgB;AAAA,UACvB,OAAOJ,EAAE,YAAY;AAAA,UACrB,aAAaA,EAAE,kBAAkB;AAAA,QAAA;AAAA,MACnC;AAAA,IACF;AAAA,EAAA;AAGN;"}

package/dist/components/Contractor/Profile/ContractorProfile.js

@@ -1,38 +1,45 @@
 import { jsx as t } from "react/jsx-runtime";
 import { useContractorsGetSuspense as m } from "@gusto/embedded-api/react-query/contractorsGet";
 import { useContractorProfile as f } from "./useContractorProfile.js";
-import { ContractorType as T, WageType as W } from "./useContractorProfile.js";
+import { ContractorType as W, WageType as g } from "./useContractorProfile.js";
 import { ContractorProfileForm as d } from "./ContractorProfileForm.js";
 import { BaseComponent as u } from "../../Base/Base.js";
-import { useComponentDictionary as C } from "../../../i18n/I18n.js";
-function g(o) {
-  return C("Contractor.Profile", o.dictionary), /* @__PURE__ */ t(u, { ...o, children: o.contractorId ? /* @__PURE__ */ t(l, { ...o, contractorId: o.contractorId, children: o.children }) : /* @__PURE__ */ t(n, { ...o, children: o.children }) });
+import { useComponentDictionary as l } from "../../../i18n/I18n.js";
+function D(o) {
+  return l("Contractor.Profile", o.dictionary), /* @__PURE__ */ t(u, { ...o, children: o.contractorId ? /* @__PURE__ */ t(C, { ...o, contractorId: o.contractorId, children: o.children }) : /* @__PURE__ */ t(c, { ...o, children: o.children }) });
 }
-function l(o) {
+function C(o) {
   const {
     data: { contractor: r }
   } = m({ contractorUuid: o.contractorId });
-  return /* @__PURE__ */ t(n, { ...o, existingContractor: r });
+  return /* @__PURE__ */ t(c, { ...o, existingContractor: r });
 }
-function n({
+function c({
   companyId: o,
   contractorId: r,
-  defaultValues: c,
-  existingContractor: e,
+  defaultValues: e,
+  existingContractor: n,
   className: i
 }) {
   const a = f({
     companyId: o,
     contractorId: r,
-    defaultValues: c,
-    existingContractor: e
+    defaultValues: e,
+    existingContractor: n
   });
-  return /* @__PURE__ */ t(d, { ...a, className: i });
+  return /* @__PURE__ */ t(
+    d,
+    {
+      ...a,
+      existingContractor: n,
+      className: i
+    }
+  );
 }
 export {
-  g as ContractorProfile,
+  D as ContractorProfile,
   d as ContractorProfileForm,
-  T as ContractorType,
-  W as WageType
+  W as ContractorType,
+  g as WageType
 };
 //# sourceMappingURL=ContractorProfile.js.map

package/dist/components/Contractor/Profile/ContractorProfile.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContractorProfile.js","sources":["../../../../src/components/Contractor/Profile/ContractorProfile.tsx"],"sourcesContent":["import { useContractorsGetSuspense } from '@gusto/embedded-api/react-query/contractorsGet'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport {\n  useContractorProfile,\n  ContractorType,\n  WageType,\n  type UseContractorProfileProps,\n} from './useContractorProfile'\nimport { ContractorProfileForm } from './ContractorProfileForm'\nimport type { BaseComponentInterface, CommonComponentInterface } from '@/components/Base/Base'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport type { WithRequired } from '@/types/Helpers'\n\ninterface ContractorProfileProps extends CommonComponentInterface<'Contractor.Profile'> {\n  companyId: string\n  contractorId?: string\n  defaultValues?: UseContractorProfileProps['defaultValues']\n}\n\ninterface ContractorProfileConditionalProps {\n  existingContractor?: Contractor\n}\n\n// Container component - calls hook and passes data to presentation component\nexport function ContractorProfile(props: ContractorProfileProps & BaseComponentInterface) {\n  useComponentDictionary('Contractor.Profile', props.dictionary)\n  return (\n    <BaseComponent {...props}>\n      {props.contractorId ? (\n        <RootWithContractor {...props} contractorId={props.contractorId}>\n          {props.children}\n        </RootWithContractor>\n      ) : (\n        <Root {...props}>{props.children}</Root>\n      )}\n    </BaseComponent>\n  )\n}\n\n/**Accounting for conditional logic where contractor data needs to be fetched only if contractorId is present */\nfunction RootWithContractor(props: WithRequired<ContractorProfileProps, 'contractorId'>) {\n  const {\n    data: { contractor },\n  } = useContractorsGetSuspense({ contractorUuid: props.contractorId })\n  return <Root {...props} existingContractor={contractor} />\n}\n\nfunction Root({\n  companyId,\n  contractorId,\n  defaultValues,\n  existingContractor,\n  className,\n}: ContractorProfileProps & ContractorProfileConditionalProps) {\n  const hookData = useContractorProfile({\n    companyId,\n    contractorId,\n    defaultValues,\n    existingContractor,\n  })\n  return <ContractorProfileForm {...hookData} className={className} />\n}\n\n// Re-export types and enums for convenience\nexport { ContractorType, WageType }\nexport type { UseContractorProfileProps as ContractorProfileFormData }\n\n// Re-export the form component for convenience\nexport { ContractorProfileForm } from './ContractorProfileForm'\n"],"names":["ContractorProfile","props","useComponentDictionary","jsx","BaseComponent","RootWithContractor","Root","contractor","useContractorsGetSuspense","companyId","contractorId","defaultValues","existingContractor","className","hookData","useContractorProfile","ContractorProfileForm"],"mappings":";;;;;;;AAyBO,SAASA,EAAkBC,GAAwD;AACxF,SAAAC,EAAuB,sBAAsBD,EAAM,UAAU,GAE3D,gBAAAE,EAACC,KAAe,GAAGH,GAChB,YAAM,eACL,gBAAAE,EAACE,GAAA,EAAoB,GAAGJ,GAAO,cAAcA,EAAM,cAChD,UAAAA,EAAM,UACT,IAEA,gBAAAE,EAACG,KAAM,GAAGL,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CAErC;AAEJ;AAGA,SAASI,EAAmBJ,GAA6D;AACvF,QAAM;AAAA,IACJ,MAAM,EAAE,YAAAM,EAAA;AAAA,EAAW,IACjBC,EAA0B,EAAE,gBAAgBP,EAAM,cAAc;AACpE,SAAO,gBAAAE,EAACG,GAAA,EAAM,GAAGL,GAAO,oBAAoBM,GAAY;AAC1D;AAEA,SAASD,EAAK;AAAA,EACZ,WAAAG;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,WAAAC;AACF,GAA+D;AAC7D,QAAMC,IAAWC,EAAqB;AAAA,IACpC,WAAAN;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,CACD;AACD,SAAO,gBAAAT,EAACa,GAAA,EAAuB,GAAGF,GAAU,WAAAD,EAAA,CAAsB;AACpE;"}
+{"version":3,"file":"ContractorProfile.js","sources":["../../../../src/components/Contractor/Profile/ContractorProfile.tsx"],"sourcesContent":["import { useContractorsGetSuspense } from '@gusto/embedded-api/react-query/contractorsGet'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport {\n  useContractorProfile,\n  ContractorType,\n  WageType,\n  type UseContractorProfileProps,\n} from './useContractorProfile'\nimport { ContractorProfileForm } from './ContractorProfileForm'\nimport type { BaseComponentInterface, CommonComponentInterface } from '@/components/Base/Base'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport type { WithRequired } from '@/types/Helpers'\n\ninterface ContractorProfileProps extends CommonComponentInterface<'Contractor.Profile'> {\n  companyId: string\n  contractorId?: string\n  defaultValues?: UseContractorProfileProps['defaultValues']\n}\n\ninterface ContractorProfileConditionalProps {\n  existingContractor?: Contractor\n}\n\n// Container component - calls hook and passes data to presentation component\nexport function ContractorProfile(props: ContractorProfileProps & BaseComponentInterface) {\n  useComponentDictionary('Contractor.Profile', props.dictionary)\n  return (\n    <BaseComponent {...props}>\n      {props.contractorId ? (\n        <RootWithContractor {...props} contractorId={props.contractorId}>\n          {props.children}\n        </RootWithContractor>\n      ) : (\n        <Root {...props}>{props.children}</Root>\n      )}\n    </BaseComponent>\n  )\n}\n\n/**Accounting for conditional logic where contractor data needs to be fetched only if contractorId is present */\nfunction RootWithContractor(props: WithRequired<ContractorProfileProps, 'contractorId'>) {\n  const {\n    data: { contractor },\n  } = useContractorsGetSuspense({ contractorUuid: props.contractorId })\n  return <Root {...props} existingContractor={contractor} />\n}\n\nfunction Root({\n  companyId,\n  contractorId,\n  defaultValues,\n  existingContractor,\n  className,\n}: ContractorProfileProps & ContractorProfileConditionalProps) {\n  const hookData = useContractorProfile({\n    companyId,\n    contractorId,\n    defaultValues,\n    existingContractor,\n  })\n  return (\n    <ContractorProfileForm\n      {...hookData}\n      existingContractor={existingContractor}\n      className={className}\n    />\n  )\n}\n\n// Re-export types and enums for convenience\nexport { ContractorType, WageType }\nexport type { UseContractorProfileProps as ContractorProfileFormData }\n\n// Re-export the form component for convenience\nexport { ContractorProfileForm } from './ContractorProfileForm'\n"],"names":["ContractorProfile","props","useComponentDictionary","jsx","BaseComponent","RootWithContractor","Root","contractor","useContractorsGetSuspense","companyId","contractorId","defaultValues","existingContractor","className","hookData","useContractorProfile","ContractorProfileForm"],"mappings":";;;;;;;AAyBO,SAASA,EAAkBC,GAAwD;AACxF,SAAAC,EAAuB,sBAAsBD,EAAM,UAAU,GAE3D,gBAAAE,EAACC,KAAe,GAAGH,GAChB,YAAM,eACL,gBAAAE,EAACE,GAAA,EAAoB,GAAGJ,GAAO,cAAcA,EAAM,cAChD,UAAAA,EAAM,UACT,IAEA,gBAAAE,EAACG,KAAM,GAAGL,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CAErC;AAEJ;AAGA,SAASI,EAAmBJ,GAA6D;AACvF,QAAM;AAAA,IACJ,MAAM,EAAE,YAAAM,EAAA;AAAA,EAAW,IACjBC,EAA0B,EAAE,gBAAgBP,EAAM,cAAc;AACpE,SAAO,gBAAAE,EAACG,GAAA,EAAM,GAAGL,GAAO,oBAAoBM,GAAY;AAC1D;AAEA,SAASD,EAAK;AAAA,EACZ,WAAAG;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,WAAAC;AACF,GAA+D;AAC7D,QAAMC,IAAWC,EAAqB;AAAA,IACpC,WAAAN;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,CACD;AACD,SACE,gBAAAT;AAAA,IAACa;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,oBAAAF;AAAA,MACA,WAAAC;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Contractor/Profile/ContractorProfileForm.d.ts

@@ -1,5 +1,7 @@
+import { Contractor } from '@gusto/embedded-api/models/components/contractor';
 import { useContractorProfile } from './useContractorProfile';
 export type ContractorProfileFormProps = ReturnType<typeof useContractorProfile> & {
     className?: string;
+    existingContractor?: Contractor;
 };
-export declare function ContractorProfileForm({ formMethods, handleSubmit, formState, shouldShowEmailField, shouldShowBusinessFields, shouldShowIndividualFields, shouldShowHourlyRate, contractorTypeOptions, wageTypeOptions, isEditing, className, }: ContractorProfileFormProps): import("react/jsx-runtime").JSX.Element;
+export declare function ContractorProfileForm({ formMethods, handleSubmit, formState, shouldShowEmailField, shouldShowBusinessFields, shouldShowIndividualFields, shouldShowHourlyRate, contractorTypeOptions, wageTypeOptions, isEditing, className, existingContractor, }: ContractorProfileFormProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Contractor/Profile/ContractorProfileForm.js

@@ -1,50 +1,53 @@
-import { jsx as i, jsxs as r, Fragment as s } from "react/jsx-runtime";
-import { FormProvider as R } from "react-hook-form";
-import { useTranslation as y } from "react-i18next";
-import { useComponentContext as q } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as F } from "../../../i18n/I18n.js";
-import { Form as N } from "../../Common/Form/Form.js";
-import { Grid as a } from "../../Common/Grid/Grid.js";
-import { Flex as T } from "../../Common/Flex/Flex.js";
-import { normalizeSSN as x } from "../../../helpers/ssn.js";
-import { normalizeEin as v } from "../../../helpers/federalEin.js";
+import { jsx as r, jsxs as i, Fragment as m } from "react/jsx-runtime";
+import { FormProvider as F } from "react-hook-form";
+import { useTranslation as P } from "react-i18next";
+import { useComponentContext as S } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as T } from "../../../i18n/I18n.js";
+import { Form as C } from "../../Common/Form/Form.js";
+import { Grid as n } from "../../Common/Grid/Grid.js";
+import { Flex as D } from "../../Common/Flex/Flex.js";
+import { usePlaceholderSSN as I, normalizeSSN as O } from "../../../helpers/ssn.js";
+import { usePlaceholderEin as x, normalizeEin as E } from "../../../helpers/federalEin.js";
+import { ContractorOnboardingStatus as j } from "../../../shared/constants.js";
 import { TextInputField as l } from "../../Common/Fields/TextInputField/TextInputField.js";
-import { RadioGroupField as m } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { NumberInputField as D } from "../../Common/Fields/NumberInputField/NumberInputField.js";
-import { SwitchField as I } from "../../Common/Fields/SwitchField/SwitchField.js";
-import { DatePickerField as P } from "../../Common/Fields/DatePickerField/DatePickerField.js";
-function Q({
-  formMethods: d,
-  handleSubmit: u,
-  formState: n,
-  shouldShowEmailField: p,
-  shouldShowBusinessFields: f,
+import { RadioGroupField as d } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { NumberInputField as w } from "../../Common/Fields/NumberInputField/NumberInputField.js";
+import { SwitchField as G } from "../../Common/Fields/SwitchField/SwitchField.js";
+import { DatePickerField as v } from "../../Common/Fields/DatePickerField/DatePickerField.js";
+function Z({
+  formMethods: u,
+  handleSubmit: f,
+  formState: o,
+  shouldShowEmailField: b,
+  shouldShowBusinessFields: p,
   shouldShowIndividualFields: c,
-  shouldShowHourlyRate: b,
-  contractorTypeOptions: h,
-  wageTypeOptions: g,
-  isEditing: o,
-  className: C
+  shouldShowHourlyRate: h,
+  contractorTypeOptions: g,
+  wageTypeOptions: N,
+  isEditing: s,
+  className: R,
+  existingContractor: a
 }) {
-  const t = q();
-  F("Contractor.Profile");
-  const { t: e } = y("Contractor.Profile");
-  return /* @__PURE__ */ i("section", { className: C, children: /* @__PURE__ */ i(R, { ...d, children: /* @__PURE__ */ r(N, { onSubmit: u, children: [
-    /* @__PURE__ */ r(a, { gridTemplateColumns: "1fr", gap: 24, className: "mb-8", children: [
-      /* @__PURE__ */ r("header", { children: [
-        /* @__PURE__ */ i(t.Heading, { as: "h2", children: e("title") }),
-        /* @__PURE__ */ i(t.Text, { children: e("subtitle") })
+  const t = S();
+  T("Contractor.Profile");
+  const { t: e } = P("Contractor.Profile"), y = I(a?.hasSsn ?? !1), q = x(a?.hasEin ?? !1);
+  return /* @__PURE__ */ r("section", { className: R, children: /* @__PURE__ */ r(F, { ...u, children: /* @__PURE__ */ i(C, { onSubmit: f, children: [
+    /* @__PURE__ */ i(n, { gridTemplateColumns: "1fr", gap: 24, className: "mb-8", children: [
+      /* @__PURE__ */ i("header", { children: [
+        /* @__PURE__ */ r(t.Heading, { as: "h2", children: e("title") }),
+        /* @__PURE__ */ r(t.Text, { children: e("subtitle") })
       ] }),
-      /* @__PURE__ */ i(t.Card, { children: /* @__PURE__ */ r(a, { gap: 16, children: [
-        /* @__PURE__ */ i(
-          I,
+      /* @__PURE__ */ r(t.Card, { children: /* @__PURE__ */ i(n, { gap: 16, children: [
+        /* @__PURE__ */ r(
+          G,
           {
-            name: "inviteContractor",
-            label: e("fields.inviteContractor.label"),
-            description: e("fields.inviteContractor.description")
+            name: "selfOnboarding",
+            label: e("fields.selfOnboarding.label"),
+            description: e("fields.selfOnboarding.description"),
+            isDisabled: a && a.onboardingStatus !== j.ADMIN_ONBOARDING_INCOMPLETE
           }
         ),
-        p && /* @__PURE__ */ i(
+        b && /* @__PURE__ */ r(
           l,
           {
             name: "email",
@@ -54,34 +57,34 @@ function Q({
           }
         )
       ] }) }),
-      /* @__PURE__ */ i(
-        m,
+      /* @__PURE__ */ r(
+        d,
         {
           name: "contractorType",
           isRequired: !0,
           label: e("fields.contractorType.label"),
-          options: h
+          options: g
         }
       ),
-      c && /* @__PURE__ */ r(s, { children: [
-        /* @__PURE__ */ r(a, { gridTemplateColumns: { base: "1fr", medium: "1fr 1fr" }, gap: 16, children: [
-          /* @__PURE__ */ i(l, { name: "firstName", label: e("fields.firstName.label"), isRequired: !0 }),
-          /* @__PURE__ */ i(l, { name: "middleInitial", label: e("fields.middleInitial.label") })
+      c && /* @__PURE__ */ i(m, { children: [
+        /* @__PURE__ */ i(n, { gridTemplateColumns: { base: "1fr", medium: "1fr 1fr" }, gap: 16, children: [
+          /* @__PURE__ */ r(l, { name: "firstName", label: e("fields.firstName.label"), isRequired: !0 }),
+          /* @__PURE__ */ r(l, { name: "middleInitial", label: e("fields.middleInitial.label") })
         ] }),
-        /* @__PURE__ */ i(l, { name: "lastName", label: e("fields.lastName.label"), isRequired: !0 }),
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ r(l, { name: "lastName", label: e("fields.lastName.label"), isRequired: !0 }),
+        /* @__PURE__ */ r(
           l,
           {
             name: "ssn",
             label: e("fields.ssn.label"),
-            placeholder: e("fields.ssn.placeholder"),
-            transform: x,
+            placeholder: y,
+            transform: O,
             isRequired: !0
           }
         )
       ] }),
-      f && /* @__PURE__ */ r(s, { children: [
-        /* @__PURE__ */ i(
+      p && /* @__PURE__ */ i(m, { children: [
+        /* @__PURE__ */ r(
           l,
           {
             name: "businessName",
@@ -89,28 +92,28 @@ function Q({
             isRequired: !0
           }
         ),
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ r(
           l,
           {
             name: "ein",
             label: e("fields.ein.label"),
-            placeholder: e("fields.ein.placeholder"),
-            transform: v,
+            placeholder: q,
+            transform: E,
             isRequired: !0
           }
         )
       ] }),
-      /* @__PURE__ */ i(
-        m,
+      /* @__PURE__ */ r(
+        d,
         {
           name: "wageType",
           isRequired: !0,
           label: e("fields.wageType.label"),
-          options: g
+          options: N
         }
       ),
-      b && /* @__PURE__ */ i(
-        D,
+      h && /* @__PURE__ */ r(
+        w,
         {
           name: "hourlyRate",
           label: e("fields.hourlyRate.label"),
@@ -119,8 +122,8 @@ function Q({
           format: "currency"
         }
       ),
-      /* @__PURE__ */ i(
-        P,
+      /* @__PURE__ */ r(
+        v,
         {
           name: "startDate",
           label: e("fields.startDate.label"),
@@ -129,10 +132,10 @@ function Q({
         }
       )
     ] }),
-    /* @__PURE__ */ i(T, { gap: 12, justifyContent: "flex-end", children: /* @__PURE__ */ i(t.Button, { type: "submit", variant: "primary", isDisabled: n.isSubmitting, children: n.isSubmitting ? e(o ? "buttons.updating" : "buttons.creating") : e(o ? "buttons.update" : "buttons.create") }) })
+    /* @__PURE__ */ r(D, { gap: 12, justifyContent: "flex-end", children: /* @__PURE__ */ r(t.Button, { type: "submit", variant: "primary", isDisabled: o.isSubmitting, children: o.isSubmitting ? e(s ? "buttons.updating" : "buttons.creating") : e(s ? "buttons.update" : "buttons.create") }) })
   ] }) }) });
 }
 export {
-  Q as ContractorProfileForm
+  Z as ContractorProfileForm
 };
 //# sourceMappingURL=ContractorProfileForm.js.map