@gusto/embedded-react-sdk 0.53.0 → 0.54.1-rc.1

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

@@ -1,14 +1,14 @@
-import { jsx as t, jsxs as a } from "react/jsx-runtime";
-import { useForm as Re, useFieldArray as Oe, useWatch as Me, FormProvider as xe } from "react-hook-form";
-import { useRef as ve, useMemo as w, useState as G } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { useForm as Re, useFieldArray as Oe, useWatch as Me, FormProvider as Ae } from "react-hook-form";
+import { useRef as xe, useMemo as w, useState as G } from "react";
 import { PayrollEmployeeCompensationsTypePaymentMethod as _ } from "@gusto/embedded-api/models/components/payrollemployeecompensationstype";
-import { useTranslation as Ae } from "react-i18next";
+import { useTranslation as ve } from "react-i18next";
 import { z as s } from "zod";
 import { zodResolver as Se } from "@hookform/resolvers/zod";
 import d from "./PayrollEditEmployeePresentation.module.scss.js";
 import { TimeOffField as De, PayoutTimeOffField as Ie } from "./TimeOffField.js";
-import { Flex as y } from "../../Common/Flex/Flex.js";
-import { Grid as x } from "../../Common/Grid/Grid.js";
+import { Flex as N } from "../../Common/Flex/Flex.js";
+import { Grid as A } from "../../Common/Grid/Grid.js";
 import { EmptyData as Fe } from "../../Common/EmptyData/EmptyData.js";
 import { useComponentContext as _e } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as Le } from "../../../i18n/I18n.js";
@@ -16,7 +16,7 @@ import { Form as Ue } from "../../Common/Form/Form.js";
 import { formatNumberAsCurrency as re, firstLastName as ke } from "../../../helpers/formattedStrings.js";
 import { getAdditionalEarningsCompensations as je, calculateGrossPay as se } from "../helpers.js";
 import { PayrollCategory as S, isOffCyclePayroll as ue } from "../payrollTypes.js";
-import { COMPENSATION_NAME_REIMBURSEMENT as v, HOURS_COMPENSATION_NAMES as ae, EXCLUDED_ADDITIONAL_EARNINGS as we, COMPENSATION_NAME_DOUBLE_OVERTIME as Ge, COMPENSATION_NAME_OVERTIME as He, COMPENSATION_NAME_REGULAR_HOURS as $e, COMPENSATION_NAME_CASH_TIPS as Be, COMPENSATION_NAME_COMMISSION as Ve, COMPENSATION_NAME_CORRECTION_PAYMENT as qe, COMPENSATION_NAME_PAYCHECK_TIPS as ze, COMPENSATION_NAME_BONUS as We } from "../../../shared/constants.js";
+import { COMPENSATION_NAME_REIMBURSEMENT as x, HOURS_COMPENSATION_NAMES as ae, EXCLUDED_ADDITIONAL_EARNINGS as we, COMPENSATION_NAME_DOUBLE_OVERTIME as Ge, COMPENSATION_NAME_OVERTIME as He, COMPENSATION_NAME_REGULAR_HOURS as $e, COMPENSATION_NAME_CASH_TIPS as Be, COMPENSATION_NAME_COMMISSION as Ve, COMPENSATION_NAME_CORRECTION_PAYMENT as qe, COMPENSATION_NAME_PAYCHECK_TIPS as ze, COMPENSATION_NAME_BONUS as We } from "../../../shared/constants.js";
 import Ye from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
 import oe from "../../../assets/icons/plus-circle.svg.js";
 import Ke from "../../../assets/icons/trashcan.svg.js";
@@ -36,12 +36,12 @@ const Je = s.object({
   fixedCompensations: s.record(s.string(), s.string().optional()),
   reimbursements: s.array(Je),
   paymentMethod: s.enum(_).optional()
-}), me = (f, A, c, o, D = S.Regular) => {
+}), me = (f, v, c, o, D = S.Regular) => {
   const C = {
-    ...A,
+    ...v,
     paymentMethod: f.paymentMethod
   };
-  C.hourlyCompensations = A?.hourlyCompensations?.map(
+  C.hourlyCompensations = v?.hourlyCompensations?.map(
     (r) => {
       const m = r.jobUuid && r.name ? f.hourlyCompensations[r.jobUuid]?.[r.name] : void 0;
       return m ? {
@@ -66,9 +66,9 @@ const Je = s.object({
   });
   const P = !ue(D), E = [];
   return Object.entries(f.fixedCompensations).forEach(([r, m]) => {
-    if (r.toLowerCase() === v.toLowerCase() && P)
+    if (r.toLowerCase() === x.toLowerCase() && P)
       return;
-    const l = A?.fixedCompensations?.find(
+    const l = v?.fixedCompensations?.find(
       (R) => R.name?.toLowerCase() === r.toLowerCase()
     );
     m !== void 0 && m !== "" && (l ? E.push({
@@ -86,9 +86,9 @@ const Je = s.object({
     uuid: r.uuid ?? null,
     recurring: r.recurring
   })) : C.reimbursements = [], C;
-}, An = ({
+}, vn = ({
   onSave: f,
-  onCancel: A,
+  onCancel: v,
   employee: c,
   employeeCompensation: o,
   isPending: D = !1,
@@ -99,16 +99,16 @@ const Je = s.object({
   withReimbursements: m = !0,
   hasDirectDepositSetup: L = !0
 }) => {
-  const { Button: l, ButtonIcon: R, Heading: p, Text: $, TextInput: B } = _e(), { t: n } = Ae("Payroll.PayrollEditEmployee");
+  const { Button: l, ButtonIcon: R, Heading: p, Text: $, TextInput: B } = _e(), { t: n } = ve("Payroll.PayrollEditEmployee");
   Le("Payroll.PayrollEditEmployee");
   const h = c.jobs?.find((e) => e.primary), le = o?.hourlyCompensations?.some(
     (e) => e.jobUuid === h?.uuid
-  ), O = h && le ? [h] : [], V = ve(null), b = Ye({
+  ), O = h && le ? [h] : [], V = xe(null), b = Ye({
     ref: V
   }).includes("small");
   o?.hourlyCompensations?.forEach((e) => {
-    const i = c.jobs?.find((u) => u.uuid === e.jobUuid);
-    i && !O.find((u) => u.uuid === i.uuid) && O.push(i);
+    const t = c.jobs?.find((u) => u.uuid === e.jobUuid);
+    t && !O.find((u) => u.uuid === t.uuid) && O.push(t);
   });
   const T = (o?.paidTimeOff || []).filter((e) => e.name), U = je({
     flsaStatus: h?.compensations?.[0]?.flsaStatus,
@@ -121,11 +121,11 @@ const Je = s.object({
     [m, I, o?.reimbursements]
   ), ce = w(
     () => o?.fixedCompensations?.find(
-      (e) => e.name?.toLowerCase() === v.toLowerCase()
+      (e) => e.name?.toLowerCase() === x.toLowerCase()
     ),
     [o?.fixedCompensations]
-  ), q = m && !I && !!h?.uuid, z = (e, i) => o?.hourlyCompensations?.find(
-    (u) => u.jobUuid === e && u.name?.toLowerCase() === i.toLowerCase()
+  ), q = m && !I && !!h?.uuid, z = (e, t) => o?.hourlyCompensations?.find(
+    (u) => u.jobUuid === e && u.name?.toLowerCase() === t.toLowerCase()
   ), pe = (e) => {
     switch (e) {
       case $e:
@@ -149,7 +149,7 @@ const Je = s.object({
         return n("fixedCompensationNames.commission");
       case Be:
         return n("fixedCompensationNames.cashTips");
-      case v:
+      case x:
         return n("fixedCompensationNames.reimbursement");
       default:
         return e;
@@ -157,30 +157,30 @@ const Je = s.object({
   }, fe = {
     hourlyCompensations: (() => {
       const e = {};
-      return O.forEach((i) => {
+      return O.forEach((t) => {
         ae.forEach((u) => {
-          const M = z(i.uuid, u);
-          M && (e[i.uuid] || (e[i.uuid] = {}), e[i.uuid][M.name] = M.hours ? parseFloat(M.hours).toString() : "");
+          const M = z(t.uuid, u);
+          M && (e[t.uuid] || (e[t.uuid] = {}), e[t.uuid][M.name] = M.hours ? parseFloat(M.hours).toString() : "");
         });
       }), e;
     })(),
     timeOffCompensations: (() => {
       const e = {};
-      return T.forEach((i) => {
-        e[i.name] = i.hours ? parseFloat(i.hours).toString() : "";
+      return T.forEach((t) => {
+        e[t.name] = t.hours ? parseFloat(t.hours).toString() : "";
       }), e;
     })(),
     finalPayoutCompensations: (() => {
       const e = {};
-      return T.forEach((i) => {
-        e[i.name] = i.finalPayoutUnusedHoursInput ?? "0";
+      return T.forEach((t) => {
+        e[t.name] = t.finalPayoutUnusedHoursInput ?? "0";
       }), e;
     })(),
     fixedCompensations: (() => {
       const e = {};
-      return U.forEach((i) => {
-        e[i.name] = i.amount ?? "";
-      }), q && (e[v] = ce?.amount ?? "0.00"), e;
+      return U.forEach((t) => {
+        e[t.name] = t.amount ?? "";
+      }), q && (e[x] = ce?.amount ?? "0.00"), e;
     })(),
     reimbursements: de.map((e) => ({
       uuid: e.uuid ?? null,
@@ -201,19 +201,19 @@ const Je = s.object({
     control: F.control,
     name: "reimbursements"
   }), ge = (e) => {
-    const i = Y[e];
-    i && (i.uuid ? Ce(e, { ...i, amount: "0" }) : be(e));
-  }, k = Y.map((e, i) => ({ ...e, originalIndex: i })).filter((e) => parseFloat(e.amount || "0") !== 0), [K, j] = G(!1), [X, Q] = G(""), [Z, J] = G(""), ee = () => {
+    const t = Y[e];
+    t && (t.uuid ? Ce(e, { ...t, amount: "0" }) : be(e));
+  }, k = Y.map((e, t) => ({ ...e, originalIndex: t })).filter((e) => parseFloat(e.amount || "0") !== 0), [K, j] = G(!1), [X, Q] = G(""), [Z, J] = G(""), ee = () => {
     j(!1), Q(""), J("");
-  }, Ne = () => {
-    const e = Z.trim(), i = parseFloat(e || "0");
-    Number.isNaN(i) || i <= 0 || (he({
+  }, ye = () => {
+    const e = Z.trim(), t = parseFloat(e || "0");
+    Number.isNaN(t) || t <= 0 || (he({
       uuid: null,
       description: X.trim(),
-      amount: i.toFixed(2),
+      amount: t.toFixed(2),
       recurring: !1
     }), ee());
-  }, ye = Qe({
+  }, Ne = Qe({
     data: k,
     columns: [
       {
@@ -234,27 +234,27 @@ const Je = s.object({
     ],
     itemMenu: (e) => {
       if (e.recurring) return null;
-      const i = e.description.trim() || n("reimbursementUnnamedFallback");
-      return /* @__PURE__ */ t(
+      const t = e.description.trim() || n("reimbursementUnnamedFallback");
+      return /* @__PURE__ */ i(
         R,
         {
           variant: "tertiary",
           onClick: () => {
             ge(e.originalIndex);
           },
-          "aria-label": n("removeReimbursementLabel", { description: i }),
-          children: /* @__PURE__ */ t(Ke, { "aria-hidden": !0 })
+          "aria-label": n("removeReimbursementLabel", { description: t }),
+          children: /* @__PURE__ */ i(Ke, { "aria-hidden": !0 })
         }
       );
     },
-    emptyState: () => /* @__PURE__ */ t(Fe, { title: n("reimbursementEmptyTitle"), children: /* @__PURE__ */ t(
+    emptyState: () => /* @__PURE__ */ i(Fe, { title: n("reimbursementEmptyTitle"), children: /* @__PURE__ */ i(
       l,
       {
         variant: "secondary",
         onClick: () => {
           j(!0);
         },
-        icon: /* @__PURE__ */ t(oe, { "aria-hidden": !0 }),
+        icon: /* @__PURE__ */ i(oe, { "aria-hidden": !0 }),
         children: n("addReimbursementCta")
       }
     ) })
@@ -263,25 +263,25 @@ const Je = s.object({
   }), Ee = w(() => {
     try {
       const e = {};
-      g.hourlyCompensations && Object.entries(g.hourlyCompensations).forEach(([N, te]) => {
-        te && (e[N] = te);
+      g.hourlyCompensations && Object.entries(g.hourlyCompensations).forEach(([y, ie]) => {
+        ie && (e[y] = ie);
       });
-      const i = (g.reimbursements ?? []).map((N) => ({
-        uuid: N.uuid ?? null,
-        description: N.description ?? "",
-        amount: N.amount ?? "0",
-        recurring: N.recurring
+      const t = (g.reimbursements ?? []).map((y) => ({
+        uuid: y.uuid ?? null,
+        description: y.description ?? "",
+        amount: y.amount ?? "0",
+        recurring: y.recurring
       })), u = {
         hourlyCompensations: e,
         timeOffCompensations: g.timeOffCompensations || {},
         finalPayoutCompensations: g.finalPayoutCompensations || {},
         fixedCompensations: g.fixedCompensations || {},
-        reimbursements: i,
+        reimbursements: t,
         paymentMethod: g.paymentMethod
       }, M = me(
         u,
         o,
-        (o?.paidTimeOff || []).filter((N) => N.name),
+        (o?.paidTimeOff || []).filter((y) => y.name),
         h?.uuid,
         r
       );
@@ -313,24 +313,24 @@ const Je = s.object({
     first_name: c.firstName,
     last_name: c.lastName
   }), Pe = (e) => {
-    const i = me(
+    const t = me(
       e,
       o,
       T,
       h?.uuid,
       r
     );
-    f(i);
-  }, ne = re(Ee || 0), ie = /* @__PURE__ */ a(
-    y,
+    f(t);
+  }, ne = re(Ee || 0), te = /* @__PURE__ */ a(
+    N,
     {
       flexDirection: b ? "row" : "column",
       justifyContent: b ? "flex-end" : "normal",
       alignItems: b ? "flex-start" : "stretch",
       gap: 12,
       children: [
-        /* @__PURE__ */ t(l, { variant: "secondary", onClick: A, title: n("cancelCta"), children: n("cancelCta") }),
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ i(l, { variant: "secondary", onClick: v, title: n("cancelCta"), children: n("cancelCta") }),
+        /* @__PURE__ */ i(
           l,
           {
             onClick: F.handleSubmit(Pe),
@@ -343,52 +343,52 @@ const Je = s.object({
     }
   );
   return /* @__PURE__ */ a("div", { ref: V, className: d.container, children: [
-    /* @__PURE__ */ t(
+    /* @__PURE__ */ i(
       "div",
       {
         className: `${d.headerSection} ${b ? "" : d.headerSectionSticky}`,
-        children: /* @__PURE__ */ a(y, { justifyContent: "space-between", children: [
-          /* @__PURE__ */ a(y, { flexDirection: "column", gap: b ? 8 : 2, children: [
-            /* @__PURE__ */ t(p, { as: "h1", styledAs: b ? "h2" : "h4", children: n("pageTitle", { employeeName: Te }) }),
-            b ? /* @__PURE__ */ a(y, { flexDirection: "column", gap: 6, children: [
-              /* @__PURE__ */ t(p, { as: "h2", styledAs: "h3", children: ne }),
-              /* @__PURE__ */ t($, { className: d.grossPayLabel, children: n("grossPayLabel") })
-            ] }) : /* @__PURE__ */ t(p, { as: "h2", styledAs: "h6", className: d.grossPayLabel, children: n("grossPayLabelMobile", { grossPay: ne }) })
+        children: /* @__PURE__ */ a(N, { justifyContent: "space-between", children: [
+          /* @__PURE__ */ a(N, { flexDirection: "column", gap: b ? 8 : 2, children: [
+            /* @__PURE__ */ i(p, { as: "h1", styledAs: b ? "h2" : "h4", children: n("pageTitle", { employeeName: Te }) }),
+            b ? /* @__PURE__ */ a(N, { flexDirection: "column", gap: 6, children: [
+              /* @__PURE__ */ i(p, { as: "h2", styledAs: "h3", children: ne }),
+              /* @__PURE__ */ i($, { className: d.grossPayLabel, children: n("grossPayLabel") })
+            ] }) : /* @__PURE__ */ i(p, { as: "h2", styledAs: "h6", className: d.grossPayLabel, children: n("grossPayLabelMobile", { grossPay: ne }) })
           ] }),
-          b && ie
+          b && te
         ] })
       }
     ),
-    /* @__PURE__ */ a(xe, { ...F, children: [
+    /* @__PURE__ */ a(Ae, { ...F, children: [
       /* @__PURE__ */ a(Ue, { children: [
         O.length > 0 && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ t(p, { as: "h3", children: n("regularHoursTitle") }),
-          O.map((e) => /* @__PURE__ */ a(y, { flexDirection: "column", gap: 8, children: [
-            O.length > 1 && /* @__PURE__ */ t(p, { as: "h4", children: e.title }),
-            /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: ae.map((i) => {
+          /* @__PURE__ */ i(p, { as: "h3", children: n("regularHoursTitle") }),
+          O.map((e) => /* @__PURE__ */ a(N, { flexDirection: "column", gap: 8, children: [
+            O.length > 1 && /* @__PURE__ */ i(p, { as: "h4", children: e.title }),
+            /* @__PURE__ */ i(A, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: ae.map((t) => {
               const u = z(
                 e.uuid,
-                i
+                t
               );
               if (u)
-                return /* @__PURE__ */ t(
+                return /* @__PURE__ */ i(
                   H,
                   {
                     type: "number",
                     min: 0,
                     adornmentEnd: n("hoursUnit"),
                     isRequired: !0,
-                    label: pe(i),
+                    label: pe(t),
                     name: `hourlyCompensations.${e.uuid}.${u.name}`
                   },
-                  i
+                  t
                 );
             }) })
           ] }, e.uuid))
         ] }),
         T.length > 0 && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ t(p, { as: "h4", children: r === S.Dismissal ? n("timeOffTitleDismissal") : n("timeOffTitle") }),
-          /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ t(
+          /* @__PURE__ */ i(p, { as: "h3", styledAs: "h4", children: r === S.Dismissal ? n("timeOffTitleDismissal") : n("timeOffTitle") }),
+          /* @__PURE__ */ i(A, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ i(
             De,
             {
               timeOff: e,
@@ -398,11 +398,11 @@ const Je = s.object({
           )) })
         ] }),
         r === S.Dismissal && T.length > 0 && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ a(y, { flexDirection: "column", gap: 4, children: [
-            /* @__PURE__ */ t(p, { as: "h4", children: n("finalPayoutTitle") }),
-            /* @__PURE__ */ t($, { variant: "supporting", children: n("finalPayoutDescription") })
+          /* @__PURE__ */ a(N, { flexDirection: "column", gap: 4, children: [
+            /* @__PURE__ */ i(p, { as: "h3", styledAs: "h4", children: n("finalPayoutTitle") }),
+            /* @__PURE__ */ i($, { variant: "supporting", children: n("finalPayoutDescription") })
           ] }),
-          /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ t(
+          /* @__PURE__ */ i(A, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: T.map((e) => /* @__PURE__ */ i(
             Ie,
             {
               timeOff: e,
@@ -412,13 +412,13 @@ const Je = s.object({
           )) })
         ] }),
         U.length > 0 && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ t(p, { as: "h4", children: n("additionalEarningsTitle") }),
-          /* @__PURE__ */ t(
-            x,
+          /* @__PURE__ */ i(p, { as: "h3", styledAs: "h4", children: n("additionalEarningsTitle") }),
+          /* @__PURE__ */ i(
+            A,
             {
               gridTemplateColumns: { base: "1fr", small: [320, 320], large: [320, 320, 320] },
               gap: 20,
-              children: U.map((e) => /* @__PURE__ */ t(
+              children: U.map((e) => /* @__PURE__ */ i(
                 H,
                 {
                   type: "number",
@@ -434,25 +434,25 @@ const Je = s.object({
           )
         ] }),
         q && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ t(p, { as: "h4", children: n("reimbursementTitle") }),
-          /* @__PURE__ */ t(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: /* @__PURE__ */ t(
+          /* @__PURE__ */ i(p, { as: "h3", styledAs: "h4", children: n("reimbursementTitle") }),
+          /* @__PURE__ */ i(A, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: /* @__PURE__ */ i(
             H,
             {
               type: "number",
               min: 0,
               adornmentStart: "$",
               isRequired: !0,
-              label: W(v),
-              name: `fixedCompensations.${v}`
+              label: W(x),
+              name: `fixedCompensations.${x}`
             }
           ) })
         ] }),
         m && I && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ t(p, { as: "h4", children: n("reimbursementTitle") }),
-          !(k.length === 0 && K) && /* @__PURE__ */ t(Ze, { label: n("reimbursementsTableLabel"), ...ye }),
-          K ? /* @__PURE__ */ a(y, { flexDirection: "column", gap: 12, children: [
-            /* @__PURE__ */ a(x, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: [
-              /* @__PURE__ */ t(
+          /* @__PURE__ */ i(p, { as: "h3", styledAs: "h4", children: n("reimbursementTitle") }),
+          !(k.length === 0 && K) && /* @__PURE__ */ i(Ze, { label: n("reimbursementsTableLabel"), ...Ne }),
+          K ? /* @__PURE__ */ a(N, { flexDirection: "column", gap: 12, children: [
+            /* @__PURE__ */ a(A, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: [
+              /* @__PURE__ */ i(
                 B,
                 {
                   name: "newReimbursementDescription",
@@ -462,7 +462,7 @@ const Je = s.object({
                   onChange: Q
                 }
               ),
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ i(
                 B,
                 {
                   name: "newReimbursementAmount",
@@ -476,11 +476,11 @@ const Je = s.object({
                 }
               )
             ] }),
-            /* @__PURE__ */ a(y, { gap: 12, children: [
-              /* @__PURE__ */ t(l, { onClick: Ne, children: n("saveReimbursementCta") }),
-              /* @__PURE__ */ t(l, { variant: "secondary", onClick: ee, children: n("cancelReimbursementCta") })
+            /* @__PURE__ */ a(N, { gap: 12, children: [
+              /* @__PURE__ */ i(l, { onClick: ye, children: n("saveReimbursementCta") }),
+              /* @__PURE__ */ i(l, { variant: "secondary", onClick: ee, children: n("cancelReimbursementCta") })
             ] })
-          ] }) : k.length > 0 && /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
+          ] }) : k.length > 0 && /* @__PURE__ */ i("div", { children: /* @__PURE__ */ i(
             l,
             {
               variant: "secondary",
@@ -488,14 +488,14 @@ const Je = s.object({
                 j(!0);
               },
               title: n("addReimbursementLink"),
-              icon: /* @__PURE__ */ t(oe, { "aria-hidden": !0 }),
+              icon: /* @__PURE__ */ i(oe, { "aria-hidden": !0 }),
               children: n("addReimbursementLink")
             }
           ) })
         ] }),
         L && /* @__PURE__ */ a("div", { className: d.fieldGroup, children: [
-          /* @__PURE__ */ t(p, { as: "h4", children: n("paymentMethodTitle") }),
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ i(p, { as: "h3", styledAs: "h4", children: n("paymentMethodTitle") }),
+          /* @__PURE__ */ i(
             Xe,
             {
               name: "paymentMethod",
@@ -516,11 +516,11 @@ const Je = s.object({
           )
         ] })
       ] }),
-      !b && ie
+      !b && te
     ] })
   ] });
 };
 export {
-  An as PayrollEditEmployeePresentation
+  vn as PayrollEditEmployeePresentation
 };
 //# sourceMappingURL=PayrollEditEmployeePresentation.js.map