@gusto/embedded-react-sdk 0.47.0 → 0.48.0

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

@@ -7,17 +7,17 @@ import { zodResolver as z } from "@hookform/resolvers/zod";
 import a from "./GrossUpModal.module.scss.js";
 import { Flex as B } from "../../Common/Flex/Flex.js";
 import { ActionsLayout as D } from "../../Common/ActionsLayout/ActionsLayout.js";
+import { useComponentContext as H } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import "react-error-boundary";
 import "@tanstack/react-query";
-import { useBase as H } from "../../Base/useBase.js";
+import { useBase as L } from "../../Base/useBase.js";
 import "@gusto/embedded-api-v-2025-11-15/models/errors/apierror";
 import "@gusto/embedded-api-v-2025-11-15/models/errors/gustoembeddederror";
 import "@gusto/embedded-api-v-2025-11-15/models/errors/sdkvalidationerror";
 import "@gusto/embedded-api-v-2025-11-15/models/errors/unprocessableentityerror";
 import "@gusto/embedded-api-v-2025-11-15/models/errors/httpclienterrors";
-import { formatNumberAsCurrency as L } from "../../../helpers/formattedStrings.js";
+import { formatNumberAsCurrency as V } from "../../../helpers/formattedStrings.js";
 import "../../../shared/constants.js";
-import { useComponentContext as V } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import "../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { useI18n as E } from "../../../i18n/I18n.js";
 import { NumberInputField as T } from "../../Common/Fields/NumberInputField/NumberInputField.js";
@@ -26,7 +26,7 @@ const q = P.object({
 });
 function fe({ isOpen: n, onCalculateGrossUp: w, onApply: A, onCancel: d }) {
   E("Payroll.GrossUpModal");
-  const { t: r } = k("Payroll.GrossUpModal"), { Modal: M, Heading: u, Text: p, Button: i, Alert: f } = V(), { baseSubmitHandler: y } = H(), N = R(null), [l, c] = o(null), [h, m] = o(null), [g, b] = o(!1), [x, v] = o(!1), s = U({
+  const { t: r } = k("Payroll.GrossUpModal"), { Modal: M, Heading: u, Text: p, Button: i, Alert: f } = H(), { baseSubmitHandler: y } = L(), N = R(null), [l, c] = o(null), [h, m] = o(null), [g, b] = o(!1), [x, v] = o(!1), s = U({
     resolver: z(q),
     defaultValues: { netPay: 0 }
   });
@@ -103,7 +103,7 @@ function fe({ isOpen: n, onCalculateGrossUp: w, onApply: A, onCancel: d }) {
           ] }),
           l && /* @__PURE__ */ e(I, { children: /* @__PURE__ */ t("div", { className: a.result, children: [
             /* @__PURE__ */ e(p, { size: "sm", variant: "supporting", weight: "semibold", children: r("grossPayResult") }),
-            /* @__PURE__ */ e(u, { as: "h3", children: L(parseFloat(l)) })
+            /* @__PURE__ */ e(u, { as: "h3", children: V(parseFloat(l)) })
           ] }) })
         ] })
       ] })

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

@@ -9,11 +9,11 @@ import { useI18n as c } from "../../../i18n/I18n.js";
 import { useComponentContext as k } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { Flex as o } from "../../Common/Flex/Flex.js";
 import { OffCycleReasonSelectionPresentation as N } from "../OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js";
-import { MultiSelectComboBoxField as R } from "../../Common/Fields/MultiSelectComboBoxField/MultiSelectComboBoxField.js";
-import { RadioGroupField as j } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { OffCycleTaxWithholdingTable as I } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js";
-import { OffCycleTaxWithholdingModal as L } from "../OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js";
-import { SwitchField as M } from "../../Common/Fields/SwitchField/SwitchField.js";
+import { SwitchField as R } from "../../Common/Fields/SwitchField/SwitchField.js";
+import { MultiSelectComboBoxField as j } from "../../Common/Fields/MultiSelectComboBoxField/MultiSelectComboBoxField.js";
+import { RadioGroupField as I } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { OffCycleTaxWithholdingTable as L } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js";
+import { OffCycleTaxWithholdingModal as M } from "../OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js";
 function oe({
   employees: g,
   isPending: m,
@@ -66,7 +66,7 @@ function oe({
     /* @__PURE__ */ n(o, { flexDirection: "column", gap: 12, children: [
       /* @__PURE__ */ e(d, { as: "h3", children: s("sectionTitle") }),
       /* @__PURE__ */ e(
-        M,
+        R,
         {
           name: "includeAllEmployees",
           label: i("includeAllEmployeesLabel"),
@@ -74,7 +74,7 @@ function oe({
         }
       ),
       !O && /* @__PURE__ */ e(
-        R,
+        j,
         {
           name: "selectedEmployeeUuids",
           label: s("sectionTitle"),
@@ -86,7 +86,7 @@ function oe({
     ] }),
     /* @__PURE__ */ e("hr", { className: a.divider }),
     /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(
-      j,
+      I,
       {
         name: "skipRegularDeductions",
         label: t("title"),
@@ -97,7 +97,7 @@ function oe({
     ) }),
     /* @__PURE__ */ e("hr", { className: a.divider }),
     /* @__PURE__ */ e(
-      I,
+      L,
       {
         wageTypeGroups: P,
         config: u,
@@ -105,7 +105,7 @@ function oe({
       }
     ),
     C && /* @__PURE__ */ e(
-      L,
+      M,
       {
         isOpen: !0,
         defaultConfig: u,

package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js

@@ -2,7 +2,8 @@ import { jsxs as i, jsx as r } from "react/jsx-runtime";
 import { useTranslation as l } from "react-i18next";
 import a from "./OffCyclePayPeriodDateFormPresentation.module.scss.js";
 import { useI18n as o } from "../../../i18n/I18n.js";
-import "../../../shared/constants.js";
+import "../../../contexts/ComponentAdapter/useComponentContext.js";
+import "react";
 import { CheckboxField as c } from "../../Common/Fields/CheckboxField/CheckboxField.js";
 import { DatePickerField as t } from "../../Common/Fields/DatePickerField/DatePickerField.js";
 function h() {

package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"OffCyclePayPeriodDateFormPresentation.js","sources":["../../../../src/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport styles from './OffCyclePayPeriodDateFormPresentation.module.scss'\nimport { useI18n } from '@/i18n'\nimport { CheckboxField, DatePickerField } from '@/components/Common'\n\nexport function OffCyclePayPeriodDateFormPresentation() {\n  useI18n('Payroll.OffCyclePayPeriodDateForm')\n  const { t } = useTranslation('Payroll.OffCyclePayPeriodDateForm')\n\n  return (\n    <div className={styles.root}>\n      <div className={styles.dateFields}>\n        <DatePickerField name=\"startDate\" label={t('startDateLabel')} isRequired />\n        <DatePickerField name=\"endDate\" label={t('endDateLabel')} isRequired />\n      </div>\n\n      <div className={styles.checkDateField}>\n        <DatePickerField name=\"checkDate\" label={t('checkDateLabel')} isRequired />\n      </div>\n\n      <CheckboxField\n        name=\"isCheckOnly\"\n        label={t('checkOnlyLabel')}\n        description={t('checkOnlyDescription')}\n      />\n    </div>\n  )\n}\n"],"names":["OffCyclePayPeriodDateFormPresentation","useI18n","t","useTranslation","jsxs","styles","jsx","DatePickerField","CheckboxField"],"mappings":";;;;;;;AAKO,SAASA,IAAwC;AACtD,EAAAC,EAAQ,mCAAmC;AAC3C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,mCAAmC;AAEhE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,MACrB,UAAA;AAAA,IAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,YACrB,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAgB,MAAK,aAAY,OAAOL,EAAE,gBAAgB,GAAG,YAAU,IAAC;AAAA,MACzE,gBAAAI,EAACC,KAAgB,MAAK,WAAU,OAAOL,EAAE,cAAc,GAAG,YAAU,GAAA,CAAC;AAAA,IAAA,GACvE;AAAA,IAEA,gBAAAI,EAAC,OAAA,EAAI,WAAWD,EAAO,gBACrB,UAAA,gBAAAC,EAACC,GAAA,EAAgB,MAAK,aAAY,OAAOL,EAAE,gBAAgB,GAAG,YAAU,IAAC,GAC3E;AAAA,IAEA,gBAAAI;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAON,EAAE,gBAAgB;AAAA,QACzB,aAAaA,EAAE,sBAAsB;AAAA,MAAA;AAAA,IAAA;AAAA,EACvC,GACF;AAEJ;"}
+{"version":3,"file":"OffCyclePayPeriodDateFormPresentation.js","sources":["../../../../src/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport styles from './OffCyclePayPeriodDateFormPresentation.module.scss'\nimport { useI18n } from '@/i18n'\nimport { CheckboxField, DatePickerField } from '@/components/Common'\n\nexport function OffCyclePayPeriodDateFormPresentation() {\n  useI18n('Payroll.OffCyclePayPeriodDateForm')\n  const { t } = useTranslation('Payroll.OffCyclePayPeriodDateForm')\n\n  return (\n    <div className={styles.root}>\n      <div className={styles.dateFields}>\n        <DatePickerField name=\"startDate\" label={t('startDateLabel')} isRequired />\n        <DatePickerField name=\"endDate\" label={t('endDateLabel')} isRequired />\n      </div>\n\n      <div className={styles.checkDateField}>\n        <DatePickerField name=\"checkDate\" label={t('checkDateLabel')} isRequired />\n      </div>\n\n      <CheckboxField\n        name=\"isCheckOnly\"\n        label={t('checkOnlyLabel')}\n        description={t('checkOnlyDescription')}\n      />\n    </div>\n  )\n}\n"],"names":["OffCyclePayPeriodDateFormPresentation","useI18n","t","useTranslation","jsxs","styles","jsx","DatePickerField","CheckboxField"],"mappings":";;;;;;;;AAKO,SAASA,IAAwC;AACtD,EAAAC,EAAQ,mCAAmC;AAC3C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,mCAAmC;AAEhE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,MACrB,UAAA;AAAA,IAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,YACrB,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAgB,MAAK,aAAY,OAAOL,EAAE,gBAAgB,GAAG,YAAU,IAAC;AAAA,MACzE,gBAAAI,EAACC,KAAgB,MAAK,WAAU,OAAOL,EAAE,cAAc,GAAG,YAAU,GAAA,CAAC;AAAA,IAAA,GACvE;AAAA,IAEA,gBAAAI,EAAC,OAAA,EAAI,WAAWD,EAAO,gBACrB,UAAA,gBAAAC,EAACC,GAAA,EAAgB,MAAK,aAAY,OAAOL,EAAE,gBAAgB,GAAG,YAAU,IAAC,GAC3E;AAAA,IAEA,gBAAAI;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAON,EAAE,gBAAgB;AAAA,QACzB,aAAaA,EAAE,sBAAsB;AAAA,MAAA;AAAA,IAAA;AAAA,EACvC,GACF;AAEJ;"}

package/dist/components/Payroll/OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
 import { useMemo as r } from "react";
 import { useTranslation as s } from "react-i18next";
-import "../../../shared/constants.js";
+import "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { RadioGroupField as l } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
 function f({
   name: e,

package/dist/components/Payroll/OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js

@@ -5,13 +5,12 @@ import { useTranslation as L } from "react-i18next";
 import { WithholdingPayPeriod as N } from "@gusto/embedded-api-v-2025-11-15/models/operations/postv1companiescompanyidpayrolls";
 import { WITHHOLDING_PAY_PERIOD_I18N_KEY as p } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js";
 import l from "./OffCycleTaxWithholdingModal.module.scss.js";
-import "../../../shared/constants.js";
 import { ActionsLayout as T } from "../../Common/ActionsLayout/ActionsLayout.js";
 import { useComponentContext as W } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as w } from "../../../i18n/I18n.js";
 import { SelectField as D } from "../../Common/Fields/SelectField/SelectField.js";
 import { RadioGroupField as H } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-function K({
+function Y({
   isOpen: h,
   defaultConfig: f,
   onDone: g,
@@ -96,6 +95,6 @@ function K({
   );
 }
 export {
-  K as OffCycleTaxWithholdingModal
+  Y as OffCycleTaxWithholdingModal
 };
 //# sourceMappingURL=OffCycleTaxWithholdingModal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"OffCycleTaxWithholdingModal.js","sources":["../../../../src/components/Payroll/OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react'\nimport { FormProvider, useForm, useWatch } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { WithholdingPayPeriod } from '@gusto/embedded-api-v-2025-11-15/models/operations/postv1companiescompanyidpayrolls'\nimport { WITHHOLDING_PAY_PERIOD_I18N_KEY } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type { OffCycleTaxWithholdingConfig } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport styles from './OffCycleTaxWithholdingModal.module.scss'\nimport type { OffCycleTaxWithholdingModalProps } from './OffCycleTaxWithholdingModalTypes'\nimport { ActionsLayout, SelectField, RadioGroupField } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nexport function OffCycleTaxWithholdingModal({\n  isOpen,\n  defaultConfig,\n  onDone,\n  onCancel,\n}: OffCycleTaxWithholdingModalProps) {\n  useI18n('Payroll.OffCycleTaxWithholding')\n  const { t } = useTranslation('Payroll.OffCycleTaxWithholding')\n  const { Modal, Heading, Text, Button } = useComponentContext()\n  const modalContainerRef = useRef<HTMLDivElement>(null)\n\n  const formHandlers = useForm<OffCycleTaxWithholdingConfig>({\n    defaultValues: defaultConfig,\n  })\n\n  const currentWithholdingPayPeriod = useWatch({\n    control: formHandlers.control,\n    name: 'withholdingPayPeriod',\n  })\n\n  const frequencyOptions = useMemo(\n    () =>\n      Object.values(WithholdingPayPeriod).map(value => ({\n        value,\n        label: t(WITHHOLDING_PAY_PERIOD_I18N_KEY[value]),\n      })),\n    [t],\n  )\n\n  const frequencyDisplayText = t(\n    WITHHOLDING_PAY_PERIOD_I18N_KEY[currentWithholdingPayPeriod],\n  ).toLowerCase()\n\n  const withholdingRateOptions = useMemo(\n    () => [\n      {\n        value: 'supplemental' as const,\n        label: t('modal.supplementalSection.useSupplementalRate'),\n        description: t('modal.supplementalSection.useSupplementalRateDescription'),\n      },\n      {\n        value: 'regular' as const,\n        label: t('modal.supplementalSection.useRegularRate', {\n          frequency: frequencyDisplayText,\n        }),\n        description: t('modal.supplementalSection.useRegularRateDescription'),\n      },\n    ],\n    [t, frequencyDisplayText],\n  )\n\n  const handleSubmit = formHandlers.handleSubmit(onDone)\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onClose={onCancel}\n      containerRef={modalContainerRef}\n      footer={\n        <ActionsLayout>\n          <Button variant=\"secondary\" onClick={onCancel}>\n            {t('modal.cancelButton')}\n          </Button>\n          <Button variant=\"primary\" onClick={handleSubmit}>\n            {t('modal.doneButton')}\n          </Button>\n        </ActionsLayout>\n      }\n    >\n      <FormProvider {...formHandlers}>\n        <div className={styles.content}>\n          <Heading as=\"h2\">{t('modal.title')}</Heading>\n\n          <div className={styles.section}>\n            <Heading as=\"h3\">{t('modal.regularSection.title')}</Heading>\n            <Text variant=\"supporting\">{t('modal.regularSection.subtitle')}</Text>\n\n            <div className={styles.rateInfo}>\n              <Text weight=\"semibold\">{t('modal.regularSection.rateLabel')}</Text>\n              <Text variant=\"supporting\">{t('modal.regularSection.rateDescription')}</Text>\n            </div>\n\n            <SelectField\n              name=\"withholdingPayPeriod\"\n              label={t('modal.regularSection.rateLabel')}\n              options={frequencyOptions}\n              shouldVisuallyHideLabel\n              portalContainer={modalContainerRef.current ?? undefined}\n            />\n          </div>\n\n          <hr className={styles.divider} />\n\n          <div className={styles.section}>\n            <Heading as=\"h3\">{t('modal.supplementalSection.title')}</Heading>\n            <RadioGroupField\n              name=\"withholdingRate\"\n              label={t('modal.supplementalSection.title')}\n              options={withholdingRateOptions}\n              shouldVisuallyHideLabel\n            />\n          </div>\n        </div>\n      </FormProvider>\n    </Modal>\n  )\n}\n"],"names":["OffCycleTaxWithholdingModal","isOpen","defaultConfig","onDone","onCancel","useI18n","t","useTranslation","Modal","Heading","Text","Button","useComponentContext","modalContainerRef","useRef","formHandlers","useForm","currentWithholdingPayPeriod","useWatch","frequencyOptions","useMemo","WithholdingPayPeriod","value","WITHHOLDING_PAY_PERIOD_I18N_KEY","frequencyDisplayText","withholdingRateOptions","handleSubmit","jsx","ActionsLayout","FormProvider","styles","jsxs","SelectField","RadioGroupField"],"mappings":"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"}
+{"version":3,"file":"OffCycleTaxWithholdingModal.js","sources":["../../../../src/components/Payroll/OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react'\nimport { FormProvider, useForm, useWatch } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { WithholdingPayPeriod } from '@gusto/embedded-api-v-2025-11-15/models/operations/postv1companiescompanyidpayrolls'\nimport { WITHHOLDING_PAY_PERIOD_I18N_KEY } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type { OffCycleTaxWithholdingConfig } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport styles from './OffCycleTaxWithholdingModal.module.scss'\nimport type { OffCycleTaxWithholdingModalProps } from './OffCycleTaxWithholdingModalTypes'\nimport { ActionsLayout, SelectField, RadioGroupField } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nexport function OffCycleTaxWithholdingModal({\n  isOpen,\n  defaultConfig,\n  onDone,\n  onCancel,\n}: OffCycleTaxWithholdingModalProps) {\n  useI18n('Payroll.OffCycleTaxWithholding')\n  const { t } = useTranslation('Payroll.OffCycleTaxWithholding')\n  const { Modal, Heading, Text, Button } = useComponentContext()\n  const modalContainerRef = useRef<HTMLDivElement>(null)\n\n  const formHandlers = useForm<OffCycleTaxWithholdingConfig>({\n    defaultValues: defaultConfig,\n  })\n\n  const currentWithholdingPayPeriod = useWatch({\n    control: formHandlers.control,\n    name: 'withholdingPayPeriod',\n  })\n\n  const frequencyOptions = useMemo(\n    () =>\n      Object.values(WithholdingPayPeriod).map(value => ({\n        value,\n        label: t(WITHHOLDING_PAY_PERIOD_I18N_KEY[value]),\n      })),\n    [t],\n  )\n\n  const frequencyDisplayText = t(\n    WITHHOLDING_PAY_PERIOD_I18N_KEY[currentWithholdingPayPeriod],\n  ).toLowerCase()\n\n  const withholdingRateOptions = useMemo(\n    () => [\n      {\n        value: 'supplemental' as const,\n        label: t('modal.supplementalSection.useSupplementalRate'),\n        description: t('modal.supplementalSection.useSupplementalRateDescription'),\n      },\n      {\n        value: 'regular' as const,\n        label: t('modal.supplementalSection.useRegularRate', {\n          frequency: frequencyDisplayText,\n        }),\n        description: t('modal.supplementalSection.useRegularRateDescription'),\n      },\n    ],\n    [t, frequencyDisplayText],\n  )\n\n  const handleSubmit = formHandlers.handleSubmit(onDone)\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onClose={onCancel}\n      containerRef={modalContainerRef}\n      footer={\n        <ActionsLayout>\n          <Button variant=\"secondary\" onClick={onCancel}>\n            {t('modal.cancelButton')}\n          </Button>\n          <Button variant=\"primary\" onClick={handleSubmit}>\n            {t('modal.doneButton')}\n          </Button>\n        </ActionsLayout>\n      }\n    >\n      <FormProvider {...formHandlers}>\n        <div className={styles.content}>\n          <Heading as=\"h2\">{t('modal.title')}</Heading>\n\n          <div className={styles.section}>\n            <Heading as=\"h3\">{t('modal.regularSection.title')}</Heading>\n            <Text variant=\"supporting\">{t('modal.regularSection.subtitle')}</Text>\n\n            <div className={styles.rateInfo}>\n              <Text weight=\"semibold\">{t('modal.regularSection.rateLabel')}</Text>\n              <Text variant=\"supporting\">{t('modal.regularSection.rateDescription')}</Text>\n            </div>\n\n            <SelectField\n              name=\"withholdingPayPeriod\"\n              label={t('modal.regularSection.rateLabel')}\n              options={frequencyOptions}\n              shouldVisuallyHideLabel\n              portalContainer={modalContainerRef.current ?? undefined}\n            />\n          </div>\n\n          <hr className={styles.divider} />\n\n          <div className={styles.section}>\n            <Heading as=\"h3\">{t('modal.supplementalSection.title')}</Heading>\n            <RadioGroupField\n              name=\"withholdingRate\"\n              label={t('modal.supplementalSection.title')}\n              options={withholdingRateOptions}\n              shouldVisuallyHideLabel\n            />\n          </div>\n        </div>\n      </FormProvider>\n    </Modal>\n  )\n}\n"],"names":["OffCycleTaxWithholdingModal","isOpen","defaultConfig","onDone","onCancel","useI18n","t","useTranslation","Modal","Heading","Text","Button","useComponentContext","modalContainerRef","useRef","formHandlers","useForm","currentWithholdingPayPeriod","useWatch","frequencyOptions","useMemo","WithholdingPayPeriod","value","WITHHOLDING_PAY_PERIOD_I18N_KEY","frequencyDisplayText","withholdingRateOptions","handleSubmit","jsx","ActionsLayout","FormProvider","styles","jsxs","SelectField","RadioGroupField"],"mappings":"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"}

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerAlerts.js

@@ -3,15 +3,16 @@ import { useTranslation as A } from "react-i18next";
 import { hasActionableBlockers as K, getBlockerTranslationKeys as P, isActionableBlocker as D } from "../payrollHelpers.js";
 import { useComponentContext as C } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { Flex as B } from "../../../Common/Flex/Flex.js";
+import "react";
 import { useI18n as I } from "../../../../i18n/I18n.js";
-function H({
+function M({
   blockers: o,
   onViewBlockersClick: i,
   viewBlockersLabel: y,
   className: a
 }) {
   I("Payroll.PayrollBlocker");
-  const { t } = A("Payroll.PayrollBlocker"), { Alert: d, Button: p, Text: u, UnorderedList: x } = C();
+  const { t } = A("Payroll.PayrollBlocker"), { Alert: p, Button: d, Text: u, UnorderedList: x } = C();
   if (o.length === 0)
     return null;
   const s = o.length > 1, h = !!i && (s || K(o)), m = o.map((r) => {
@@ -28,26 +29,26 @@ function H({
     };
   }), n = y || t(s ? "viewAllBlockers" : "viewBlocker"), l = m[0];
   if (!s && l)
-    return /* @__PURE__ */ e(d, { status: "error", label: l.title, className: a, children: /* @__PURE__ */ f(B, { flexDirection: "column", gap: 8, children: [
+    return /* @__PURE__ */ e(p, { status: "error", label: l.title, className: a, children: /* @__PURE__ */ f(B, { flexDirection: "column", gap: 8, children: [
       /* @__PURE__ */ e(u, { children: l.description }),
       l.helpText && l.helpText !== l.description && /* @__PURE__ */ e(u, { variant: "supporting", size: "sm", children: l.helpText }),
-      h && /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(p, { variant: "secondary", onClick: i, title: n, children: n }) })
+      h && /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(d, { variant: "secondary", onClick: i, title: n, children: n }) })
     ] }) });
   const g = m.map((r) => r.title);
   return /* @__PURE__ */ e(
-    d,
+    p,
     {
       status: "error",
       label: t("multipleIssuesTitle", { count: o.length }),
       className: a,
       children: /* @__PURE__ */ f(B, { flexDirection: "column", gap: 16, children: [
         /* @__PURE__ */ e(x, { items: g }),
-        h && /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(p, { variant: "secondary", onClick: i, title: n, children: n }) })
+        h && /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(d, { variant: "secondary", onClick: i, title: n, children: n }) })
       ] })
     }
   );
 }
 export {
-  H as PayrollBlockerAlerts
+  M as PayrollBlockerAlerts
 };
 //# sourceMappingURL=PayrollBlockerAlerts.js.map

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerAlerts.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayrollBlockerAlerts.js","sources":["../../../../../src/components/Payroll/PayrollBlocker/components/PayrollBlockerAlerts.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport {\n  type ApiPayrollBlocker,\n  getBlockerTranslationKeys,\n  hasActionableBlockers,\n  isActionableBlocker,\n} from '../payrollHelpers'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex } from '@/components/Common'\nimport { useI18n } from '@/i18n'\n\ninterface PayrollBlockerAlertsProps {\n  blockers: ApiPayrollBlocker[]\n  className?: string\n  onViewBlockersClick?: () => void\n  viewBlockersLabel?: string\n}\n\nexport function PayrollBlockerAlerts({\n  blockers,\n  onViewBlockersClick,\n  viewBlockersLabel,\n  className,\n}: PayrollBlockerAlertsProps) {\n  useI18n('Payroll.PayrollBlocker')\n  const { t } = useTranslation('Payroll.PayrollBlocker')\n  const { Alert, Button, Text, UnorderedList } = useComponentContext()\n\n  if (blockers.length === 0) {\n    return null\n  }\n\n  const hasMultipleBlockers = blockers.length > 1\n  const showViewBlockersCta =\n    Boolean(onViewBlockersClick) && (hasMultipleBlockers || hasActionableBlockers(blockers))\n\n  const enrichedBlockers = blockers.map(blocker => {\n    const translationKeys = getBlockerTranslationKeys(blocker.key)\n\n    const title = t(translationKeys.titleKey, {\n      defaultValue: t('defaultBlockerDescription'),\n    })\n    const description = t(translationKeys.descriptionKey, {\n      defaultValue: blocker.message || t('defaultBlockerDescription'),\n    })\n    const helpText = isActionableBlocker(blocker.key)\n      ? undefined\n      : t(translationKeys.helpTextKey, { defaultValue: t('defaultBlockerHelp') })\n\n    return {\n      ...blocker,\n      title,\n      description,\n      helpText,\n    }\n  })\n\n  const ctaLabel = viewBlockersLabel || t(hasMultipleBlockers ? 'viewAllBlockers' : 'viewBlocker')\n\n  const singleBlocker = enrichedBlockers[0]\n\n  if (!hasMultipleBlockers && singleBlocker) {\n    return (\n      <Alert status=\"error\" label={singleBlocker.title} className={className}>\n        <Flex flexDirection=\"column\" gap={8}>\n          <Text>{singleBlocker.description}</Text>\n          {singleBlocker.helpText && singleBlocker.helpText !== singleBlocker.description && (\n            <Text variant=\"supporting\" size=\"sm\">\n              {singleBlocker.helpText}\n            </Text>\n          )}\n          {showViewBlockersCta && (\n            <div>\n              <Button variant=\"secondary\" onClick={onViewBlockersClick} title={ctaLabel}>\n                {ctaLabel}\n              </Button>\n            </div>\n          )}\n        </Flex>\n      </Alert>\n    )\n  }\n\n  const listItems = enrichedBlockers.map(blocker => blocker.title)\n\n  return (\n    <Alert\n      status=\"error\"\n      label={t('multipleIssuesTitle', { count: blockers.length })}\n      className={className}\n    >\n      <Flex flexDirection=\"column\" gap={16}>\n        <UnorderedList items={listItems} />\n        {showViewBlockersCta && (\n          <div>\n            <Button variant=\"secondary\" onClick={onViewBlockersClick} title={ctaLabel}>\n              {ctaLabel}\n            </Button>\n          </div>\n        )}\n      </Flex>\n    </Alert>\n  )\n}\n"],"names":["PayrollBlockerAlerts","blockers","onViewBlockersClick","viewBlockersLabel","className","useI18n","useTranslation","Alert","Button","Text","UnorderedList","useComponentContext","hasMultipleBlockers","showViewBlockersCta","hasActionableBlockers","enrichedBlockers","blocker","translationKeys","getBlockerTranslationKeys","title","description","helpText","isActionableBlocker","ctaLabel","singleBlocker","jsx","jsxs","Flex","listItems"],"mappings":";;;;;;AAkBO,SAASA,EAAqB;AAAA,EACnC,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,WAAAC;AACF,GAA8B;AAC5B,EAAAC,EAAQ,wBAAwB;AAChC,QAAM,EAAE,EAAA,IAAMC,EAAe,wBAAwB,GAC/C,EAAE,OAAAC,GAAO,QAAAC,GAAQ,MAAAC,GAAM,eAAAC,EAAA,IAAkBC,EAAA;AAE/C,MAAIV,EAAS,WAAW;AACtB,WAAO;AAGT,QAAMW,IAAsBX,EAAS,SAAS,GACxCY,IACJ,EAAQX,MAAyBU,KAAuBE,EAAsBb,CAAQ,IAElFc,IAAmBd,EAAS,IAAI,CAAAe,MAAW;AAC/C,UAAMC,IAAkBC,EAA0BF,EAAQ,GAAG,GAEvDG,IAAQ,EAAEF,EAAgB,UAAU;AAAA,MACxC,cAAc,EAAE,2BAA2B;AAAA,IAAA,CAC5C,GACKG,IAAc,EAAEH,EAAgB,gBAAgB;AAAA,MACpD,cAAcD,EAAQ,WAAW,EAAE,2BAA2B;AAAA,IAAA,CAC/D,GACKK,IAAWC,EAAoBN,EAAQ,GAAG,IAC5C,SACA,EAAEC,EAAgB,aAAa,EAAE,cAAc,EAAE,oBAAoB,GAAG;AAE5E,WAAO;AAAA,MACL,GAAGD;AAAA,MACH,OAAAG;AAAA,MACA,aAAAC;AAAA,MACA,UAAAC;AAAA,IAAA;AAAA,EAEJ,CAAC,GAEKE,IAAWpB,KAAqB,EAAES,IAAsB,oBAAoB,aAAa,GAEzFY,IAAgBT,EAAiB,CAAC;AAExC,MAAI,CAACH,KAAuBY;AAC1B,WACE,gBAAAC,EAAClB,GAAA,EAAM,QAAO,SAAQ,OAAOiB,EAAc,OAAO,WAAApB,GAChD,UAAA,gBAAAsB,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAF,EAAChB,GAAA,EAAM,YAAc,YAAA,CAAY;AAAA,MAChCe,EAAc,YAAYA,EAAc,aAAaA,EAAc,eAClE,gBAAAC,EAAChB,GAAA,EAAK,SAAQ,cAAa,MAAK,MAC7B,YAAc,UACjB;AAAA,MAEDI,KACC,gBAAAY,EAAC,OAAA,EACC,UAAA,gBAAAA,EAACjB,GAAA,EAAO,SAAQ,aAAY,SAASN,GAAqB,OAAOqB,GAC9D,UAAAA,EAAA,CACH,EAAA,CACF;AAAA,IAAA,EAAA,CAEJ,EAAA,CACF;AAIJ,QAAMK,IAAYb,EAAiB,IAAI,CAAAC,MAAWA,EAAQ,KAAK;AAE/D,SACE,gBAAAS;AAAA,IAAClB;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,OAAO,EAAE,uBAAuB,EAAE,OAAON,EAAS,QAAQ;AAAA,MAC1D,WAAAG;AAAA,MAEA,UAAA,gBAAAsB,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,QAAA,gBAAAF,EAACf,GAAA,EAAc,OAAOkB,EAAA,CAAW;AAAA,QAChCf,KACC,gBAAAY,EAAC,OAAA,EACC,UAAA,gBAAAA,EAACjB,GAAA,EAAO,SAAQ,aAAY,SAASN,GAAqB,OAAOqB,GAC9D,UAAAA,EAAA,CACH,EAAA,CACF;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"PayrollBlockerAlerts.js","sources":["../../../../../src/components/Payroll/PayrollBlocker/components/PayrollBlockerAlerts.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport {\n  type ApiPayrollBlocker,\n  getBlockerTranslationKeys,\n  hasActionableBlockers,\n  isActionableBlocker,\n} from '../payrollHelpers'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex } from '@/components/Common'\nimport { useI18n } from '@/i18n'\n\ninterface PayrollBlockerAlertsProps {\n  blockers: ApiPayrollBlocker[]\n  className?: string\n  onViewBlockersClick?: () => void\n  viewBlockersLabel?: string\n}\n\nexport function PayrollBlockerAlerts({\n  blockers,\n  onViewBlockersClick,\n  viewBlockersLabel,\n  className,\n}: PayrollBlockerAlertsProps) {\n  useI18n('Payroll.PayrollBlocker')\n  const { t } = useTranslation('Payroll.PayrollBlocker')\n  const { Alert, Button, Text, UnorderedList } = useComponentContext()\n\n  if (blockers.length === 0) {\n    return null\n  }\n\n  const hasMultipleBlockers = blockers.length > 1\n  const showViewBlockersCta =\n    Boolean(onViewBlockersClick) && (hasMultipleBlockers || hasActionableBlockers(blockers))\n\n  const enrichedBlockers = blockers.map(blocker => {\n    const translationKeys = getBlockerTranslationKeys(blocker.key)\n\n    const title = t(translationKeys.titleKey, {\n      defaultValue: t('defaultBlockerDescription'),\n    })\n    const description = t(translationKeys.descriptionKey, {\n      defaultValue: blocker.message || t('defaultBlockerDescription'),\n    })\n    const helpText = isActionableBlocker(blocker.key)\n      ? undefined\n      : t(translationKeys.helpTextKey, { defaultValue: t('defaultBlockerHelp') })\n\n    return {\n      ...blocker,\n      title,\n      description,\n      helpText,\n    }\n  })\n\n  const ctaLabel = viewBlockersLabel || t(hasMultipleBlockers ? 'viewAllBlockers' : 'viewBlocker')\n\n  const singleBlocker = enrichedBlockers[0]\n\n  if (!hasMultipleBlockers && singleBlocker) {\n    return (\n      <Alert status=\"error\" label={singleBlocker.title} className={className}>\n        <Flex flexDirection=\"column\" gap={8}>\n          <Text>{singleBlocker.description}</Text>\n          {singleBlocker.helpText && singleBlocker.helpText !== singleBlocker.description && (\n            <Text variant=\"supporting\" size=\"sm\">\n              {singleBlocker.helpText}\n            </Text>\n          )}\n          {showViewBlockersCta && (\n            <div>\n              <Button variant=\"secondary\" onClick={onViewBlockersClick} title={ctaLabel}>\n                {ctaLabel}\n              </Button>\n            </div>\n          )}\n        </Flex>\n      </Alert>\n    )\n  }\n\n  const listItems = enrichedBlockers.map(blocker => blocker.title)\n\n  return (\n    <Alert\n      status=\"error\"\n      label={t('multipleIssuesTitle', { count: blockers.length })}\n      className={className}\n    >\n      <Flex flexDirection=\"column\" gap={16}>\n        <UnorderedList items={listItems} />\n        {showViewBlockersCta && (\n          <div>\n            <Button variant=\"secondary\" onClick={onViewBlockersClick} title={ctaLabel}>\n              {ctaLabel}\n            </Button>\n          </div>\n        )}\n      </Flex>\n    </Alert>\n  )\n}\n"],"names":["PayrollBlockerAlerts","blockers","onViewBlockersClick","viewBlockersLabel","className","useI18n","useTranslation","Alert","Button","Text","UnorderedList","useComponentContext","hasMultipleBlockers","showViewBlockersCta","hasActionableBlockers","enrichedBlockers","blocker","translationKeys","getBlockerTranslationKeys","title","description","helpText","isActionableBlocker","ctaLabel","singleBlocker","jsx","jsxs","Flex","listItems"],"mappings":";;;;;;;AAkBO,SAASA,EAAqB;AAAA,EACnC,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,WAAAC;AACF,GAA8B;AAC5B,EAAAC,EAAQ,wBAAwB;AAChC,QAAM,EAAE,EAAA,IAAMC,EAAe,wBAAwB,GAC/C,EAAE,OAAAC,GAAO,QAAAC,GAAQ,MAAAC,GAAM,eAAAC,EAAA,IAAkBC,EAAA;AAE/C,MAAIV,EAAS,WAAW;AACtB,WAAO;AAGT,QAAMW,IAAsBX,EAAS,SAAS,GACxCY,IACJ,EAAQX,MAAyBU,KAAuBE,EAAsBb,CAAQ,IAElFc,IAAmBd,EAAS,IAAI,CAAAe,MAAW;AAC/C,UAAMC,IAAkBC,EAA0BF,EAAQ,GAAG,GAEvDG,IAAQ,EAAEF,EAAgB,UAAU;AAAA,MACxC,cAAc,EAAE,2BAA2B;AAAA,IAAA,CAC5C,GACKG,IAAc,EAAEH,EAAgB,gBAAgB;AAAA,MACpD,cAAcD,EAAQ,WAAW,EAAE,2BAA2B;AAAA,IAAA,CAC/D,GACKK,IAAWC,EAAoBN,EAAQ,GAAG,IAC5C,SACA,EAAEC,EAAgB,aAAa,EAAE,cAAc,EAAE,oBAAoB,GAAG;AAE5E,WAAO;AAAA,MACL,GAAGD;AAAA,MACH,OAAAG;AAAA,MACA,aAAAC;AAAA,MACA,UAAAC;AAAA,IAAA;AAAA,EAEJ,CAAC,GAEKE,IAAWpB,KAAqB,EAAES,IAAsB,oBAAoB,aAAa,GAEzFY,IAAgBT,EAAiB,CAAC;AAExC,MAAI,CAACH,KAAuBY;AAC1B,WACE,gBAAAC,EAAClB,GAAA,EAAM,QAAO,SAAQ,OAAOiB,EAAc,OAAO,WAAApB,GAChD,UAAA,gBAAAsB,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAF,EAAChB,GAAA,EAAM,YAAc,YAAA,CAAY;AAAA,MAChCe,EAAc,YAAYA,EAAc,aAAaA,EAAc,eAClE,gBAAAC,EAAChB,GAAA,EAAK,SAAQ,cAAa,MAAK,MAC7B,YAAc,UACjB;AAAA,MAEDI,KACC,gBAAAY,EAAC,OAAA,EACC,UAAA,gBAAAA,EAACjB,GAAA,EAAO,SAAQ,aAAY,SAASN,GAAqB,OAAOqB,GAC9D,UAAAA,EAAA,CACH,EAAA,CACF;AAAA,IAAA,EAAA,CAEJ,EAAA,CACF;AAIJ,QAAMK,IAAYb,EAAiB,IAAI,CAAAC,MAAWA,EAAQ,KAAK;AAE/D,SACE,gBAAAS;AAAA,IAAClB;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,OAAO,EAAE,uBAAuB,EAAE,OAAON,EAAS,QAAQ;AAAA,MAC1D,WAAAG;AAAA,MAEA,UAAA,gBAAAsB,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,QAAA,gBAAAF,EAACf,GAAA,EAAc,OAAOkB,EAAA,CAAW;AAAA,QAChCf,KACC,gBAAAY,EAAC,OAAA,EACC,UAAA,gBAAAA,EAACjB,GAAA,EAAO,SAAQ,aAAY,SAASN,GAAqB,OAAOqB,GAC9D,UAAAA,EAAA,CACH,EAAA,CACF;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.js

@@ -8,16 +8,16 @@ import $ from "./PayrollConfigurationPresentation.module.scss.js";
 import { useI18n as ee } from "../../../i18n/I18n.js";
 import { Flex as u, FlexItem as h } from "../../Common/Flex/Flex.js";
 import { Grid as te } from "../../Common/Grid/Grid.js";
-import { useComponentContext as re } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import ne from "../../../assets/icons/pencil.svg.js";
-import oe from "../../../assets/icons/x-circle.svg.js";
-import ie from "../../../assets/icons/plus-circle.svg.js";
-import le from "../../../assets/icons/coins-hand.svg.js";
-import { formatNumberAsCurrency as b, firstLastName as ae } from "../../../helpers/formattedStrings.js";
-import { useDateFormatter as se } from "../../../hooks/useDateFormatter.js";
-import me from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
-import { PayrollLoading as ce } from "../../Common/PayrollLoading/PayrollLoading.js";
-import { HamburgerMenu as ue } from "../../Common/HamburgerMenu/HamburgerMenu.js";
+import { HamburgerMenu as re } from "../../Common/HamburgerMenu/HamburgerMenu.js";
+import { useComponentContext as ne } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import oe from "../../../assets/icons/pencil.svg.js";
+import ie from "../../../assets/icons/x-circle.svg.js";
+import le from "../../../assets/icons/plus-circle.svg.js";
+import ae from "../../../assets/icons/coins-hand.svg.js";
+import { formatNumberAsCurrency as b, firstLastName as se } from "../../../helpers/formattedStrings.js";
+import { useDateFormatter as me } from "../../../hooks/useDateFormatter.js";
+import ce from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
+import { PayrollLoading as ue } from "../../Common/PayrollLoading/PayrollLoading.js";
 import { DataView as de } from "../../Common/DataView/DataView.js";
 const pe = (i, p) => i?.startDate && i.endDate ? p.formatPayPeriod(i.startDate, i.endDate) : { startDate: "", endDate: "" }, Ge = ({
   employeeCompensations: i,
@@ -40,11 +40,11 @@ const pe = (i, p) => i?.startDate && i.endDate ? p.formatPayPeriod(i.startDate,
   grossUpEnabled: B = !1,
   onGrossUpSelect: j
 }) => {
-  const { Button: k, Heading: T, Text: d, Badge: G, Alert: I } = re();
+  const { Button: k, Heading: T, Text: d, Badge: G, Alert: I } = ne();
   ee("Payroll.PayrollConfiguration");
-  const { t } = _("Payroll.PayrollConfiguration"), S = se(), L = K(), v = V(null), a = me({ ref: v }).includes("small"), c = new Map(p.map((e) => [e.uuid, e])), A = (e) => {
+  const { t } = _("Payroll.PayrollConfiguration"), S = me(), L = K(), v = V(null), a = ce({ ref: v }).includes("small"), c = new Map(p.map((e) => [e.uuid, e])), A = (e) => {
     const n = c.get(e);
-    return n ? ae({ first_name: n.firstName, last_name: n.lastName }) : null;
+    return n ? se({ first_name: n.firstName, last_name: n.lastName }) : null;
   };
   return /* @__PURE__ */ r("div", { ref: v, className: $.container, children: /* @__PURE__ */ o(u, { flexDirection: "column", gap: 32, children: [
     /* @__PURE__ */ o(
@@ -95,7 +95,7 @@ const pe = (i, p) => i?.startDate && i.endDate ? p.formatPayPeriod(i.startDate,
       C
     ] }),
     y ? /* @__PURE__ */ r(
-      ce,
+      ue,
       {
         title: t(l ? "calculatingTitle" : "loadingTitle"),
         description: t(l ? "calculatingDescription" : "loadingDescription")
@@ -175,12 +175,12 @@ const pe = (i, p) => i?.startDate && i.endDate ? p.formatPayPeriod(i.startDate,
             ],
             data: i,
             itemMenu: (e) => /* @__PURE__ */ r(
-              ue,
+              re,
               {
                 items: [
                   {
                     label: t("editMenu.edit"),
-                    icon: /* @__PURE__ */ r(ne, { "aria-hidden": !0 }),
+                    icon: /* @__PURE__ */ r(oe, { "aria-hidden": !0 }),
                     onClick: () => {
                       const n = c.get(e.employeeUuid || "");
                       n && E(n);
@@ -188,7 +188,7 @@ const pe = (i, p) => i?.startDate && i.endDate ? p.formatPayPeriod(i.startDate,
                   },
                   {
                     label: t(e.excluded ? "editMenu.unskip" : "editMenu.skip"),
-                    icon: e.excluded ? /* @__PURE__ */ r(ie, { "aria-hidden": !0 }) : /* @__PURE__ */ r(oe, { "aria-hidden": !0 }),
+                    icon: e.excluded ? /* @__PURE__ */ r(le, { "aria-hidden": !0 }) : /* @__PURE__ */ r(ie, { "aria-hidden": !0 }),
                     onClick: () => {
                       c.get(e.employeeUuid || "") && R(e);
                     }
@@ -196,7 +196,7 @@ const pe = (i, p) => i?.startDate && i.endDate ? p.formatPayPeriod(i.startDate,
                   ...B ? [
                     {
                       label: t("editMenu.setNetEarnings"),
-                      icon: /* @__PURE__ */ r(le, { "aria-hidden": !0 }),
+                      icon: /* @__PURE__ */ r(ae, { "aria-hidden": !0 }),
                       onClick: () => {
                         e.employeeUuid && j?.(e.employeeUuid);
                       }