@gusto/embedded-react-sdk 0.56.2 → 0.56.4

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

@@ -1,36 +1,36 @@
 import { jsx as t, jsxs as a } from "react/jsx-runtime";
-import { useForm as ee, useFieldArray as Ae, useWatch as Me, FormProvider as ne } from "react-hook-form";
-import { useRef as Oe, useMemo as $, useState as ve } from "react";
-import Re from "classnames";
+import { useForm as ne, useFieldArray as Me, useWatch as Oe, FormProvider as te } from "react-hook-form";
+import { useRef as ve, useMemo as V, useState as Re } from "react";
+import xe from "classnames";
 import { PayrollEmployeeCompensationsTypePaymentMethod as M } from "@gusto/embedded-api/models/components/payrollemployeecompensationstype";
-import { useTranslation as xe } from "react-i18next";
+import { useTranslation as Se } from "react-i18next";
 import { z as s } from "zod";
-import { zodResolver as te } from "@hookform/resolvers/zod";
+import { zodResolver as ie } from "@hookform/resolvers/zod";
 import c from "./PayrollEditEmployeePresentation.module.scss.js";
-import { TimeOffField as Se, PayoutTimeOffField as Ie } from "./TimeOffField.js";
+import { TimeOffField as Ie, PayoutTimeOffField as Fe } from "./TimeOffField.js";
 import { Flex as P } from "../../Common/Flex/Flex.js";
 import { Grid as x } from "../../Common/Grid/Grid.js";
-import { EmptyData as Fe } from "../../Common/EmptyData/EmptyData.js";
-import { useComponentContext as De } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as _e } from "../../../i18n/I18n.js";
-import { Form as Le } from "../../Common/Form/Form.js";
-import { formatNumberAsCurrency as ie, firstLastName as ke } from "../../../helpers/formattedStrings.js";
-import { getAdditionalEarningsCompensations as Ue, calculateGrossPay as re } from "../helpers.js";
-import { PayrollCategory as F, isOffCyclePayroll as me } from "../payrollTypes.js";
-import { COMPENSATION_NAME_REIMBURSEMENT as S, HOURS_COMPENSATION_NAMES as se, EXCLUDED_ADDITIONAL_EARNINGS as je, COMPENSATION_NAME_DOUBLE_OVERTIME as Ge, COMPENSATION_NAME_OVERTIME as He, COMPENSATION_NAME_REGULAR_HOURS as we, COMPENSATION_NAME_CASH_TIPS as $e, COMPENSATION_NAME_COMMISSION as Ve, COMPENSATION_NAME_CORRECTION_PAYMENT as Be, COMPENSATION_NAME_PAYCHECK_TIPS as ze, COMPENSATION_NAME_BONUS as We } from "../../../shared/constants.js";
-import qe from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
-import oe from "../../../assets/icons/plus-circle.svg.js";
-import Ye from "../../../assets/icons/trashcan.svg.js";
+import { EmptyData as De } from "../../Common/EmptyData/EmptyData.js";
+import { useComponentContext as _e } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as Le } from "../../../i18n/I18n.js";
+import { Form as ke } from "../../Common/Form/Form.js";
+import { formatNumberAsCurrency as re, firstLastName as Ue, stripLeadingZeros as k } from "../../../helpers/formattedStrings.js";
+import { getAdditionalEarningsCompensations as je, calculateGrossPay as se } from "../helpers.js";
+import { PayrollCategory as F, isOffCyclePayroll as ue } from "../payrollTypes.js";
+import { COMPENSATION_NAME_REIMBURSEMENT as S, HOURS_COMPENSATION_NAMES as oe, EXCLUDED_ADDITIONAL_EARNINGS as Ge, COMPENSATION_NAME_DOUBLE_OVERTIME as He, COMPENSATION_NAME_OVERTIME as we, COMPENSATION_NAME_REGULAR_HOURS as $e, COMPENSATION_NAME_CASH_TIPS as Ve, COMPENSATION_NAME_COMMISSION as Be, COMPENSATION_NAME_CORRECTION_PAYMENT as ze, COMPENSATION_NAME_PAYCHECK_TIPS as We, COMPENSATION_NAME_BONUS as qe } from "../../../shared/constants.js";
+import Ye from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
+import ae from "../../../assets/icons/plus-circle.svg.js";
+import Ke from "../../../assets/icons/trashcan.svg.js";
 import { TextInputField as I } from "../../Common/Fields/TextInputField/TextInputField.js";
-import { RadioGroupField as Ke } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
-import { useDataView as Xe } from "../../Common/DataView/useDataView.js";
+import { RadioGroupField as Xe } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { useDataView as Ze } from "../../Common/DataView/useDataView.js";
 import { DataView as Qe } from "../../Common/DataView/DataView.js";
-const Ze = s.object({
+const Je = s.object({
   uuid: s.string().nullable().optional(),
   description: s.string(),
   amount: s.string(),
   recurring: s.boolean().optional()
-}), Je = s.object({
+}), en = s.object({
   description: s.string(),
   amount: s.string().refine(
     (l) => {
@@ -39,14 +39,14 @@ const Ze = s.object({
     },
     { message: "validations.reimbursementAmount" }
   )
-}), en = s.string().optional().refine((l) => !l || parseFloat(l) >= 0, { message: "validations.negativeAmount" }), nn = s.object({
+}), nn = s.string().optional().refine((l) => !l || parseFloat(l) >= 0, { message: "validations.negativeAmount" }), tn = s.object({
   hourlyCompensations: s.record(s.string(), s.record(s.string(), s.string().optional())),
   timeOffCompensations: s.record(s.string(), s.string().optional()),
   finalPayoutCompensations: s.record(s.string(), s.string().optional()),
-  fixedCompensations: s.record(s.string(), en),
-  reimbursements: s.array(Ze),
+  fixedCompensations: s.record(s.string(), nn),
+  reimbursements: s.array(Je),
   paymentMethod: s.enum(M).optional()
-}), ae = (l, C, k, p, o = F.Regular) => {
+}), me = (l, C, U, p, o = F.Regular) => {
   const y = {
     ...C,
     paymentMethod: l.paymentMethod
@@ -59,7 +59,7 @@ const Ze = s.object({
         hours: m
       } : r;
     }
-  ), y.paidTimeOff = k.map((r) => {
+  ), y.paidTimeOff = U.map((r) => {
     const m = o === F.Dismissal, { finalPayoutUnusedHoursInput: O, ...h } = r;
     if (m) {
       const u = l.finalPayoutCompensations[r.name] ?? r.finalPayoutUnusedHoursInput;
@@ -74,12 +74,12 @@ const Ze = s.object({
       hours: l.timeOffCompensations[r.name] || "0"
     };
   });
-  const D = !me(o), T = [];
+  const D = !ue(o), T = [];
   return Object.entries(l.fixedCompensations).forEach(([r, m]) => {
     if (r.toLowerCase() === S.toLowerCase() && D)
       return;
     const h = C?.fixedCompensations?.find(
-      (U) => U.name?.toLowerCase() === r.toLowerCase()
+      (j) => j.name?.toLowerCase() === r.toLowerCase()
     ), u = m === "" && h ? "0" : m;
     u !== void 0 && u !== "" && (h ? T.push({
       name: h.name,
@@ -96,10 +96,10 @@ const Ze = s.object({
     uuid: r.uuid ?? null,
     recurring: r.recurring
   })) : y.reimbursements = [], y;
-}, In = ({
+}, Fn = ({
   className: l,
   onSave: C,
-  onCancel: k,
+  onCancel: U,
   employee: p,
   employeeCompensation: o,
   isPending: y = !1,
@@ -110,70 +110,70 @@ const Ze = s.object({
   withReimbursements: O = !0,
   hasDirectDepositSetup: h = !0
 }) => {
-  const { Button: u, ButtonIcon: U, Heading: f, Text: V } = De(), { t: n } = xe("Payroll.PayrollEditEmployee");
-  _e("Payroll.PayrollEditEmployee");
-  const b = p.jobs?.find((e) => e.primary), ue = o?.hourlyCompensations?.some(
+  const { Button: u, ButtonIcon: j, Heading: f, Text: B } = _e(), { t: n } = Se("Payroll.PayrollEditEmployee");
+  Le("Payroll.PayrollEditEmployee");
+  const b = p.jobs?.find((e) => e.primary), le = o?.hourlyCompensations?.some(
     (e) => e.jobUuid === b?.uuid
-  ), v = b && ue ? [b] : [], B = Oe(null), g = qe({
-    ref: B
+  ), v = b && le ? [b] : [], z = ve(null), g = Ye({
+    ref: z
   }).includes("small");
   o?.hourlyCompensations?.forEach((e) => {
     const i = p.jobs?.find((d) => d.uuid === e.jobUuid);
     i && !v.find((d) => d.uuid === i.uuid) && v.push(i);
   });
-  const A = (o?.paidTimeOff || []).filter((e) => e.name), j = Ue({
+  const A = (o?.paidTimeOff || []).filter((e) => e.name), G = je({
     flsaStatus: b?.compensations?.[0]?.flsaStatus,
     existingFixedCompensations: o?.fixedCompensations || [],
     primaryJobUuid: b?.uuid,
     fixedCompensationTypes: D,
-    excludedTypes: je
-  }), _ = !me(m), le = $(
+    excludedTypes: Ge
+  }), _ = !ue(m), de = V(
     () => O && _ ? o?.reimbursements ?? [] : [],
     [O, _, o?.reimbursements]
-  ), de = $(
+  ), ce = V(
     () => o?.fixedCompensations?.find(
       (e) => e.name?.toLowerCase() === S.toLowerCase()
     ),
     [o?.fixedCompensations]
-  ), z = O && !_ && !!b?.uuid, W = (e, i) => o?.hourlyCompensations?.find(
+  ), W = O && !_ && !!b?.uuid, q = (e, i) => o?.hourlyCompensations?.find(
     (d) => d.jobUuid === e && d.name?.toLowerCase() === i.toLowerCase()
-  ), ce = (e) => {
+  ), pe = (e) => {
     switch (e) {
-      case we:
+      case $e:
         return n("compensationNames.regularHours");
-      case He:
+      case we:
         return n("compensationNames.overtime");
-      case Ge:
+      case He:
         return n("compensationNames.doubleOvertime");
       default:
         return e;
     }
-  }, q = (e) => {
+  }, Y = (e) => {
     switch (e) {
-      case We:
+      case qe:
         return n("fixedCompensationNames.bonus");
-      case ze:
+      case We:
         return n("fixedCompensationNames.paycheckTips");
-      case Be:
+      case ze:
         return n("fixedCompensationNames.correctionPayment");
-      case Ve:
+      case Be:
         return n("fixedCompensationNames.commission");
-      case $e:
+      case Ve:
         return n("fixedCompensationNames.cashTips");
       case S:
         return n("fixedCompensationNames.reimbursement");
       default:
         return e;
     }
-  }, pe = () => {
+  }, fe = () => {
     const e = o?.paymentMethod;
     return e ? !h && e === M.DirectDeposit ? M.Check : e : h ? M.DirectDeposit : M.Check;
-  }, fe = {
+  }, he = {
     hourlyCompensations: (() => {
       const e = {};
       return v.forEach((i) => {
-        se.forEach((d) => {
-          const R = W(i.uuid, d);
+        oe.forEach((d) => {
+          const R = q(i.uuid, d);
           R && (e[i.uuid] || (e[i.uuid] = {}), e[i.uuid][R.name] = R.hours ? parseFloat(R.hours).toString() : "");
         });
       }), e;
@@ -192,46 +192,46 @@ const Ze = s.object({
     })(),
     fixedCompensations: (() => {
       const e = {};
-      return j.forEach((i) => {
+      return G.forEach((i) => {
         e[i.name] = i.amount ?? "";
-      }), z && (e[S] = de?.amount ?? "0.00"), e;
+      }), W && (e[S] = ce?.amount ?? "0.00"), e;
     })(),
-    reimbursements: le.map((e) => ({
+    reimbursements: de.map((e) => ({
       uuid: e.uuid ?? null,
       description: e.description ?? "",
       amount: e.amount,
       recurring: e.recurring ?? !1
     })),
-    paymentMethod: pe()
-  }, L = ee({
-    resolver: te(nn),
-    defaultValues: fe
+    paymentMethod: fe()
+  }, L = ne({
+    resolver: ie(tn),
+    defaultValues: he
   }), {
-    fields: Y,
-    append: he,
-    remove: be,
-    update: ge
-  } = Ae({
+    fields: K,
+    append: be,
+    remove: ge,
+    update: Ce
+  } = Me({
     control: L.control,
     name: "reimbursements"
-  }), Ce = (e) => {
-    const i = Y[e];
-    i && (i.uuid ? ge(e, { ...i, amount: "0" }) : be(e));
-  }, G = Y.map((e, i) => ({ ...e, originalIndex: i })).filter((e) => parseFloat(e.amount || "0") !== 0), [K, H] = ve(!1), w = ee({
-    resolver: te(Je),
+  }), ye = (e) => {
+    const i = K[e];
+    i && (i.uuid ? Ce(e, { ...i, amount: "0" }) : ge(e));
+  }, H = K.map((e, i) => ({ ...e, originalIndex: i })).filter((e) => parseFloat(e.amount || "0") !== 0), [X, w] = Re(!1), $ = ne({
+    resolver: ie(en),
     defaultValues: { description: "", amount: "" }
-  }), X = () => {
-    H(!1), w.reset();
-  }, ye = (e) => {
+  }), Z = () => {
+    w(!1), $.reset();
+  }, Ne = (e) => {
     const i = parseFloat(e.amount);
-    he({
+    be({
       uuid: null,
       description: e.description.trim(),
       amount: i.toFixed(2),
       recurring: !1
-    }), X();
-  }, Ne = Xe({
-    data: G,
+    }), Z();
+  }, Ee = Ze({
+    data: H,
     columns: [
       {
         key: "description",
@@ -242,7 +242,7 @@ const Ze = s.object({
         key: "amount",
         title: n("reimbursementAmountColumn"),
         justify: "end",
-        render: (e) => ie(parseFloat(e.amount || "0"))
+        render: (e) => re(parseFloat(e.amount || "0"))
       },
       {
         key: "recurring",
@@ -254,35 +254,35 @@ const Ze = s.object({
       if (e.recurring) return null;
       const i = e.description.trim() || n("reimbursementUnnamedFallback");
       return /* @__PURE__ */ t(
-        U,
+        j,
         {
           variant: "tertiary",
           onClick: () => {
-            Ce(e.originalIndex);
+            ye(e.originalIndex);
           },
           "aria-label": n("removeReimbursementLabel", { description: i }),
-          children: /* @__PURE__ */ t(Ye, { "aria-hidden": !0 })
+          children: /* @__PURE__ */ t(Ke, { "aria-hidden": !0 })
         }
       );
     },
-    emptyState: () => /* @__PURE__ */ t(Fe, { title: n("reimbursementEmptyTitle"), children: /* @__PURE__ */ t(
+    emptyState: () => /* @__PURE__ */ t(De, { title: n("reimbursementEmptyTitle"), children: /* @__PURE__ */ t(
       u,
       {
         variant: "secondary",
         onClick: () => {
-          H(!0);
+          w(!0);
         },
-        icon: /* @__PURE__ */ t(oe, { "aria-hidden": !0 }),
+        icon: /* @__PURE__ */ t(ae, { "aria-hidden": !0 }),
         children: n("addReimbursementCta")
       }
     ) })
-  }), N = Me({
+  }), N = Oe({
     control: L.control
-  }), Ee = $(() => {
+  }), Pe = V(() => {
     try {
       const e = {};
-      N.hourlyCompensations && Object.entries(N.hourlyCompensations).forEach(([E, J]) => {
-        J && (e[E] = J);
+      N.hourlyCompensations && Object.entries(N.hourlyCompensations).forEach(([E, ee]) => {
+        ee && (e[E] = ee);
       });
       const i = (N.reimbursements ?? []).map((E) => ({
         uuid: E.uuid ?? null,
@@ -296,14 +296,14 @@ const Ze = s.object({
         fixedCompensations: N.fixedCompensations || {},
         reimbursements: i,
         paymentMethod: N.paymentMethod
-      }, R = ae(
+      }, R = me(
         d,
         o,
         (o?.paidTimeOff || []).filter((E) => E.name),
         b?.uuid,
         m
       );
-      return re(
+      return se(
         R,
         p,
         T,
@@ -311,7 +311,7 @@ const Ze = s.object({
         m
       );
     } catch {
-      return o ? re(
+      return o ? se(
         o,
         p,
         T,
@@ -327,11 +327,11 @@ const Ze = s.object({
     T,
     r,
     m
-  ]), Pe = ke({
+  ]), Te = Ue({
     first_name: p.firstName,
     last_name: p.lastName
-  }), Te = (e) => {
-    const i = ae(
+  }), Ae = (e) => {
+    const i = me(
       e,
       o,
       A,
@@ -339,7 +339,7 @@ const Ze = s.object({
       m
     );
     C(i);
-  }, Q = ie(Ee || 0), Z = /* @__PURE__ */ a(
+  }, Q = re(Pe || 0), J = /* @__PURE__ */ a(
     P,
     {
       flexDirection: g ? "row" : "column",
@@ -347,11 +347,11 @@ const Ze = s.object({
       alignItems: g ? "flex-start" : "stretch",
       gap: 12,
       children: [
-        /* @__PURE__ */ t(u, { variant: "secondary", onClick: k, title: n("cancelCta"), children: n("cancelCta") }),
+        /* @__PURE__ */ t(u, { variant: "secondary", onClick: U, title: n("cancelCta"), children: n("cancelCta") }),
         /* @__PURE__ */ t(
           u,
           {
-            onClick: L.handleSubmit(Te),
+            onClick: L.handleSubmit(Ae),
             title: n("saveCta"),
             isLoading: y,
             children: n("saveCta")
@@ -360,31 +360,31 @@ const Ze = s.object({
       ]
     }
   );
-  return /* @__PURE__ */ a("div", { ref: B, className: Re(c.container, l), children: [
+  return /* @__PURE__ */ a("div", { ref: z, className: xe(c.container, l), children: [
     /* @__PURE__ */ t(
       "div",
       {
         className: `${c.headerSection} ${g ? "" : c.headerSectionSticky}`,
         children: /* @__PURE__ */ a(P, { justifyContent: "space-between", children: [
           /* @__PURE__ */ a(P, { 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: Te }) }),
             g ? /* @__PURE__ */ a(P, { 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 && Z
+          g && J
         ] })
       }
     ),
-    /* @__PURE__ */ a(ne, { ...L, children: [
-      /* @__PURE__ */ a(Le, { children: [
+    /* @__PURE__ */ a(te, { ...L, children: [
+      /* @__PURE__ */ a(ke, { children: [
         v.length > 0 && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", children: n("regularHoursTitle") }),
           v.map((e) => /* @__PURE__ */ a(P, { flexDirection: "column", gap: 8, children: [
             v.length > 1 && /* @__PURE__ */ t(f, { as: "h4", children: e.title }),
-            /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: se.map((i) => {
-              const d = W(
+            /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: oe.map((i) => {
+              const d = q(
                 e.uuid,
                 i
               );
@@ -394,8 +394,9 @@ const Ze = s.object({
                   {
                     type: "number",
                     min: 0,
+                    transform: k,
                     adornmentEnd: n("hoursUnit"),
-                    label: ce(i),
+                    label: pe(i),
                     name: `hourlyCompensations.${e.uuid}.${d.name}`
                   },
                   i
@@ -406,7 +407,7 @@ const Ze = s.object({
         A.length > 0 && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: m === F.Dismissal ? n("timeOffTitleDismissal") : n("timeOffTitle") }),
           /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: A.map((e) => /* @__PURE__ */ t(
-            Se,
+            Ie,
             {
               timeOff: e,
               employee: p
@@ -417,10 +418,10 @@ const Ze = s.object({
         m === F.Dismissal && A.length > 0 && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ a(P, { 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: A.map((e) => /* @__PURE__ */ t(
-            Ie,
+            Fe,
             {
               timeOff: e,
               employee: p
@@ -428,20 +429,21 @@ const Ze = s.object({
             `payout-${e.name}`
           )) })
         ] }),
-        j.length > 0 && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
+        G.length > 0 && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("additionalEarningsTitle") }),
           /* @__PURE__ */ t(
             x,
             {
               gridTemplateColumns: { base: "1fr", small: [320, 320], large: [320, 320, 320] },
               gap: 20,
-              children: j.map((e) => /* @__PURE__ */ t(
+              children: G.map((e) => /* @__PURE__ */ t(
                 I,
                 {
                   type: "number",
                   min: 0,
+                  transform: k,
                   adornmentStart: "$",
-                  label: q(e.name),
+                  label: Y(e.name),
                   name: `fixedCompensations.${e.name}`,
                   errorMessage: n("validations.negativeAmount")
                 },
@@ -450,15 +452,16 @@ const Ze = s.object({
             }
           )
         ] }),
-        z && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
+        W && /* @__PURE__ */ a("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(
             I,
             {
               type: "number",
               min: 0,
+              transform: k,
               adornmentStart: "$",
-              label: q(S),
+              label: Y(S),
               name: `fixedCompensations.${S}`,
               errorMessage: n("validations.negativeAmount")
             }
@@ -466,8 +469,8 @@ const Ze = s.object({
         ] }),
         O && _ && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("reimbursementTitle") }),
-          !(G.length === 0 && K) && /* @__PURE__ */ t(Qe, { label: n("reimbursementsTableLabel"), ...Ne }),
-          K ? /* @__PURE__ */ t(ne, { ...w, children: /* @__PURE__ */ a(P, { flexDirection: "column", gap: 12, children: [
+          !(H.length === 0 && X) && /* @__PURE__ */ t(Qe, { label: n("reimbursementsTableLabel"), ...Ee }),
+          X ? /* @__PURE__ */ t(te, { ...$, children: /* @__PURE__ */ a(P, { flexDirection: "column", gap: 12, children: [
             /* @__PURE__ */ a(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: [
               /* @__PURE__ */ t(
                 I,
@@ -483,6 +486,7 @@ const Ze = s.object({
                   name: "amount",
                   type: "number",
                   min: 0,
+                  transform: k,
                   adornmentStart: "$",
                   isRequired: !0,
                   label: n("reimbursementAmountLabel"),
@@ -491,18 +495,18 @@ const Ze = s.object({
               )
             ] }),
             /* @__PURE__ */ a(P, { gap: 12, children: [
-              /* @__PURE__ */ t(u, { onClick: w.handleSubmit(ye), children: n("saveReimbursementCta") }),
-              /* @__PURE__ */ t(u, { variant: "secondary", onClick: X, children: n("cancelReimbursementCta") })
+              /* @__PURE__ */ t(u, { onClick: $.handleSubmit(Ne), children: n("saveReimbursementCta") }),
+              /* @__PURE__ */ t(u, { variant: "secondary", onClick: Z, children: n("cancelReimbursementCta") })
             ] })
-          ] }) }) : G.length > 0 && /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
+          ] }) }) : H.length > 0 && /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
             u,
             {
               variant: "secondary",
               onClick: () => {
-                H(!0);
+                w(!0);
               },
               title: n("addReimbursementLink"),
-              icon: /* @__PURE__ */ t(oe, { "aria-hidden": !0 }),
+              icon: /* @__PURE__ */ t(ae, { "aria-hidden": !0 }),
               children: n("addReimbursementLink")
             }
           ) })
@@ -510,7 +514,7 @@ const Ze = s.object({
         h && /* @__PURE__ */ a("div", { className: c.fieldGroup, children: [
           /* @__PURE__ */ t(f, { as: "h3", styledAs: "h4", children: n("paymentMethodTitle") }),
           /* @__PURE__ */ t(
-            Ke,
+            Xe,
             {
               name: "paymentMethod",
               isRequired: !0,
@@ -530,11 +534,11 @@ const Ze = s.object({
           )
         ] })
       ] }),
-      !g && Z
+      !g && J
     ] })
   ] });
 };
 export {
-  In as PayrollEditEmployeePresentation
+  Fn as PayrollEditEmployeePresentation
 };
 //# sourceMappingURL=PayrollEditEmployeePresentation.js.map