@gusto/embedded-react-sdk 0.55.8 → 0.56.1

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

@@ -1 +1 @@
-{"version":3,"file":"GrossUpModal.js","sources":["../../../../src/components/Payroll/GrossUpModal/GrossUpModal.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport type { GrossUpModalProps } from './GrossUpModalTypes'\nimport styles from './GrossUpModal.module.scss'\nimport { ActionsLayout, Flex, NumberInputField } from '@/components/Common'\nimport { useBase } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\n\nconst GrossUpFormSchema = z.object({\n  netPay: z.number().positive(),\n})\n\ntype GrossUpFormValues = z.infer<typeof GrossUpFormSchema>\n\n/** @internal */\nexport function GrossUpModal({ isOpen, onCalculateGrossUp, onApply, onCancel }: GrossUpModalProps) {\n  useI18n('Payroll.GrossUpModal')\n  const { t } = useTranslation('Payroll.GrossUpModal')\n  const { Modal, Heading, Text, Button, Alert } = useComponentContext()\n  const { baseSubmitHandler } = useBase()\n  const modalContainerRef = useRef<HTMLDivElement>(null)\n\n  const [calculatedGrossUp, setCalculatedGrossUp] = useState<string | null>(null)\n  const [errorMessage, setErrorMessage] = useState<string | null>(null)\n  const [isCalculating, setIsCalculating] = useState(false)\n  const [isApplying, setIsApplying] = useState(false)\n\n  const formHandlers = useForm<GrossUpFormValues>({\n    resolver: zodResolver(GrossUpFormSchema),\n    defaultValues: { netPay: 0 },\n  })\n\n  useEffect(() => {\n    if (!isOpen) {\n      formHandlers.reset({ netPay: 0 })\n      setCalculatedGrossUp(null)\n      setErrorMessage(null)\n    }\n  }, [isOpen, formHandlers.reset])\n\n  const handleCalculate = async (data: GrossUpFormValues) => {\n    setErrorMessage(null)\n    setCalculatedGrossUp(null)\n    setIsCalculating(true)\n\n    await baseSubmitHandler(null, async () => {\n      try {\n        const result = await onCalculateGrossUp(data.netPay)\n\n        if (result) {\n          setCalculatedGrossUp(result)\n        } else {\n          setErrorMessage(t('errorMessage'))\n        }\n      } finally {\n        setIsCalculating(false)\n      }\n    })\n  }\n\n  const handleApply = async () => {\n    if (calculatedGrossUp) {\n      setIsApplying(true)\n      await baseSubmitHandler(null, async () => {\n        try {\n          await onApply(calculatedGrossUp)\n        } finally {\n          setIsApplying(false)\n        }\n      })\n    }\n  }\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onClose={onCancel}\n      containerRef={modalContainerRef}\n      footer={\n        <ActionsLayout>\n          <Button\n            variant=\"primary\"\n            isDisabled={!calculatedGrossUp}\n            onClick={handleApply}\n            isLoading={isApplying}\n          >\n            {t('applyCta')}\n          </Button>\n          <Button variant=\"secondary\" onClick={onCancel}>\n            {t('cancelCta')}\n          </Button>\n        </ActionsLayout>\n      }\n    >\n      <FormProvider {...formHandlers}>\n        <div className={styles.header}>\n          <Heading as=\"h2\" styledAs=\"h3\">\n            {t('title')}\n          </Heading>\n          <Text variant=\"supporting\" as=\"p\">\n            {t('description')}\n          </Text>\n        </div>\n\n        <div className={styles.content}>\n          {errorMessage && (\n            <div className={styles.alert}>\n              <Alert label={errorMessage} status=\"error\" disableScrollIntoView />\n            </div>\n          )}\n\n          <div className={styles.alert}>\n            <Alert label={t('warning')} status=\"warning\" disableScrollIntoView />\n          </div>\n\n          <Flex flexDirection=\"row\" gap={8}>\n            <NumberInputField\n              name=\"netPay\"\n              label={t('netPayLabel')}\n              format=\"currency\"\n              errorMessage={t('validations.netPay')}\n              min={0}\n              isRequired\n            />\n            <Button\n              variant=\"secondary\"\n              className={styles.calculateButton}\n              isDisabled={isCalculating}\n              onClick={formHandlers.handleSubmit(handleCalculate)}\n            >\n              {isCalculating ? t('calculatingCta') : t('calculateCta')}\n            </Button>\n          </Flex>\n\n          {calculatedGrossUp && (\n            <>\n              <div className={styles.result}>\n                <Text size=\"sm\" variant=\"supporting\" weight=\"semibold\">\n                  {t('grossPayResult')}\n                </Text>\n                <Heading as=\"h3\">{formatNumberAsCurrency(parseFloat(calculatedGrossUp))}</Heading>\n              </div>\n            </>\n          )}\n        </div>\n      </FormProvider>\n    </Modal>\n  )\n}\n"],"names":["GrossUpFormSchema","z","GrossUpModal","isOpen","onCalculateGrossUp","onApply","onCancel","useI18n","t","useTranslation","Modal","Heading","Text","Button","Alert","useComponentContext","baseSubmitHandler","useBase","modalContainerRef","useRef","calculatedGrossUp","setCalculatedGrossUp","useState","errorMessage","setErrorMessage","isCalculating","setIsCalculating","isApplying","setIsApplying","formHandlers","useForm","zodResolver","useEffect","handleCalculate","data","result","jsx","ActionsLayout","jsxs","FormProvider","styles","Flex","NumberInputField","Fragment"],"mappings":"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"}
+{"version":3,"file":"GrossUpModal.js","sources":["../../../../src/components/Payroll/GrossUpModal/GrossUpModal.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport type { GrossUpModalProps } from './GrossUpModalTypes'\nimport styles from './GrossUpModal.module.scss'\nimport { ActionsLayout, Flex, NumberInputField } from '@/components/Common'\nimport { useBase } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\n\nconst GrossUpFormSchema = z.object({\n  netPay: z.number().positive(),\n})\n\ntype GrossUpFormValues = z.infer<typeof GrossUpFormSchema>\n\n/** @internal */\nexport function GrossUpModal({ isOpen, onCalculateGrossUp, onApply, onCancel }: GrossUpModalProps) {\n  useI18n('Payroll.GrossUpModal')\n  const { t } = useTranslation('Payroll.GrossUpModal')\n  const { Modal, Heading, Text, Button, Alert } = useComponentContext()\n  const { baseSubmitHandler } = useBase()\n  const modalContainerRef = useRef<HTMLDivElement>(null)\n\n  const [calculatedGrossUp, setCalculatedGrossUp] = useState<string | null>(null)\n  const [errorMessage, setErrorMessage] = useState<string | null>(null)\n  const [isCalculating, setIsCalculating] = useState(false)\n  const [isApplying, setIsApplying] = useState(false)\n\n  const formHandlers = useForm<GrossUpFormValues>({\n    resolver: zodResolver(GrossUpFormSchema),\n    // Start blank rather than 0: 0 is not a valid net amount, and a leading 0\n    // in the field means typing an amount produces values like \"0350\".\n    defaultValues: {},\n  })\n\n  useEffect(() => {\n    if (!isOpen) {\n      formHandlers.reset()\n      setCalculatedGrossUp(null)\n      setErrorMessage(null)\n    }\n  }, [isOpen, formHandlers.reset])\n\n  const handleCalculate = async (data: GrossUpFormValues) => {\n    setErrorMessage(null)\n    setCalculatedGrossUp(null)\n    setIsCalculating(true)\n\n    await baseSubmitHandler(null, async () => {\n      try {\n        const result = await onCalculateGrossUp(data.netPay)\n\n        if (result) {\n          setCalculatedGrossUp(result)\n        } else {\n          setErrorMessage(t('errorMessage'))\n        }\n      } finally {\n        setIsCalculating(false)\n      }\n    })\n  }\n\n  const handleApply = async () => {\n    if (calculatedGrossUp) {\n      setIsApplying(true)\n      await baseSubmitHandler(null, async () => {\n        try {\n          await onApply(calculatedGrossUp)\n        } finally {\n          setIsApplying(false)\n        }\n      })\n    }\n  }\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onClose={onCancel}\n      containerRef={modalContainerRef}\n      footer={\n        <ActionsLayout>\n          <Button\n            variant=\"primary\"\n            isDisabled={!calculatedGrossUp}\n            onClick={handleApply}\n            isLoading={isApplying}\n          >\n            {t('applyCta')}\n          </Button>\n          <Button variant=\"secondary\" onClick={onCancel}>\n            {t('cancelCta')}\n          </Button>\n        </ActionsLayout>\n      }\n    >\n      <FormProvider {...formHandlers}>\n        <div className={styles.header}>\n          <Heading as=\"h2\" styledAs=\"h3\">\n            {t('title')}\n          </Heading>\n          <Text variant=\"supporting\" as=\"p\">\n            {t('description')}\n          </Text>\n        </div>\n\n        <div className={styles.content}>\n          {errorMessage && (\n            <div className={styles.alert}>\n              <Alert label={errorMessage} status=\"error\" disableScrollIntoView />\n            </div>\n          )}\n\n          <div className={styles.alert}>\n            <Alert label={t('warning')} status=\"warning\" disableScrollIntoView />\n          </div>\n\n          {/* Bottom-align on the row itself: the .calculateButton align-self\n              rule below only targets the default (react-aria) adapter, so in\n              other adapters the button otherwise falls back to flex-start. */}\n          <Flex flexDirection=\"row\" gap={8} alignItems=\"flex-end\">\n            <NumberInputField\n              name=\"netPay\"\n              label={t('netPayLabel')}\n              format=\"currency\"\n              adornmentStart=\"$\"\n              errorMessage={t('validations.netPay')}\n              min={0}\n              isRequired\n            />\n            <Button\n              variant=\"secondary\"\n              className={styles.calculateButton}\n              isDisabled={isCalculating}\n              onClick={formHandlers.handleSubmit(handleCalculate)}\n            >\n              {isCalculating ? t('calculatingCta') : t('calculateCta')}\n            </Button>\n          </Flex>\n\n          {calculatedGrossUp ? (\n            <div className={styles.result}>\n              <Text size=\"sm\" variant=\"supporting\" weight=\"semibold\">\n                {t('grossPayResult')}\n              </Text>\n              <Heading as=\"h3\">{formatNumberAsCurrency(parseFloat(calculatedGrossUp))}</Heading>\n            </div>\n          ) : (\n            <Text size=\"sm\" variant=\"supporting\">\n              {t('applyHint')}\n            </Text>\n          )}\n        </div>\n      </FormProvider>\n    </Modal>\n  )\n}\n"],"names":["GrossUpFormSchema","z","GrossUpModal","isOpen","onCalculateGrossUp","onApply","onCancel","useI18n","t","useTranslation","Modal","Heading","Text","Button","Alert","useComponentContext","baseSubmitHandler","useBase","modalContainerRef","useRef","calculatedGrossUp","setCalculatedGrossUp","useState","errorMessage","setErrorMessage","isCalculating","setIsCalculating","isApplying","setIsApplying","formHandlers","useForm","zodResolver","useEffect","handleCalculate","data","result","jsx","ActionsLayout","jsxs","FormProvider","styles","Flex","NumberInputField"],"mappings":"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"}

package/dist/components/Payroll/OffCycle/OffCycleFlow.js.map

@@ -1 +1 @@
-{"version":3,"file":"OffCycleFlow.js","sources":["../../../../src/components/Payroll/OffCycle/OffCycleFlow.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { createMachine } from 'robot3'\nimport { offCycleMachine, offCycleBreadcrumbsNodes } from './offCycleStateMachine'\nimport {\n  OffCycleCreationContextual,\n  type OffCycleFlowContextInterface,\n  type OffCycleFlowProps,\n} from './OffCycleFlowComponents'\nimport { Flow } from '@/components/Flow/Flow'\nimport { buildBreadcrumbs } from '@/helpers/breadcrumbHelpers'\n\n/**\n * Guided flow to create and run a bonus or correction payroll.\n *\n * @remarks\n * Guides the user through configuring pay period dates, selecting a reason, choosing\n * employees, and setting deduction and tax withholding preferences, then transitions\n * into the standard payroll execution experience (configuration, overview, submission,\n * receipts). All off-cycle payroll types share the same execution steps as regular\n * payrolls — only the creation step differs.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `breadcrumb/navigate` | User navigates via the flow breadcrumb header | `{ key: string }` |\n * | `offCycle/created` | Off-cycle payroll has been created and the flow transitions to execution | `{ payrollUuid: string }` |\n *\n * Once the flow transitions to execution, all standard run-payroll events are emitted\n * (e.g. `runPayroll/calculated`, `runPayroll/submitted`, `runPayroll/processed`).\n *\n * @components\n * - {@link OffCycleCreation}\n * - {@link PayrollExecutionFlow}\n *\n * @param props - {@link OffCycleFlowProps}\n * @returns The rendered off-cycle payroll flow.\n * @public\n *\n * @example\n * ```tsx title=\"App.tsx\"\n * import { Payroll, type EventType } from '@gusto/embedded-react-sdk'\n *\n * function MyApp() {\n *   return (\n *     <Payroll.OffCycleFlow\n *       companyId=\"a007e1ab-3595-43c2-ab4b-af7a5af2e365\"\n *       onEvent={(eventType: EventType) => {\n *         if (eventType === 'runPayroll/submitted') {\n *           // Payroll submitted — navigate to your next screen\n *         }\n *       }}\n *     />\n *   )\n * }\n * ```\n */\nexport function OffCycleFlow({\n  companyId,\n  payrollType,\n  onEvent,\n  withReimbursements,\n}: OffCycleFlowProps) {\n  const offCycleFlowMachine = useMemo(\n    () =>\n      createMachine(\n        'createOffCyclePayroll',\n        offCycleMachine,\n        (initialContext: OffCycleFlowContextInterface) => ({\n          ...initialContext,\n          component: OffCycleCreationContextual,\n          companyId,\n          payrollType,\n          withReimbursements,\n          header: {\n            type: 'breadcrumbs' as const,\n            breadcrumbs: buildBreadcrumbs(offCycleBreadcrumbsNodes),\n            currentBreadcrumbId: 'createOffCyclePayroll',\n          },\n        }),\n      ),\n    [companyId, payrollType, withReimbursements],\n  )\n\n  return <Flow machine={offCycleFlowMachine} onEvent={onEvent} />\n}\n"],"names":["OffCycleFlow","companyId","payrollType","onEvent","withReimbursements","offCycleFlowMachine","useMemo","createMachine","offCycleMachine","initialContext","OffCycleCreationContextual","buildBreadcrumbs","offCycleBreadcrumbsNodes","jsx","Flow"],"mappings":";;;;;;;AAwDO,SAASA,EAAa;AAAA,EAC3B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,oBAAAC;AACF,GAAsB;AACpB,QAAMC,IAAsBC;AAAA,IAC1B,MACEC;AAAA,MACE;AAAA,MACAC;AAAA,MACA,CAACC,OAAkD;AAAA,QACjD,GAAGA;AAAA,QACH,WAAWC;AAAA,QACX,WAAAT;AAAA,QACA,aAAAC;AAAA,QACA,oBAAAE;AAAA,QACA,QAAQ;AAAA,UACN,MAAM;AAAA,UACN,aAAaO,EAAiBC,CAAwB;AAAA,UACtD,qBAAqB;AAAA,QAAA;AAAA,MACvB;AAAA,IACF;AAAA,IAEJ,CAACX,GAAWC,GAAaE,CAAkB;AAAA,EAAA;AAG7C,SAAO,gBAAAS,EAACC,GAAA,EAAK,SAAST,GAAqB,SAAAF,EAAA,CAAkB;AAC/D;"}
+{"version":3,"file":"OffCycleFlow.js","sources":["../../../../src/components/Payroll/OffCycle/OffCycleFlow.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { createMachine } from 'robot3'\nimport { offCycleMachine, offCycleBreadcrumbsNodes } from './offCycleStateMachine'\nimport {\n  OffCycleCreationContextual,\n  type OffCycleFlowContextInterface,\n  type OffCycleFlowProps,\n} from './OffCycleFlowComponents'\nimport { Flow } from '@/components/Flow/Flow'\nimport { buildBreadcrumbs } from '@/helpers/breadcrumbHelpers'\n\n/**\n * Guided flow to create and run a bonus or correction payroll.\n *\n * @remarks\n * Guides the user through configuring pay period dates, selecting a reason, choosing\n * employees, and setting deduction and tax withholding preferences, then transitions\n * into the standard payroll execution experience (configuration, overview, submission,\n * receipts). All off-cycle payroll types share the same execution steps as regular\n * payrolls — only the creation step differs.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `breadcrumb/navigate` | User navigates via the flow breadcrumb header | `{ key: string }` |\n * | `offCycle/created` | Off-cycle payroll has been created and the flow transitions to execution | `{ payrollUuid: string }` |\n * | `offCycle/blockers/viewAll` | User opens the payroll blockers step from the creation screen's blocker alert | none |\n *\n * Once the flow transitions to execution, all standard run-payroll events are emitted\n * (e.g. `runPayroll/calculated`, `runPayroll/submitted`, `runPayroll/processed`).\n *\n * @components\n * - {@link OffCycleCreation}\n * - {@link PayrollBlockerList}\n * - {@link PayrollExecutionFlow}\n *\n * @param props - {@link OffCycleFlowProps}\n * @returns The rendered off-cycle payroll flow.\n * @public\n *\n * @example\n * ```tsx title=\"App.tsx\"\n * import { Payroll, type EventType } from '@gusto/embedded-react-sdk'\n *\n * function MyApp() {\n *   return (\n *     <Payroll.OffCycleFlow\n *       companyId=\"a007e1ab-3595-43c2-ab4b-af7a5af2e365\"\n *       onEvent={(eventType: EventType) => {\n *         if (eventType === 'runPayroll/submitted') {\n *           // Payroll submitted — navigate to your next screen\n *         }\n *       }}\n *     />\n *   )\n * }\n * ```\n */\nexport function OffCycleFlow({\n  companyId,\n  payrollType,\n  onEvent,\n  withReimbursements,\n}: OffCycleFlowProps) {\n  const offCycleFlowMachine = useMemo(\n    () =>\n      createMachine(\n        'createOffCyclePayroll',\n        offCycleMachine,\n        (initialContext: OffCycleFlowContextInterface) => ({\n          ...initialContext,\n          component: OffCycleCreationContextual,\n          companyId,\n          payrollType,\n          withReimbursements,\n          header: {\n            type: 'breadcrumbs' as const,\n            breadcrumbs: buildBreadcrumbs(offCycleBreadcrumbsNodes),\n            currentBreadcrumbId: 'createOffCyclePayroll',\n          },\n        }),\n      ),\n    [companyId, payrollType, withReimbursements],\n  )\n\n  return <Flow machine={offCycleFlowMachine} onEvent={onEvent} />\n}\n"],"names":["OffCycleFlow","companyId","payrollType","onEvent","withReimbursements","offCycleFlowMachine","useMemo","createMachine","offCycleMachine","initialContext","OffCycleCreationContextual","buildBreadcrumbs","offCycleBreadcrumbsNodes","jsx","Flow"],"mappings":";;;;;;;AA0DO,SAASA,EAAa;AAAA,EAC3B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,oBAAAC;AACF,GAAsB;AACpB,QAAMC,IAAsBC;AAAA,IAC1B,MACEC;AAAA,MACE;AAAA,MACAC;AAAA,MACA,CAACC,OAAkD;AAAA,QACjD,GAAGA;AAAA,QACH,WAAWC;AAAA,QACX,WAAAT;AAAA,QACA,aAAAC;AAAA,QACA,oBAAAE;AAAA,QACA,QAAQ;AAAA,UACN,MAAM;AAAA,UACN,aAAaO,EAAiBC,CAAwB;AAAA,UACtD,qBAAqB;AAAA,QAAA;AAAA,MACvB;AAAA,IACF;AAAA,IAEJ,CAACX,GAAWC,GAAaE,CAAkB;AAAA,EAAA;AAG7C,SAAO,gBAAAS,EAACC,GAAA,EAAK,SAAST,GAAqB,SAAAF,EAAA,CAAkB;AAC/D;"}

package/dist/components/Payroll/OffCycle/OffCycleFlowComponents.js

@@ -1,15 +1,16 @@
-import { jsx as l } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
 import { useMemo as y } from "react";
 import { usePayrollsGetSuspense as p } from "@gusto/embedded-api/react-query/payrollsGet";
 import { PayrollExecutionInternalFlow as u } from "../PayrollExecutionFlow/PayrollExecutionFlow.js";
 import { isDismissalPayroll as d } from "../helpers.js";
-import { useFlow as s } from "../../Flow/useFlow.js";
+import { useFlow as c } from "../../Flow/useFlow.js";
 import { ensureRequired as a } from "../../../helpers/ensureRequired.js";
 import { BaseComponent as C } from "../../Base/Base.js";
 import { OffCycleCreation as P } from "../OffCycleCreation/OffCycleCreation.js";
-function D() {
-  const { companyId: o, payrollType: r, onEvent: e } = s();
-  return /* @__PURE__ */ l(
+import { PayrollBlockerList as x } from "../PayrollBlocker/components/PayrollBlockerList.js";
+function k() {
+  const { companyId: o, payrollType: r, onEvent: e } = c();
+  return /* @__PURE__ */ t(
     P,
     {
       companyId: a(o),
@@ -18,41 +19,46 @@ function D() {
     }
   );
 }
-function S() {
-  const { companyId: o, payrollUuid: r, onEvent: e, withReimbursements: t, header: n } = s(), m = a(o), c = a(r), i = n?.type === "breadcrumbs" ? n.breadcrumbs?.createOffCyclePayroll?.[0] : void 0, f = y(
+function F() {
+  const { companyId: o, onEvent: r } = c();
+  return /* @__PURE__ */ t(x, { companyId: a(o), onEvent: r });
+}
+function L() {
+  const { companyId: o, payrollUuid: r, onEvent: e, withReimbursements: n, header: l } = c(), m = a(o), s = a(r), i = l?.type === "breadcrumbs" ? l.breadcrumbs?.createOffCyclePayroll?.[0] : void 0, f = y(
     () => i ? [i] : void 0,
     [i]
   );
-  return /* @__PURE__ */ l(C, { onEvent: e, children: /* @__PURE__ */ l(
-    x,
+  return /* @__PURE__ */ t(C, { onEvent: e, children: /* @__PURE__ */ t(
+    I,
     {
       companyId: m,
-      payrollId: c,
+      payrollId: s,
       onEvent: e,
-      withReimbursements: t,
+      withReimbursements: n,
       prefixBreadcrumbs: f
     }
   ) });
 }
-function x({
+function I({
   companyId: o,
   payrollId: r,
   ...e
 }) {
-  const { data: t } = p({ companyId: o, payrollId: r }), n = t.payrollShow?.payPeriod;
-  return /* @__PURE__ */ l(
+  const { data: n } = p({ companyId: o, payrollId: r }), l = n.payrollShow?.payPeriod;
+  return /* @__PURE__ */ t(
     u,
     {
       companyId: o,
       payrollId: r,
-      initialPayPeriod: n,
-      isDismissalPayroll: d(t.payrollShow?.offCycleReason),
+      initialPayPeriod: l,
+      isDismissalPayroll: d(n.payrollShow?.offCycleReason),
       ...e
     }
   );
 }
 export {
-  D as OffCycleCreationContextual,
-  S as OffCycleExecutionContextual
+  k as OffCycleCreationContextual,
+  L as OffCycleExecutionContextual,
+  F as PayrollBlockerListContextual
 };
 //# sourceMappingURL=OffCycleFlowComponents.js.map

package/dist/components/Payroll/OffCycle/OffCycleFlowComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"OffCycleFlowComponents.js","sources":["../../../../src/components/Payroll/OffCycle/OffCycleFlowComponents.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { usePayrollsGetSuspense } from '@gusto/embedded-api/react-query/payrollsGet'\nimport { OffCycleCreation } from '../OffCycleCreation'\nimport {\n  PayrollExecutionInternalFlow,\n  type PayrollExecutionInternalFlowProps,\n} from '../PayrollExecutionFlow/PayrollExecutionFlow'\nimport type { OffCycleReason } from '../OffCycleReasonSelection'\nimport { isDismissalPayroll } from '../helpers'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { EventType } from '@/shared/constants'\nimport { ensureRequired } from '@/helpers/ensureRequired'\nimport { BaseComponent } from '@/components/Base/Base'\n\n/**\n * Flow context shared across the off-cycle payroll flow steps.\n *\n * @internal\n */\nexport interface OffCycleFlowContextInterface extends FlowContextInterface {\n  /** The associated company identifier. */\n  companyId: string\n  /** Identifier of the off-cycle payroll created during the flow; set once creation completes. */\n  payrollUuid?: string\n  /** Pre-selected off-cycle reason (bonus or correction). */\n  payrollType?: OffCycleReason\n  /** Whether to show reimbursement fields throughout the execution steps. Defaults to true. */\n  withReimbursements?: boolean\n}\n\n/**\n * Props for {@link OffCycleFlow}.\n *\n * @public\n */\nexport interface OffCycleFlowProps {\n  /** The associated company identifier. */\n  companyId: string\n  /** Optional pre-selected off-cycle reason. When provided, the creation form starts with this reason selected. */\n  payrollType?: OffCycleReason\n  /** Callback invoked when the flow emits an event. See the events table on {@link OffCycleFlow}. */\n  onEvent: OnEventType<EventType, unknown>\n  /** Optional flag to show/hide reimbursement fields throughout the flow. Defaults to true. */\n  withReimbursements?: boolean\n}\n\n/** @internal */\nexport function OffCycleCreationContextual() {\n  const { companyId, payrollType, onEvent } = useFlow<OffCycleFlowContextInterface>()\n  return (\n    <OffCycleCreation\n      companyId={ensureRequired(companyId)}\n      payrollType={payrollType}\n      onEvent={onEvent}\n    />\n  )\n}\n\n/** @internal */\nexport function OffCycleExecutionContextual() {\n  const { companyId, payrollUuid, onEvent, withReimbursements, header } =\n    useFlow<OffCycleFlowContextInterface>()\n\n  const resolvedCompanyId = ensureRequired(companyId)\n  const resolvedPayrollId = ensureRequired(payrollUuid)\n\n  const offCycleRootBreadcrumb =\n    header?.type === 'breadcrumbs' ? header.breadcrumbs?.['createOffCyclePayroll']?.[0] : undefined\n  const prefixBreadcrumbs = useMemo(\n    () => (offCycleRootBreadcrumb ? [offCycleRootBreadcrumb] : undefined),\n    [offCycleRootBreadcrumb],\n  )\n\n  return (\n    <BaseComponent onEvent={onEvent}>\n      <OffCycleExecutionWithData\n        companyId={resolvedCompanyId}\n        payrollId={resolvedPayrollId}\n        onEvent={onEvent}\n        withReimbursements={withReimbursements}\n        prefixBreadcrumbs={prefixBreadcrumbs}\n      />\n    </BaseComponent>\n  )\n}\n\ntype OffCycleExecutionWithDataProps = Pick<\n  PayrollExecutionInternalFlowProps,\n  'companyId' | 'payrollId' | 'onEvent' | 'prefixBreadcrumbs' | 'withReimbursements'\n>\n\nfunction OffCycleExecutionWithData({\n  companyId,\n  payrollId,\n  ...rest\n}: OffCycleExecutionWithDataProps) {\n  const { data } = usePayrollsGetSuspense({ companyId, payrollId })\n  const initialPayPeriod = data.payrollShow?.payPeriod\n\n  return (\n    <PayrollExecutionInternalFlow\n      companyId={companyId}\n      payrollId={payrollId}\n      initialPayPeriod={initialPayPeriod}\n      isDismissalPayroll={isDismissalPayroll(data.payrollShow?.offCycleReason)}\n      {...rest}\n    />\n  )\n}\n"],"names":["OffCycleCreationContextual","companyId","payrollType","onEvent","useFlow","jsx","OffCycleCreation","ensureRequired","OffCycleExecutionContextual","payrollUuid","withReimbursements","header","resolvedCompanyId","resolvedPayrollId","offCycleRootBreadcrumb","prefixBreadcrumbs","useMemo","BaseComponent","OffCycleExecutionWithData","payrollId","rest","data","usePayrollsGetSuspense","initialPayPeriod","PayrollExecutionInternalFlow","isDismissalPayroll"],"mappings":";;;;;;;;;AAgDO,SAASA,IAA6B;AAC3C,QAAM,EAAE,WAAAC,GAAW,aAAAC,GAAa,SAAAC,EAAA,IAAYC,EAAA;AAC5C,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAeN,CAAS;AAAA,MACnC,aAAAC;AAAA,MACA,SAAAC;AAAA,IAAA;AAAA,EAAA;AAGN;AAGO,SAASK,IAA8B;AAC5C,QAAM,EAAE,WAAAP,GAAW,aAAAQ,GAAa,SAAAN,GAAS,oBAAAO,GAAoB,QAAAC,EAAA,IAC3DP,EAAA,GAEIQ,IAAoBL,EAAeN,CAAS,GAC5CY,IAAoBN,EAAeE,CAAW,GAE9CK,IACJH,GAAQ,SAAS,gBAAgBA,EAAO,aAAc,wBAA2B,CAAC,IAAI,QAClFI,IAAoBC;AAAA,IACxB,MAAOF,IAAyB,CAACA,CAAsB,IAAI;AAAA,IAC3D,CAACA,CAAsB;AAAA,EAAA;AAGzB,SACE,gBAAAT,EAACY,KAAc,SAAAd,GACb,UAAA,gBAAAE;AAAA,IAACa;AAAA,IAAA;AAAA,MACC,WAAWN;AAAA,MACX,WAAWC;AAAA,MACX,SAAAV;AAAA,MACA,oBAAAO;AAAA,MACA,mBAAAK;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AAOA,SAASG,EAA0B;AAAA,EACjC,WAAAjB;AAAA,EACA,WAAAkB;AAAA,EACA,GAAGC;AACL,GAAmC;AACjC,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAuB,EAAE,WAAArB,GAAW,WAAAkB,GAAW,GAC1DI,IAAmBF,EAAK,aAAa;AAE3C,SACE,gBAAAhB;AAAA,IAACmB;AAAA,IAAA;AAAA,MACC,WAAAvB;AAAA,MACA,WAAAkB;AAAA,MACA,kBAAAI;AAAA,MACA,oBAAoBE,EAAmBJ,EAAK,aAAa,cAAc;AAAA,MACtE,GAAGD;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"OffCycleFlowComponents.js","sources":["../../../../src/components/Payroll/OffCycle/OffCycleFlowComponents.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { usePayrollsGetSuspense } from '@gusto/embedded-api/react-query/payrollsGet'\nimport { OffCycleCreation } from '../OffCycleCreation'\nimport { PayrollBlockerList } from '../PayrollBlocker'\nimport {\n  PayrollExecutionInternalFlow,\n  type PayrollExecutionInternalFlowProps,\n} from '../PayrollExecutionFlow/PayrollExecutionFlow'\nimport type { OffCycleReason } from '../OffCycleReasonSelection'\nimport { isDismissalPayroll } from '../helpers'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { EventType } from '@/shared/constants'\nimport { ensureRequired } from '@/helpers/ensureRequired'\nimport { BaseComponent } from '@/components/Base/Base'\n\n/**\n * Flow context shared across the off-cycle payroll flow steps.\n *\n * @internal\n */\nexport interface OffCycleFlowContextInterface extends FlowContextInterface {\n  /** The associated company identifier. */\n  companyId: string\n  /** Identifier of the off-cycle payroll created during the flow; set once creation completes. */\n  payrollUuid?: string\n  /** Pre-selected off-cycle reason (bonus or correction). */\n  payrollType?: OffCycleReason\n  /** Whether to show reimbursement fields throughout the execution steps. Defaults to true. */\n  withReimbursements?: boolean\n}\n\n/**\n * Props for {@link OffCycleFlow}.\n *\n * @public\n */\nexport interface OffCycleFlowProps {\n  /** The associated company identifier. */\n  companyId: string\n  /** Optional pre-selected off-cycle reason. When provided, the creation form starts with this reason selected. */\n  payrollType?: OffCycleReason\n  /** Callback invoked when the flow emits an event. See the events table on {@link OffCycleFlow}. */\n  onEvent: OnEventType<EventType, unknown>\n  /** Optional flag to show/hide reimbursement fields throughout the flow. Defaults to true. */\n  withReimbursements?: boolean\n}\n\n/** @internal */\nexport function OffCycleCreationContextual() {\n  const { companyId, payrollType, onEvent } = useFlow<OffCycleFlowContextInterface>()\n  return (\n    <OffCycleCreation\n      companyId={ensureRequired(companyId)}\n      payrollType={payrollType}\n      onEvent={onEvent}\n    />\n  )\n}\n\n/** @internal */\nexport function PayrollBlockerListContextual() {\n  const { companyId, onEvent } = useFlow<OffCycleFlowContextInterface>()\n  return <PayrollBlockerList companyId={ensureRequired(companyId)} onEvent={onEvent} />\n}\n\n/** @internal */\nexport function OffCycleExecutionContextual() {\n  const { companyId, payrollUuid, onEvent, withReimbursements, header } =\n    useFlow<OffCycleFlowContextInterface>()\n\n  const resolvedCompanyId = ensureRequired(companyId)\n  const resolvedPayrollId = ensureRequired(payrollUuid)\n\n  const offCycleRootBreadcrumb =\n    header?.type === 'breadcrumbs' ? header.breadcrumbs?.['createOffCyclePayroll']?.[0] : undefined\n  const prefixBreadcrumbs = useMemo(\n    () => (offCycleRootBreadcrumb ? [offCycleRootBreadcrumb] : undefined),\n    [offCycleRootBreadcrumb],\n  )\n\n  return (\n    <BaseComponent onEvent={onEvent}>\n      <OffCycleExecutionWithData\n        companyId={resolvedCompanyId}\n        payrollId={resolvedPayrollId}\n        onEvent={onEvent}\n        withReimbursements={withReimbursements}\n        prefixBreadcrumbs={prefixBreadcrumbs}\n      />\n    </BaseComponent>\n  )\n}\n\ntype OffCycleExecutionWithDataProps = Pick<\n  PayrollExecutionInternalFlowProps,\n  'companyId' | 'payrollId' | 'onEvent' | 'prefixBreadcrumbs' | 'withReimbursements'\n>\n\nfunction OffCycleExecutionWithData({\n  companyId,\n  payrollId,\n  ...rest\n}: OffCycleExecutionWithDataProps) {\n  const { data } = usePayrollsGetSuspense({ companyId, payrollId })\n  const initialPayPeriod = data.payrollShow?.payPeriod\n\n  return (\n    <PayrollExecutionInternalFlow\n      companyId={companyId}\n      payrollId={payrollId}\n      initialPayPeriod={initialPayPeriod}\n      isDismissalPayroll={isDismissalPayroll(data.payrollShow?.offCycleReason)}\n      {...rest}\n    />\n  )\n}\n"],"names":["OffCycleCreationContextual","companyId","payrollType","onEvent","useFlow","jsx","OffCycleCreation","ensureRequired","PayrollBlockerListContextual","PayrollBlockerList","OffCycleExecutionContextual","payrollUuid","withReimbursements","header","resolvedCompanyId","resolvedPayrollId","offCycleRootBreadcrumb","prefixBreadcrumbs","useMemo","BaseComponent","OffCycleExecutionWithData","payrollId","rest","data","usePayrollsGetSuspense","initialPayPeriod","PayrollExecutionInternalFlow","isDismissalPayroll"],"mappings":";;;;;;;;;;AAiDO,SAASA,IAA6B;AAC3C,QAAM,EAAE,WAAAC,GAAW,aAAAC,GAAa,SAAAC,EAAA,IAAYC,EAAA;AAC5C,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAeN,CAAS;AAAA,MACnC,aAAAC;AAAA,MACA,SAAAC;AAAA,IAAA;AAAA,EAAA;AAGN;AAGO,SAASK,IAA+B;AAC7C,QAAM,EAAE,WAAAP,GAAW,SAAAE,EAAA,IAAYC,EAAA;AAC/B,2BAAQK,GAAA,EAAmB,WAAWF,EAAeN,CAAS,GAAG,SAAAE,GAAkB;AACrF;AAGO,SAASO,IAA8B;AAC5C,QAAM,EAAE,WAAAT,GAAW,aAAAU,GAAa,SAAAR,GAAS,oBAAAS,GAAoB,QAAAC,EAAA,IAC3DT,EAAA,GAEIU,IAAoBP,EAAeN,CAAS,GAC5Cc,IAAoBR,EAAeI,CAAW,GAE9CK,IACJH,GAAQ,SAAS,gBAAgBA,EAAO,aAAc,wBAA2B,CAAC,IAAI,QAClFI,IAAoBC;AAAA,IACxB,MAAOF,IAAyB,CAACA,CAAsB,IAAI;AAAA,IAC3D,CAACA,CAAsB;AAAA,EAAA;AAGzB,SACE,gBAAAX,EAACc,KAAc,SAAAhB,GACb,UAAA,gBAAAE;AAAA,IAACe;AAAA,IAAA;AAAA,MACC,WAAWN;AAAA,MACX,WAAWC;AAAA,MACX,SAAAZ;AAAA,MACA,oBAAAS;AAAA,MACA,mBAAAK;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AAOA,SAASG,EAA0B;AAAA,EACjC,WAAAnB;AAAA,EACA,WAAAoB;AAAA,EACA,GAAGC;AACL,GAAmC;AACjC,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAuB,EAAE,WAAAvB,GAAW,WAAAoB,GAAW,GAC1DI,IAAmBF,EAAK,aAAa;AAE3C,SACE,gBAAAlB;AAAA,IAACqB;AAAA,IAAA;AAAA,MACC,WAAAzB;AAAA,MACA,WAAAoB;AAAA,MACA,kBAAAI;AAAA,MACA,oBAAoBE,EAAmBJ,EAAK,aAAa,cAAc;AAAA,MACtE,GAAGD;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/components/Payroll/OffCycle/offCycleStateMachine.js

@@ -1,7 +1,7 @@
-import { state as a, transition as c, reduce as l, guard as f } from "robot3";
-import { OffCycleExecutionContextual as y, OffCycleCreationContextual as t } from "./OffCycleFlowComponents.js";
-import { componentEvents as n } from "../../../shared/constants.js";
-import { patchBreadcrumbsHeader as o } from "../../../helpers/breadcrumbHelpers.js";
+import { state as l, transition as o, reduce as a, guard as f } from "robot3";
+import { OffCycleExecutionContextual as d, PayrollBlockerListContextual as i, OffCycleCreationContextual as y } from "./OffCycleFlowComponents.js";
+import { componentEvents as c } from "../../../shared/constants.js";
+import { patchBreadcrumbsHeader as t, updateBreadcrumbs as u } from "../../../helpers/breadcrumbHelpers.js";
 const O = {
   createOffCyclePayroll: {
     parent: null,
@@ -10,45 +10,63 @@ const O = {
       label: "createOffCyclePayroll.breadcrumbLabel",
       namespace: "Payroll.OffCycle",
       onNavigate: ((e) => ({
-        ...o(e, { currentBreadcrumbId: "createOffCyclePayroll" }),
-        component: t,
+        ...t(e, { currentBreadcrumbId: "createOffCyclePayroll" }),
+        component: y,
         payrollUuid: void 0
       }))
     }
+  },
+  blockers: {
+    parent: "createOffCyclePayroll",
+    item: {
+      id: "blockers",
+      label: "breadcrumbLabel",
+      namespace: "Payroll.PayrollBlocker"
+    }
   }
 };
-function i(e) {
+function m(e) {
   return {
-    ...o(e, { currentBreadcrumbId: "createOffCyclePayroll" }),
-    component: t,
+    ...t(e, { currentBreadcrumbId: "createOffCyclePayroll" }),
+    component: y,
     payrollUuid: void 0
   };
 }
-const d = c(
-  n.BREADCRUMB_NAVIGATE,
+const n = o(
+  c.BREADCRUMB_NAVIGATE,
   "createOffCyclePayroll",
   f(
     (e, r) => r.payload.key === "createOffCyclePayroll"
   ),
-  l(i)
-), s = {
-  createOffCyclePayroll: a(
-    c(
-      n.OFF_CYCLE_CREATED,
+  a(m)
+), P = {
+  createOffCyclePayroll: l(
+    o(
+      c.OFF_CYCLE_CREATED,
       "execution",
-      l(
+      a(
         (e, r) => ({
-          ...o(e, { currentBreadcrumbId: void 0 }),
+          ...t(e, { currentBreadcrumbId: void 0 }),
           payrollUuid: r.payload?.payrollUuid,
-          component: y
+          component: d
         })
       )
+    ),
+    o(
+      c.OFF_CYCLE_BLOCKERS_VIEW_ALL,
+      "blockers",
+      a((e) => ({
+        ...u("blockers", e),
+        component: i,
+        payrollUuid: void 0
+      }))
     )
   ),
-  execution: a(d)
+  blockers: l(n),
+  execution: l(n)
 };
 export {
   O as offCycleBreadcrumbsNodes,
-  s as offCycleMachine
+  P as offCycleMachine
 };
 //# sourceMappingURL=offCycleStateMachine.js.map

package/dist/components/Payroll/OffCycle/offCycleStateMachine.js.map

@@ -1 +1 @@
-{"version":3,"file":"offCycleStateMachine.js","sources":["../../../../src/components/Payroll/OffCycle/offCycleStateMachine.ts"],"sourcesContent":["import { state, transition, reduce, guard } from 'robot3'\nimport {\n  OffCycleCreationContextual,\n  OffCycleExecutionContextual,\n  type OffCycleFlowContextInterface,\n} from './OffCycleFlowComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineTransition } from '@/types/Helpers'\nimport type { BreadcrumbNodes } from '@/components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport { patchBreadcrumbsHeader } from '@/helpers/breadcrumbHelpers'\n\n/** @internal */\nexport const offCycleBreadcrumbsNodes: BreadcrumbNodes = {\n  createOffCyclePayroll: {\n    parent: null,\n    item: {\n      id: 'createOffCyclePayroll',\n      label: 'createOffCyclePayroll.breadcrumbLabel',\n      namespace: 'Payroll.OffCycle',\n      onNavigate: ((ctx: OffCycleFlowContextInterface) => ({\n        ...patchBreadcrumbsHeader(ctx, { currentBreadcrumbId: 'createOffCyclePayroll' }),\n        component: OffCycleCreationContextual,\n        payrollUuid: undefined,\n      })) as (context: unknown) => unknown,\n    },\n  },\n}\n\nfunction toCreationReducer(ctx: OffCycleFlowContextInterface): OffCycleFlowContextInterface {\n  return {\n    ...patchBreadcrumbsHeader(ctx, { currentBreadcrumbId: 'createOffCyclePayroll' }),\n    component: OffCycleCreationContextual,\n    payrollUuid: undefined,\n  }\n}\n\nconst creationBreadcrumbTransition = transition(\n  componentEvents.BREADCRUMB_NAVIGATE,\n  'createOffCyclePayroll',\n  guard(\n    (_ctx: OffCycleFlowContextInterface, ev: { payload: { key: string } }) =>\n      ev.payload.key === 'createOffCyclePayroll',\n  ),\n  reduce(toCreationReducer),\n)\n\n/** @internal */\nexport const offCycleMachine = {\n  createOffCyclePayroll: state<MachineTransition>(\n    transition(\n      componentEvents.OFF_CYCLE_CREATED,\n      'execution',\n      reduce(\n        (\n          ctx: OffCycleFlowContextInterface,\n          ev: { payload?: { payrollUuid?: string } },\n        ): OffCycleFlowContextInterface => ({\n          ...patchBreadcrumbsHeader(ctx, { currentBreadcrumbId: undefined }),\n          payrollUuid: ev.payload?.payrollUuid,\n          component: OffCycleExecutionContextual,\n        }),\n      ),\n    ),\n  ),\n\n  execution: state<MachineTransition>(creationBreadcrumbTransition),\n}\n"],"names":["offCycleBreadcrumbsNodes","ctx","patchBreadcrumbsHeader","OffCycleCreationContextual","toCreationReducer","creationBreadcrumbTransition","transition","componentEvents","guard","_ctx","ev","reduce","offCycleMachine","state","OffCycleExecutionContextual"],"mappings":";;;;AAYO,MAAMA,IAA4C;AAAA,EACvD,uBAAuB;AAAA,IACrB,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,aAAa,CAACC,OAAuC;AAAA,QACnD,GAAGC,EAAuBD,GAAK,EAAE,qBAAqB,yBAAyB;AAAA,QAC/E,WAAWE;AAAA,QACX,aAAa;AAAA,MAAA;AAAA,IACf;AAAA,EACF;AAEJ;AAEA,SAASC,EAAkBH,GAAiE;AAC1F,SAAO;AAAA,IACL,GAAGC,EAAuBD,GAAK,EAAE,qBAAqB,yBAAyB;AAAA,IAC/E,WAAWE;AAAA,IACX,aAAa;AAAA,EAAA;AAEjB;AAEA,MAAME,IAA+BC;AAAA,EACnCC,EAAgB;AAAA,EAChB;AAAA,EACAC;AAAA,IACE,CAACC,GAAoCC,MACnCA,EAAG,QAAQ,QAAQ;AAAA,EAAA;AAAA,EAEvBC,EAAOP,CAAiB;AAC1B,GAGaQ,IAAkB;AAAA,EAC7B,uBAAuBC;AAAA,IACrBP;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAI;AAAA,QACE,CACEV,GACAS,OACkC;AAAA,UAClC,GAAGR,EAAuBD,GAAK,EAAE,qBAAqB,QAAW;AAAA,UACjE,aAAaS,EAAG,SAAS;AAAA,UACzB,WAAWI;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAAA,EAGF,WAAWD,EAAyBR,CAA4B;AAClE;"}
+{"version":3,"file":"offCycleStateMachine.js","sources":["../../../../src/components/Payroll/OffCycle/offCycleStateMachine.ts"],"sourcesContent":["import { state, transition, reduce, guard } from 'robot3'\nimport {\n  OffCycleCreationContextual,\n  OffCycleExecutionContextual,\n  PayrollBlockerListContextual,\n  type OffCycleFlowContextInterface,\n} from './OffCycleFlowComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineTransition } from '@/types/Helpers'\nimport type { BreadcrumbNodes } from '@/components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport { patchBreadcrumbsHeader, updateBreadcrumbs } from '@/helpers/breadcrumbHelpers'\n\n/** @internal */\nexport const offCycleBreadcrumbsNodes: BreadcrumbNodes = {\n  createOffCyclePayroll: {\n    parent: null,\n    item: {\n      id: 'createOffCyclePayroll',\n      label: 'createOffCyclePayroll.breadcrumbLabel',\n      namespace: 'Payroll.OffCycle',\n      onNavigate: ((ctx: OffCycleFlowContextInterface) => ({\n        ...patchBreadcrumbsHeader(ctx, { currentBreadcrumbId: 'createOffCyclePayroll' }),\n        component: OffCycleCreationContextual,\n        payrollUuid: undefined,\n      })) as (context: unknown) => unknown,\n    },\n  },\n  blockers: {\n    parent: 'createOffCyclePayroll',\n    item: {\n      id: 'blockers',\n      label: 'breadcrumbLabel',\n      namespace: 'Payroll.PayrollBlocker',\n    },\n  },\n}\n\nfunction toCreationReducer(ctx: OffCycleFlowContextInterface): OffCycleFlowContextInterface {\n  return {\n    ...patchBreadcrumbsHeader(ctx, { currentBreadcrumbId: 'createOffCyclePayroll' }),\n    component: OffCycleCreationContextual,\n    payrollUuid: undefined,\n  }\n}\n\nconst creationBreadcrumbTransition = transition(\n  componentEvents.BREADCRUMB_NAVIGATE,\n  'createOffCyclePayroll',\n  guard(\n    (_ctx: OffCycleFlowContextInterface, ev: { payload: { key: string } }) =>\n      ev.payload.key === 'createOffCyclePayroll',\n  ),\n  reduce(toCreationReducer),\n)\n\n/** @internal */\nexport const offCycleMachine = {\n  createOffCyclePayroll: state<MachineTransition>(\n    transition(\n      componentEvents.OFF_CYCLE_CREATED,\n      'execution',\n      reduce(\n        (\n          ctx: OffCycleFlowContextInterface,\n          ev: { payload?: { payrollUuid?: string } },\n        ): OffCycleFlowContextInterface => ({\n          ...patchBreadcrumbsHeader(ctx, { currentBreadcrumbId: undefined }),\n          payrollUuid: ev.payload?.payrollUuid,\n          component: OffCycleExecutionContextual,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.OFF_CYCLE_BLOCKERS_VIEW_ALL,\n      'blockers',\n      reduce((ctx: OffCycleFlowContextInterface): OffCycleFlowContextInterface => ({\n        ...updateBreadcrumbs('blockers', ctx),\n        component: PayrollBlockerListContextual,\n        payrollUuid: undefined,\n      })),\n    ),\n  ),\n\n  blockers: state<MachineTransition>(creationBreadcrumbTransition),\n\n  execution: state<MachineTransition>(creationBreadcrumbTransition),\n}\n"],"names":["offCycleBreadcrumbsNodes","ctx","patchBreadcrumbsHeader","OffCycleCreationContextual","toCreationReducer","creationBreadcrumbTransition","transition","componentEvents","guard","_ctx","ev","reduce","offCycleMachine","state","OffCycleExecutionContextual","updateBreadcrumbs","PayrollBlockerListContextual"],"mappings":";;;;AAaO,MAAMA,IAA4C;AAAA,EACvD,uBAAuB;AAAA,IACrB,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,aAAa,CAACC,OAAuC;AAAA,QACnD,GAAGC,EAAuBD,GAAK,EAAE,qBAAqB,yBAAyB;AAAA,QAC/E,WAAWE;AAAA,QACX,aAAa;AAAA,MAAA;AAAA,IACf;AAAA,EACF;AAAA,EAEF,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ;AAEA,SAASC,EAAkBH,GAAiE;AAC1F,SAAO;AAAA,IACL,GAAGC,EAAuBD,GAAK,EAAE,qBAAqB,yBAAyB;AAAA,IAC/E,WAAWE;AAAA,IACX,aAAa;AAAA,EAAA;AAEjB;AAEA,MAAME,IAA+BC;AAAA,EACnCC,EAAgB;AAAA,EAChB;AAAA,EACAC;AAAA,IACE,CAACC,GAAoCC,MACnCA,EAAG,QAAQ,QAAQ;AAAA,EAAA;AAAA,EAEvBC,EAAOP,CAAiB;AAC1B,GAGaQ,IAAkB;AAAA,EAC7B,uBAAuBC;AAAA,IACrBP;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAI;AAAA,QACE,CACEV,GACAS,OACkC;AAAA,UAClC,GAAGR,EAAuBD,GAAK,EAAE,qBAAqB,QAAW;AAAA,UACjE,aAAaS,EAAG,SAAS;AAAA,UACzB,WAAWI;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,IAEFR;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAI,EAAO,CAACV,OAAqE;AAAA,QAC3E,GAAGc,EAAkB,YAAYd,CAAG;AAAA,QACpC,WAAWe;AAAA,QACX,aAAa;AAAA,MAAA,EACb;AAAA,IAAA;AAAA,EACJ;AAAA,EAGF,UAAUH,EAAyBR,CAA4B;AAAA,EAE/D,WAAWQ,EAAyBR,CAA4B;AAClE;"}

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

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