@gusto/embedded-react-sdk 0.34.0 → 0.35.0-rc.2

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

@@ -1 +1 @@
-{"version":3,"file":"OffCycleCreation.js","sources":["../../../../src/components/Payroll/OffCycleCreation/OffCycleCreation.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react'\nimport { FormProvider, useForm, type Resolver } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { useTranslation } from 'react-i18next'\nimport { usePayrollsCreateOffCycleMutation } from '@gusto/embedded-api/react-query/payrollsCreateOffCycle'\nimport { OffCycleReason as ApiOffCycleReason } from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport { OFF_CYCLE_REASON_DEFAULTS, type OffCycleReason } from '../OffCycleReasonSelection'\nimport {\n  createOffCyclePayPeriodDateFormSchema,\n  type OffCyclePayrollDateType,\n} from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormTypes'\nimport { useOffCyclePayPeriodDateValidation } from '../OffCyclePayPeriodDateForm/useOffCyclePayPeriodDateValidation'\nimport type { OffCycleCreationFormData, OffCycleCreationProps } from './OffCycleCreationTypes'\nimport { OffCycleCreationPresentation } from './OffCycleCreationPresentation'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { Form } from '@/components/Common/Form'\nimport type { MultiSelectComboBoxOption } from '@/components/Common/UI/MultiSelectComboBox/MultiSelectComboBoxTypes'\n\nconst LOCAL_TO_API_REASON: Record<OffCycleReason, ApiOffCycleReason> = {\n  bonus: ApiOffCycleReason.Bonus,\n  correction: ApiOffCycleReason.Correction,\n}\n\nexport function OffCycleCreation(props: OffCycleCreationProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ dictionary, companyId, payrollType = 'bonus' }: OffCycleCreationProps) {\n  useComponentDictionary('Payroll.OffCycleCreation', dictionary)\n  useI18n('Payroll.OffCycleCreation')\n  useI18n('Payroll.OffCycleReasonSelection')\n  useI18n('Payroll.OffCyclePayPeriodDateForm')\n  useI18n('Payroll.OffCycleDeductionsSetting')\n  useI18n('Payroll.EmployeeSelection')\n\n  const { t } = useTranslation('Payroll.OffCyclePayPeriodDateForm')\n  const { t: tCreation } = useTranslation('Payroll.OffCycleCreation')\n  const { onEvent, baseSubmitHandler } = useBase()\n\n  const { minCheckDate, today } = useOffCyclePayPeriodDateValidation()\n  const { mutateAsync: createOffCyclePayroll, isPending } = usePayrollsCreateOffCycleMutation()\n\n  const { data: employeesData, isLoading: isLoadingEmployees } = useEmployeesListSuspense({\n    companyId,\n    onboardedActive: true,\n  })\n\n  const employees: MultiSelectComboBoxOption[] = useMemo(() => {\n    const employeeList = employeesData.showEmployees ?? []\n    return employeeList.map(employee => {\n      const fullName = [employee.firstName, employee.lastName].filter(Boolean).join(' ')\n      return {\n        label: fullName,\n        value: employee.uuid,\n      }\n    })\n  }, [employeesData])\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const translateValidation = (key: string): string => t(key as any) as string\n\n  const dynamicResolver: Resolver<OffCycleCreationFormData> = (values, context, options) => {\n    const reason = values.reason\n    const isCheckOnly = values.isCheckOnly\n    const resolvedPayrollType: OffCyclePayrollDateType =\n      reason === 'correction' ? 'correction' : payrollType\n\n    const dateSchema = createOffCyclePayPeriodDateFormSchema(\n      translateValidation,\n      resolvedPayrollType,\n      isCheckOnly ? today : minCheckDate,\n    )\n    const schema = z\n      .object({\n        reason: z.enum(['bonus', 'correction']),\n        skipRegularDeductions: z.boolean(),\n        includeAllEmployees: z.boolean(),\n        selectedEmployeeUuids: z.array(z.string()),\n      })\n      .and(dateSchema)\n      .superRefine((data, ctx) => {\n        if (!data.includeAllEmployees && data.selectedEmployeeUuids.length === 0) {\n          ctx.addIssue({\n            code: z.ZodIssueCode.custom,\n            path: ['selectedEmployeeUuids'],\n            message: tCreation('errors.noEmployeesSelected'),\n          })\n        }\n      })\n\n    return zodResolver(schema)(values, context, options)\n  }\n\n  const methods = useForm<OffCycleCreationFormData>({\n    resolver: dynamicResolver,\n    defaultValues: {\n      reason: payrollType,\n      isCheckOnly: false,\n      startDate: null,\n      endDate: null,\n      checkDate: null,\n      skipRegularDeductions: OFF_CYCLE_REASON_DEFAULTS[payrollType].skipDeductions,\n      includeAllEmployees: true,\n      selectedEmployeeUuids: [],\n    },\n  })\n\n  const watchedReason = methods.watch('reason')\n\n  useEffect(() => {\n    methods.setValue(\n      'skipRegularDeductions',\n      OFF_CYCLE_REASON_DEFAULTS[watchedReason].skipDeductions,\n    )\n  }, [watchedReason, methods])\n\n  const onSubmit = async (data: OffCycleCreationFormData) => {\n    const reason = data.reason\n    const checkDate = data.checkDate!\n    const startDate = data.isCheckOnly ? checkDate : data.startDate!\n    const endDate = data.isCheckOnly ? checkDate : data.endDate!\n    const employeeUuids =\n      !data.includeAllEmployees && data.selectedEmployeeUuids.length > 0\n        ? data.selectedEmployeeUuids\n        : undefined\n\n    await baseSubmitHandler(data, async () => {\n      const response = await createOffCyclePayroll({\n        request: {\n          companyId,\n          requestBody: {\n            offCycle: true,\n            offCycleReason: LOCAL_TO_API_REASON[reason],\n            startDate: new RFCDate(startDate),\n            endDate: new RFCDate(endDate),\n            checkDate: new RFCDate(checkDate),\n            skipRegularDeductions: data.skipRegularDeductions,\n            isCheckOnlyPayroll: data.isCheckOnly,\n            employeeUuids,\n          },\n        },\n      })\n\n      const payrollUuid = response.payrollPrepared?.payrollUuid ?? response.payrollPrepared?.uuid\n\n      if (!payrollUuid) {\n        throw new Error(tCreation('errors.missingPayrollId'))\n      }\n\n      onEvent(componentEvents.OFF_CYCLE_CREATED, { payrollUuid })\n    })\n  }\n\n  return (\n    <FormProvider {...methods}>\n      <Form onSubmit={methods.handleSubmit(onSubmit)}>\n        <OffCycleCreationPresentation\n          employees={employees}\n          isLoadingEmployees={isLoadingEmployees}\n          isPending={isPending}\n        />\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["LOCAL_TO_API_REASON","ApiOffCycleReason","OffCycleCreation","props","jsx","BaseComponent","Root","dictionary","companyId","payrollType","useComponentDictionary","useI18n","t","useTranslation","tCreation","onEvent","baseSubmitHandler","useBase","minCheckDate","today","useOffCyclePayPeriodDateValidation","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","employeesData","isLoadingEmployees","useEmployeesListSuspense","employees","useMemo","employee","translateValidation","key","methods","useForm","values","context","options","reason","isCheckOnly","dateSchema","createOffCyclePayPeriodDateFormSchema","schema","z","data","ctx","zodResolver","OFF_CYCLE_REASON_DEFAULTS","watchedReason","useEffect","onSubmit","checkDate","startDate","endDate","employeeUuids","response","RFCDate","payrollUuid","componentEvents","FormProvider","Form","OffCycleCreationPresentation"],"mappings":"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"}
+{"version":3,"file":"OffCycleCreation.js","sources":["../../../../src/components/Payroll/OffCycleCreation/OffCycleCreation.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react'\nimport { FormProvider, useForm, type Resolver } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { useTranslation } from 'react-i18next'\nimport { usePayrollsCreateOffCycleMutation } from '@gusto/embedded-api/react-query/payrollsCreateOffCycle'\nimport {\n  OffCycleReason as ApiOffCycleReason,\n  WithholdingPayPeriod,\n} from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport { OFF_CYCLE_REASON_DEFAULTS, type OffCycleReason } from '../OffCycleReasonSelection'\nimport {\n  createOffCyclePayPeriodDateFormSchema,\n  type OffCyclePayrollDateType,\n} from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormTypes'\nimport { useOffCyclePayPeriodDateValidation } from '../OffCyclePayPeriodDateForm/useOffCyclePayPeriodDateValidation'\nimport type { OffCycleTaxWithholdingConfig } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type { OffCycleCreationFormData, OffCycleCreationProps } from './OffCycleCreationTypes'\nimport { OffCycleCreationPresentation } from './OffCycleCreationPresentation'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { Form } from '@/components/Common/Form'\nimport type { MultiSelectComboBoxOption } from '@/components/Common/UI/MultiSelectComboBox/MultiSelectComboBoxTypes'\n\nconst LOCAL_TO_API_REASON: Record<OffCycleReason, ApiOffCycleReason> = {\n  bonus: ApiOffCycleReason.Bonus,\n  correction: ApiOffCycleReason.Correction,\n}\n\nexport function OffCycleCreation(props: OffCycleCreationProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ dictionary, companyId, payrollType = 'bonus' }: OffCycleCreationProps) {\n  useComponentDictionary('Payroll.OffCycleCreation', dictionary)\n  useI18n('Payroll.OffCycleCreation')\n  useI18n('Payroll.OffCycleReasonSelection')\n  useI18n('Payroll.OffCyclePayPeriodDateForm')\n  useI18n('Payroll.OffCycleDeductionsSetting')\n  useI18n('Payroll.EmployeeSelection')\n\n  const { t } = useTranslation('Payroll.OffCyclePayPeriodDateForm')\n  const { t: tCreation } = useTranslation('Payroll.OffCycleCreation')\n  const { onEvent, baseSubmitHandler } = useBase()\n\n  const { minCheckDate, today } = useOffCyclePayPeriodDateValidation()\n  const { mutateAsync: createOffCyclePayroll, isPending } = usePayrollsCreateOffCycleMutation()\n\n  const [taxWithholdingConfig, setTaxWithholdingConfig] = useState<OffCycleTaxWithholdingConfig>({\n    withholdingPayPeriod: WithholdingPayPeriod.EveryOtherWeek,\n    withholdingRate: OFF_CYCLE_REASON_DEFAULTS[payrollType].withholdingType,\n  })\n  const [isTaxWithholdingModalOpen, setIsTaxWithholdingModalOpen] = useState(false)\n\n  const handleTaxWithholdingEditClick = useCallback(() => {\n    setIsTaxWithholdingModalOpen(true)\n  }, [])\n\n  const handleTaxWithholdingModalDone = useCallback((config: OffCycleTaxWithholdingConfig) => {\n    setTaxWithholdingConfig(config)\n    setIsTaxWithholdingModalOpen(false)\n  }, [])\n\n  const handleTaxWithholdingModalCancel = useCallback(() => {\n    setIsTaxWithholdingModalOpen(false)\n  }, [])\n\n  const { data: employeesData, isLoading: isLoadingEmployees } = useEmployeesListSuspense({\n    companyId,\n    onboardedActive: true,\n  })\n\n  const employees: MultiSelectComboBoxOption[] = useMemo(() => {\n    const employeeList = employeesData.showEmployees ?? []\n    return employeeList.map(employee => {\n      const fullName = [employee.firstName, employee.lastName].filter(Boolean).join(' ')\n      return {\n        label: fullName,\n        value: employee.uuid,\n      }\n    })\n  }, [employeesData])\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const translateValidation = (key: string): string => t(key as any) as string\n\n  const dynamicResolver: Resolver<OffCycleCreationFormData> = (values, context, options) => {\n    const reason = values.reason\n    const isCheckOnly = values.isCheckOnly\n    const resolvedPayrollType: OffCyclePayrollDateType =\n      reason === 'correction' ? 'correction' : payrollType\n\n    const dateSchema = createOffCyclePayPeriodDateFormSchema(\n      translateValidation,\n      resolvedPayrollType,\n      isCheckOnly ? today : minCheckDate,\n    )\n    const schema = z\n      .object({\n        reason: z.enum(['bonus', 'correction']),\n        skipRegularDeductions: z.boolean(),\n        includeAllEmployees: z.boolean(),\n        selectedEmployeeUuids: z.array(z.string()),\n      })\n      .and(dateSchema)\n      .superRefine((data, ctx) => {\n        if (!data.includeAllEmployees && data.selectedEmployeeUuids.length === 0) {\n          ctx.addIssue({\n            code: z.ZodIssueCode.custom,\n            path: ['selectedEmployeeUuids'],\n            message: tCreation('errors.noEmployeesSelected'),\n          })\n        }\n      })\n\n    return zodResolver(schema)(values, context, options)\n  }\n\n  const methods = useForm<OffCycleCreationFormData>({\n    resolver: dynamicResolver,\n    defaultValues: {\n      reason: payrollType,\n      isCheckOnly: false,\n      startDate: null,\n      endDate: null,\n      checkDate: null,\n      skipRegularDeductions: OFF_CYCLE_REASON_DEFAULTS[payrollType].skipDeductions,\n      includeAllEmployees: true,\n      selectedEmployeeUuids: [],\n    },\n  })\n\n  const watchedReason = methods.watch('reason')\n\n  useEffect(() => {\n    methods.setValue(\n      'skipRegularDeductions',\n      OFF_CYCLE_REASON_DEFAULTS[watchedReason].skipDeductions,\n    )\n    setTaxWithholdingConfig(prev => ({\n      ...prev,\n      withholdingRate: OFF_CYCLE_REASON_DEFAULTS[watchedReason].withholdingType,\n    }))\n  }, [watchedReason, methods])\n\n  const onSubmit = async (data: OffCycleCreationFormData) => {\n    const reason = data.reason\n    const checkDate = data.checkDate!\n    const startDate = data.isCheckOnly ? checkDate : data.startDate!\n    const endDate = data.isCheckOnly ? checkDate : data.endDate!\n    const employeeUuids =\n      !data.includeAllEmployees && data.selectedEmployeeUuids.length > 0\n        ? data.selectedEmployeeUuids\n        : undefined\n\n    await baseSubmitHandler(data, async () => {\n      const response = await createOffCyclePayroll({\n        request: {\n          companyId,\n          requestBody: {\n            offCycle: true,\n            offCycleReason: LOCAL_TO_API_REASON[reason],\n            startDate: new RFCDate(startDate),\n            endDate: new RFCDate(endDate),\n            checkDate: new RFCDate(checkDate),\n            skipRegularDeductions: data.skipRegularDeductions,\n            isCheckOnlyPayroll: data.isCheckOnly,\n            employeeUuids,\n            withholdingPayPeriod: taxWithholdingConfig.withholdingPayPeriod,\n            fixedWithholdingRate: taxWithholdingConfig.withholdingRate === 'supplemental',\n          },\n        },\n      })\n\n      const payrollUuid = response.payrollPrepared?.payrollUuid ?? response.payrollPrepared?.uuid\n\n      if (!payrollUuid) {\n        throw new Error(tCreation('errors.missingPayrollId'))\n      }\n\n      onEvent(componentEvents.OFF_CYCLE_CREATED, { payrollUuid })\n    })\n  }\n\n  return (\n    <FormProvider {...methods}>\n      <Form onSubmit={methods.handleSubmit(onSubmit)}>\n        <OffCycleCreationPresentation\n          employees={employees}\n          isLoadingEmployees={isLoadingEmployees}\n          isPending={isPending}\n          taxWithholdingConfig={taxWithholdingConfig}\n          isTaxWithholdingModalOpen={isTaxWithholdingModalOpen}\n          onTaxWithholdingEditClick={handleTaxWithholdingEditClick}\n          onTaxWithholdingModalDone={handleTaxWithholdingModalDone}\n          onTaxWithholdingModalCancel={handleTaxWithholdingModalCancel}\n        />\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["LOCAL_TO_API_REASON","ApiOffCycleReason","OffCycleCreation","props","jsx","BaseComponent","Root","dictionary","companyId","payrollType","useComponentDictionary","useI18n","t","useTranslation","tCreation","onEvent","baseSubmitHandler","useBase","minCheckDate","today","useOffCyclePayPeriodDateValidation","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","taxWithholdingConfig","setTaxWithholdingConfig","useState","WithholdingPayPeriod","OFF_CYCLE_REASON_DEFAULTS","isTaxWithholdingModalOpen","setIsTaxWithholdingModalOpen","handleTaxWithholdingEditClick","useCallback","handleTaxWithholdingModalDone","config","handleTaxWithholdingModalCancel","employeesData","isLoadingEmployees","useEmployeesListSuspense","employees","useMemo","employee","translateValidation","key","methods","useForm","values","context","options","reason","isCheckOnly","dateSchema","createOffCyclePayPeriodDateFormSchema","schema","z","data","ctx","zodResolver","watchedReason","useEffect","prev","onSubmit","checkDate","startDate","endDate","employeeUuids","response","RFCDate","payrollUuid","componentEvents","FormProvider","Form","OffCycleCreationPresentation"],"mappings":"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"}

package/dist/components/Payroll/OffCycleCreation/OffCycleCreationPresentation.d.ts

@@ -1,2 +1,2 @@
 import { OffCycleCreationPresentationProps } from './OffCycleCreationTypes';
-export declare function OffCycleCreationPresentation({ employees, isLoadingEmployees, isPending, }: OffCycleCreationPresentationProps): import("react/jsx-runtime").JSX.Element;
+export declare function OffCycleCreationPresentation({ employees, isLoadingEmployees, isPending, taxWithholdingConfig, isTaxWithholdingModalOpen, onTaxWithholdingEditClick, onTaxWithholdingModalDone, onTaxWithholdingModalCancel, }: OffCycleCreationPresentationProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,81 +1,115 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { useCallback as b } from "react";
-import { useFormContext as D } from "react-hook-form";
-import { useTranslation as c } from "react-i18next";
-import { OffCyclePayPeriodDateFormPresentation as P } from "../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js";
-import { useI18n as a } from "../../../i18n/I18n.js";
-import { useComponentContext as E } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { Flex as o } from "../../Common/Flex/Flex.js";
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { useMemo as F, useCallback as G } from "react";
+import { useFormContext as w } from "react-hook-form";
+import { useTranslation as n } from "react-i18next";
+import { OffCyclePayPeriodDateFormPresentation as W } from "../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js";
+import { WAGE_TYPE_CATEGORIES as k } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js";
+import { useI18n as r } from "../../../i18n/I18n.js";
+import { useComponentContext as v } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { Flex as l } from "../../Common/Flex/Flex.js";
 import "classnames";
 import "../../../shared/constants.js";
-import { RadioGroupField as S } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { SwitchField as O } from "../../Common/Fields/SwitchField/SwitchField.js";
-import { OffCycleReasonSelectionPresentation as T } from "../OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js";
-import { MultiSelectComboBoxField as F } from "../../Common/Fields/MultiSelectComboBoxField/MultiSelectComboBoxField.js";
-function q({
-  employees: d,
-  isLoadingEmployees: u,
-  isPending: s
+import { RadioGroupField as L } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { SwitchField as R } from "../../Common/Fields/SwitchField/SwitchField.js";
+import { OffCycleReasonSelectionPresentation as j } from "../OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js";
+import { MultiSelectComboBoxField as I } from "../../Common/Fields/MultiSelectComboBoxField/MultiSelectComboBoxField.js";
+import { OffCycleTaxWithholdingTable as M } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js";
+import { OffCycleTaxWithholdingModal as V } from "../OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js";
+function ie({
+  employees: y,
+  isLoadingEmployees: h,
+  isPending: p,
+  taxWithholdingConfig: m,
+  isTaxWithholdingModalOpen: g,
+  onTaxWithholdingEditClick: C,
+  onTaxWithholdingModalDone: x,
+  onTaxWithholdingModalCancel: T
 }) {
-  a("Payroll.OffCycleCreation"), a("Payroll.OffCycleDeductionsSetting"), a("Payroll.EmployeeSelection");
-  const { t: l } = c("Payroll.OffCycleCreation"), { t: i } = c("Payroll.OffCycleDeductionsSetting"), { t } = c("Payroll.EmployeeSelection"), { Heading: m, Text: f, Button: y } = E(), { setValue: p, watch: h } = D(), g = h("includeAllEmployees"), C = b(
-    (n) => {
-      n && p("selectedEmployeeUuids", []);
+  r("Payroll.OffCycleCreation"), r("Payroll.OffCycleDeductionsSetting"), r("Payroll.EmployeeSelection"), r("Payroll.OffCycleTaxWithholding");
+  const { t: i } = n("Payroll.OffCycleCreation"), { t } = n("Payroll.OffCycleDeductionsSetting"), { t: a } = n("Payroll.EmployeeSelection"), { t: c } = n("Payroll.OffCycleTaxWithholding"), { Heading: d, Text: b, Button: D } = v(), E = F(
+    () => k.map((o) => {
+      const f = {
+        category: o,
+        label: c(`wageTypeGroups.${o}.label`)
+      };
+      return (o === "regular" || o === "supplemental") && (f.description = c(`wageTypeGroups.${o}.description`)), f;
+    }),
+    [c]
+  ), { setValue: u, watch: O } = w(), P = O("includeAllEmployees"), S = G(
+    (o) => {
+      o && u("selectedEmployeeUuids", []);
     },
-    [p]
-  ), x = [
+    [u]
+  ), A = [
     {
       value: !1,
-      label: i("options.include.label")
+      label: t("options.include.label")
     },
     {
       value: !0,
-      label: i("options.skip.label")
+      label: t("options.skip.label")
     }
   ];
-  return /* @__PURE__ */ r(o, { flexDirection: "column", gap: 32, children: [
-    /* @__PURE__ */ r(o, { flexDirection: "column", gap: 4, children: [
-      /* @__PURE__ */ e(m, { as: "h2", children: l("pageTitle") }),
-      /* @__PURE__ */ e(f, { variant: "supporting", children: l("pageDescription") })
+  return /* @__PURE__ */ s(l, { flexDirection: "column", gap: 32, children: [
+    /* @__PURE__ */ s(l, { flexDirection: "column", gap: 4, children: [
+      /* @__PURE__ */ e(d, { as: "h2", children: i("pageTitle") }),
+      /* @__PURE__ */ e(b, { variant: "supporting", children: i("pageDescription") })
     ] }),
-    /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(P, {}) }),
-    /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(T, { name: "reason" }) }),
-    /* @__PURE__ */ r(o, { flexDirection: "column", gap: 12, children: [
-      /* @__PURE__ */ e(m, { as: "h3", children: t("sectionTitle") }),
+    /* @__PURE__ */ e(l, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(W, {}) }),
+    /* @__PURE__ */ e(l, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(j, { name: "reason" }) }),
+    /* @__PURE__ */ s(l, { flexDirection: "column", gap: 12, children: [
+      /* @__PURE__ */ e(d, { as: "h3", children: a("sectionTitle") }),
       /* @__PURE__ */ e(
-        O,
+        R,
         {
           name: "includeAllEmployees",
-          label: l("includeAllEmployeesLabel"),
-          onChange: C
+          label: i("includeAllEmployeesLabel"),
+          onChange: S
         }
       ),
-      !g && /* @__PURE__ */ e(
-        F,
+      !P && /* @__PURE__ */ e(
+        I,
         {
           name: "selectedEmployeeUuids",
-          label: t("sectionTitle"),
+          label: a("sectionTitle"),
           shouldVisuallyHideLabel: !0,
-          placeholder: t("searchPlaceholder"),
-          options: d,
-          isLoading: u
+          placeholder: a("searchPlaceholder"),
+          options: y,
+          isLoading: h
         }
       )
     ] }),
-    /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(
-      S,
+    /* @__PURE__ */ e(l, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(
+      L,
       {
         name: "skipRegularDeductions",
-        label: i("title"),
-        description: i("description"),
-        options: x,
-        convertValueToString: (n) => String(n)
+        label: t("title"),
+        description: t("description"),
+        options: A,
+        convertValueToString: (o) => String(o)
       }
     ) }),
-    /* @__PURE__ */ e(o, { justifyContent: "flex-end", gap: 12, children: /* @__PURE__ */ e(y, { type: "submit", isLoading: s, isDisabled: s, children: l("continueCta") }) })
+    /* @__PURE__ */ e(
+      M,
+      {
+        wageTypeGroups: E,
+        config: m,
+        onEditClick: C
+      }
+    ),
+    g && /* @__PURE__ */ e(
+      V,
+      {
+        isOpen: !0,
+        defaultConfig: m,
+        onDone: x,
+        onCancel: T
+      }
+    ),
+    /* @__PURE__ */ e(l, { justifyContent: "flex-end", gap: 12, children: /* @__PURE__ */ e(D, { type: "submit", isLoading: p, isDisabled: p, children: i("continueCta") }) })
   ] });
 }
 export {
-  q as OffCycleCreationPresentation
+  ie as OffCycleCreationPresentation
 };
 //# sourceMappingURL=OffCycleCreationPresentation.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"OffCycleCreationPresentation.js","sources":["../../../../src/components/Payroll/OffCycleCreation/OffCycleCreationPresentation.tsx"],"sourcesContent":["import { useCallback } from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { OffCycleReasonSelectionPresentation } from '../OffCycleReasonSelection'\nimport { OffCyclePayPeriodDateFormPresentation } from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation'\nimport type {\n  OffCycleCreationFormData,\n  OffCycleCreationPresentationProps,\n} from './OffCycleCreationTypes'\nimport { useI18n } from '@/i18n'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, RadioGroupField, SwitchField, MultiSelectComboBoxField } from '@/components/Common'\n\nexport function OffCycleCreationPresentation({\n  employees,\n  isLoadingEmployees,\n  isPending,\n}: OffCycleCreationPresentationProps) {\n  useI18n('Payroll.OffCycleCreation')\n  useI18n('Payroll.OffCycleDeductionsSetting')\n  useI18n('Payroll.EmployeeSelection')\n  const { t } = useTranslation('Payroll.OffCycleCreation')\n  const { t: tDeductions } = useTranslation('Payroll.OffCycleDeductionsSetting')\n  const { t: tEmployees } = useTranslation('Payroll.EmployeeSelection')\n  const { Heading, Text, Button } = useComponentContext()\n\n  const { setValue, watch } = useFormContext<OffCycleCreationFormData>()\n  const includeAllEmployees = watch('includeAllEmployees')\n\n  const handleToggleIncludeAll = useCallback(\n    (checked: boolean) => {\n      if (checked) {\n        setValue('selectedEmployeeUuids', [])\n      }\n    },\n    [setValue],\n  )\n\n  const deductionsOptions = [\n    {\n      value: false,\n      label: tDeductions('options.include.label'),\n    },\n    {\n      value: true,\n      label: tDeductions('options.skip.label'),\n    },\n  ]\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={4}>\n        <Heading as=\"h2\">{t('pageTitle')}</Heading>\n        <Text variant=\"supporting\">{t('pageDescription')}</Text>\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={20}>\n        <OffCyclePayPeriodDateFormPresentation />\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={20}>\n        <OffCycleReasonSelectionPresentation name=\"reason\" />\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={12}>\n        <Heading as=\"h3\">{tEmployees('sectionTitle')}</Heading>\n        <SwitchField\n          name=\"includeAllEmployees\"\n          label={t('includeAllEmployeesLabel')}\n          onChange={handleToggleIncludeAll}\n        />\n        {!includeAllEmployees && (\n          <MultiSelectComboBoxField\n            name=\"selectedEmployeeUuids\"\n            label={tEmployees('sectionTitle')}\n            shouldVisuallyHideLabel\n            placeholder={tEmployees('searchPlaceholder')}\n            options={employees}\n            isLoading={isLoadingEmployees}\n          />\n        )}\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={20}>\n        <RadioGroupField<boolean>\n          name=\"skipRegularDeductions\"\n          label={tDeductions('title')}\n          description={tDeductions('description')}\n          options={deductionsOptions}\n          convertValueToString={value => String(value)}\n        />\n      </Flex>\n\n      <Flex justifyContent=\"flex-end\" gap={12}>\n        <Button type=\"submit\" isLoading={isPending} isDisabled={isPending}>\n          {t('continueCta')}\n        </Button>\n      </Flex>\n    </Flex>\n  )\n}\n"],"names":["OffCycleCreationPresentation","employees","isLoadingEmployees","isPending","useI18n","t","useTranslation","tDeductions","tEmployees","Heading","Text","Button","useComponentContext","setValue","watch","useFormContext","includeAllEmployees","handleToggleIncludeAll","useCallback","checked","deductionsOptions","jsxs","Flex","jsx","OffCyclePayPeriodDateFormPresentation","OffCycleReasonSelectionPresentation","SwitchField","MultiSelectComboBoxField","RadioGroupField","value"],"mappings":";;;;;;;;;;;;;;AAaO,SAASA,EAA6B;AAAA,EAC3C,WAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,WAAAC;AACF,GAAsC;AACpC,EAAAC,EAAQ,0BAA0B,GAClCA,EAAQ,mCAAmC,GAC3CA,EAAQ,2BAA2B;AACnC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,0BAA0B,GACjD,EAAE,GAAGC,MAAgBD,EAAe,mCAAmC,GACvE,EAAEE,MAAkBF,EAAe,2BAA2B,GAC9D,EAAE,SAAAG,GAAS,MAAAC,GAAM,QAAAC,EAAA,IAAWC,EAAA,GAE5B,EAAE,UAAAC,GAAU,OAAAC,EAAA,IAAUC,EAAA,GACtBC,IAAsBF,EAAM,qBAAqB,GAEjDG,IAAyBC;AAAA,IAC7B,CAACC,MAAqB;AACpB,MAAIA,KACFN,EAAS,yBAAyB,EAAE;AAAA,IAExC;AAAA,IACA,CAACA,CAAQ;AAAA,EAAA,GAGLO,IAAoB;AAAA,IACxB;AAAA,MACE,OAAO;AAAA,MACP,OAAOb,EAAY,uBAAuB;AAAA,IAAA;AAAA,IAE5C;AAAA,MACE,OAAO;AAAA,MACP,OAAOA,EAAY,oBAAoB;AAAA,IAAA;AAAA,EACzC;AAGF,SACE,gBAAAc,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,IAAA,gBAAAD,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAC,EAACd,GAAA,EAAQ,IAAG,MAAM,UAAAJ,EAAE,WAAW,GAAE;AAAA,wBAChCK,GAAA,EAAK,SAAQ,cAAc,UAAAL,EAAE,iBAAiB,EAAA,CAAE;AAAA,IAAA,GACnD;AAAA,IAEA,gBAAAkB,EAACD,KAAK,eAAc,UAAS,KAAK,IAChC,UAAA,gBAAAC,EAACC,KAAsC,EAAA,CACzC;AAAA,IAEA,gBAAAD,EAACD,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA,gBAAAC,EAACE,GAAA,EAAoC,MAAK,SAAA,CAAS,EAAA,CACrD;AAAA,IAEA,gBAAAJ,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,MAAA,gBAAAC,EAACd,GAAA,EAAQ,IAAG,MAAM,UAAAD,EAAW,cAAc,GAAE;AAAA,MAC7C,gBAAAe;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,OAAOrB,EAAE,0BAA0B;AAAA,UACnC,UAAUY;AAAA,QAAA;AAAA,MAAA;AAAA,MAEX,CAACD,KACA,gBAAAO;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,OAAOnB,EAAW,cAAc;AAAA,UAChC,yBAAuB;AAAA,UACvB,aAAaA,EAAW,mBAAmB;AAAA,UAC3C,SAASP;AAAA,UACT,WAAWC;AAAA,QAAA;AAAA,MAAA;AAAA,IACb,GAEJ;AAAA,IAEA,gBAAAqB,EAACD,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA,gBAAAC;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAOrB,EAAY,OAAO;AAAA,QAC1B,aAAaA,EAAY,aAAa;AAAA,QACtC,SAASa;AAAA,QACT,sBAAsB,CAAAS,MAAS,OAAOA,CAAK;AAAA,MAAA;AAAA,IAAA,GAE/C;AAAA,sBAECP,GAAA,EAAK,gBAAe,YAAW,KAAK,IACnC,UAAA,gBAAAC,EAACZ,GAAA,EAAO,MAAK,UAAS,WAAWR,GAAW,YAAYA,GACrD,UAAAE,EAAE,aAAa,GAClB,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"OffCycleCreationPresentation.js","sources":["../../../../src/components/Payroll/OffCycleCreation/OffCycleCreationPresentation.tsx"],"sourcesContent":["import { useCallback, useMemo } from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport { OffCycleReasonSelectionPresentation } from '../OffCycleReasonSelection'\nimport { OffCyclePayPeriodDateFormPresentation } from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation'\nimport { OffCycleTaxWithholdingTable } from '../OffCycleTaxWithholdingTable'\nimport { OffCycleTaxWithholdingModal } from '../OffCycleTaxWithholdingModal'\nimport {\n  WAGE_TYPE_CATEGORIES,\n  type WageTypeGroup,\n} from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type {\n  OffCycleCreationFormData,\n  OffCycleCreationPresentationProps,\n} from './OffCycleCreationTypes'\nimport { useI18n } from '@/i18n'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, RadioGroupField, SwitchField, MultiSelectComboBoxField } from '@/components/Common'\n\nexport function OffCycleCreationPresentation({\n  employees,\n  isLoadingEmployees,\n  isPending,\n  taxWithholdingConfig,\n  isTaxWithholdingModalOpen,\n  onTaxWithholdingEditClick,\n  onTaxWithholdingModalDone,\n  onTaxWithholdingModalCancel,\n}: OffCycleCreationPresentationProps) {\n  useI18n('Payroll.OffCycleCreation')\n  useI18n('Payroll.OffCycleDeductionsSetting')\n  useI18n('Payroll.EmployeeSelection')\n  useI18n('Payroll.OffCycleTaxWithholding')\n  const { t } = useTranslation('Payroll.OffCycleCreation')\n  const { t: tDeductions } = useTranslation('Payroll.OffCycleDeductionsSetting')\n  const { t: tEmployees } = useTranslation('Payroll.EmployeeSelection')\n  const { t: tWithholding } = useTranslation('Payroll.OffCycleTaxWithholding')\n  const { Heading, Text, Button } = useComponentContext()\n\n  const wageTypeGroups: WageTypeGroup[] = useMemo(\n    () =>\n      WAGE_TYPE_CATEGORIES.map(category => {\n        const group: WageTypeGroup = {\n          category,\n          label: tWithholding(`wageTypeGroups.${category}.label`),\n        }\n        if (category === 'regular' || category === 'supplemental') {\n          group.description = tWithholding(`wageTypeGroups.${category}.description`)\n        }\n        return group\n      }),\n    [tWithholding],\n  )\n\n  const { setValue, watch } = useFormContext<OffCycleCreationFormData>()\n  const includeAllEmployees = watch('includeAllEmployees')\n\n  const handleToggleIncludeAll = useCallback(\n    (checked: boolean) => {\n      if (checked) {\n        setValue('selectedEmployeeUuids', [])\n      }\n    },\n    [setValue],\n  )\n\n  const deductionsOptions = [\n    {\n      value: false,\n      label: tDeductions('options.include.label'),\n    },\n    {\n      value: true,\n      label: tDeductions('options.skip.label'),\n    },\n  ]\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={4}>\n        <Heading as=\"h2\">{t('pageTitle')}</Heading>\n        <Text variant=\"supporting\">{t('pageDescription')}</Text>\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={20}>\n        <OffCyclePayPeriodDateFormPresentation />\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={20}>\n        <OffCycleReasonSelectionPresentation name=\"reason\" />\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={12}>\n        <Heading as=\"h3\">{tEmployees('sectionTitle')}</Heading>\n        <SwitchField\n          name=\"includeAllEmployees\"\n          label={t('includeAllEmployeesLabel')}\n          onChange={handleToggleIncludeAll}\n        />\n        {!includeAllEmployees && (\n          <MultiSelectComboBoxField\n            name=\"selectedEmployeeUuids\"\n            label={tEmployees('sectionTitle')}\n            shouldVisuallyHideLabel\n            placeholder={tEmployees('searchPlaceholder')}\n            options={employees}\n            isLoading={isLoadingEmployees}\n          />\n        )}\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={20}>\n        <RadioGroupField<boolean>\n          name=\"skipRegularDeductions\"\n          label={tDeductions('title')}\n          description={tDeductions('description')}\n          options={deductionsOptions}\n          convertValueToString={value => String(value)}\n        />\n      </Flex>\n\n      <OffCycleTaxWithholdingTable\n        wageTypeGroups={wageTypeGroups}\n        config={taxWithholdingConfig}\n        onEditClick={onTaxWithholdingEditClick}\n      />\n      {isTaxWithholdingModalOpen && (\n        <OffCycleTaxWithholdingModal\n          isOpen\n          defaultConfig={taxWithholdingConfig}\n          onDone={onTaxWithholdingModalDone}\n          onCancel={onTaxWithholdingModalCancel}\n        />\n      )}\n\n      <Flex justifyContent=\"flex-end\" gap={12}>\n        <Button type=\"submit\" isLoading={isPending} isDisabled={isPending}>\n          {t('continueCta')}\n        </Button>\n      </Flex>\n    </Flex>\n  )\n}\n"],"names":["OffCycleCreationPresentation","employees","isLoadingEmployees","isPending","taxWithholdingConfig","isTaxWithholdingModalOpen","onTaxWithholdingEditClick","onTaxWithholdingModalDone","onTaxWithholdingModalCancel","useI18n","t","useTranslation","tDeductions","tEmployees","tWithholding","Heading","Text","Button","useComponentContext","wageTypeGroups","useMemo","WAGE_TYPE_CATEGORIES","category","group","setValue","watch","useFormContext","includeAllEmployees","handleToggleIncludeAll","useCallback","checked","deductionsOptions","jsxs","Flex","jsx","OffCyclePayPeriodDateFormPresentation","OffCycleReasonSelectionPresentation","SwitchField","MultiSelectComboBoxField","RadioGroupField","value","OffCycleTaxWithholdingTable","OffCycleTaxWithholdingModal"],"mappings":"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"}

package/dist/components/Payroll/OffCycleCreation/OffCycleCreationTypes.d.ts

@@ -1,5 +1,6 @@
 import { OffCycleReason } from '../OffCycleReasonSelection';
 import { OffCyclePayPeriodDateFormData, OffCyclePayrollDateType } from '../OffCyclePayPeriodDateForm';
+import { OffCycleTaxWithholdingConfig } from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes';
 import { MultiSelectComboBoxOption } from '../../Common/UI/MultiSelectComboBox/MultiSelectComboBoxTypes';
 import { BaseComponentInterface } from '../../Base/Base';
 export interface OffCycleCreationProps extends BaseComponentInterface<'Payroll.OffCycleCreation'> {
@@ -16,4 +17,9 @@ export interface OffCycleCreationPresentationProps {
     employees: MultiSelectComboBoxOption[];
     isLoadingEmployees: boolean;
     isPending?: boolean;
+    taxWithholdingConfig: OffCycleTaxWithholdingConfig;
+    isTaxWithholdingModalOpen: boolean;
+    onTaxWithholdingEditClick: () => void;
+    onTaxWithholdingModalDone: (config: OffCycleTaxWithholdingConfig) => void;
+    onTaxWithholdingModalCancel: () => void;
 }

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

@@ -0,0 +1,102 @@
+import { jsx as o, jsxs as t } from "react/jsx-runtime";
+import { useRef as R, useMemo as u } from "react";
+import { useForm as C, useWatch as x, FormProvider as O } from "react-hook-form";
+import { useTranslation as L } from "react-i18next";
+import { WithholdingPayPeriod as N } from "@gusto/embedded-api/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 "classnames";
+import { RadioGroupField as T } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { ActionsLayout as W } from "../../Common/ActionsLayout/ActionsLayout.js";
+import { useComponentContext as w } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as D } from "../../../i18n/I18n.js";
+import { SelectField as H } from "../../Common/Fields/SelectField/SelectField.js";
+function z({
+  isOpen: h,
+  defaultConfig: f,
+  onDone: g,
+  onCancel: r
+}) {
+  D("Payroll.OffCycleTaxWithholding");
+  const { t: e } = L("Payroll.OffCycleTaxWithholding"), { Modal: y, Heading: i, Text: n, Button: s } = w(), d = R(null), a = C({
+    defaultValues: f
+  }), S = x({
+    control: a.control,
+    name: "withholdingPayPeriod"
+  }), b = u(
+    () => Object.values(N).map((m) => ({
+      value: m,
+      label: e(p[m])
+    })),
+    [e]
+  ), c = e(
+    p[S]
+  ).toLowerCase(), v = u(
+    () => [
+      {
+        value: "supplemental",
+        label: e("modal.supplementalSection.useSupplementalRate"),
+        description: e("modal.supplementalSection.useSupplementalRateDescription")
+      },
+      {
+        value: "regular",
+        label: e("modal.supplementalSection.useRegularRate", {
+          frequency: c
+        }),
+        description: e("modal.supplementalSection.useRegularRateDescription")
+      }
+    ],
+    [e, c]
+  ), P = a.handleSubmit(g);
+  return /* @__PURE__ */ o(
+    y,
+    {
+      isOpen: h,
+      onClose: r,
+      containerRef: d,
+      footer: /* @__PURE__ */ t(W, { children: [
+        /* @__PURE__ */ o(s, { variant: "secondary", onClick: r, children: e("modal.cancelButton") }),
+        /* @__PURE__ */ o(s, { variant: "primary", onClick: P, children: e("modal.doneButton") })
+      ] }),
+      children: /* @__PURE__ */ o(O, { ...a, children: /* @__PURE__ */ t("div", { className: l.content, children: [
+        /* @__PURE__ */ o(i, { as: "h2", children: e("modal.title") }),
+        /* @__PURE__ */ t("div", { className: l.section, children: [
+          /* @__PURE__ */ o(i, { as: "h3", children: e("modal.regularSection.title") }),
+          /* @__PURE__ */ o(n, { variant: "supporting", children: e("modal.regularSection.subtitle") }),
+          /* @__PURE__ */ t("div", { className: l.rateInfo, children: [
+            /* @__PURE__ */ o(n, { weight: "semibold", children: e("modal.regularSection.rateLabel") }),
+            /* @__PURE__ */ o(n, { variant: "supporting", children: e("modal.regularSection.rateDescription") })
+          ] }),
+          /* @__PURE__ */ o(
+            H,
+            {
+              name: "withholdingPayPeriod",
+              label: e("modal.regularSection.rateLabel"),
+              options: b,
+              shouldVisuallyHideLabel: !0,
+              portalContainer: d.current ?? void 0
+            }
+          )
+        ] }),
+        /* @__PURE__ */ o("hr", { className: l.divider }),
+        /* @__PURE__ */ t("div", { className: l.section, children: [
+          /* @__PURE__ */ o(i, { as: "h3", children: e("modal.supplementalSection.title") }),
+          /* @__PURE__ */ o(
+            T,
+            {
+              name: "withholdingRate",
+              label: e("modal.supplementalSection.title"),
+              options: v,
+              shouldVisuallyHideLabel: !0
+            }
+          )
+        ] })
+      ] }) })
+    }
+  );
+}
+export {
+  z as OffCycleTaxWithholdingModal
+};
+//# sourceMappingURL=OffCycleTaxWithholdingModal.js.map

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

@@ -0,0 +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/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/OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.module.scss.js

@@ -0,0 +1,14 @@
+const t = "_content_4ea1b_1", e = "_section_4ea1b_7", n = "_rateInfo_4ea1b_13", o = "_divider_4ea1b_19", _ = {
+  content: t,
+  section: e,
+  rateInfo: n,
+  divider: o
+};
+export {
+  t as content,
+  _ as default,
+  o as divider,
+  n as rateInfo,
+  e as section
+};
+//# sourceMappingURL=OffCycleTaxWithholdingModal.module.scss.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OffCycleTaxWithholdingModal.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js

@@ -0,0 +1,52 @@
+import { jsxs as l, jsx as a } from "react/jsx-runtime";
+import { useTranslation as f } from "react-i18next";
+import n from "./OffCycleTaxWithholdingTable.module.scss.js";
+import { WITHHOLDING_PAY_PERIOD_I18N_KEY as b } from "./OffCycleTaxWithholdingTableTypes.js";
+import { useComponentContext as g } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as u } from "../../../i18n/I18n.js";
+function k({
+  wageTypeGroups: s,
+  config: i,
+  onEditClick: d
+}) {
+  u("Payroll.OffCycleTaxWithholding");
+  const { t: e } = f("Payroll.OffCycleTaxWithholding"), { Table: c, Button: h, Heading: y, Text: r } = g(), o = e(
+    b[i.withholdingPayPeriod]
+  ).toLowerCase(), m = {
+    regular: e("table.taxedAsRegular", { frequency: o }),
+    supplemental: i.withholdingRate === "supplemental" ? e("table.taxedAsSupplemental") : e("table.taxedAsRegular", { frequency: o }),
+    reimbursement: e("table.taxedAsNotTaxed")
+  }, p = [
+    { key: "wage-types", content: e("table.headers.wageTypes") },
+    { key: "taxed-as", content: e("table.headers.taxedAs") }
+  ], x = s.map((t) => ({
+    key: t.category,
+    data: [
+      {
+        key: `${t.category}-type`,
+        content: /* @__PURE__ */ l("div", { className: n.wageTypeCell, children: [
+          /* @__PURE__ */ a(r, { weight: "semibold", children: t.label }),
+          t.description && /* @__PURE__ */ a(r, { variant: "supporting", children: t.description })
+        ] })
+      },
+      {
+        key: `${t.category}-taxed-as`,
+        content: m[t.category]
+      }
+    ]
+  }));
+  return /* @__PURE__ */ l("div", { className: n.root, children: [
+    /* @__PURE__ */ l("div", { className: n.header, children: [
+      /* @__PURE__ */ l("div", { className: n.headerContent, children: [
+        /* @__PURE__ */ a(y, { as: "h3", children: e("title") }),
+        /* @__PURE__ */ a(r, { variant: "supporting", children: e("description") })
+      ] }),
+      /* @__PURE__ */ a(h, { variant: "secondary", onClick: d, children: e("editButton") })
+    ] }),
+    /* @__PURE__ */ a(c, { "aria-label": e("title"), headers: p, rows: x, className: n.table })
+  ] });
+}
+export {
+  k as OffCycleTaxWithholdingTable
+};
+//# sourceMappingURL=OffCycleTaxWithholdingTable.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OffCycleTaxWithholdingTable.js","sources":["../../../../src/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport styles from './OffCycleTaxWithholdingTable.module.scss'\nimport {\n  WITHHOLDING_PAY_PERIOD_I18N_KEY,\n  type OffCycleTaxWithholdingTableProps,\n  type WageTypeCategory,\n} from './OffCycleTaxWithholdingTableTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport type { TableData, TableRow } from '@/components/Common/UI/Table/TableTypes'\n\nexport function OffCycleTaxWithholdingTable({\n  wageTypeGroups,\n  config,\n  onEditClick,\n}: OffCycleTaxWithholdingTableProps) {\n  useI18n('Payroll.OffCycleTaxWithholding')\n  const { t } = useTranslation('Payroll.OffCycleTaxWithholding')\n  const { Table, Button, Heading, Text } = useComponentContext()\n\n  const frequencyText = t(\n    WITHHOLDING_PAY_PERIOD_I18N_KEY[config.withholdingPayPeriod],\n  ).toLowerCase()\n\n  const taxedAsByCategory: Record<WageTypeCategory, string> = {\n    regular: t('table.taxedAsRegular', { frequency: frequencyText }),\n    supplemental:\n      config.withholdingRate === 'supplemental'\n        ? t('table.taxedAsSupplemental')\n        : t('table.taxedAsRegular', { frequency: frequencyText }),\n    reimbursement: t('table.taxedAsNotTaxed'),\n  }\n\n  const headers: TableData[] = [\n    { key: 'wage-types', content: t('table.headers.wageTypes') },\n    { key: 'taxed-as', content: t('table.headers.taxedAs') },\n  ]\n\n  const rows: TableRow[] = wageTypeGroups.map(group => ({\n    key: group.category,\n    data: [\n      {\n        key: `${group.category}-type`,\n        content: (\n          <div className={styles.wageTypeCell}>\n            <Text weight=\"semibold\">{group.label}</Text>\n            {group.description && <Text variant=\"supporting\">{group.description}</Text>}\n          </div>\n        ),\n      },\n      {\n        key: `${group.category}-taxed-as`,\n        content: taxedAsByCategory[group.category],\n      },\n    ],\n  }))\n\n  return (\n    <div className={styles.root}>\n      <div className={styles.header}>\n        <div className={styles.headerContent}>\n          <Heading as=\"h3\">{t('title')}</Heading>\n          <Text variant=\"supporting\">{t('description')}</Text>\n        </div>\n        <Button variant=\"secondary\" onClick={onEditClick}>\n          {t('editButton')}\n        </Button>\n      </div>\n      <Table aria-label={t('title')} headers={headers} rows={rows} className={styles.table} />\n    </div>\n  )\n}\n"],"names":["OffCycleTaxWithholdingTable","wageTypeGroups","config","onEditClick","useI18n","t","useTranslation","Table","Button","Heading","Text","useComponentContext","frequencyText","WITHHOLDING_PAY_PERIOD_I18N_KEY","taxedAsByCategory","headers","rows","group","jsxs","styles","jsx"],"mappings":";;;;;;AAWO,SAASA,EAA4B;AAAA,EAC1C,gBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AACF,GAAqC;AACnC,EAAAC,EAAQ,gCAAgC;AACxC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,gCAAgC,GACvD,EAAE,OAAAC,GAAO,QAAAC,GAAQ,SAAAC,GAAS,MAAAC,EAAA,IAASC,EAAA,GAEnCC,IAAgBP;AAAA,IACpBQ,EAAgCX,EAAO,oBAAoB;AAAA,EAAA,EAC3D,YAAA,GAEIY,IAAsD;AAAA,IAC1D,SAAST,EAAE,wBAAwB,EAAE,WAAWO,GAAe;AAAA,IAC/D,cACEV,EAAO,oBAAoB,iBACvBG,EAAE,2BAA2B,IAC7BA,EAAE,wBAAwB,EAAE,WAAWO,EAAA,CAAe;AAAA,IAC5D,eAAeP,EAAE,uBAAuB;AAAA,EAAA,GAGpCU,IAAuB;AAAA,IAC3B,EAAE,KAAK,cAAc,SAASV,EAAE,yBAAyB,EAAA;AAAA,IACzD,EAAE,KAAK,YAAY,SAASA,EAAE,uBAAuB,EAAA;AAAA,EAAE,GAGnDW,IAAmBf,EAAe,IAAI,CAAAgB,OAAU;AAAA,IACpD,KAAKA,EAAM;AAAA,IACX,MAAM;AAAA,MACJ;AAAA,QACE,KAAK,GAAGA,EAAM,QAAQ;AAAA,QACtB,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,cACrB,UAAA;AAAA,UAAA,gBAAAC,EAACV,GAAA,EAAK,QAAO,YAAY,UAAAO,EAAM,OAAM;AAAA,UACpCA,EAAM,eAAe,gBAAAG,EAACV,KAAK,SAAQ,cAAc,YAAM,YAAA,CAAY;AAAA,QAAA,EAAA,CACtE;AAAA,MAAA;AAAA,MAGJ;AAAA,QACE,KAAK,GAAGO,EAAM,QAAQ;AAAA,QACtB,SAASH,EAAkBG,EAAM,QAAQ;AAAA,MAAA;AAAA,IAC3C;AAAA,EACF,EACA;AAEF,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,MACrB,UAAA;AAAA,IAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,QACrB,UAAA;AAAA,MAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,eACrB,UAAA;AAAA,QAAA,gBAAAC,EAACX,GAAA,EAAQ,IAAG,MAAM,UAAAJ,EAAE,OAAO,GAAE;AAAA,0BAC5BK,GAAA,EAAK,SAAQ,cAAc,UAAAL,EAAE,aAAa,EAAA,CAAE;AAAA,MAAA,GAC/C;AAAA,MACA,gBAAAe,EAACZ,KAAO,SAAQ,aAAY,SAASL,GAClC,UAAAE,EAAE,YAAY,EAAA,CACjB;AAAA,IAAA,GACF;AAAA,IACA,gBAAAe,EAACb,GAAA,EAAM,cAAYF,EAAE,OAAO,GAAG,SAAAU,GAAkB,MAAAC,GAAY,WAAWG,EAAO,MAAA,CAAO;AAAA,EAAA,GACxF;AAEJ;"}

package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.module.scss.js

@@ -0,0 +1,16 @@
+const e = "_root_izowe_1", o = "_header_izowe_7", t = "_headerContent_izowe_14", _ = "_wageTypeCell_izowe_20", a = "_table_izowe_26", n = {
+  root: e,
+  header: o,
+  headerContent: t,
+  wageTypeCell: _,
+  table: a
+};
+export {
+  n as default,
+  o as header,
+  t as headerContent,
+  e as root,
+  a as table,
+  _ as wageTypeCell
+};
+//# sourceMappingURL=OffCycleTaxWithholdingTable.module.scss.js.map

package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OffCycleTaxWithholdingTable.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.d.ts

@@ -1,10 +1,20 @@
 import { WithholdingPayPeriod } from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls';
 import { WithholdingType } from '../OffCycleReasonSelection';
+export declare const WITHHOLDING_PAY_PERIOD_I18N_KEY: {
+    readonly "Every week": "payPeriodFrequency.everyWeek";
+    readonly "Every other week": "payPeriodFrequency.everyOtherWeek";
+    readonly "Twice per month": "payPeriodFrequency.twicePerMonth";
+    readonly Monthly: "payPeriodFrequency.monthly";
+    readonly Quarterly: "payPeriodFrequency.quarterly";
+    readonly Semiannually: "payPeriodFrequency.semiannually";
+    readonly Annually: "payPeriodFrequency.annually";
+};
+export declare const WAGE_TYPE_CATEGORIES: readonly ["regular", "supplemental", "reimbursement"];
+export type WageTypeCategory = (typeof WAGE_TYPE_CATEGORIES)[number];
 export interface WageTypeGroup {
-    id: string;
+    category: WageTypeCategory;
     label: string;
     description?: string;
-    category: 'regular' | 'supplemental' | 'reimbursement';
 }
 export interface OffCycleTaxWithholdingConfig {
     withholdingPayPeriod: WithholdingPayPeriod;

package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js

@@ -0,0 +1,15 @@
+import { WithholdingPayPeriod as e } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
+const y = {
+  [e.EveryWeek]: "payPeriodFrequency.everyWeek",
+  [e.EveryOtherWeek]: "payPeriodFrequency.everyOtherWeek",
+  [e.TwicePerMonth]: "payPeriodFrequency.twicePerMonth",
+  [e.Monthly]: "payPeriodFrequency.monthly",
+  [e.Quarterly]: "payPeriodFrequency.quarterly",
+  [e.Semiannually]: "payPeriodFrequency.semiannually",
+  [e.Annually]: "payPeriodFrequency.annually"
+}, n = ["regular", "supplemental", "reimbursement"];
+export {
+  n as WAGE_TYPE_CATEGORIES,
+  y as WITHHOLDING_PAY_PERIOD_I18N_KEY
+};
+//# sourceMappingURL=OffCycleTaxWithholdingTableTypes.js.map

package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OffCycleTaxWithholdingTableTypes.js","sources":["../../../../src/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.ts"],"sourcesContent":["import { WithholdingPayPeriod } from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport type { WithholdingType } from '@/components/Payroll/OffCycleReasonSelection'\n\nexport const WITHHOLDING_PAY_PERIOD_I18N_KEY = {\n  [WithholdingPayPeriod.EveryWeek]: 'payPeriodFrequency.everyWeek',\n  [WithholdingPayPeriod.EveryOtherWeek]: 'payPeriodFrequency.everyOtherWeek',\n  [WithholdingPayPeriod.TwicePerMonth]: 'payPeriodFrequency.twicePerMonth',\n  [WithholdingPayPeriod.Monthly]: 'payPeriodFrequency.monthly',\n  [WithholdingPayPeriod.Quarterly]: 'payPeriodFrequency.quarterly',\n  [WithholdingPayPeriod.Semiannually]: 'payPeriodFrequency.semiannually',\n  [WithholdingPayPeriod.Annually]: 'payPeriodFrequency.annually',\n} as const\n\nexport const WAGE_TYPE_CATEGORIES = ['regular', 'supplemental', 'reimbursement'] as const\nexport type WageTypeCategory = (typeof WAGE_TYPE_CATEGORIES)[number]\n\nexport interface WageTypeGroup {\n  category: WageTypeCategory\n  label: string\n  description?: string\n}\n\nexport interface OffCycleTaxWithholdingConfig {\n  withholdingPayPeriod: WithholdingPayPeriod\n  withholdingRate: WithholdingType\n}\n\nexport interface OffCycleTaxWithholdingTableProps {\n  wageTypeGroups: WageTypeGroup[]\n  config: OffCycleTaxWithholdingConfig\n  onEditClick: () => void\n}\n"],"names":["WITHHOLDING_PAY_PERIOD_I18N_KEY","WithholdingPayPeriod","WAGE_TYPE_CATEGORIES"],"mappings":";AAGO,MAAMA,IAAkC;AAAA,EAC7C,CAACC,EAAqB,SAAS,GAAG;AAAA,EAClC,CAACA,EAAqB,cAAc,GAAG;AAAA,EACvC,CAACA,EAAqB,aAAa,GAAG;AAAA,EACtC,CAACA,EAAqB,OAAO,GAAG;AAAA,EAChC,CAACA,EAAqB,SAAS,GAAG;AAAA,EAClC,CAACA,EAAqB,YAAY,GAAG;AAAA,EACrC,CAACA,EAAqB,QAAQ,GAAG;AACnC,GAEaC,IAAuB,CAAC,WAAW,gBAAgB,eAAe;"}

package/dist/components/Payroll/OffCycleTaxWithholdingTable/index.d.ts

@@ -1,3 +1,4 @@
 import "./types/i18next.d.ts"
 export { OffCycleTaxWithholdingTable } from './OffCycleTaxWithholdingTable';
-export type { OffCycleTaxWithholdingConfig, OffCycleTaxWithholdingTableProps, WageTypeGroup, } from './OffCycleTaxWithholdingTableTypes';
+export { WITHHOLDING_PAY_PERIOD_I18N_KEY, WAGE_TYPE_CATEGORIES, } from './OffCycleTaxWithholdingTableTypes';
+export type { OffCycleTaxWithholdingConfig, OffCycleTaxWithholdingTableProps, WageTypeCategory, WageTypeGroup, } from './OffCycleTaxWithholdingTableTypes';