@gusto/embedded-react-sdk 0.57.2 → 0.58.0

package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployeePresentation.js

@@ -1,36 +1,36 @@
 import { jsx as t, jsxs as m } from "react/jsx-runtime";
-import { useForm as ne, useFieldArray as Oe, useWatch as Re, FormProvider as te } from "react-hook-form";
-import { useRef as xe, useMemo as B, useState as Se } from "react";
+import { useForm as ne, useFieldArray as Re, useWatch as xe, FormProvider as te } from "react-hook-form";
+import { useRef as Se, useMemo as V, useState as Ie } from "react";
 import Fe from "classnames";
-import { PayrollEmployeeCompensationsTypePaymentMethod as P } from "@gusto/embedded-api/models/components/payrollemployeecompensationstype";
-import { useTranslation as Ie } from "react-i18next";
+import { PayrollEmployeeCompensationsTypePaymentMethod as v } from "@gusto/embedded-api/models/components/payrollemployeecompensationstype";
+import { useTranslation as _e } from "react-i18next";
 import { z as s } from "zod";
 import { zodResolver as ie } from "@hookform/resolvers/zod";
 import c from "./PayrollEditEmployeePresentation.module.scss.js";
-import { TimeOffField as _e, PayoutTimeOffField as De } from "./TimeOffField.js";
+import { TimeOffField as De, PayoutTimeOffField as Le } from "./TimeOffField.js";
 import { Flex as E } from "../../Common/Flex/Flex.js";
-import { Grid as x } from "../../Common/Grid/Grid.js";
-import { EmptyData as Le } from "../../Common/EmptyData/EmptyData.js";
-import { useComponentContext as Ue } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { Grid as I } from "../../Common/Grid/Grid.js";
+import { EmptyData as Ue } from "../../Common/EmptyData/EmptyData.js";
+import { useComponentContext as je } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as ke } from "../../../i18n/I18n.js";
-import { Form as je } from "../../Common/Form/Form.js";
-import { formatNumberAsCurrency as re, firstLastName as He, stripLeadingZeros as k } from "../../../helpers/formattedStrings.js";
-import { getAdditionalEarningsCompensations as Ge, calculateGrossPay as se } from "../helpers.js";
-import { PayrollCategory as I, isOffCyclePayroll as ue } from "../payrollTypes.js";
-import { COMPENSATION_NAME_REIMBURSEMENT as S, HOURS_COMPENSATION_NAMES as ae, EXCLUDED_ADDITIONAL_EARNINGS as we, COMPENSATION_NAME_DOUBLE_OVERTIME as $e, COMPENSATION_NAME_OVERTIME as Be, COMPENSATION_NAME_REGULAR_HOURS as Ve, COMPENSATION_NAME_CASH_TIPS as ze, COMPENSATION_NAME_COMMISSION as We, COMPENSATION_NAME_CORRECTION_PAYMENT as Xe, COMPENSATION_NAME_PAYCHECK_TIPS as qe, COMPENSATION_NAME_BONUS as Ye } from "../../../shared/constants.js";
-import Ke from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
+import { Form as He } from "../../Common/Form/Form.js";
+import { formatNumberAsCurrency as re, firstLastName as Ge, stripLeadingZeros as j } from "../../../helpers/formattedStrings.js";
+import { getAdditionalEarningsCompensations as we, calculateGrossPay as se } from "../helpers.js";
+import { PayrollCategory as S, isOffCyclePayroll as le } from "../payrollTypes.js";
+import { COMPENSATION_NAME_REIMBURSEMENT as x, HOURS_COMPENSATION_NAMES as ae, EXCLUDED_ADDITIONAL_EARNINGS as $e, COMPENSATION_NAME_DOUBLE_OVERTIME as Ve, COMPENSATION_NAME_OVERTIME as Be, COMPENSATION_NAME_REGULAR_HOURS as qe, COMPENSATION_NAME_CASH_TIPS as ze, COMPENSATION_NAME_COMMISSION as We, COMPENSATION_NAME_CORRECTION_PAYMENT as Xe, COMPENSATION_NAME_PAYCHECK_TIPS as Ye, COMPENSATION_NAME_BONUS as Ke } from "../../../shared/constants.js";
+import Ze from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
 import oe from "../../../assets/icons/plus-circle.svg.js";
-import Ze from "../../../assets/icons/trashcan.svg.js";
+import Qe from "../../../assets/icons/trashcan.svg.js";
 import { TextInputField as F } from "../../Common/Fields/TextInputField/TextInputField.js";
-import { RadioGroupField as Qe } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { useDataView as Je } from "../../Common/DataView/useDataView.js";
-import { DataView as en } from "../../Common/DataView/DataView.js";
+import { RadioGroupField as Je } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { useDataView as en } from "../../Common/DataView/useDataView.js";
+import { DataView as me } from "../../Common/DataView/DataView.js";
 const nn = s.object({
   uuid: s.string().nullable().optional(),
   description: s.string(),
   amount: s.string(),
   recurring: s.boolean().optional()
-}), le = 1e6, tn = s.object({
+}), de = 1e6, tn = s.object({
   description: s.string(),
   amount: s.string().refine(
     (a) => {
@@ -38,22 +38,22 @@ const nn = s.object({
       return !Number.isNaN(C) && C > 0;
     },
     { message: "validations.reimbursementAmount" }
-  ).refine((a) => parseFloat(a) <= le, {
+  ).refine((a) => parseFloat(a) <= de, {
     message: "validations.maxReimbursementAmount"
   })
-}), rn = s.string().optional().refine((a) => !a || parseFloat(a) >= 0, { message: "validations.negativeAmount" }), de = 99999, sn = s.string().optional().refine((a) => !a || parseFloat(a) <= de, { message: "validations.maxHours" }), an = s.object({
+}), rn = s.string().optional().refine((a) => !a || parseFloat(a) >= 0, { message: "validations.negativeAmount" }), ce = 99999, sn = s.string().optional().refine((a) => !a || parseFloat(a) <= ce, { message: "validations.maxHours" }), an = s.object({
   hourlyCompensations: s.record(s.string(), s.record(s.string(), sn)),
   timeOffCompensations: s.record(s.string(), s.string().optional()),
   finalPayoutCompensations: s.record(s.string(), s.string().optional()),
   fixedCompensations: s.record(s.string(), rn),
   reimbursements: s.array(nn),
-  paymentMethod: s.enum(P).optional()
-}), me = (a, C, j, p, o = I.Regular) => {
-  const y = {
+  paymentMethod: s.enum(v).optional()
+}), ue = (a, C, k, p, o = S.Regular) => {
+  const N = {
     ...C,
     paymentMethod: a.paymentMethod
   };
-  y.hourlyCompensations = C?.hourlyCompensations?.map(
+  N.hourlyCompensations = C?.hourlyCompensations?.map(
     (r) => {
       const u = r.jobUuid && r.name ? a.hourlyCompensations[r.jobUuid]?.[r.name] : void 0;
       return u ? {
@@ -61,8 +61,8 @@ const nn = s.object({
         hours: u
       } : r;
     }
-  ), y.paidTimeOff = j.map((r) => {
-    const u = o === I.Dismissal, { finalPayoutUnusedHoursInput: v, ...h } = r;
+  ), N.paidTimeOff = k.map((r) => {
+    const u = o === S.Dismissal, { finalPayoutUnusedHoursInput: O, ...h } = r;
     if (u) {
       const l = a.finalPayoutCompensations[r.name] ?? r.finalPayoutUnusedHoursInput;
       return {
@@ -76,9 +76,9 @@ const nn = s.object({
       hours: a.timeOffCompensations[r.name] || "0"
     };
   });
-  const _ = !ue(o), M = [];
+  const _ = !le(o), M = [];
   return Object.entries(a.fixedCompensations).forEach(([r, u]) => {
-    if (r.toLowerCase() === S.toLowerCase() && _)
+    if (r.toLowerCase() === x.toLowerCase() && _)
       return;
     const h = C?.fixedCompensations?.find(
       (H) => H.name?.toLowerCase() === r.toLowerCase()
@@ -92,69 +92,69 @@ const nn = s.object({
       jobUuid: p,
       amount: l
     }));
-  }), y.fixedCompensations = M, _ ? y.reimbursements = a.reimbursements.map((r) => ({
+  }), N.fixedCompensations = M, _ ? N.reimbursements = a.reimbursements.map((r) => ({
     amount: r.amount,
     description: r.description.trim() === "" ? null : r.description.trim(),
     uuid: r.uuid ?? null,
     recurring: r.recurring
-  })) : y.reimbursements = [], y;
+  })) : N.reimbursements = [], N;
 }, Ln = ({
   className: a,
   onSave: C,
-  onCancel: j,
+  onCancel: k,
   employee: p,
   employeeCompensation: o,
-  isPending: y = !1,
+  isPending: N = !1,
   fixedCompensationTypes: _,
   payPeriodStartDate: M,
   paySchedule: r,
-  payrollCategory: u = I.Regular,
-  withReimbursements: v = !0,
+  payrollCategory: u = S.Regular,
+  withReimbursements: O = !0,
   hasDirectDepositSetup: h = !0
 }) => {
-  const { Button: l, ButtonIcon: H, Heading: f, Text: V } = Ue(), { t: n } = Ie("Payroll.PayrollEditEmployee");
+  const { Button: l, ButtonIcon: H, Heading: f, Text: B } = je(), { t: n } = _e("Payroll.PayrollEditEmployee");
   ke("Payroll.PayrollEditEmployee");
-  const b = p.jobs?.find((e) => e.primary), ce = o?.hourlyCompensations?.some(
+  const b = p.jobs?.find((e) => e.primary), pe = o?.hourlyCompensations?.some(
     (e) => e.jobUuid === b?.uuid
-  ), O = b && ce ? [b] : [], z = xe(null), g = Ke({
-    ref: z
+  ), P = b && pe ? [b] : [], q = Se(null), g = Ze({
+    ref: q
   }).includes("small");
   o?.hourlyCompensations?.forEach((e) => {
     const i = p.jobs?.find((d) => d.uuid === e.jobUuid);
-    i && !O.find((d) => d.uuid === i.uuid) && O.push(i);
+    i && !P.find((d) => d.uuid === i.uuid) && P.push(i);
   });
-  const T = (o?.paidTimeOff || []).filter((e) => e.name), G = Ge({
+  const T = (o?.paidTimeOff || []).filter((e) => e.name), G = we({
     flsaStatus: b?.compensations?.[0]?.flsaStatus,
     existingFixedCompensations: o?.fixedCompensations || [],
     primaryJobUuid: b?.uuid,
     fixedCompensationTypes: _,
-    excludedTypes: we
-  }), D = !ue(u), pe = B(
-    () => v && D ? o?.reimbursements ?? [] : [],
-    [v, D, o?.reimbursements]
-  ), fe = B(
+    excludedTypes: $e
+  }), D = !le(u), fe = V(
+    () => O && D ? o?.reimbursements ?? [] : [],
+    [O, D, o?.reimbursements]
+  ), he = V(
     () => o?.fixedCompensations?.find(
-      (e) => e.name?.toLowerCase() === S.toLowerCase()
+      (e) => e.name?.toLowerCase() === x.toLowerCase()
     ),
     [o?.fixedCompensations]
-  ), W = v && !D && !!b?.uuid, X = (e, i) => o?.hourlyCompensations?.find(
+  ), z = O && !D && !!b?.uuid, W = (e, i) => o?.hourlyCompensations?.find(
     (d) => d.jobUuid === e && d.name?.toLowerCase() === i.toLowerCase()
-  ), he = (e) => {
+  ), be = (e) => {
     switch (e) {
-      case Ve:
+      case qe:
         return n("compensationNames.regularHours");
       case Be:
         return n("compensationNames.overtime");
-      case $e:
+      case Ve:
         return n("compensationNames.doubleOvertime");
       default:
         return e;
     }
-  }, q = (e) => {
+  }, X = (e) => {
     switch (e) {
-      case Ye:
+      case Ke:
         return n("fixedCompensationNames.bonus");
-      case qe:
+      case Ye:
         return n("fixedCompensationNames.paycheckTips");
       case Xe:
         return n("fixedCompensationNames.correctionPayment");
@@ -162,20 +162,20 @@ const nn = s.object({
         return n("fixedCompensationNames.commission");
       case ze:
         return n("fixedCompensationNames.cashTips");
-      case S:
+      case x:
         return n("fixedCompensationNames.reimbursement");
       default:
         return e;
     }
-  }, be = () => {
+  }, ge = () => {
     const e = o?.paymentMethod;
-    return e ? !h && e === P.DirectDeposit ? P.Check : e : h ? P.DirectDeposit : P.Check;
-  }, ge = {
+    return e ? !h && e === v.DirectDeposit ? v.Check : e : h ? v.DirectDeposit : v.Check;
+  }, Ce = {
     hourlyCompensations: (() => {
       const e = {};
-      return O.forEach((i) => {
+      return P.forEach((i) => {
         ae.forEach((d) => {
-          const R = X(i.uuid, d);
+          const R = W(i.uuid, d);
           R && (e[i.uuid] || (e[i.uuid] = {}), e[i.uuid][R.name] = R.hours ? parseFloat(R.hours).toString() : "");
         });
       }), e;
@@ -196,43 +196,43 @@ const nn = s.object({
       const e = {};
       return G.forEach((i) => {
         e[i.name] = i.amount ?? "";
-      }), W && (e[S] = fe?.amount ?? "0.00"), e;
+      }), z && (e[x] = he?.amount ?? "0.00"), e;
     })(),
-    reimbursements: pe.map((e) => ({
+    reimbursements: fe.map((e) => ({
       uuid: e.uuid ?? null,
       description: e.description ?? "",
       amount: e.amount,
       recurring: e.recurring ?? !1
     })),
-    paymentMethod: be()
+    paymentMethod: ge()
   }, L = ne({
     resolver: ie(an),
-    defaultValues: ge
+    defaultValues: Ce
   }), {
     fields: Y,
-    append: Ce,
+    append: Ne,
     remove: ye,
-    update: Ne
-  } = Oe({
+    update: Ae
+  } = Re({
     control: L.control,
     name: "reimbursements"
-  }), Ae = (e) => {
+  }), Ee = (e) => {
     const i = Y[e];
-    i && (i.uuid ? Ne(e, { ...i, amount: "0" }) : ye(e));
-  }, w = Y.map((e, i) => ({ ...e, originalIndex: i })).filter((e) => parseFloat(e.amount || "0") !== 0), [K, $] = Se(!1), U = ne({
+    i && (i.uuid ? Ae(e, { ...i, amount: "0" }) : ye(e));
+  }, w = Y.map((e, i) => ({ ...e, originalIndex: i })).filter((e) => parseFloat(e.amount || "0") !== 0), [K, $] = Ie(!1), U = ne({
     resolver: ie(tn),
     defaultValues: { description: "", amount: "" }
   }), Z = () => {
     $(!1), U.reset();
-  }, Ee = (e) => {
+  }, Me = (e) => {
     const i = parseFloat(e.amount);
-    Ce({
+    Ne({
       uuid: null,
       description: e.description.trim(),
       amount: i.toFixed(2),
       recurring: !1
     }), Z();
-  }, Me = Je({
+  }, Te = en({
     data: w,
     columns: [
       {
@@ -260,14 +260,14 @@ const nn = s.object({
         {
           variant: "tertiary",
           onClick: () => {
-            Ae(e.originalIndex);
+            Ee(e.originalIndex);
           },
           "aria-label": n("removeReimbursementLabel", { description: i }),
-          children: /* @__PURE__ */ t(Ze, { "aria-hidden": !0 })
+          children: /* @__PURE__ */ t(Qe, { "aria-hidden": !0 })
         }
       );
     },
-    emptyState: () => /* @__PURE__ */ t(Le, { title: n("reimbursementEmptyTitle"), children: /* @__PURE__ */ t(
+    emptyState: () => /* @__PURE__ */ t(Ue, { title: n("reimbursementEmptyTitle"), children: /* @__PURE__ */ t(
       l,
       {
         variant: "secondary",
@@ -278,27 +278,27 @@ const nn = s.object({
         children: n("addReimbursementCta")
       }
     ) })
-  }), N = Re({
+  }), y = xe({
     control: L.control
-  }), Te = B(() => {
+  }), ve = V(() => {
     try {
       const e = {};
-      N.hourlyCompensations && Object.entries(N.hourlyCompensations).forEach(([A, ee]) => {
+      y.hourlyCompensations && Object.entries(y.hourlyCompensations).forEach(([A, ee]) => {
         ee && (e[A] = ee);
       });
-      const i = (N.reimbursements ?? []).map((A) => ({
+      const i = (y.reimbursements ?? []).map((A) => ({
         uuid: A.uuid ?? null,
         description: A.description ?? "",
         amount: A.amount ?? "0",
         recurring: A.recurring
       })), d = {
         hourlyCompensations: e,
-        timeOffCompensations: N.timeOffCompensations || {},
-        finalPayoutCompensations: N.finalPayoutCompensations || {},
-        fixedCompensations: N.fixedCompensations || {},
+        timeOffCompensations: y.timeOffCompensations || {},
+        finalPayoutCompensations: y.finalPayoutCompensations || {},
+        fixedCompensations: y.fixedCompensations || {},
         reimbursements: i,
-        paymentMethod: N.paymentMethod
-      }, R = me(
+        paymentMethod: y.paymentMethod
+      }, R = ue(
         d,
         o,
         (o?.paidTimeOff || []).filter((A) => A.name),
@@ -322,18 +322,18 @@ const nn = s.object({
       ) : 0;
     }
   }, [
-    N,
+    y,
     o,
     b?.uuid,
     p,
     M,
     r,
     u
-  ]), Pe = He({
+  ]), Oe = Ge({
     first_name: p.firstName,
     last_name: p.lastName
-  }), ve = (e) => {
-    const i = me(
+  }), Pe = (e) => {
+    const i = ue(
       e,
       o,
       T,
@@ -341,7 +341,7 @@ const nn = s.object({
       u
     );
     C(i);
-  }, Q = re(Te || 0), J = /* @__PURE__ */ m(
+  }, Q = re(ve || 0), J = /* @__PURE__ */ m(
     E,
     {
       flexDirection: g ? "row" : "column",
@@ -349,30 +349,30 @@ const nn = s.object({
       alignItems: g ? "flex-start" : "stretch",
       gap: 12,
       children: [
-        /* @__PURE__ */ t(l, { variant: "secondary", onClick: j, title: n("cancelCta"), children: n("cancelCta") }),
+        /* @__PURE__ */ t(l, { variant: "secondary", onClick: k, title: n("cancelCta"), children: n("cancelCta") }),
         /* @__PURE__ */ t(
           l,
           {
-            onClick: L.handleSubmit(ve),
+            onClick: L.handleSubmit(Pe),
             title: n("saveCta"),
-            isLoading: y,
+            isLoading: N,
             children: n("saveCta")
           }
         )
       ]
     }
   );
-  return /* @__PURE__ */ m("div", { ref: z, className: Fe(c.container, a), children: [
+  return /* @__PURE__ */ m("div", { ref: q, className: Fe(c.container, a), children: [
     /* @__PURE__ */ t(
       "div",
       {
         className: `${c.headerSection} ${g ? "" : c.headerSectionSticky}`,
         children: /* @__PURE__ */ m(E, { justifyContent: "space-between", children: [
           /* @__PURE__ */ m(E, { flexDirection: "column", alignItems: "stretch", gap: g ? 8 : 2, children: [
-            /* @__PURE__ */ t(f, { as: "h1", styledAs: g ? "h2" : "h4", children: n("pageTitle", { employeeName: Pe }) }),
+            /* @__PURE__ */ t(f, { as: "h1", styledAs: g ? "h2" : "h4", children: n("pageTitle", { employeeName: Oe }) }),
             g ? /* @__PURE__ */ m(E, { flexDirection: "column", gap: 6, children: [
               /* @__PURE__ */ t(f, { as: "h2", styledAs: "h3", children: Q }),
-              /* @__PURE__ */ t(V, { className: c.grossPayLabel, children: n("grossPayLabel") })
+              /* @__PURE__ */ t(B, { className: c.grossPayLabel, children: n("grossPayLabel") })
             ] }) : /* @__PURE__ */ t(f, { as: "h2", styledAs: "h6", className: c.grossPayLabel, children: n("grossPayLabelMobile", { grossPay: Q }) })
           ] }),
           g && J
@@ -380,13 +380,13 @@ const nn = s.object({
       }
     ),
     /* @__PURE__ */ m(te, { ...L, children: [
-      /* @__PURE__ */ m(je, { children: [
-        O.length > 0 && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
+      /* @__PURE__ */ m(He, { children: [
+        P.length > 0 && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", children: n("regularHoursTitle") }),
-          O.map((e) => /* @__PURE__ */ m(E, { flexDirection: "column", gap: 8, children: [
-            O.length > 1 && /* @__PURE__ */ t(f, { as: "h4", children: e.title }),
-            /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: ae.map((i) => {
-              const d = X(
+          P.map((e) => /* @__PURE__ */ m(E, { flexDirection: "column", gap: 8, children: [
+            P.length > 1 && /* @__PURE__ */ t(f, { as: "h4", children: e.title }),
+            /* @__PURE__ */ t(I, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: ae.map((i) => {
+              const d = W(
                 e.uuid,
                 i
               );
@@ -396,10 +396,10 @@ const nn = s.object({
                   {
                     type: "number",
                     min: 0,
-                    max: de,
-                    transform: k,
+                    max: ce,
+                    transform: j,
                     adornmentEnd: n("hoursUnit"),
-                    label: he(i),
+                    label: be(i),
                     name: `hourlyCompensations.${e.uuid}.${d.name}`,
                     errorMessage: n("validations.maxHours")
                   },
@@ -409,23 +409,35 @@ const nn = s.object({
           ] }, e.uuid))
         ] }),
         T.length > 0 && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
-          /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: u === I.Dismissal ? n("timeOffTitleDismissal") : n("timeOffTitle") }),
-          /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ t(
-            _e,
+          /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: u === S.Dismissal ? n("timeOffTitleDismissal") : n("timeOffTitle") }),
+          /* @__PURE__ */ t(
+            me,
             {
-              timeOff: e,
-              employee: p
-            },
-            e.name
-          )) })
+              label: u === S.Dismissal ? n("timeOffTitleDismissal") : n("timeOffTitle"),
+              data: T,
+              columns: [
+                { title: n("timeOffTypeColumn"), render: (e) => e.name },
+                {
+                  title: n("preapprovedHoursColumn"),
+                  justify: "end",
+                  render: (e) => Number(e.approvedRequestHours) > 0 ? Number(e.approvedRequestHours) : null
+                },
+                {
+                  title: n("additionalHoursColumn"),
+                  justify: "end",
+                  render: (e) => /* @__PURE__ */ t("div", { className: c.timeOffInputContainer, children: /* @__PURE__ */ t(De, { timeOff: e, employee: p, shouldVisuallyHideLabel: !0 }) })
+                }
+              ]
+            }
+          )
         ] }),
-        u === I.Dismissal && T.length > 0 && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
+        u === S.Dismissal && T.length > 0 && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ m(E, { flexDirection: "column", gap: 4, children: [
             /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("finalPayoutTitle") }),
-            /* @__PURE__ */ t(V, { variant: "supporting", children: n("finalPayoutDescription") })
+            /* @__PURE__ */ t(B, { variant: "supporting", children: n("finalPayoutDescription") })
           ] }),
-          /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ t(
-            De,
+          /* @__PURE__ */ t(I, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ t(
+            Le,
             {
               timeOff: e,
               employee: p
@@ -436,7 +448,7 @@ const nn = s.object({
         G.length > 0 && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("additionalEarningsTitle") }),
           /* @__PURE__ */ t(
-            x,
+            I,
             {
               gridTemplateColumns: { base: "1fr", small: [320, 320], large: [320, 320, 320] },
               gap: 20,
@@ -445,9 +457,9 @@ const nn = s.object({
                 {
                   type: "number",
                   min: 0,
-                  transform: k,
+                  transform: j,
                   adornmentStart: "$",
-                  label: q(e.name),
+                  label: X(e.name),
                   name: `fixedCompensations.${e.name}`,
                   errorMessage: n("validations.negativeAmount")
                 },
@@ -456,26 +468,26 @@ const nn = s.object({
             }
           )
         ] }),
-        W && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
+        z && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("reimbursementTitle") }),
-          /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: /* @__PURE__ */ t(
+          /* @__PURE__ */ t(I, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: /* @__PURE__ */ t(
             F,
             {
               type: "number",
               min: 0,
-              transform: k,
+              transform: j,
               adornmentStart: "$",
-              label: q(S),
-              name: `fixedCompensations.${S}`,
+              label: X(x),
+              name: `fixedCompensations.${x}`,
               errorMessage: n("validations.negativeAmount")
             }
           ) })
         ] }),
-        v && D && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
+        O && D && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("reimbursementTitle") }),
-          !(w.length === 0 && K) && /* @__PURE__ */ t(en, { label: n("reimbursementsTableLabel"), ...Me }),
+          !(w.length === 0 && K) && /* @__PURE__ */ t(me, { label: n("reimbursementsTableLabel"), ...Te }),
           K ? /* @__PURE__ */ t(te, { ...U, children: /* @__PURE__ */ m(E, { flexDirection: "column", gap: 12, children: [
-            /* @__PURE__ */ m(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: [
+            /* @__PURE__ */ m(I, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: [
               /* @__PURE__ */ t(
                 F,
                 {
@@ -490,8 +502,8 @@ const nn = s.object({
                   name: "amount",
                   type: "number",
                   min: 0,
-                  max: le,
-                  transform: k,
+                  max: de,
+                  transform: j,
                   adornmentStart: "$",
                   isRequired: !0,
                   label: n("reimbursementAmountLabel"),
@@ -500,7 +512,7 @@ const nn = s.object({
               )
             ] }),
             /* @__PURE__ */ m(E, { gap: 12, children: [
-              /* @__PURE__ */ t(l, { onClick: U.handleSubmit(Ee), children: n("saveReimbursementCta") }),
+              /* @__PURE__ */ t(l, { onClick: U.handleSubmit(Me), children: n("saveReimbursementCta") }),
               /* @__PURE__ */ t(l, { variant: "secondary", onClick: Z, children: n("cancelReimbursementCta") })
             ] })
           ] }) }) : w.length > 0 && /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
@@ -519,7 +531,7 @@ const nn = s.object({
         h && /* @__PURE__ */ m("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("paymentMethodTitle") }),
           /* @__PURE__ */ t(
-            Qe,
+            Je,
             {
               name: "paymentMethod",
               isRequired: !0,
@@ -527,11 +539,11 @@ const nn = s.object({
               description: n("paymentMethodDescription"),
               options: [
                 {
-                  value: P.DirectDeposit,
+                  value: v.DirectDeposit,
                   label: n("paymentMethodOptions.directDeposit")
                 },
                 {
-                  value: P.Check,
+                  value: v.Check,
                   label: n("paymentMethodOptions.check")
                 }
               ]