@gusto/embedded-react-sdk 0.44.1 → 0.45.0

package/dist/components/Employee/OnboardingFlow/OnboardingFlowComponents.d.ts

@@ -22,3 +22,4 @@ export interface OnboardingContextInterface extends FlowContextInterface {
 export declare function FederalTaxesContextual(): import("react/jsx-runtime").JSX.Element;
 export declare function StateTaxesContextual(): import("react/jsx-runtime").JSX.Element;
 export declare const EmployeeListContextual: () => import("react/jsx-runtime").JSX.Element;
+export declare function DeductionsContextual(): import("react/jsx-runtime").JSX.Element;

package/dist/components/Employee/OnboardingFlow/OnboardingFlowComponents.js

@@ -1,24 +1,30 @@
 import { jsx as t } from "react/jsx-runtime";
+import { Deductions as i } from "../Deductions/Deductions.js";
 import { FederalTaxes as p } from "../FederalTaxes/onboarding/FederalTaxes.js";
 import { StateTaxes as s } from "../StateTaxes/onboarding/StateTaxes.js";
-import { EmployeeList as i } from "../EmployeeList/onboarding/EmployeeList.js";
+import { EmployeeList as u } from "../EmployeeList/onboarding/EmployeeList.js";
 import { ensureRequired as r } from "../../../helpers/ensureRequired.js";
 import { useFlow as n } from "../../Flow/useFlow.js";
-function c() {
+function I() {
   const { employeeId: e, onEvent: o } = n();
   return /* @__PURE__ */ t(p, { onEvent: o, employeeId: r(e) });
 }
-function y() {
+function E() {
   const { employeeId: e, onEvent: o, isAdmin: m } = n();
   return /* @__PURE__ */ t(s, { onEvent: o, employeeId: r(e), isAdmin: m });
 }
-const E = () => {
+const v = () => {
   const { companyId: e, onEvent: o } = n();
-  return /* @__PURE__ */ t(i, { companyId: e, onEvent: o });
+  return /* @__PURE__ */ t(u, { companyId: e, onEvent: o });
 };
+function C() {
+  const { employeeId: e, onEvent: o } = n();
+  return /* @__PURE__ */ t(i, { onEvent: o, employeeId: r(e) });
+}
 export {
-  E as EmployeeListContextual,
-  c as FederalTaxesContextual,
-  y as StateTaxesContextual
+  C as DeductionsContextual,
+  v as EmployeeListContextual,
+  I as FederalTaxesContextual,
+  E as StateTaxesContextual
 };
 //# sourceMappingURL=OnboardingFlowComponents.js.map

package/dist/components/Employee/OnboardingFlow/OnboardingFlowComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"OnboardingFlowComponents.js","sources":["../../../../src/components/Employee/OnboardingFlow/OnboardingFlowComponents.tsx"],"sourcesContent":["import type { PaymentMethodBankAccount } from '@gusto/embedded-api/models/components/paymentmethodbankaccount'\nimport { FederalTaxes } from '../FederalTaxes/onboarding/FederalTaxes'\nimport { StateTaxes } from '../StateTaxes/onboarding/StateTaxes'\nimport type { ProfileDefaultValues } from '../Profile/onboarding/Profile'\nimport type { CompensationDefaultValues } from '../Compensation'\nimport { EmployeeList } from '../EmployeeList/onboarding/EmployeeList'\nimport { ensureRequired } from '@/helpers/ensureRequired'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport type { EmployeeOnboardingStatus } from '@/shared/constants'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\nexport type OnboardingDefaultValues = RequireAtLeastOne<{\n  profile?: ProfileDefaultValues\n  compensation?: CompensationDefaultValues\n}>\n\nexport interface OnboardingContextInterface extends FlowContextInterface {\n  companyId: string\n  employeeId?: string\n  isAdmin?: boolean\n  onboardingStatus?: (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n  startDate?: string\n  paymentMethod?: PaymentMethodBankAccount\n  defaultValues?: OnboardingDefaultValues\n  isSelfOnboardingEnabled?: boolean\n  withEmployeeI9?: boolean\n}\n\nexport function FederalTaxesContextual() {\n  const { employeeId, onEvent } = useFlow<OnboardingContextInterface>()\n  return <FederalTaxes onEvent={onEvent} employeeId={ensureRequired(employeeId)} />\n}\n\nexport function StateTaxesContextual() {\n  const { employeeId, onEvent, isAdmin } = useFlow<OnboardingContextInterface>()\n  return <StateTaxes onEvent={onEvent} employeeId={ensureRequired(employeeId)} isAdmin={isAdmin} />\n}\n\nexport const EmployeeListContextual = () => {\n  const { companyId, onEvent } = useFlow<OnboardingContextInterface>()\n  return <EmployeeList companyId={companyId} onEvent={onEvent} />\n}\n"],"names":["FederalTaxesContextual","employeeId","onEvent","useFlow","FederalTaxes","ensureRequired","StateTaxesContextual","isAdmin","StateTaxes","EmployeeListContextual","companyId","jsx","EmployeeList"],"mappings":";;;;;;AA4BO,SAASA,IAAyB;AACvC,QAAM,EAAE,YAAAC,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,2BAAQC,GAAA,EAAa,SAAAF,GAAkB,YAAYG,EAAeJ,CAAU,GAAG;AACjF;AAEO,SAASK,IAAuB;AACrC,QAAM,EAAE,YAAAL,GAAY,SAAAC,GAAS,SAAAK,EAAA,IAAYJ,EAAA;AACzC,2BAAQK,GAAA,EAAW,SAAAN,GAAkB,YAAYG,EAAeJ,CAAU,GAAG,SAAAM,GAAkB;AACjG;AAEO,MAAME,IAAyB,MAAM;AAC1C,QAAM,EAAE,WAAAC,GAAW,SAAAR,EAAA,IAAYC,EAAA;AAC/B,SAAO,gBAAAQ,EAACC,GAAA,EAAa,WAAAF,GAAsB,SAAAR,EAAA,CAAkB;AAC/D;"}
+{"version":3,"file":"OnboardingFlowComponents.js","sources":["../../../../src/components/Employee/OnboardingFlow/OnboardingFlowComponents.tsx"],"sourcesContent":["import type { PaymentMethodBankAccount } from '@gusto/embedded-api/models/components/paymentmethodbankaccount'\nimport { Deductions } from '../Deductions/Deductions'\nimport { FederalTaxes } from '../FederalTaxes/onboarding/FederalTaxes'\nimport { StateTaxes } from '../StateTaxes/onboarding/StateTaxes'\nimport type { ProfileDefaultValues } from '../Profile/onboarding/Profile'\nimport type { CompensationDefaultValues } from '../Compensation'\nimport { EmployeeList } from '../EmployeeList/onboarding/EmployeeList'\nimport { ensureRequired } from '@/helpers/ensureRequired'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport type { EmployeeOnboardingStatus } from '@/shared/constants'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\nexport type OnboardingDefaultValues = RequireAtLeastOne<{\n  profile?: ProfileDefaultValues\n  compensation?: CompensationDefaultValues\n}>\n\nexport interface OnboardingContextInterface extends FlowContextInterface {\n  companyId: string\n  employeeId?: string\n  isAdmin?: boolean\n  onboardingStatus?: (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n  startDate?: string\n  paymentMethod?: PaymentMethodBankAccount\n  defaultValues?: OnboardingDefaultValues\n  isSelfOnboardingEnabled?: boolean\n  withEmployeeI9?: boolean\n}\n\nexport function FederalTaxesContextual() {\n  const { employeeId, onEvent } = useFlow<OnboardingContextInterface>()\n  return <FederalTaxes onEvent={onEvent} employeeId={ensureRequired(employeeId)} />\n}\n\nexport function StateTaxesContextual() {\n  const { employeeId, onEvent, isAdmin } = useFlow<OnboardingContextInterface>()\n  return <StateTaxes onEvent={onEvent} employeeId={ensureRequired(employeeId)} isAdmin={isAdmin} />\n}\n\nexport const EmployeeListContextual = () => {\n  const { companyId, onEvent } = useFlow<OnboardingContextInterface>()\n  return <EmployeeList companyId={companyId} onEvent={onEvent} />\n}\n\nexport function DeductionsContextual() {\n  const { employeeId, onEvent } = useFlow<OnboardingContextInterface>()\n  return <Deductions onEvent={onEvent} employeeId={ensureRequired(employeeId)} />\n}\n"],"names":["FederalTaxesContextual","employeeId","onEvent","useFlow","FederalTaxes","ensureRequired","StateTaxesContextual","isAdmin","StateTaxes","EmployeeListContextual","companyId","jsx","EmployeeList","DeductionsContextual","Deductions"],"mappings":";;;;;;;AA6BO,SAASA,IAAyB;AACvC,QAAM,EAAE,YAAAC,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,2BAAQC,GAAA,EAAa,SAAAF,GAAkB,YAAYG,EAAeJ,CAAU,GAAG;AACjF;AAEO,SAASK,IAAuB;AACrC,QAAM,EAAE,YAAAL,GAAY,SAAAC,GAAS,SAAAK,EAAA,IAAYJ,EAAA;AACzC,2BAAQK,GAAA,EAAW,SAAAN,GAAkB,YAAYG,EAAeJ,CAAU,GAAG,SAAAM,GAAkB;AACjG;AAEO,MAAME,IAAyB,MAAM;AAC1C,QAAM,EAAE,WAAAC,GAAW,SAAAR,EAAA,IAAYC,EAAA;AAC/B,SAAO,gBAAAQ,EAACC,GAAA,EAAa,WAAAF,GAAsB,SAAAR,EAAA,CAAkB;AAC/D;AAEO,SAASW,IAAuB;AACrC,QAAM,EAAE,YAAAZ,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,2BAAQW,GAAA,EAAW,SAAAZ,GAAkB,YAAYG,EAAeJ,CAAU,GAAG;AAC/E;"}

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

@@ -1,51 +1,50 @@
-import { state as E, transition as o, reduce as n, guard as i } from "robot3";
-import { EmployeeListContextual as l, StateTaxesContextual as _, FederalTaxesContextual as D } from "./OnboardingFlowComponents.js";
-import { componentEvents as t, EmployeeSelfOnboardingStatuses as c, EmployeeOnboardingStatus as d } from "../../../shared/constants.js";
-import { ProfileContextual as p } from "../Profile/onboarding/Profile.js";
-import { CompensationContextual as N } from "../Compensation/Compensation.js";
-import { OnboardingSummaryContextual as O } from "../OnboardingSummary/OnboardingSummary.js";
-import { EmployeeDocumentsContextual as y } from "../EmployeeDocuments/EmployeeDocuments.js";
-import { DeductionsContextual as u } from "../Deductions/Deductions.js";
-import { PaymentMethodContextual as P } from "../PaymentMethod/PaymentMethod.js";
+import { state as E, transition as o, reduce as t, guard as i } from "robot3";
+import { EmployeeListContextual as l, DeductionsContextual as p, StateTaxesContextual as _, FederalTaxesContextual as D } from "./OnboardingFlowComponents.js";
+import { componentEvents as n, EmployeeSelfOnboardingStatuses as c, EmployeeOnboardingStatus as d } from "../../../shared/constants.js";
+import { ProfileContextual as O } from "../Profile/onboarding/Profile.js";
+import { CompensationContextual as N } from "../Compensation/onboarding/Compensation.js";
+import { OnboardingSummaryContextual as u } from "../OnboardingSummary/OnboardingSummary.js";
+import { EmployeeDocumentsContextual as y } from "../Documents/onboarding/EmployeeDocuments/EmployeeDocuments.js";
+import { PaymentMethodContextual as P } from "../PaymentMethod/onboarding/PaymentMethod.js";
 const a = (e) => (m) => ({
   ...m,
   ...e
 }), r = (e, m) => o(
-  t.CANCEL,
+  n.CANCEL,
   e,
-  n(a({ component: l }))
+  t(a({ component: l }))
 ), S = /* @__PURE__ */ new Set([
   d.SELF_ONBOARDING_COMPLETED_BY_EMPLOYEE,
   d.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW,
   d.ONBOARDING_COMPLETED
 ]), M = (e) => !(!e.withEmployeeI9 || e.onboardingStatus && S.has(e.onboardingStatus)), s = (e) => e.onboardingStatus ? !// prettier-ignore
 // @ts-expect-error: onboarding_status during runtime can be one of self onboarding statuses
-(c.has(e.onboardingStatus) || e.onboardingStatus === d.SELF_ONBOARDING_PENDING_INVITE) : !0, b = {
+(c.has(e.onboardingStatus) || e.onboardingStatus === d.SELF_ONBOARDING_PENDING_INVITE) : !0, Y = {
   index: E(
     o(
-      t.EMPLOYEE_CREATE,
+      n.EMPLOYEE_CREATE,
       "employeeProfile",
-      n(a({ component: p, employeeId: void 0 }))
+      t(a({ component: O, employeeId: void 0 }))
     ),
     o(
-      t.EMPLOYEE_UPDATE,
+      n.EMPLOYEE_UPDATE,
       "employeeProfile",
-      n(
+      t(
         (e, m) => ({
           ...e,
-          component: p,
+          component: O,
           employeeId: m.payload.employeeId,
           onboardingStatus: m.payload.onboardingStatus
         })
       )
     ),
-    o(t.EMPLOYEE_ONBOARDING_DONE, "final")
+    o(n.EMPLOYEE_ONBOARDING_DONE, "final")
   ),
   employeeProfile: E(
     o(
-      t.EMPLOYEE_PROFILE_DONE,
+      n.EMPLOYEE_PROFILE_DONE,
       "compensation",
-      n(
+      t(
         (e, m) => ({
           ...e,
           component: N,
@@ -59,76 +58,76 @@ const a = (e) => (m) => ({
   ),
   compensation: E(
     o(
-      t.EMPLOYEE_COMPENSATION_DONE,
+      n.EMPLOYEE_COMPENSATION_DONE,
       "federalTaxes",
-      n(a({ component: D })),
+      t(a({ component: D })),
       i(s)
     ),
     o(
-      t.EMPLOYEE_COMPENSATION_DONE,
+      n.EMPLOYEE_COMPENSATION_DONE,
       "deductions",
-      n(a({ component: u }))
+      t(a({ component: p }))
     ),
     r("index")
   ),
   federalTaxes: E(
     o(
-      t.EMPLOYEE_FEDERAL_TAXES_DONE,
+      n.EMPLOYEE_FEDERAL_TAXES_DONE,
       "stateTaxes",
-      n(a({ component: _ })),
+      t(a({ component: _ })),
       i(s)
     ),
     r("index")
   ),
   stateTaxes: E(
     o(
-      t.EMPLOYEE_STATE_TAXES_DONE,
+      n.EMPLOYEE_STATE_TAXES_DONE,
       "paymentMethod",
-      n(a({ component: P })),
+      t(a({ component: P })),
       i(s)
     ),
     r("index")
   ),
   paymentMethod: E(
     o(
-      t.EMPLOYEE_PAYMENT_METHOD_DONE,
+      n.EMPLOYEE_PAYMENT_METHOD_DONE,
       "deductions",
-      n(a({ component: u }))
+      t(a({ component: p }))
     ),
     r("index")
   ),
   deductions: E(
     o(
-      t.EMPLOYEE_DEDUCTION_DONE,
+      n.EMPLOYEE_DEDUCTION_DONE,
       "employeeDocuments",
-      n(a({ component: y })),
+      t(a({ component: y })),
       i(M)
     ),
     o(
-      t.EMPLOYEE_DEDUCTION_DONE,
+      n.EMPLOYEE_DEDUCTION_DONE,
       "summary",
-      n(a({ component: O }))
+      t(a({ component: u }))
     ),
     r("index")
   ),
   employeeDocuments: E(
     o(
-      t.EMPLOYEE_DOCUMENTS_DONE,
+      n.EMPLOYEE_DOCUMENTS_DONE,
       "summary",
-      n(a({ component: O }))
+      t(a({ component: u }))
     ),
     r("index")
   ),
   summary: E(
     o(
-      t.EMPLOYEES_LIST,
+      n.EMPLOYEES_LIST,
       "index",
-      n(a({ component: l, employeeId: void 0 }))
+      t(a({ component: l, employeeId: void 0 }))
     )
   ),
   final: E()
 };
 export {
-  b as employeeOnboardingMachine
+  Y as employeeOnboardingMachine
 };
 //# sourceMappingURL=onboardingStateMachine.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"onboardingStateMachine.js","sources":["../../../../src/components/Employee/OnboardingFlow/onboardingStateMachine.ts"],"sourcesContent":["import { transition, reduce, state, guard } from 'robot3'\nimport {\n  FederalTaxesContextual,\n  StateTaxesContextual,\n  type OnboardingContextInterface,\n  EmployeeListContextual,\n} from './OnboardingFlowComponents'\nimport {\n  componentEvents,\n  EmployeeSelfOnboardingStatuses,\n  EmployeeOnboardingStatus,\n} from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\nimport { CompensationContextual } from '@/components/Employee/Compensation'\nimport { DeductionsContextual } from '@/components/Employee/Deductions'\nimport { EmployeeDocumentsContextual } from '@/components/Employee/EmployeeDocuments'\nimport { PaymentMethodContextual } from '@/components/Employee/PaymentMethod'\nimport { ProfileContextual } from '@/components/Employee/Profile/onboarding/Profile'\nimport { OnboardingSummaryContextual } from '@/components/Employee/OnboardingSummary'\n\ntype EventPayloads = {\n  [componentEvents.EMPLOYEE_UPDATE]: {\n    employeeId: string\n    onboardingStatus: (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n  }\n  [componentEvents.EMPLOYEE_PROFILE_DONE]: {\n    uuid: string\n    onboardingStatus: (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n    startDate: string\n  }\n}\n\nconst createReducer = (props: Partial<OnboardingContextInterface>) => {\n  return (ctx: OnboardingContextInterface): OnboardingContextInterface => ({\n    ...ctx,\n    ...props,\n  })\n}\n\nconst cancelTransition = (target: string, component?: React.ComponentType) =>\n  transition(\n    componentEvents.CANCEL,\n    target,\n    reduce(createReducer({ component: component ?? EmployeeListContextual })),\n  )\n\nconst employeeDocumentsConfigCompletedStatuses: Set<\n  (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n> = new Set([\n  EmployeeOnboardingStatus.SELF_ONBOARDING_COMPLETED_BY_EMPLOYEE,\n  EmployeeOnboardingStatus.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW,\n  EmployeeOnboardingStatus.ONBOARDING_COMPLETED,\n])\n\nconst employeeDocumentsGuard = (ctx: OnboardingContextInterface) => {\n  if (!ctx.withEmployeeI9) return false\n  if (ctx.onboardingStatus && employeeDocumentsConfigCompletedStatuses.has(ctx.onboardingStatus))\n    return false\n  return true\n}\n\nconst selfOnboardingGuard = (ctx: OnboardingContextInterface) =>\n  ctx.onboardingStatus\n    ? !(\n        // prettier-ignore\n        // @ts-expect-error: onboarding_status during runtime can be one of self onboarding statuses\n        (EmployeeSelfOnboardingStatuses.has(ctx.onboardingStatus) ||\n        ctx.onboardingStatus === EmployeeOnboardingStatus.SELF_ONBOARDING_PENDING_INVITE)\n      )\n    : true\n\nexport const employeeOnboardingMachine = {\n  index: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_CREATE,\n      'employeeProfile',\n      reduce(createReducer({ component: ProfileContextual, employeeId: undefined })),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_UPDATE,\n      'employeeProfile',\n\n      reduce(\n        (\n          ctx: OnboardingContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.EMPLOYEE_UPDATE>,\n        ): OnboardingContextInterface => {\n          return {\n            ...ctx,\n            component: ProfileContextual,\n            employeeId: ev.payload.employeeId,\n            onboardingStatus: ev.payload.onboardingStatus,\n          }\n        },\n      ),\n    ),\n    transition(componentEvents.EMPLOYEE_ONBOARDING_DONE, 'final'),\n  ),\n  employeeProfile: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_PROFILE_DONE,\n      'compensation',\n      reduce(\n        (\n          ctx: OnboardingContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.EMPLOYEE_PROFILE_DONE>,\n        ): OnboardingContextInterface => ({\n          ...ctx,\n          component: CompensationContextual,\n          employeeId: ev.payload.uuid,\n          onboardingStatus: ev.payload.onboardingStatus,\n          startDate: ev.payload.startDate,\n        }),\n      ),\n    ),\n    cancelTransition('index'),\n  ),\n  compensation: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_COMPENSATION_DONE,\n      'federalTaxes',\n      reduce(createReducer({ component: FederalTaxesContextual })),\n      guard(selfOnboardingGuard),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_COMPENSATION_DONE,\n      'deductions',\n      reduce(createReducer({ component: DeductionsContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  federalTaxes: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_FEDERAL_TAXES_DONE,\n      'stateTaxes',\n      reduce(createReducer({ component: StateTaxesContextual })),\n      guard(selfOnboardingGuard),\n    ),\n    cancelTransition('index'),\n  ),\n  stateTaxes: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_STATE_TAXES_DONE,\n      'paymentMethod',\n      reduce(createReducer({ component: PaymentMethodContextual })),\n      guard(selfOnboardingGuard),\n    ),\n    cancelTransition('index'),\n  ),\n  paymentMethod: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_PAYMENT_METHOD_DONE,\n      'deductions',\n      reduce(createReducer({ component: DeductionsContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  deductions: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_DONE,\n      'employeeDocuments',\n      reduce(createReducer({ component: EmployeeDocumentsContextual })),\n      guard(employeeDocumentsGuard),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_DONE,\n      'summary',\n      reduce(createReducer({ component: OnboardingSummaryContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  employeeDocuments: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DOCUMENTS_DONE,\n      'summary',\n      reduce(createReducer({ component: OnboardingSummaryContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  summary: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEES_LIST,\n      'index',\n      reduce(createReducer({ component: EmployeeListContextual, employeeId: undefined })),\n    ),\n  ),\n  final: state<MachineTransition>(),\n}\n"],"names":["createReducer","props","ctx","cancelTransition","target","component","transition","componentEvents","reduce","EmployeeListContextual","employeeDocumentsConfigCompletedStatuses","EmployeeOnboardingStatus","employeeDocumentsGuard","selfOnboardingGuard","EmployeeSelfOnboardingStatuses","employeeOnboardingMachine","state","ProfileContextual","ev","CompensationContextual","FederalTaxesContextual","guard","DeductionsContextual","StateTaxesContextual","PaymentMethodContextual","EmployeeDocumentsContextual","OnboardingSummaryContextual"],"mappings":"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"}
+{"version":3,"file":"onboardingStateMachine.js","sources":["../../../../src/components/Employee/OnboardingFlow/onboardingStateMachine.ts"],"sourcesContent":["import { transition, reduce, state, guard } from 'robot3'\nimport {\n  FederalTaxesContextual,\n  StateTaxesContextual,\n  type OnboardingContextInterface,\n  EmployeeListContextual,\n} from './OnboardingFlowComponents'\nimport {\n  componentEvents,\n  EmployeeSelfOnboardingStatuses,\n  EmployeeOnboardingStatus,\n} from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\nimport { CompensationContextual } from '@/components/Employee/Compensation'\nimport { DeductionsContextual } from '@/components/Employee/OnboardingFlow/OnboardingFlowComponents'\nimport { EmployeeDocumentsContextual } from '@/components/Employee/Documents/onboarding/EmployeeDocuments'\nimport { PaymentMethodContextual } from '@/components/Employee/PaymentMethod'\nimport { ProfileContextual } from '@/components/Employee/Profile/onboarding/Profile'\nimport { OnboardingSummaryContextual } from '@/components/Employee/OnboardingSummary'\n\ntype EventPayloads = {\n  [componentEvents.EMPLOYEE_UPDATE]: {\n    employeeId: string\n    onboardingStatus: (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n  }\n  [componentEvents.EMPLOYEE_PROFILE_DONE]: {\n    uuid: string\n    onboardingStatus: (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n    startDate: string\n  }\n}\n\nconst createReducer = (props: Partial<OnboardingContextInterface>) => {\n  return (ctx: OnboardingContextInterface): OnboardingContextInterface => ({\n    ...ctx,\n    ...props,\n  })\n}\n\nconst cancelTransition = (target: string, component?: React.ComponentType) =>\n  transition(\n    componentEvents.CANCEL,\n    target,\n    reduce(createReducer({ component: component ?? EmployeeListContextual })),\n  )\n\nconst employeeDocumentsConfigCompletedStatuses: Set<\n  (typeof EmployeeOnboardingStatus)[keyof typeof EmployeeOnboardingStatus]\n> = new Set([\n  EmployeeOnboardingStatus.SELF_ONBOARDING_COMPLETED_BY_EMPLOYEE,\n  EmployeeOnboardingStatus.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW,\n  EmployeeOnboardingStatus.ONBOARDING_COMPLETED,\n])\n\nconst employeeDocumentsGuard = (ctx: OnboardingContextInterface) => {\n  if (!ctx.withEmployeeI9) return false\n  if (ctx.onboardingStatus && employeeDocumentsConfigCompletedStatuses.has(ctx.onboardingStatus))\n    return false\n  return true\n}\n\nconst selfOnboardingGuard = (ctx: OnboardingContextInterface) =>\n  ctx.onboardingStatus\n    ? !(\n        // prettier-ignore\n        // @ts-expect-error: onboarding_status during runtime can be one of self onboarding statuses\n        (EmployeeSelfOnboardingStatuses.has(ctx.onboardingStatus) ||\n        ctx.onboardingStatus === EmployeeOnboardingStatus.SELF_ONBOARDING_PENDING_INVITE)\n      )\n    : true\n\nexport const employeeOnboardingMachine = {\n  index: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_CREATE,\n      'employeeProfile',\n      reduce(createReducer({ component: ProfileContextual, employeeId: undefined })),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_UPDATE,\n      'employeeProfile',\n\n      reduce(\n        (\n          ctx: OnboardingContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.EMPLOYEE_UPDATE>,\n        ): OnboardingContextInterface => {\n          return {\n            ...ctx,\n            component: ProfileContextual,\n            employeeId: ev.payload.employeeId,\n            onboardingStatus: ev.payload.onboardingStatus,\n          }\n        },\n      ),\n    ),\n    transition(componentEvents.EMPLOYEE_ONBOARDING_DONE, 'final'),\n  ),\n  employeeProfile: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_PROFILE_DONE,\n      'compensation',\n      reduce(\n        (\n          ctx: OnboardingContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.EMPLOYEE_PROFILE_DONE>,\n        ): OnboardingContextInterface => ({\n          ...ctx,\n          component: CompensationContextual,\n          employeeId: ev.payload.uuid,\n          onboardingStatus: ev.payload.onboardingStatus,\n          startDate: ev.payload.startDate,\n        }),\n      ),\n    ),\n    cancelTransition('index'),\n  ),\n  compensation: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_COMPENSATION_DONE,\n      'federalTaxes',\n      reduce(createReducer({ component: FederalTaxesContextual })),\n      guard(selfOnboardingGuard),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_COMPENSATION_DONE,\n      'deductions',\n      reduce(createReducer({ component: DeductionsContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  federalTaxes: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_FEDERAL_TAXES_DONE,\n      'stateTaxes',\n      reduce(createReducer({ component: StateTaxesContextual })),\n      guard(selfOnboardingGuard),\n    ),\n    cancelTransition('index'),\n  ),\n  stateTaxes: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_STATE_TAXES_DONE,\n      'paymentMethod',\n      reduce(createReducer({ component: PaymentMethodContextual })),\n      guard(selfOnboardingGuard),\n    ),\n    cancelTransition('index'),\n  ),\n  paymentMethod: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_PAYMENT_METHOD_DONE,\n      'deductions',\n      reduce(createReducer({ component: DeductionsContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  deductions: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_DONE,\n      'employeeDocuments',\n      reduce(createReducer({ component: EmployeeDocumentsContextual })),\n      guard(employeeDocumentsGuard),\n    ),\n    transition(\n      componentEvents.EMPLOYEE_DEDUCTION_DONE,\n      'summary',\n      reduce(createReducer({ component: OnboardingSummaryContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  employeeDocuments: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEE_DOCUMENTS_DONE,\n      'summary',\n      reduce(createReducer({ component: OnboardingSummaryContextual })),\n    ),\n    cancelTransition('index'),\n  ),\n  summary: state<MachineTransition>(\n    transition(\n      componentEvents.EMPLOYEES_LIST,\n      'index',\n      reduce(createReducer({ component: EmployeeListContextual, employeeId: undefined })),\n    ),\n  ),\n  final: state<MachineTransition>(),\n}\n"],"names":["createReducer","props","ctx","cancelTransition","target","component","transition","componentEvents","reduce","EmployeeListContextual","employeeDocumentsConfigCompletedStatuses","EmployeeOnboardingStatus","employeeDocumentsGuard","selfOnboardingGuard","EmployeeSelfOnboardingStatuses","employeeOnboardingMachine","state","ProfileContextual","ev","CompensationContextual","FederalTaxesContextual","guard","DeductionsContextual","StateTaxesContextual","PaymentMethodContextual","EmployeeDocumentsContextual","OnboardingSummaryContextual"],"mappings":"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"}

package/dist/components/Employee/OnboardingSummary/OnboardingSummary.js

@@ -1,16 +1,16 @@
-import { jsx as e, jsxs as s, Fragment as g } from "react/jsx-runtime";
-import { useTranslation as b } from "react-i18next";
+import { jsx as e, jsxs as s, Fragment as v } from "react/jsx-runtime";
+import { useTranslation as O } from "react-i18next";
 import A from "classnames";
 import { useEmployeesGetSuspense as B } from "@gusto/embedded-api/react-query/employeesGet";
 import { useEmployeesGetOnboardingStatusSuspense as L } from "@gusto/embedded-api/react-query/employeesGetOnboardingStatus";
-import y from "dompurify";
-import { useMemo as S } from "react";
+import f from "dompurify";
+import { useMemo as y } from "react";
 import r from "./OnboardingSummary.module.scss.js";
 import { BaseComponent as P } from "../../Base/Base.js";
 import { useBase as R } from "../../Base/useBase.js";
-import { Flex as d } from "../../Common/Flex/Flex.js";
-import { componentEvents as E, EmployeeOnboardingStatus as N } from "../../../shared/constants.js";
-import { ActionsLayout as O } from "../../Common/ActionsLayout/ActionsLayout.js";
+import { Flex as m } from "../../Common/Flex/Flex.js";
+import { componentEvents as S, EmployeeOnboardingStatus as E } from "../../../shared/constants.js";
+import { ActionsLayout as N } from "../../Common/ActionsLayout/ActionsLayout.js";
 import { useComponentContext as T } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as _, useComponentDictionary as w } from "../../../i18n/I18n.js";
 import F from "../../../assets/icons/success_check.svg.js";
@@ -19,21 +19,21 @@ import { useFlow as M } from "../../Flow/useFlow.js";
 function j(n) {
   return _("Employee.OnboardingSummary"), w("Employee.OnboardingSummary", n.dictionary), /* @__PURE__ */ e(P, { ...n, children: /* @__PURE__ */ e(k, { ...n, children: n.children }) });
 }
-const k = ({ employeeId: n, className: c, isAdmin: m = !1 }) => {
-  const { onEvent: a } = R(), { t } = b("Employee.OnboardingSummary"), o = T(), {
+const k = ({ employeeId: n, className: l, isAdmin: a = !1 }) => {
+  const { onEvent: c } = R(), { t } = O("Employee.OnboardingSummary"), o = T(), {
     data: { employee: x }
-  } = B({ employeeId: n }), { firstName: u, lastName: p } = x, { data: C } = L({ employeeId: n }), { onboardingStatus: h, onboardingSteps: l } = C.employeeOnboardingStatus, I = l?.length && l.findIndex((i) => i.required && !i.completed) > -1, f = h === N.ONBOARDING_COMPLETED || !I && h === N.SELF_ONBOARDING_PENDING_INVITE, D = S(() => y.sanitize(u), [u]), v = S(() => y.sanitize(p), [p]);
-  return /* @__PURE__ */ e("section", { className: c, children: /* @__PURE__ */ s(d, { flexDirection: "column", gap: 32, children: [
-    /* @__PURE__ */ e(d, { alignItems: "center", flexDirection: "column", gap: 8, children: m ? f ? /* @__PURE__ */ s(g, { children: [
+  } = B({ employeeId: n }), { firstName: p, lastName: u } = x, { data: I } = L({ employeeId: n }), { onboardingStatus: g, onboardingSteps: d } = I.employeeOnboardingStatus, b = d?.length && d.findIndex((i) => i.required && !i.completed) > -1, h = g === E.ONBOARDING_COMPLETED || !b && g === E.SELF_ONBOARDING_PENDING_INVITE, C = y(() => f.sanitize(p), [p]), D = y(() => f.sanitize(u), [u]);
+  return /* @__PURE__ */ e("section", { className: l, children: /* @__PURE__ */ s(m, { flexDirection: "column", gap: 20, children: [
+    /* @__PURE__ */ e(m, { alignItems: "center", flexDirection: "column", gap: 8, children: a ? h ? /* @__PURE__ */ s(m, { flexDirection: "column", gap: 4, alignItems: "center", children: [
       /* @__PURE__ */ e(o.Heading, { as: "h2", textAlign: "center", children: t("onboardedAdminSubtitle", {
-        name: `${D} ${v}`,
+        name: `${C} ${D}`,
         interpolation: { escapeValue: !1 }
       }) }),
-      /* @__PURE__ */ e(o.Text, { className: r.description, children: t("onboardedAdminDescription") })
-    ] }) : /* @__PURE__ */ s(d, { flexDirection: "column", alignItems: "flex-start", gap: 8, children: [
+      /* @__PURE__ */ e(o.Text, { variant: "supporting", className: r.description, children: t("onboardedAdminDescription") })
+    ] }) : /* @__PURE__ */ s(m, { flexDirection: "column", alignItems: "flex-start", gap: 8, children: [
       /* @__PURE__ */ e(o.Heading, { as: "h2", children: t("missingRequirementsSubtitle") }),
       /* @__PURE__ */ e(o.Text, { children: t("missingRequirementsDescription") }),
-      /* @__PURE__ */ e("ul", { className: r.list, children: l?.sort((i, q) => i.completed ? -1 : 1).map((i) => /* @__PURE__ */ s("li", { className: r.listItem, children: [
+      /* @__PURE__ */ e("ul", { className: r.list, children: d?.sort((i, q) => i.completed ? -1 : 1).map((i) => /* @__PURE__ */ s("li", { className: r.listItem, children: [
         i.completed ? /* @__PURE__ */ e(F, { width: 24, height: 24, className: r.listItemIcon }) : /* @__PURE__ */ e(
           G,
           {
@@ -44,42 +44,44 @@ const k = ({ employeeId: n, className: c, isAdmin: m = !1 }) => {
         ),
         /* @__PURE__ */ e(o.Heading, { as: "h4", children: t(`steps.${i.id}`, i.title) })
       ] }, i.id)) })
-    ] }) : /* @__PURE__ */ s(g, { children: [
-      /* @__PURE__ */ e(o.Heading, { as: "h2", textAlign: "center", children: t("onboardedSelfSubtitle") }),
-      /* @__PURE__ */ e(o.Text, { className: r.description, children: t("onboardedSelfDescription") }),
-      /* @__PURE__ */ e(O, { justifyContent: f ? "center" : "start", children: /* @__PURE__ */ e(
+    ] }) : /* @__PURE__ */ e(v, { children: /* @__PURE__ */ s(m, { flexDirection: "column", gap: 20, alignItems: "center", children: [
+      /* @__PURE__ */ s(m, { flexDirection: "column", gap: 4, alignItems: "center", children: [
+        /* @__PURE__ */ e(o.Heading, { as: "h2", textAlign: "center", children: t("onboardedSelfSubtitle") }),
+        /* @__PURE__ */ e(o.Text, { variant: "supporting", className: r.description, children: t("onboardedSelfDescription") })
+      ] }),
+      /* @__PURE__ */ e(N, { justifyContent: h ? "center" : "start", children: /* @__PURE__ */ e(
         o.Button,
         {
           variant: "secondary",
           onClick: () => {
-            a(E.EMPLOYEE_ONBOARDING_DONE);
+            c(S.EMPLOYEE_ONBOARDING_DONE);
           },
           children: t("doneCta")
         }
       ) })
-    ] }) }),
-    m && /* @__PURE__ */ e(O, { justifyContent: "center", children: /* @__PURE__ */ e(
+    ] }) }) }),
+    a && /* @__PURE__ */ e(N, { justifyContent: "center", children: /* @__PURE__ */ e(
       o.Button,
       {
         variant: "secondary",
         onClick: () => {
-          a(E.EMPLOYEES_LIST);
+          c(S.EMPLOYEES_LIST);
         },
         children: t("doneCta")
       }
     ) })
   ] }) });
 }, se = () => {
-  const { employeeId: n, onEvent: c, isAdmin: m } = M(), { t: a } = b("common");
+  const { employeeId: n, onEvent: l, isAdmin: a } = M(), { t: c } = O("common");
   if (!n)
     throw new Error(
-      a("errors.missingParamsOrContext", {
+      c("errors.missingParamsOrContext", {
         component: "Summary",
         param: "employeeId",
         provider: "FlowProvider"
       })
     );
-  return /* @__PURE__ */ e(j, { employeeId: n, onEvent: c, isAdmin: m });
+  return /* @__PURE__ */ e(j, { employeeId: n, onEvent: l, isAdmin: a });
 };
 export {
   j as OnboardingSummary,

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

@@ -1 +1 @@
-{"version":3,"file":"OnboardingSummary.js","sources":["../../../../src/components/Employee/OnboardingSummary/OnboardingSummary.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport { useEmployeesGetOnboardingStatusSuspense } from '@gusto/embedded-api/react-query/employeesGetOnboardingStatus'\nimport DOMPurify from 'dompurify'\nimport { useMemo } from 'react'\nimport type { OnboardingContextInterface } from '../OnboardingFlow/OnboardingFlowComponents'\nimport styles from './OnboardingSummary.module.scss'\nimport {\n  BaseComponent,\n  useBase,\n  type BaseComponentInterface,\n  type CommonComponentInterface,\n} from '@/components/Base'\nimport { Flex, ActionsLayout } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, EmployeeOnboardingStatus } from '@/shared/constants'\nimport SuccessCheck from '@/assets/icons/success_check.svg?react'\nimport UncheckedCircular from '@/assets/icons/unchecked_circular.svg?react'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport { useComponentDictionary } from '@/i18n/I18n'\n\ninterface SummaryProps extends CommonComponentInterface<'Employee.OnboardingSummary'> {\n  employeeId: string\n  isAdmin?: boolean\n}\n\nexport function OnboardingSummary(props: SummaryProps & BaseComponentInterface) {\n  useI18n('Employee.OnboardingSummary')\n  useComponentDictionary('Employee.OnboardingSummary', props.dictionary)\n\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ employeeId, className, isAdmin = false }: SummaryProps) => {\n  const { onEvent } = useBase()\n  const { t } = useTranslation('Employee.OnboardingSummary')\n  const Components = useComponentContext()\n\n  const {\n    data: { employee },\n  } = useEmployeesGetSuspense({ employeeId })\n  const { firstName, lastName } = employee!\n\n  const { data } = useEmployeesGetOnboardingStatusSuspense({ employeeId })\n  const { onboardingStatus, onboardingSteps } = data.employeeOnboardingStatus!\n\n  const hasMissingRequirements =\n    onboardingSteps?.length &&\n    onboardingSteps.findIndex(step => step.required && !step.completed) > -1\n\n  const isOnboardingCompleted =\n    onboardingStatus === EmployeeOnboardingStatus.ONBOARDING_COMPLETED ||\n    (!hasMissingRequirements &&\n      onboardingStatus === EmployeeOnboardingStatus.SELF_ONBOARDING_PENDING_INVITE)\n\n  const sanitizedFirstName = useMemo(() => DOMPurify.sanitize(firstName), [firstName])\n  const sanitizedLastName = useMemo(() => DOMPurify.sanitize(lastName), [lastName])\n\n  return (\n    <section className={className}>\n      <Flex flexDirection=\"column\" gap={32}>\n        <Flex alignItems=\"center\" flexDirection=\"column\" gap={8}>\n          {isAdmin ? (\n            isOnboardingCompleted ? (\n              <>\n                <Components.Heading as=\"h2\" textAlign=\"center\">\n                  {t('onboardedAdminSubtitle', {\n                    name: `${sanitizedFirstName} ${sanitizedLastName}`,\n                    interpolation: { escapeValue: false },\n                  })}\n                </Components.Heading>\n                <Components.Text className={styles.description}>\n                  {t('onboardedAdminDescription')}\n                </Components.Text>\n              </>\n            ) : (\n              <Flex flexDirection=\"column\" alignItems=\"flex-start\" gap={8}>\n                <Components.Heading as=\"h2\">{t('missingRequirementsSubtitle')}</Components.Heading>\n                <Components.Text>{t('missingRequirementsDescription')}</Components.Text>\n                <ul className={styles.list}>\n                  {onboardingSteps\n                    ?.sort((a, b) => (a.completed ? -1 : 1))\n                    .map(step => {\n                      return (\n                        <li key={step.id} className={styles.listItem}>\n                          {step.completed ? (\n                            <SuccessCheck width={24} height={24} className={styles.listItemIcon} />\n                          ) : (\n                            <UncheckedCircular\n                              width={24}\n                              height={24}\n                              className={classNames(styles.listItemIcon, styles.incomplete)}\n                            />\n                          )}\n                          <Components.Heading as=\"h4\">\n                            {/* @ts-expect-error: id has typeof keyof steps */}\n                            {t(`steps.${step.id}`, step.title)}\n                          </Components.Heading>\n                        </li>\n                      )\n                    })}\n                </ul>\n              </Flex>\n            )\n          ) : (\n            <>\n              <Components.Heading as=\"h2\" textAlign=\"center\">\n                {t('onboardedSelfSubtitle')}\n              </Components.Heading>\n              <Components.Text className={styles.description}>\n                {t('onboardedSelfDescription')}\n              </Components.Text>\n              <ActionsLayout justifyContent={isOnboardingCompleted ? 'center' : 'start'}>\n                <Components.Button\n                  variant=\"secondary\"\n                  onClick={() => {\n                    onEvent(componentEvents.EMPLOYEE_ONBOARDING_DONE)\n                  }}\n                >\n                  {t('doneCta')}\n                </Components.Button>\n              </ActionsLayout>\n            </>\n          )}\n        </Flex>\n\n        {isAdmin && (\n          <ActionsLayout justifyContent={'center'}>\n            <Components.Button\n              variant=\"secondary\"\n              onClick={() => {\n                onEvent(componentEvents.EMPLOYEES_LIST)\n              }}\n            >\n              {t('doneCta')}\n            </Components.Button>\n          </ActionsLayout>\n        )}\n      </Flex>\n    </section>\n  )\n}\n\nexport const OnboardingSummaryContextual = () => {\n  const { employeeId, onEvent, isAdmin } = useFlow<OnboardingContextInterface>()\n  const { t } = useTranslation('common')\n\n  if (!employeeId) {\n    throw new Error(\n      t('errors.missingParamsOrContext', {\n        component: 'Summary',\n        param: 'employeeId',\n        provider: 'FlowProvider',\n      }),\n    )\n  }\n  return <OnboardingSummary employeeId={employeeId} onEvent={onEvent} isAdmin={isAdmin} />\n}\n"],"names":["OnboardingSummary","props","useI18n","useComponentDictionary","jsx","BaseComponent","Root","employeeId","className","isAdmin","onEvent","useBase","useTranslation","Components","useComponentContext","employee","useEmployeesGetSuspense","firstName","lastName","data","useEmployeesGetOnboardingStatusSuspense","onboardingStatus","onboardingSteps","hasMissingRequirements","step","isOnboardingCompleted","EmployeeOnboardingStatus","sanitizedFirstName","useMemo","DOMPurify","sanitizedLastName","jsxs","Flex","Fragment","styles","a","b","SuccessCheck","UncheckedCircular","classNames","ActionsLayout","componentEvents","OnboardingSummaryContextual","useFlow","t"],"mappings":"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"}
+{"version":3,"file":"OnboardingSummary.js","sources":["../../../../src/components/Employee/OnboardingSummary/OnboardingSummary.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { useEmployeesGetSuspense } from '@gusto/embedded-api/react-query/employeesGet'\nimport { useEmployeesGetOnboardingStatusSuspense } from '@gusto/embedded-api/react-query/employeesGetOnboardingStatus'\nimport DOMPurify from 'dompurify'\nimport { useMemo } from 'react'\nimport type { OnboardingContextInterface } from '../OnboardingFlow/OnboardingFlowComponents'\nimport styles from './OnboardingSummary.module.scss'\nimport {\n  BaseComponent,\n  useBase,\n  type BaseComponentInterface,\n  type CommonComponentInterface,\n} from '@/components/Base'\nimport { Flex, ActionsLayout } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, EmployeeOnboardingStatus } from '@/shared/constants'\nimport SuccessCheck from '@/assets/icons/success_check.svg?react'\nimport UncheckedCircular from '@/assets/icons/unchecked_circular.svg?react'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport { useComponentDictionary } from '@/i18n/I18n'\n\ninterface SummaryProps extends CommonComponentInterface<'Employee.OnboardingSummary'> {\n  employeeId: string\n  isAdmin?: boolean\n}\n\nexport function OnboardingSummary(props: SummaryProps & BaseComponentInterface) {\n  useI18n('Employee.OnboardingSummary')\n  useComponentDictionary('Employee.OnboardingSummary', props.dictionary)\n\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ employeeId, className, isAdmin = false }: SummaryProps) => {\n  const { onEvent } = useBase()\n  const { t } = useTranslation('Employee.OnboardingSummary')\n  const Components = useComponentContext()\n\n  const {\n    data: { employee },\n  } = useEmployeesGetSuspense({ employeeId })\n  const { firstName, lastName } = employee!\n\n  const { data } = useEmployeesGetOnboardingStatusSuspense({ employeeId })\n  const { onboardingStatus, onboardingSteps } = data.employeeOnboardingStatus!\n\n  const hasMissingRequirements =\n    onboardingSteps?.length &&\n    onboardingSteps.findIndex(step => step.required && !step.completed) > -1\n\n  const isOnboardingCompleted =\n    onboardingStatus === EmployeeOnboardingStatus.ONBOARDING_COMPLETED ||\n    (!hasMissingRequirements &&\n      onboardingStatus === EmployeeOnboardingStatus.SELF_ONBOARDING_PENDING_INVITE)\n\n  const sanitizedFirstName = useMemo(() => DOMPurify.sanitize(firstName), [firstName])\n  const sanitizedLastName = useMemo(() => DOMPurify.sanitize(lastName), [lastName])\n\n  return (\n    <section className={className}>\n      <Flex flexDirection=\"column\" gap={20}>\n        <Flex alignItems=\"center\" flexDirection=\"column\" gap={8}>\n          {isAdmin ? (\n            isOnboardingCompleted ? (\n              <Flex flexDirection=\"column\" gap={4} alignItems=\"center\">\n                <Components.Heading as=\"h2\" textAlign=\"center\">\n                  {t('onboardedAdminSubtitle', {\n                    name: `${sanitizedFirstName} ${sanitizedLastName}`,\n                    interpolation: { escapeValue: false },\n                  })}\n                </Components.Heading>\n                <Components.Text variant=\"supporting\" className={styles.description}>\n                  {t('onboardedAdminDescription')}\n                </Components.Text>\n              </Flex>\n            ) : (\n              <Flex flexDirection=\"column\" alignItems=\"flex-start\" gap={8}>\n                <Components.Heading as=\"h2\">{t('missingRequirementsSubtitle')}</Components.Heading>\n                <Components.Text>{t('missingRequirementsDescription')}</Components.Text>\n                <ul className={styles.list}>\n                  {onboardingSteps\n                    ?.sort((a, b) => (a.completed ? -1 : 1))\n                    .map(step => {\n                      return (\n                        <li key={step.id} className={styles.listItem}>\n                          {step.completed ? (\n                            <SuccessCheck width={24} height={24} className={styles.listItemIcon} />\n                          ) : (\n                            <UncheckedCircular\n                              width={24}\n                              height={24}\n                              className={classNames(styles.listItemIcon, styles.incomplete)}\n                            />\n                          )}\n                          <Components.Heading as=\"h4\">\n                            {/* @ts-expect-error: id has typeof keyof steps */}\n                            {t(`steps.${step.id}`, step.title)}\n                          </Components.Heading>\n                        </li>\n                      )\n                    })}\n                </ul>\n              </Flex>\n            )\n          ) : (\n            <>\n              <Flex flexDirection=\"column\" gap={20} alignItems=\"center\">\n                <Flex flexDirection=\"column\" gap={4} alignItems=\"center\">\n                  <Components.Heading as=\"h2\" textAlign=\"center\">\n                    {t('onboardedSelfSubtitle')}\n                  </Components.Heading>\n                  <Components.Text variant=\"supporting\" className={styles.description}>\n                    {t('onboardedSelfDescription')}\n                  </Components.Text>\n                </Flex>\n                <ActionsLayout justifyContent={isOnboardingCompleted ? 'center' : 'start'}>\n                  <Components.Button\n                    variant=\"secondary\"\n                    onClick={() => {\n                      onEvent(componentEvents.EMPLOYEE_ONBOARDING_DONE)\n                    }}\n                  >\n                    {t('doneCta')}\n                  </Components.Button>\n                </ActionsLayout>\n              </Flex>\n            </>\n          )}\n        </Flex>\n\n        {isAdmin && (\n          <ActionsLayout justifyContent={'center'}>\n            <Components.Button\n              variant=\"secondary\"\n              onClick={() => {\n                onEvent(componentEvents.EMPLOYEES_LIST)\n              }}\n            >\n              {t('doneCta')}\n            </Components.Button>\n          </ActionsLayout>\n        )}\n      </Flex>\n    </section>\n  )\n}\n\nexport const OnboardingSummaryContextual = () => {\n  const { employeeId, onEvent, isAdmin } = useFlow<OnboardingContextInterface>()\n  const { t } = useTranslation('common')\n\n  if (!employeeId) {\n    throw new Error(\n      t('errors.missingParamsOrContext', {\n        component: 'Summary',\n        param: 'employeeId',\n        provider: 'FlowProvider',\n      }),\n    )\n  }\n  return <OnboardingSummary employeeId={employeeId} onEvent={onEvent} isAdmin={isAdmin} />\n}\n"],"names":["OnboardingSummary","props","useI18n","useComponentDictionary","jsx","BaseComponent","Root","employeeId","className","isAdmin","onEvent","useBase","useTranslation","Components","useComponentContext","employee","useEmployeesGetSuspense","firstName","lastName","data","useEmployeesGetOnboardingStatusSuspense","onboardingStatus","onboardingSteps","hasMissingRequirements","step","isOnboardingCompleted","EmployeeOnboardingStatus","sanitizedFirstName","useMemo","DOMPurify","sanitizedLastName","jsxs","Flex","styles","a","b","SuccessCheck","UncheckedCircular","classNames","ActionsLayout","componentEvents","OnboardingSummaryContextual","useFlow","t"],"mappings":"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"}

package/dist/components/Employee/PaymentMethod/index.d.ts

@@ -1,2 +1,2 @@
 import "./types/i18next.d.ts"
-export * from './PaymentMethod';
+export * from './onboarding';

package/dist/components/Employee/PaymentMethod/management/ListView.d.ts

@@ -0,0 +1,8 @@
+import { EventType } from '../../../../shared/constants';
+import { OnEventType } from '../../../Base/useBase';
+interface ListViewProps {
+    employeeId: string;
+    onEvent: OnEventType<EventType, unknown>;
+}
+export declare function ListView({ employeeId, onEvent }: ListViewProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,138 @@
+import { jsx as e, jsxs as a, Fragment as T } from "react/jsx-runtime";
+import { useTranslation as y } from "react-i18next";
+import { usePaymentMethodList as k } from "../shared/usePaymentMethodList.js";
+import { useDeleteBankAccount as P } from "../shared/useDeleteBankAccount.js";
+import { DeleteBankAccountDialog as x } from "../shared/DeleteBankAccountDialog.js";
+import { Flex as s } from "../../../Common/Flex/Flex.js";
+import "classnames";
+import { PAYMENT_METHODS as B, componentEvents as d } from "../../../../shared/constants.js";
+import { BaseLayout as C } from "../../../Base/Base.js";
+import { composeErrorHandler as N } from "../../../../partner-hook-utils/composeErrorHandler.js";
+import { useComponentContext as M } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import _ from "../../../../assets/icons/plus-circle.svg.js";
+import v from "../../../../assets/icons/percent-circle.svg.js";
+import w from "../../../../assets/icons/trashcan.svg.js";
+import { HamburgerMenu as S } from "../../../Common/HamburgerMenu/HamburgerMenu.js";
+import { useDataView as H } from "../../../Common/DataView/useDataView.js";
+import { DataView as O } from "../../../Common/DataView/DataView.js";
+function te({ employeeId: r, onEvent: i }) {
+  const c = k({ employeeId: r }), l = N([c]);
+  return c.isLoading ? /* @__PURE__ */ e(C, { isLoading: !0, error: l.errors }) : /* @__PURE__ */ e(
+    V,
+    {
+      employeeId: r,
+      onEvent: i,
+      paymentMethodList: c,
+      errorHandling: l
+    }
+  );
+}
+function V({ onEvent: r, paymentMethodList: i, errorHandling: c }) {
+  const { paymentMethod: l, bankAccounts: u } = i.data, { deletePendingBankAccountUuid: f } = i.status, { t } = y("Employee.PaymentMethod"), n = M(), {
+    pendingDeleteAccount: p,
+    setPendingDeleteAccount: h,
+    deletedAccountNumber: g,
+    setDeletedAccountNumber: D,
+    handleConfirmDelete: b
+  } = P(async (o) => {
+    const A = await i.actions.onDelete(o);
+    A && r(d.EMPLOYEE_BANK_ACCOUNT_DELETED, A.data);
+  }), { ...E } = H({
+    data: u,
+    columns: [
+      {
+        key: "name",
+        title: t("nicknameColumn"),
+        render: (o) => /* @__PURE__ */ a(s, { flexDirection: "column", gap: 0, children: [
+          /* @__PURE__ */ e(n.Text, { children: o.name }),
+          /* @__PURE__ */ e(n.Text, { variant: "supporting", children: o.hiddenAccountNumber })
+        ] })
+      },
+      { key: "routingNumber", title: t("routingNumberColumn") },
+      { key: "accountType", title: t("accountTypeColumn") }
+    ],
+    itemMenu: (o) => /* @__PURE__ */ e(
+      S,
+      {
+        items: [
+          {
+            label: t("deleteBankAccountCta"),
+            onClick: () => {
+              h({
+                uuid: o.uuid,
+                hiddenAccountNumber: o.hiddenAccountNumber
+              });
+            },
+            icon: /* @__PURE__ */ e(w, { "aria-hidden": !0 })
+          }
+        ],
+        triggerLabel: t("hamburgerTitle")
+      }
+    )
+  }), m = l.type === B.directDeposit, L = /* @__PURE__ */ a(s, { gap: 8, alignItems: "center", children: [
+    m && u.length > 1 && /* @__PURE__ */ e(
+      n.Button,
+      {
+        variant: "secondary",
+        onClick: () => {
+          r(d.EMPLOYEE_SPLIT_PAYCHECK);
+        },
+        icon: /* @__PURE__ */ e(v, {}),
+        children: t("splitCta")
+      }
+    ),
+    /* @__PURE__ */ e(
+      n.Button,
+      {
+        variant: "secondary",
+        onClick: () => {
+          r(d.EMPLOYEE_BANK_ACCOUNT_CREATE);
+        },
+        icon: /* @__PURE__ */ e(_, {}),
+        children: u.length > 0 ? t("addAnotherCta") : t("addBankAccountCta")
+      }
+    )
+  ] });
+  return /* @__PURE__ */ a(T, { children: [
+    /* @__PURE__ */ e(C, { error: c.errors, children: /* @__PURE__ */ a(
+      n.Box,
+      {
+        header: /* @__PURE__ */ e(n.BoxHeader, { title: t("managementTitle"), action: L }),
+        children: [
+          g !== null && /* @__PURE__ */ e(
+            n.Alert,
+            {
+              status: "success",
+              label: t("deleteBankAccountSuccessAlert", { account: g }),
+              onDismiss: () => {
+                D(null);
+              },
+              disableScrollIntoView: !0
+            }
+          ),
+          m && u.length > 0 ? /* @__PURE__ */ e(O, { label: t("bankAccountsListLabel"), ...E }) : /* @__PURE__ */ a(s, { flexDirection: "column", gap: 0, children: [
+            /* @__PURE__ */ e(n.Text, { variant: "supporting", children: t("paymentMethodLabel") }),
+            /* @__PURE__ */ e(n.Text, { children: t(m ? "directDepositLabel" : "checkLabel") })
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ e(
+      x,
+      {
+        pendingDeleteAccount: p,
+        isPrimaryActionLoading: f === p?.uuid,
+        onClose: () => {
+          h(null);
+        },
+        onConfirm: () => {
+          b();
+        }
+      }
+    )
+  ] });
+}
+export {
+  te as ListView
+};
+//# sourceMappingURL=ListView.js.map