npm - @gusto/embedded-react-sdk - Versions diffs - 0.55.8 → 0.56.1 - Mend

@gusto/embedded-react-sdk 0.55.8 → 0.56.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (211) hide show

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

	@@ -1 +1 @@
1	- {"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 { createOffCyclePayPeriodDateFormSchema } 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 { useCompanyPaymentSpeed } from '@/hooks/useCompanyPaymentSpeed'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { SDKInternalError } from '@/types/sdkError'\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\n/*\n Creation form for off-cycle (bonus or correction) payrolls.\n \n Walks the user through configuring pay period dates, selecting a reason, choosing\n * employees, and setting deduction and tax withholding preferences, then submits the\n * resulting payroll for execution.\n \n @events\n * \| Event \| Description \| Data \|\n * \| ----- \| ----------- \| ---- \|\n * \| `offCycle/created` \| The off-cycle payroll has been created \| `{ payrollUuid: string }` \|\n \n Changing the reason updates the deduction and withholding defaults — `'bonus'` skips\n * regular deductions and uses the supplemental withholding rate; `'correction'` includes\n * regular deductions and uses the regular rate.\n \n @param props - {@link OffCycleCreationProps} plus base component props.\n * @returns The off-cycle payroll creation form.\n * @public\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', className }: 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 { paymentSpeedDays } = useCompanyPaymentSpeed(companyId)\n\n const { minCheckDate, maxDate, minPayPeriodDate, today } =\n useOffCyclePayPeriodDateValidation(paymentSpeedDays)\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 } = useEmployeesListSuspense({\n companyId,\n onboardedActive: true,\n })\n\n const employees: MultiSelectComboBoxOption[] = useMemo(() => {\n const employeeList = employeesData.showEmployees ?? []\n return [...employeeList]\n .sort((a, b) => {\n const lastNameComparison = a.lastName.localeCompare(b.lastName)\n if (lastNameComparison !== 0) return lastNameComparison\n return a.firstName.localeCompare(b.firstName)\n })\n .map(employee => {\n const fullName = [employee.firstName, employee.lastName].filter(Boolean).join(' ')\n const primaryJob = employee.jobs?.find(job => job.primary) ?? employee.jobs?.[0]\n return {\n label: fullName,\n value: employee.uuid,\n description: primaryJob?.title \|\| undefined,\n }\n })\n }, [employeesData])\n\n const translateValidation = (key: string, options?: Record<string, unknown>): string =>\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n t(key as any, options as any) as string\n\n const dynamicResolver: Resolver<OffCycleCreationFormData> = (values, context, options) => {\n const isCheckOnly = values.isCheckOnly\n\n const dateSchema = createOffCyclePayPeriodDateFormSchema(\n translateValidation,\n isCheckOnly ? today : minCheckDate,\n paymentSpeedDays,\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: false,\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.startDate!\n const endDate = data.endDate!\n const employeeUuids = data.includeAllEmployees\n ? employees.map(e => e.value)\n : 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 =\n response.payrollUnprocessed?.payrollUuid ?? response.payrollUnprocessed?.uuid\n\n if (!payrollUuid) {\n throw new SDKInternalError(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 isPending={isPending}\n minCheckDate={minCheckDate}\n minCheckOnlyDate={today}\n maxDate={maxDate}\n minPayPeriodDate={minPayPeriodDate}\n taxWithholdingConfig={taxWithholdingConfig}\n isTaxWithholdingModalOpen={isTaxWithholdingModalOpen}\n onTaxWithholdingEditClick={handleTaxWithholdingEditClick}\n onTaxWithholdingModalDone={handleTaxWithholdingModalDone}\n onTaxWithholdingModalCancel={handleTaxWithholdingModalCancel}\n className={className}\n />\n </Form>\n </FormProvider>\n )\n}\n"],"names":["LOCAL_TO_API_REASON","ApiOffCycleReason","OffCycleCreation","props","jsx","BaseComponent","Root","dictionary","companyId","payrollType","className","useComponentDictionary","useI18n","t","useTranslation","tCreation","onEvent","baseSubmitHandler","useBase","paymentSpeedDays","useCompanyPaymentSpeed","minCheckDate","maxDate","minPayPeriodDate","today","useOffCyclePayPeriodDateValidation","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","taxWithholdingConfig","setTaxWithholdingConfig","useState","WithholdingPayPeriod","OFF_CYCLE_REASON_DEFAULTS","isTaxWithholdingModalOpen","setIsTaxWithholdingModalOpen","handleTaxWithholdingEditClick","useCallback","handleTaxWithholdingModalDone","config","handleTaxWithholdingModalCancel","employeesData","useEmployeesListSuspense","employees","useMemo","a","b","lastNameComparison","employee","fullName","primaryJob","job","translateValidation","key","options","methods","useForm","values","context","isCheckOnly","dateSchema","createOffCyclePayPeriodDateFormSchema","schema","z","data","ctx","zodResolver","watchedReason","useEffect","prev","onSubmit","reason","checkDate","startDate","endDate","employeeUuids","e","response","RFCDate","payrollUuid","SDKInternalError","componentEvents","FormProvider","Form","OffCycleCreationPresentation"],"mappings":"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"}
1	+ {"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 { usePayrollsGetBlockersSuspense } from '@gusto/embedded-api/react-query/payrollsGetBlockers'\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 type { ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { createOffCyclePayPeriodDateFormSchema } 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 { useCompanyPaymentSpeed } from '@/hooks/useCompanyPaymentSpeed'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { SDKInternalError } from '@/types/sdkError'\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\n/*\n Creation form for off-cycle (bonus or correction) payrolls.\n \n Walks the user through configuring pay period dates, selecting a reason, choosing\n * employees, and setting deduction and tax withholding preferences, then submits the\n * resulting payroll for execution.\n \n @events\n * \| Event \| Description \| Data \|\n * \| ----- \| ----------- \| ---- \|\n * \| `offCycle/created` \| The off-cycle payroll has been created \| `{ payrollUuid: string }` \|\n * \| `offCycle/blockers/viewAll` \| The user chose to view the company's payroll blockers from the blocker alert \| none \|\n \n Changing the reason updates the deduction and withholding defaults — `'bonus'` skips\n * regular deductions and uses the supplemental withholding rate; `'correction'` includes\n * regular deductions and uses the regular rate.\n \n @param props - {@link OffCycleCreationProps} plus base component props.\n * @returns The off-cycle payroll creation form.\n * @public\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', className }: 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 { paymentSpeedDays } = useCompanyPaymentSpeed(companyId)\n\n const { minCheckDate, maxDate, minPayPeriodDate, today } =\n useOffCyclePayPeriodDateValidation(paymentSpeedDays)\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 handleViewBlockers = useCallback(() => {\n onEvent(componentEvents.OFF_CYCLE_BLOCKERS_VIEW_ALL)\n }, [onEvent])\n\n const { data: employeesData } = useEmployeesListSuspense({\n companyId,\n onboardedActive: true,\n })\n\n const { data: blockersData } = usePayrollsGetBlockersSuspense({\n companyUuid: companyId,\n })\n\n const blockers: ApiPayrollBlocker[] = (blockersData.payrollBlockers ?? []).map(blocker => ({\n key: blocker.key,\n message: blocker.message,\n }))\n\n const employees: MultiSelectComboBoxOption[] = useMemo(() => {\n const employeeList = employeesData.showEmployees ?? []\n return [...employeeList]\n .sort((a, b) => {\n const lastNameComparison = a.lastName.localeCompare(b.lastName)\n if (lastNameComparison !== 0) return lastNameComparison\n return a.firstName.localeCompare(b.firstName)\n })\n .map(employee => {\n const fullName = [employee.firstName, employee.lastName].filter(Boolean).join(' ')\n const primaryJob = employee.jobs?.find(job => job.primary) ?? employee.jobs?.[0]\n return {\n label: fullName,\n value: employee.uuid,\n description: primaryJob?.title \|\| undefined,\n }\n })\n }, [employeesData])\n\n const translateValidation = (key: string, options?: Record<string, unknown>): string =>\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n t(key as any, options as any) as string\n\n const dynamicResolver: Resolver<OffCycleCreationFormData> = (values, context, options) => {\n const isCheckOnly = values.isCheckOnly\n\n const dateSchema = createOffCyclePayPeriodDateFormSchema(\n translateValidation,\n isCheckOnly ? today : minCheckDate,\n paymentSpeedDays,\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: false,\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.startDate!\n const endDate = data.endDate!\n const employeeUuids = data.includeAllEmployees\n ? employees.map(e => e.value)\n : 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 =\n response.payrollUnprocessed?.payrollUuid ?? response.payrollUnprocessed?.uuid\n\n if (!payrollUuid) {\n throw new SDKInternalError(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 blockers={blockers}\n onViewBlockersClick={handleViewBlockers}\n isPending={isPending}\n minCheckDate={minCheckDate}\n minCheckOnlyDate={today}\n maxDate={maxDate}\n minPayPeriodDate={minPayPeriodDate}\n taxWithholdingConfig={taxWithholdingConfig}\n isTaxWithholdingModalOpen={isTaxWithholdingModalOpen}\n onTaxWithholdingEditClick={handleTaxWithholdingEditClick}\n onTaxWithholdingModalDone={handleTaxWithholdingModalDone}\n onTaxWithholdingModalCancel={handleTaxWithholdingModalCancel}\n className={className}\n />\n </Form>\n </FormProvider>\n )\n}\n"],"names":["LOCAL_TO_API_REASON","ApiOffCycleReason","OffCycleCreation","props","jsx","BaseComponent","Root","dictionary","companyId","payrollType","className","useComponentDictionary","useI18n","t","useTranslation","tCreation","onEvent","baseSubmitHandler","useBase","paymentSpeedDays","useCompanyPaymentSpeed","minCheckDate","maxDate","minPayPeriodDate","today","useOffCyclePayPeriodDateValidation","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","taxWithholdingConfig","setTaxWithholdingConfig","useState","WithholdingPayPeriod","OFF_CYCLE_REASON_DEFAULTS","isTaxWithholdingModalOpen","setIsTaxWithholdingModalOpen","handleTaxWithholdingEditClick","useCallback","handleTaxWithholdingModalDone","config","handleTaxWithholdingModalCancel","handleViewBlockers","componentEvents","employeesData","useEmployeesListSuspense","blockersData","usePayrollsGetBlockersSuspense","blockers","blocker","employees","useMemo","a","b","lastNameComparison","employee","fullName","primaryJob","job","translateValidation","key","options","methods","useForm","values","context","isCheckOnly","dateSchema","createOffCyclePayPeriodDateFormSchema","schema","z","data","ctx","zodResolver","watchedReason","useEffect","prev","onSubmit","reason","checkDate","startDate","endDate","employeeUuids","e","response","RFCDate","payrollUuid","SDKInternalError","FormProvider","Form","OffCycleCreationPresentation"],"mappings":"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"}

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

@@ -1,50 +1,53 @@
 import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { useMemo as k, useCallback as N } from "react";
-import { useFormContext as R } from "react-hook-form";
-import { useTranslation as c, Trans as j } from "react-i18next";
-import { OffCyclePayPeriodDateFormPresentation as I } from "../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js";
-import { WAGE_TYPE_CATEGORIES as L } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js";
+import { useMemo as R, useCallback as j } from "react";
+import { useFormContext as I } from "react-hook-form";
+import { useTranslation as c, Trans as L } from "react-i18next";
+import { OffCyclePayPeriodDateFormPresentation as M } from "../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js";
+import { PayrollBlockerAlerts as V } from "../PayrollBlocker/components/PayrollBlockerAlerts.js";
+import { WAGE_TYPE_CATEGORIES as $ } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js";
 import s from "./OffCycleCreationPresentation.module.scss.js";
 import { useI18n as p } from "../../../i18n/I18n.js";
-import { useComponentContext as M } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentContext as H } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { Flex as o } from "../../Common/Flex/Flex.js";
-import { OffCycleReasonSelectionPresentation as V } from "../OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js";
-import { MultiSelectComboBoxField as $ } from "../../Common/Fields/MultiSelectComboBoxField/MultiSelectComboBoxField.js";
-import { RadioGroupField as B } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { OffCycleTaxWithholdingTable as H } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js";
-import { OffCycleTaxWithholdingModal as U } from "../OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js";
-import { SwitchField as _ } from "../../Common/Fields/SwitchField/SwitchField.js";
-function ce({
-  employees: g,
-  isPending: u,
-  minCheckDate: C,
-  minCheckOnlyDate: x,
-  maxDate: D,
-  minPayPeriodDate: T,
-  taxWithholdingConfig: f,
-  isTaxWithholdingModalOpen: b,
-  onTaxWithholdingEditClick: P,
-  onTaxWithholdingModalDone: E,
-  onTaxWithholdingModalCancel: O,
-  className: S
+import { OffCycleReasonSelectionPresentation as U } from "../OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js";
+import { MultiSelectComboBoxField as _ } from "../../Common/Fields/MultiSelectComboBoxField/MultiSelectComboBoxField.js";
+import { RadioGroupField as K } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { OffCycleTaxWithholdingTable as Y } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js";
+import { OffCycleTaxWithholdingModal as q } from "../OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js";
+import { SwitchField as z } from "../../Common/Fields/SwitchField/SwitchField.js";
+function ue({
+  employees: x,
+  blockers: u,
+  onViewBlockersClick: D,
+  isPending: f,
+  minCheckDate: T,
+  minCheckOnlyDate: b,
+  maxDate: P,
+  minPayPeriodDate: E,
+  taxWithholdingConfig: h,
+  isTaxWithholdingModalOpen: O,
+  onTaxWithholdingEditClick: S,
+  onTaxWithholdingModalDone: v,
+  onTaxWithholdingModalCancel: A,
+  className: w
 }) {
   p("Payroll.OffCycleCreation"), p("Payroll.OffCycleDeductionsSetting"), p("Payroll.EmployeeSelection"), p("Payroll.OffCycleTaxWithholding");
-  const { t: i } = c("Payroll.OffCycleCreation"), { t } = c("Payroll.OffCycleDeductionsSetting"), { t: d } = c("Payroll.EmployeeSelection"), { t: r } = c("Payroll.OffCycleTaxWithholding"), { Heading: m, Text: a, Button: v } = M(), A = k(
-    () => L.map((l) => {
-      const y = {
+  const { t: i } = c("Payroll.OffCycleCreation"), { t } = c("Payroll.OffCycleDeductionsSetting"), { t: d } = c("Payroll.EmployeeSelection"), { t: r } = c("Payroll.OffCycleTaxWithholding"), { Heading: m, Text: a, Button: G } = H(), F = R(
+    () => $.map((l) => {
+      const C = {
         category: l,
         label: r(`wageTypeGroups.${l}.label`),
         taxedAsDescription: r(`wageTypeGroups.${l}.taxedAsDescription`)
       };
-      return (l === "regular" || l === "supplemental") && (y.description = r(`wageTypeGroups.${l}.description`)), y;
+      return (l === "regular" || l === "supplemental") && (C.description = r(`wageTypeGroups.${l}.description`)), C;
     }),
     [r]
-  ), { setValue: h, watch: w } = R(), G = w("includeAllEmployees"), F = N(
+  ), { setValue: y, watch: W } = I(), k = W("includeAllEmployees"), B = j(
     (l) => {
-      l && h("selectedEmployeeUuids", []);
+      l && y("selectedEmployeeUuids", []);
     },
-    [h]
-  ), W = [
+    [y]
+  ), N = [
     {
       value: !1,
       label: t("options.include.label")
@@ -53,8 +56,9 @@ function ce({
       value: !0,
       label: t("options.skip.label")
     }
-  ];
-  return /* @__PURE__ */ n(o, { className: S, flexDirection: "column", gap: 32, children: [
+  ], g = u.length > 0;
+  return /* @__PURE__ */ n(o, { className: w, flexDirection: "column", gap: 32, children: [
+    g && /* @__PURE__ */ e(V, { blockers: u, onViewBlockersClick: D }),
     /* @__PURE__ */ n(o, { flexDirection: "column", gap: 4, children: [
       /* @__PURE__ */ e(m, { as: "h2", children: i("pageTitle") }),
       /* @__PURE__ */ e(a, { variant: "supporting", children: i("pageDescription") })
@@ -65,54 +69,54 @@ function ce({
         /* @__PURE__ */ e(a, { variant: "supporting", children: i("payPeriodSectionDescription") })
       ] }),
       /* @__PURE__ */ e(
-        I,
+        M,
         {
-          minCheckDate: C,
-          minCheckOnlyDate: x,
-          maxDate: D,
-          minPayPeriodDate: T
+          minCheckDate: T,
+          minCheckOnlyDate: b,
+          maxDate: P,
+          minPayPeriodDate: E
         }
       )
     ] }),
     /* @__PURE__ */ e("hr", { className: s.divider }),
-    /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(V, { name: "reason" }) }),
+    /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(U, { name: "reason" }) }),
     /* @__PURE__ */ e("hr", { className: s.divider }),
     /* @__PURE__ */ n(o, { flexDirection: "column", gap: 12, children: [
       /* @__PURE__ */ e(m, { as: "h3", children: d("sectionTitle") }),
       /* @__PURE__ */ e(
-        _,
+        z,
         {
           name: "includeAllEmployees",
           label: i("includeAllEmployeesLabel"),
-          onChange: F
+          onChange: B
         }
       ),
-      !G && /* @__PURE__ */ e(
-        $,
+      !k && /* @__PURE__ */ e(
+        _,
         {
           name: "selectedEmployeeUuids",
           label: d("sectionTitle"),
           shouldVisuallyHideLabel: !0,
           placeholder: d("searchPlaceholder"),
-          options: g
+          options: x
         }
       )
     ] }),
     /* @__PURE__ */ e("hr", { className: s.divider }),
     /* @__PURE__ */ e(o, { flexDirection: "column", gap: 20, children: /* @__PURE__ */ e(
-      B,
+      K,
       {
         name: "skipRegularDeductions",
         label: t("title"),
         description: t("description"),
-        options: W,
+        options: N,
         convertValueToString: (l) => String(l)
       }
     ) }),
     /* @__PURE__ */ e("hr", { className: s.divider }),
     /* @__PURE__ */ n(o, { flexDirection: "column", gap: 12, children: [
       /* @__PURE__ */ e(a, { variant: "supporting", children: /* @__PURE__ */ e(
-        j,
+        L,
         {
           t: i,
           i18nKey: "taxWithholdingDisclaimer",
@@ -120,27 +124,27 @@ function ce({
         }
       ) }),
       /* @__PURE__ */ e(
-        H,
+        Y,
         {
-          wageTypeGroups: A,
-          config: f,
-          onEditClick: P
+          wageTypeGroups: F,
+          config: h,
+          onEditClick: S
         }
       ),
-      b && /* @__PURE__ */ e(
-        U,
+      O && /* @__PURE__ */ e(
+        q,
         {
           isOpen: !0,
-          defaultConfig: f,
-          onDone: E,
-          onCancel: O
+          defaultConfig: h,
+          onDone: v,
+          onCancel: A
         }
       )
     ] }),
-    /* @__PURE__ */ e(o, { justifyContent: "flex-end", gap: 12, children: /* @__PURE__ */ e(v, { type: "submit", isLoading: u, isDisabled: u, children: i("continueCta") }) })
+    /* @__PURE__ */ e(o, { justifyContent: "flex-end", gap: 12, children: /* @__PURE__ */ e(G, { type: "submit", isLoading: f, isDisabled: f || g, children: i("continueCta") }) })
   ] });
 }
 export {
-  ce as OffCycleCreationPresentation
+  ue as OffCycleCreationPresentation
 };
 //# sourceMappingURL=OffCycleCreationPresentation.js.map

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

	@@ -1 +1 @@
1	- {"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 { Trans, 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 styles from './OffCycleCreationPresentation.module.scss'\nimport { useI18n } from '@/i18n'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, RadioGroupField, SwitchField, MultiSelectComboBoxField } from '@/components/Common'\n\n/** @internal */\nexport function OffCycleCreationPresentation({\n employees,\n isPending,\n minCheckDate,\n minCheckOnlyDate,\n maxDate,\n minPayPeriodDate,\n taxWithholdingConfig,\n isTaxWithholdingModalOpen,\n onTaxWithholdingEditClick,\n onTaxWithholdingModalDone,\n onTaxWithholdingModalCancel,\n className,\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 taxedAsDescription: tWithholding(`wageTypeGroups.${category}.taxedAsDescription`),\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 className={className} 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 <Flex flexDirection=\"column\" gap={4}>\n <Heading as=\"h3\">{t('payPeriodSectionTitle')}</Heading>\n <Text variant=\"supporting\">{t('payPeriodSectionDescription')}</Text>\n </Flex>\n <OffCyclePayPeriodDateFormPresentation\n minCheckDate={minCheckDate}\n minCheckOnlyDate={minCheckOnlyDate}\n maxDate={maxDate}\n minPayPeriodDate={minPayPeriodDate}\n />\n </Flex>\n\n <hr className={styles.divider} />\n\n <Flex flexDirection=\"column\" gap={20}>\n <OffCycleReasonSelectionPresentation name=\"reason\" />\n </Flex>\n\n <hr className={styles.divider} />\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 />\n )}\n </Flex>\n\n <hr className={styles.divider} />\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 <hr className={styles.divider} />\n\n <Flex flexDirection=\"column\" gap={12}>\n <Text variant=\"supporting\">\n <Trans\n t={t}\n i18nKey=\"taxWithholdingDisclaimer\"\n components={{ bold: <Text as=\"span\" weight=\"bold\" /> }}\n />\n </Text>\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 </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","isPending","minCheckDate","minCheckOnlyDate","maxDate","minPayPeriodDate","taxWithholdingConfig","isTaxWithholdingModalOpen","onTaxWithholdingEditClick","onTaxWithholdingModalDone","onTaxWithholdingModalCancel","className","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","Flex","jsxs","jsx","OffCyclePayPeriodDateFormPresentation","styles","OffCycleReasonSelectionPresentation","SwitchField","MultiSelectComboBoxField","RadioGroupField","value","Trans","OffCycleTaxWithholdingTable","OffCycleTaxWithholdingModal"],"mappings":"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"}
1	+ {"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 { Trans, useTranslation } from 'react-i18next'\nimport { OffCycleReasonSelectionPresentation } from '../OffCycleReasonSelection'\nimport { OffCyclePayPeriodDateFormPresentation } from '../OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation'\nimport { OffCycleTaxWithholdingTable } from '../OffCycleTaxWithholdingTable'\nimport { OffCycleTaxWithholdingModal } from '../OffCycleTaxWithholdingModal'\nimport { PayrollBlockerAlerts } from '../PayrollBlocker/components/PayrollBlockerAlerts'\nimport {\n WAGE_TYPE_CATEGORIES,\n type WageTypeGroup,\n} from '../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes'\nimport type {\n OffCycleCreationFormData,\n OffCycleCreationPresentationProps,\n} from './OffCycleCreationTypes'\nimport styles from './OffCycleCreationPresentation.module.scss'\nimport { useI18n } from '@/i18n'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, RadioGroupField, SwitchField, MultiSelectComboBoxField } from '@/components/Common'\n\n/** @internal */\nexport function OffCycleCreationPresentation({\n employees,\n blockers,\n onViewBlockersClick,\n isPending,\n minCheckDate,\n minCheckOnlyDate,\n maxDate,\n minPayPeriodDate,\n taxWithholdingConfig,\n isTaxWithholdingModalOpen,\n onTaxWithholdingEditClick,\n onTaxWithholdingModalDone,\n onTaxWithholdingModalCancel,\n className,\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 taxedAsDescription: tWithholding(`wageTypeGroups.${category}.taxedAsDescription`),\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 const hasBlockers = blockers.length > 0\n\n return (\n <Flex className={className} flexDirection=\"column\" gap={32}>\n {hasBlockers && (\n <PayrollBlockerAlerts blockers={blockers} onViewBlockersClick={onViewBlockersClick} />\n )}\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 <Flex flexDirection=\"column\" gap={4}>\n <Heading as=\"h3\">{t('payPeriodSectionTitle')}</Heading>\n <Text variant=\"supporting\">{t('payPeriodSectionDescription')}</Text>\n </Flex>\n <OffCyclePayPeriodDateFormPresentation\n minCheckDate={minCheckDate}\n minCheckOnlyDate={minCheckOnlyDate}\n maxDate={maxDate}\n minPayPeriodDate={minPayPeriodDate}\n />\n </Flex>\n\n <hr className={styles.divider} />\n\n <Flex flexDirection=\"column\" gap={20}>\n <OffCycleReasonSelectionPresentation name=\"reason\" />\n </Flex>\n\n <hr className={styles.divider} />\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 />\n )}\n </Flex>\n\n <hr className={styles.divider} />\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 <hr className={styles.divider} />\n\n <Flex flexDirection=\"column\" gap={12}>\n <Text variant=\"supporting\">\n <Trans\n t={t}\n i18nKey=\"taxWithholdingDisclaimer\"\n components={{ bold: <Text as=\"span\" weight=\"bold\" /> }}\n />\n </Text>\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 </Flex>\n\n <Flex justifyContent=\"flex-end\" gap={12}>\n <Button type=\"submit\" isLoading={isPending} isDisabled={isPending \|\| hasBlockers}>\n {t('continueCta')}\n </Button>\n </Flex>\n </Flex>\n )\n}\n"],"names":["OffCycleCreationPresentation","employees","blockers","onViewBlockersClick","isPending","minCheckDate","minCheckOnlyDate","maxDate","minPayPeriodDate","taxWithholdingConfig","isTaxWithholdingModalOpen","onTaxWithholdingEditClick","onTaxWithholdingModalDone","onTaxWithholdingModalCancel","className","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","hasBlockers","Flex","jsx","PayrollBlockerAlerts","jsxs","OffCyclePayPeriodDateFormPresentation","styles","OffCycleReasonSelectionPresentation","SwitchField","MultiSelectComboBoxField","RadioGroupField","value","Trans","OffCycleTaxWithholdingTable","OffCycleTaxWithholdingModal"],"mappings":"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"}

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

@@ -1,48 +1,48 @@
 import { jsx as e, jsxs as f } from "react/jsx-runtime";
 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 { hasActionableBlockers as K, getBlockerTranslationKeys as P, isActionableBlocker as C } from "../payrollHelpers.js";
+import { useComponentContext as D } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { Flex as B } from "../../../Common/Flex/Flex.js";
 import { useI18n as I } from "../../../../i18n/I18n.js";
 function H({
-  blockers: o,
+  blockers: n,
   onViewBlockersClick: i,
   viewBlockersLabel: y,
   className: a
 }) {
   I("Payroll.PayrollBlocker");
-  const { t } = A("Payroll.PayrollBlocker"), { Alert: d, Button: p, Text: u, UnorderedList: x } = C();
-  if (o.length === 0)
+  const { t } = A("Payroll.PayrollBlocker"), { Alert: d, Button: p, Text: u, UnorderedList: x } = D();
+  if (n.length === 0)
     return null;
-  const s = o.length > 1, h = !!i && (s || K(o)), m = o.map((r) => {
+  const s = n.length > 1, h = !!i && (s || K(n)), m = n.map((r) => {
     const c = P(r.key), T = t(c.titleKey, {
-      defaultValue: t("defaultBlockerDescription")
+      defaultValue: t("genericBlockerTitle")
     }), k = t(c.descriptionKey, {
       defaultValue: r.message || t("defaultBlockerDescription")
-    }), v = D(r.key) ? void 0 : t(c.helpTextKey, { defaultValue: t("defaultBlockerHelp") });
+    }), v = C(r.key) ? void 0 : t(c.helpTextKey, { defaultValue: t("defaultBlockerHelp") });
     return {
       ...r,
       title: T,
       description: k,
       helpText: v
     };
-  }), n = y || t(s ? "viewAllBlockers" : "viewBlocker"), l = m[0];
+  }), o = 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: [
       /* @__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(p, { variant: "secondary", onClick: i, title: o, children: o }) })
     ] }) });
   const g = m.map((r) => r.title);
   return /* @__PURE__ */ e(
     d,
     {
       status: "error",
-      label: t("multipleIssuesTitle", { count: o.length }),
+      label: t("multipleIssuesTitle", { count: n.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(p, { variant: "secondary", onClick: i, title: o, children: o }) })
       ] })
     }
   );

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

	@@ -1 +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\n/*\n @internal\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":";;;;;;AAqBO,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;"}
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\n/*\n @internal\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('genericBlockerTitle'),\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":";;;;;;AAqBO,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,qBAAqB;AAAA,IAAA,CACtC,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/PayrollBlocker/components/PayrollBlockerList.js CHANGED Viewed

@@ -1,29 +1,29 @@
 import { jsx as o, jsxs as m } from "react/jsx-runtime";
-import { useState as L, useCallback as d } from "react";
-import { useTranslation as N } from "react-i18next";
-import k from "classnames";
-import { usePayrollsGetBlockersSuspense as O } from "@gusto/embedded-api/react-query/payrollsGetBlockers";
+import { useState as N, useCallback as d } from "react";
+import { useTranslation as O } from "react-i18next";
+import C from "classnames";
+import { usePayrollsGetBlockersSuspense as U } from "@gusto/embedded-api/react-query/payrollsGetBlockers";
 import { useRecoveryCasesGetSuspense as V } from "@gusto/embedded-api/react-query/recoveryCasesGet";
-import { useInformationRequestsGetInformationRequestsSuspense as F } from "@gusto/embedded-api/react-query/informationRequestsGetInformationRequests";
-import { InformationRequestStatus as K } from "@gusto/embedded-api/models/components/informationrequest";
-import { getBlockerTranslationKeys as G } from "../payrollHelpers.js";
-import v from "./PayrollBlockerList.module.scss.js";
-import { useComponentContext as M } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { FlexItem as j, Flex as a } from "../../../Common/Flex/Flex.js";
-import { DataView as $ } from "../../../Common/DataView/DataView.js";
-import { useDataView as H } from "../../../Common/DataView/useDataView.js";
-import { useComponentDictionary as Q, useI18n as Y } from "../../../../i18n/I18n.js";
-import { RecoveryCases as z } from "../../RecoveryCases/RecoveryCases.js";
-import { BaseComponent as J } from "../../../Base/Base.js";
+import { useInformationRequestsGetInformationRequestsSuspense as _ } from "@gusto/embedded-api/react-query/informationRequestsGetInformationRequests";
+import { InformationRequestStatus as F } from "@gusto/embedded-api/models/components/informationrequest";
+import { getBlockerTranslationKeys as K } from "../payrollHelpers.js";
+import B from "./PayrollBlockerList.module.scss.js";
+import { useComponentContext as G } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { FlexItem as M, Flex as a } from "../../../Common/Flex/Flex.js";
+import { DataView as j } from "../../../Common/DataView/DataView.js";
+import { useDataView as $ } from "../../../Common/DataView/useDataView.js";
+import { useComponentDictionary as H, useI18n as Q } from "../../../../i18n/I18n.js";
+import { RecoveryCases as Y } from "../../RecoveryCases/RecoveryCases.js";
+import { BaseComponent as z } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
-import { recoveryCasesEvents as W, informationRequestEvents as X } from "../../../../shared/constants.js";
-import { InformationRequestsFlow as Z } from "../../../InformationRequests/InformationRequests.js";
-function be(s) {
-  return /* @__PURE__ */ o(J, { ...s, children: /* @__PURE__ */ o(ee, { ...s, children: s.children }) });
+import { recoveryCasesEvents as J, informationRequestEvents as W } from "../../../../shared/constants.js";
+import { InformationRequestsFlow as X } from "../../../InformationRequests/InformationRequests.js";
+function De(s) {
+  return /* @__PURE__ */ o(z, { ...s, children: /* @__PURE__ */ o(Z, { ...s, children: s.children }) });
 }
-function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
-  Q("Payroll.PayrollBlocker", B), Y("Payroll.PayrollBlocker");
-  const { t: r } = N("Payroll.PayrollBlocker"), { Button: D, Text: i, Heading: b, Alert: g } = M(), [x, f] = L({
+function Z({ className: s, companyId: n, dictionary: v, onEvent: u }) {
+  H("Payroll.PayrollBlocker", v), Q("Payroll.PayrollBlocker");
+  const { t: r } = O("Payroll.PayrollBlocker"), { Button: D, Text: i, Heading: b, Alert: g } = G(), [x, f] = N({
     id: 0,
     alerts: []
   }), E = d((e) => {
@@ -38,36 +38,36 @@ function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
     }));
   }, []), p = d(
     (e, t) => {
-      e === W.RECOVERY_CASE_RESUBMIT_DONE && c("recoveryCaseResubmitted"), e === X.INFORMATION_REQUEST_FORM_DONE && c("informationRequestResponded"), u(e, t);
+      e === J.RECOVERY_CASE_RESUBMIT_DONE && c("recoveryCaseResubmitted"), e === W.INFORMATION_REQUEST_FORM_DONE && c("informationRequestResponded"), u(e, t);
     },
     [u, c]
-  ), { data: A } = O({
+  ), { data: A } = U({
     companyUuid: n
   }), { data: S } = V({
     companyUuid: n
-  }), { data: q } = F({
+  }), { data: q } = _({
     companyUuid: n
   }), y = (A.payrollBlockers ?? []).map((e) => {
-    const t = e.key, l = G(t), I = r(l.titleKey, {
-      defaultValue: t.replace(/_/g, " ").replace(/\b\w/g, (_) => _.toUpperCase())
-    }), U = r(l.descriptionKey, {
+    const t = e.key, l = K(t), I = r(l.titleKey, {
+      defaultValue: r("genericBlockerTitle")
+    }), L = r(l.descriptionKey, {
       defaultValue: e.message || r("defaultBlockerDescription")
     });
     return {
       id: t,
       title: I,
-      description: U
+      description: L
     };
-  }), P = S.recoveryCases ?? [], w = q.informationRequests ?? [], h = P.some(
+  }), P = S.recoveryCases ?? [], T = q.informationRequests ?? [], h = P.some(
     (e) => e.status !== "recovered"
-  ), C = w.some(
-    (e) => e.status !== K.Approved
-  ), T = H({
+  ), k = T.some(
+    (e) => e.status !== F.Approved
+  ), w = $({
     data: y,
     columns: [
       {
         title: r("blockerSectionLabel"),
-        render: (e) => /* @__PURE__ */ o(j, { flexGrow: 1, children: /* @__PURE__ */ m(a, { flexDirection: "column", gap: 8, children: [
+        render: (e) => /* @__PURE__ */ o(M, { flexGrow: 1, children: /* @__PURE__ */ m(a, { flexDirection: "column", gap: 8, children: [
           /* @__PURE__ */ o(i, { weight: "semibold", children: e.title }),
           /* @__PURE__ */ o(i, { variant: "supporting", children: e.description })
         ] }) })
@@ -81,7 +81,7 @@ function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
       }
     ]
   }), R = y.length > 0;
-  return R || h || C ? /* @__PURE__ */ o("div", { className: k(v.root, s), children: /* @__PURE__ */ m(a, { flexDirection: "column", gap: 32, children: [
+  return R || h || k ? /* @__PURE__ */ o("div", { className: C(B.root, s), children: /* @__PURE__ */ m(a, { flexDirection: "column", gap: 32, children: [
     x.alerts.map((e) => /* @__PURE__ */ o(
       g,
       {
@@ -96,13 +96,13 @@ function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
     )),
     R && /* @__PURE__ */ m(a, { flexDirection: "column", gap: 20, children: [
       /* @__PURE__ */ o(b, { as: "h2", styledAs: "h4", children: r("blockersListTitle") }),
-      /* @__PURE__ */ o($, { ...T, label: r("blockersListTitle") })
+      /* @__PURE__ */ o(j, { ...w, label: r("blockersListTitle") })
     ] }),
-    h && /* @__PURE__ */ o(z, { companyId: n, onEvent: p }),
-    C && /* @__PURE__ */ o(Z, { companyId: n, withAlert: !1, onEvent: p })
-  ] }) }) : /* @__PURE__ */ o("div", { className: k(v.root, s), children: /* @__PURE__ */ o(i, { children: r("noBlockersMessage") }) });
+    h && /* @__PURE__ */ o(Y, { companyId: n, onEvent: p }),
+    k && /* @__PURE__ */ o(X, { companyId: n, withAlert: !1, onEvent: p })
+  ] }) }) : /* @__PURE__ */ o("div", { className: C(B.root, s), children: /* @__PURE__ */ o(i, { children: r("noBlockersMessage") }) });
 }
 export {
-  be as PayrollBlockerList
+  De as PayrollBlockerList
 };
 //# sourceMappingURL=PayrollBlockerList.js.map