@gusto/embedded-react-sdk 0.23.0 → 0.24.0

package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.js

@@ -1,57 +1,58 @@
-import { jsx as t, jsxs as d, Fragment as P } from "react/jsx-runtime";
-import { useTranslation as be, Trans as ye } from "react-i18next";
-import { useState as X, useRef as he } from "react";
+import { jsx as r, jsxs as d, Fragment as x } from "react/jsx-runtime";
+import { useTranslation as ue, Trans as be } from "react-i18next";
+import { useState as q, useRef as ye } from "react";
 import { calculateTotalPayroll as pe } from "../helpers.js";
-import fe from "./PayrollOverviewPresentation.module.scss.js";
-import { Flex as h, FlexItem as z } from "../../Common/Flex/Flex.js";
+import he from "./PayrollOverviewPresentation.module.scss.js";
+import { Flex as f, FlexItem as z } from "../../Common/Flex/Flex.js";
 import "classnames";
-import { PAYMENT_METHODS as Te, FlsaStatus as q, compensationTypeLabels as x, PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES as J } from "../../../shared/constants.js";
-import { useComponentContext as ge } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useContainerBreakpoints as De } from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
-import { useI18n as He } from "../../../i18n/I18n.js";
-import { useDateFormatter as Pe } from "../../../hooks/useDateFormatter.js";
-import xe from "../../../hooks/useNumberFormatter.js";
+import { PAYMENT_METHODS as fe, FlsaStatus as J, compensationTypeLabels as k, PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES as Q } from "../../../shared/constants.js";
+import { useComponentContext as Te } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useContainerBreakpoints as He } from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
+import { useI18n as De } from "../../../i18n/I18n.js";
+import { useDateFormatter as ge } from "../../../hooks/useDateFormatter.js";
+import Pe from "../../../hooks/useNumberFormatter.js";
 import { firstLastName as A } from "../../../helpers/formattedStrings.js";
-import ke from "../../../assets/icons/download-cloud.svg.js";
-import { useLoadingIndicator as Ce } from "../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
-import { FastAchSubmissionBlockerBanner as we } from "./SubmissionBlockers/FastAchSubmissionBlockerBanner.js";
+import xe from "../../../assets/icons/download-cloud.svg.js";
+import { PayrollLoading as ke } from "../../Common/PayrollLoading/PayrollLoading.js";
+import { FastAchSubmissionBlockerBanner as Ce } from "./SubmissionBlockers/FastAchSubmissionBlockerBanner.js";
 import { GenericBlocker as Ne } from "./SubmissionBlockers/GenericBlocker.js";
 import { DataView as m } from "../../Common/DataView/DataView.js";
-const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate, p.endDate) : { startDate: "", endDate: "" }, ze = ({
+const we = (p, C) => p?.startDate && p.endDate ? C.formatPayPeriod(p.startDate, p.endDate) : { startDate: "", endDate: "" }, Xe = ({
   onEdit: p,
-  onSubmit: k,
-  onCancel: Q,
-  onPayrollReceipt: Z,
-  onPaystubDownload: ee,
-  employeeDetails: te,
+  onSubmit: C,
+  onCancel: Z,
+  onPayrollReceipt: ee,
+  onPaystubDownload: te,
+  employeeDetails: re,
   payrollData: o,
   bankAccount: O,
-  taxes: C,
+  taxes: N,
   isSubmitting: T = !1,
   isProcessed: w,
   alerts: M = [],
-  submissionBlockers: f = [],
-  selectedUnblockOptions: N = {},
+  submissionBlockers: h = [],
+  selectedUnblockOptions: _ = {},
   onUnblockOptionChange: W,
-  wireInConfirmationRequest: re
+  wireInConfirmationRequest: ae,
+  withReimbursements: H = !0
 }) => {
-  const { Alert: I, Button: g, ButtonIcon: ae, Dialog: ne, Heading: _, Text: a, Tabs: le, LoadingSpinner: ie } = ge();
-  He("Payroll.PayrollOverview");
-  const s = Pe(), { t: r } = be("Payroll.PayrollOverview"), l = xe("currency"), [oe, se] = X("companyPays"), [Y, V] = X(!1), { LoadingIndicator: de } = Ce(), B = he(null), c = De({ ref: B }).includes("small"), D = pe(o), ce = o.payrollStatusMeta?.expectedDebitTime ?? o.payrollDeadline, R = (e) => e.taxes?.reduce(
+  const { Alert: Y, Button: D, ButtonIcon: ne, Dialog: le, Heading: V, Text: a, Tabs: ie } = Te();
+  De("Payroll.PayrollOverview");
+  const s = ge(), { t } = ue("Payroll.PayrollOverview"), l = Pe("currency"), [oe, se] = q("companyPays"), [B, U] = q(!1), I = ye(null), c = He({ ref: I }).includes("small"), g = pe(o), de = o.payrollStatusMeta?.expectedDebitTime ?? o.payrollDeadline, F = (e) => e.taxes?.reduce(
     (n, i) => i.employer ? n + i.amount : n,
     0
-  ) ?? 0, U = (e) => e.benefits?.reduce(
+  ) ?? 0, R = (e) => e.benefits?.reduce(
     (n, i) => i.companyContribution ? n + i.companyContribution : n,
     0
   ) ?? 0, L = (e) => e.fixedCompensations?.length ? Number(
     e.fixedCompensations.find(
-      (n) => n.name?.toLowerCase() === x.REIMBURSEMENT_NAME.toLowerCase()
+      (n) => n.name?.toLowerCase() === k.REIMBURSEMENT_NAME.toLowerCase()
     )?.amount || 0
-  ) : 0, me = (e) => e.grossPay + L(e) + R(e) + U(e), u = new Map(te.map((e) => [e.uuid, e])), E = f.find(
+  ) : 0, ce = (e) => e.grossPay + L(e) + F(e) + R(e), u = new Map(re.map((e) => [e.uuid, e])), E = h.find(
     (e) => e.blockerType === "fast_ach_threshold_exceeded" || e.blockerType === "needs_earned_access_for_fast_ach"
-  ), S = E ? N[E.blockerType || ""] : void 0, b = E?.unblockOptions?.find(
+  ), S = E ? _[E.blockerType || ""] : void 0, b = E?.unblockOptions?.find(
     (e) => e.unblockType === S
-  ), F = S === "wire_in", j = S === "move_to_four_day", H = (e) => e.hourlyCompensations?.reduce(
+  ), j = S === "wire_in", G = S === "move_to_four_day", P = (e) => e.hourlyCompensations?.reduce(
     (n, i) => {
       if (typeof i.name > "u")
         return n;
@@ -59,110 +60,114 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
       return n[y] = v + Number(i.hours || 0), n;
     },
     {}
-  ) || {}, G = (e) => e.paidTimeOff?.reduce((n, i) => n + Number(i.hours || 0), 0) ?? 0, $ = o.employeeCompensations?.reduce(
-    (e, n) => !n.excluded && n.paymentMethod === Te.check ? e + 1 : e,
+  ) || {}, $ = (e) => e.paidTimeOff?.reduce((n, i) => n + Number(i.hours || 0), 0) ?? 0, K = o.employeeCompensations?.reduce(
+    (e, n) => !n.excluded && n.paymentMethod === fe.check ? e + 1 : e,
     0
-  ) ?? 0, K = [
+  ) ?? 0, X = [
     {
       key: "employeeName",
-      title: r("tableHeaders.employees"),
-      render: (e) => /* @__PURE__ */ t(a, { children: A({
+      title: t("tableHeaders.employees"),
+      render: (e) => /* @__PURE__ */ r(a, { children: A({
         first_name: u.get(e.employeeUuid)?.firstName,
         last_name: u.get(e.employeeUuid)?.lastName
       }) })
     },
     {
       key: "grossPay",
-      title: r("tableHeaders.grossPay"),
-      render: (e) => /* @__PURE__ */ t(a, { children: l(e.grossPay) })
-    },
-    {
-      key: "reimbursements",
-      title: r("tableHeaders.reimbursements"),
-      render: (e) => /* @__PURE__ */ t(a, { children: l(L(e)) })
+      title: t("tableHeaders.grossPay"),
+      render: (e) => /* @__PURE__ */ r(a, { children: l(e.grossPay) })
     },
+    ...H ? [
+      {
+        key: "reimbursements",
+        title: t("tableHeaders.reimbursements"),
+        render: (e) => /* @__PURE__ */ r(a, { children: l(L(e)) })
+      }
+    ] : [],
     {
       key: "companyTaxes",
-      title: r("tableHeaders.companyTaxes"),
-      render: (e) => /* @__PURE__ */ t(a, { children: l(R(e)) })
+      title: t("tableHeaders.companyTaxes"),
+      render: (e) => /* @__PURE__ */ r(a, { children: l(F(e)) })
     },
     {
       key: "companyBenefits",
-      title: r("tableHeaders.companyBenefits"),
-      render: (e) => /* @__PURE__ */ t(a, { children: l(U(e)) })
+      title: t("tableHeaders.companyBenefits"),
+      render: (e) => /* @__PURE__ */ r(a, { children: l(R(e)) })
     },
     {
       key: "companyPays",
-      title: r("tableHeaders.companyPays"),
-      render: (e) => /* @__PURE__ */ t(a, { children: l(me(e)) })
+      title: t("tableHeaders.companyPays"),
+      render: (e) => /* @__PURE__ */ r(a, { children: l(ce(e)) })
     }
   ];
-  w && K.push({
+  w && X.push({
     key: "paystubs",
-    title: r("tableHeaders.paystub"),
-    render: (e) => /* @__PURE__ */ t(
-      ae,
+    title: t("tableHeaders.paystub"),
+    render: (e) => /* @__PURE__ */ r(
+      ne,
       {
-        "aria-label": r("downloadPaystubLabel"),
+        "aria-label": t("downloadPaystubLabel"),
         variant: "tertiary",
         onClick: () => {
-          e.employeeUuid && ee(e.employeeUuid);
+          e.employeeUuid && te(e.employeeUuid);
         },
-        children: /* @__PURE__ */ t(ke, {})
+        children: /* @__PURE__ */ r(xe, {})
       }
     )
   });
-  const ue = [
+  const me = [
     {
       id: "companyPays",
-      label: r("dataViews.companyPaysTab"),
-      content: /* @__PURE__ */ t(
+      label: t("dataViews.companyPaysTab"),
+      content: /* @__PURE__ */ r(
         m,
         {
-          label: r("dataViews.companyPaysTable"),
-          columns: K,
+          label: t("dataViews.companyPaysTable"),
+          columns: X,
           data: o.employeeCompensations,
           footer: () => ({
-            employeeName: /* @__PURE__ */ d(P, { children: [
-              /* @__PURE__ */ t(a, { children: r("tableHeaders.footerTotalsLabel") }),
-              /* @__PURE__ */ t(a, { children: r("tableHeaders.footerTotalsDescription") })
+            employeeName: /* @__PURE__ */ d(x, { children: [
+              /* @__PURE__ */ r(a, { children: t("tableHeaders.footerTotalsLabel") }),
+              /* @__PURE__ */ r(a, { children: t("tableHeaders.footerTotalsDescription") })
             ] }),
-            grossPay: /* @__PURE__ */ t(a, { children: l(Number(o.totals?.grossPay ?? 0)) }),
-            reimbursements: /* @__PURE__ */ t(a, { children: l(Number(o.totals?.reimbursements ?? 0)) }),
-            companyTaxes: /* @__PURE__ */ t(a, { children: l(Number(o.totals?.employerTaxes ?? 0)) }),
-            companyBenefits: /* @__PURE__ */ t(a, { children: l(Number(o.totals?.benefits ?? 0)) }),
-            companyPays: /* @__PURE__ */ t(a, { children: l(D) })
+            grossPay: /* @__PURE__ */ r(a, { children: l(Number(o.totals?.grossPay ?? 0)) }),
+            ...H ? {
+              reimbursements: /* @__PURE__ */ r(a, { children: l(Number(o.totals?.reimbursements ?? 0)) })
+            } : {},
+            companyTaxes: /* @__PURE__ */ r(a, { children: l(Number(o.totals?.employerTaxes ?? 0)) }),
+            companyBenefits: /* @__PURE__ */ r(a, { children: l(Number(o.totals?.benefits ?? 0)) }),
+            companyPays: /* @__PURE__ */ r(a, { children: l(g) })
           })
         }
       )
     },
     {
       id: "hoursWorked",
-      label: r("dataViews.hoursWorkedTab"),
-      content: /* @__PURE__ */ t(
+      label: t("dataViews.hoursWorkedTab"),
+      content: /* @__PURE__ */ r(
         m,
         {
-          label: r("dataViews.hoursWorkedTable"),
+          label: t("dataViews.hoursWorkedTable"),
           columns: [
             {
-              title: r("tableHeaders.employees"),
-              render: (e) => /* @__PURE__ */ t(a, { children: A({
+              title: t("tableHeaders.employees"),
+              render: (e) => /* @__PURE__ */ r(a, { children: A({
                 first_name: u.get(e.employeeUuid)?.firstName,
                 last_name: u.get(e.employeeUuid)?.lastName
               }) })
             },
             {
-              title: r("tableHeaders.compensationType"),
-              render: (e) => /* @__PURE__ */ t(a, { children: u.get(e.employeeUuid)?.jobs?.reduce((n, i) => {
+              title: t("tableHeaders.compensationType"),
+              render: (e) => /* @__PURE__ */ r(a, { children: u.get(e.employeeUuid)?.jobs?.reduce((n, i) => {
                 if (i.primary) {
                   const y = i.compensations?.find(
                     (v) => v.uuid === i.currentCompensationUuid
                   )?.flsaStatus;
                   switch (y) {
-                    case q.EXEMPT:
-                      return r("compensationTypeLabels.exempt");
-                    case q.NONEXEMPT:
-                      return r("compensationTypeLabels.nonexempt");
+                    case J.EXEMPT:
+                      return t("compensationTypeLabels.exempt");
+                    case J.NONEXEMPT:
+                      return t("compensationTypeLabels.nonexempt");
                     default:
                       return y ?? "";
                   }
@@ -171,27 +176,27 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
               }, "") })
             },
             {
-              title: r("tableHeaders.regular"),
-              render: (e) => /* @__PURE__ */ t(a, { children: H(e)[x.REGULAR_HOURS_NAME] || 0 })
+              title: t("tableHeaders.regular"),
+              render: (e) => /* @__PURE__ */ r(a, { children: P(e)[k.REGULAR_HOURS_NAME] || 0 })
             },
             {
-              title: r("tableHeaders.overtime"),
-              render: (e) => /* @__PURE__ */ t(a, { children: H(e)[x.OVERTIME_NAME] || 0 })
+              title: t("tableHeaders.overtime"),
+              render: (e) => /* @__PURE__ */ r(a, { children: P(e)[k.OVERTIME_NAME] || 0 })
             },
             {
-              title: r("tableHeaders.doubleOT"),
-              render: (e) => /* @__PURE__ */ t(a, { children: H(e)[x.DOUBLE_OVERTIME_NAME] || 0 })
+              title: t("tableHeaders.doubleOT"),
+              render: (e) => /* @__PURE__ */ r(a, { children: P(e)[k.DOUBLE_OVERTIME_NAME] || 0 })
             },
             {
-              title: r("tableHeaders.timeOff"),
-              render: (e) => /* @__PURE__ */ t(a, { children: G(e) })
+              title: t("tableHeaders.timeOff"),
+              render: (e) => /* @__PURE__ */ r(a, { children: $(e) })
             },
             {
-              title: r("tableHeaders.totalHours"),
-              render: (e) => /* @__PURE__ */ t(a, { children: Object.values(H(e)).reduce(
+              title: t("tableHeaders.totalHours"),
+              render: (e) => /* @__PURE__ */ r(a, { children: Object.values(P(e)).reduce(
                 (n, i) => n + i,
                 0
-              ) + G(e) })
+              ) + $(e) })
             }
           ],
           data: o.employeeCompensations
@@ -200,43 +205,45 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
     },
     {
       id: "employeeTakeHome",
-      label: r("dataViews.employeeTakeHomeTab"),
-      content: /* @__PURE__ */ t(
+      label: t("dataViews.employeeTakeHomeTab"),
+      content: /* @__PURE__ */ r(
         m,
         {
-          label: r("dataViews.employeeTakeHomeTable"),
+          label: t("dataViews.employeeTakeHomeTable"),
           columns: [
             {
-              title: r("tableHeaders.employees"),
-              render: (e) => /* @__PURE__ */ t(a, { children: A({
+              title: t("tableHeaders.employees"),
+              render: (e) => /* @__PURE__ */ r(a, { children: A({
                 first_name: u.get(e.employeeUuid)?.firstName,
                 last_name: u.get(e.employeeUuid)?.lastName
               }) })
             },
             {
-              title: r("tableHeaders.paymentType"),
-              render: (e) => /* @__PURE__ */ t(a, { children: e.paymentMethod ?? "" })
+              title: t("tableHeaders.paymentType"),
+              render: (e) => /* @__PURE__ */ r(a, { children: e.paymentMethod ?? "" })
             },
             {
-              title: r("tableHeaders.grossPay"),
-              render: (e) => /* @__PURE__ */ t(a, { children: l(e.grossPay ?? 0) })
+              title: t("tableHeaders.grossPay"),
+              render: (e) => /* @__PURE__ */ r(a, { children: l(e.grossPay ?? 0) })
             },
             {
-              title: r("tableHeaders.deductions"),
-              render: (e) => /* @__PURE__ */ t(a, { children: l(
+              title: t("tableHeaders.deductions"),
+              render: (e) => /* @__PURE__ */ r(a, { children: l(
                 e.deductions?.reduce(
                   (n, i) => n + i.amount,
                   0
                 ) ?? 0
               ) })
             },
+            ...H ? [
+              {
+                title: t("tableHeaders.reimbursements"),
+                render: (e) => /* @__PURE__ */ r(a, { children: l(L(e)) })
+              }
+            ] : [],
             {
-              title: r("tableHeaders.reimbursements"),
-              render: (e) => /* @__PURE__ */ t(a, { children: l(L(e)) })
-            },
-            {
-              title: r("tableHeaders.employeeTaxes"),
-              render: (e) => /* @__PURE__ */ t(a, { children: l(
+              title: t("tableHeaders.employeeTaxes"),
+              render: (e) => /* @__PURE__ */ r(a, { children: l(
                 e.taxes?.reduce(
                   (n, i) => i.employer ? n : n + i.amount,
                   0
@@ -244,8 +251,8 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
               ) })
             },
             {
-              title: r("tableHeaders.employeeBenefits"),
-              render: (e) => /* @__PURE__ */ t(a, { children: l(
+              title: t("tableHeaders.employeeBenefits"),
+              render: (e) => /* @__PURE__ */ r(a, { children: l(
                 e.benefits?.reduce(
                   (n, i) => n + (i.employeeDeduction ?? 0),
                   0
@@ -253,8 +260,8 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
               ) })
             },
             {
-              title: r("tableHeaders.payment"),
-              render: (e) => /* @__PURE__ */ t(a, { children: l(e.netPay ?? 0) })
+              title: t("tableHeaders.payment"),
+              render: (e) => /* @__PURE__ */ r(a, { children: l(e.netPay ?? 0) })
             }
           ],
           data: o.employeeCompensations
@@ -263,71 +270,73 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
     },
     {
       id: "taxes",
-      label: r("dataViews.taxesTab"),
-      content: /* @__PURE__ */ d(h, { flexDirection: "column", gap: 32, children: [
-        /* @__PURE__ */ t(
+      label: t("dataViews.taxesTab"),
+      content: /* @__PURE__ */ d(f, { flexDirection: "column", gap: 32, children: [
+        /* @__PURE__ */ r(
           m,
           {
-            label: r("dataViews.taxesTable"),
+            label: t("dataViews.taxesTable"),
             columns: [
               {
                 key: "taxDescription",
-                title: r("tableHeaders.taxDescription"),
-                render: (e) => /* @__PURE__ */ t(a, { children: e })
+                title: t("tableHeaders.taxDescription"),
+                render: (e) => /* @__PURE__ */ r(a, { children: e })
               },
               {
                 key: "byYourEmployees",
-                title: r("tableHeaders.byYourEmployees"),
-                render: (e) => /* @__PURE__ */ t(a, { children: l(C[e]?.employee ?? 0) })
+                title: t("tableHeaders.byYourEmployees"),
+                render: (e) => /* @__PURE__ */ r(a, { children: l(N[e]?.employee ?? 0) })
               },
               {
                 key: "byYourCompany",
-                title: r("tableHeaders.byYourCompany"),
-                render: (e) => /* @__PURE__ */ t(a, { children: l(C[e]?.employer ?? 0) })
+                title: t("tableHeaders.byYourCompany"),
+                render: (e) => /* @__PURE__ */ r(a, { children: l(N[e]?.employer ?? 0) })
               }
             ],
             footer: () => ({
-              taxDescription: /* @__PURE__ */ t(a, { children: r("totalsLabel") }),
-              byYourEmployees: /* @__PURE__ */ t(a, { children: l(Number(o.totals?.employeeTaxes ?? 0)) }),
-              byYourCompany: /* @__PURE__ */ t(a, { children: l(Number(o.totals?.employerTaxes ?? 0)) })
+              taxDescription: /* @__PURE__ */ r(a, { children: t("totalsLabel") }),
+              byYourEmployees: /* @__PURE__ */ r(a, { children: l(Number(o.totals?.employeeTaxes ?? 0)) }),
+              byYourCompany: /* @__PURE__ */ r(a, { children: l(Number(o.totals?.employerTaxes ?? 0)) })
             }),
-            data: Object.keys(C)
+            data: Object.keys(N)
           }
         ),
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ r(
           m,
           {
-            label: r("dataViews.debitedTable"),
+            label: t("dataViews.debitedTable"),
             columns: [
               {
-                title: r("tableHeaders.debitedByGusto"),
-                render: ({ label: e }) => /* @__PURE__ */ t(a, { children: e })
+                title: t("tableHeaders.debitedByGusto"),
+                render: ({ label: e }) => /* @__PURE__ */ r(a, { children: e })
               },
               {
-                title: r("tableHeaders.taxesTotal"),
-                render: ({ value: e }) => /* @__PURE__ */ t(a, { children: l(Number(e)) })
+                title: t("tableHeaders.taxesTotal"),
+                render: ({ value: e }) => /* @__PURE__ */ r(a, { children: l(Number(e)) })
               }
             ],
             data: [
-              { label: r("directDepositLabel"), value: o.totals?.netPayDebit || "0" },
-              {
-                label: r("reimbursementLabel"),
-                value: o.totals?.reimbursementDebit || "0"
-              },
+              { label: t("directDepositLabel"), value: o.totals?.netPayDebit || "0" },
+              ...H ? [
+                {
+                  label: t("reimbursementLabel"),
+                  value: o.totals?.reimbursementDebit || "0"
+                }
+              ] : [],
               {
-                label: r("garnishmentsLabel"),
+                label: t("garnishmentsLabel"),
                 value: o.totals?.childSupportDebit || "0"
               },
-              { label: r("taxesLabel"), value: o.totals?.taxDebit || "0" }
+              { label: t("taxesLabel"), value: o.totals?.taxDebit || "0" }
             ]
           }
         )
       ] })
     }
   ];
-  return /* @__PURE__ */ t("div", { ref: B, className: fe.container, children: /* @__PURE__ */ d(h, { flexDirection: "column", alignItems: "stretch", children: [
+  return /* @__PURE__ */ r("div", { ref: I, className: he.container, children: /* @__PURE__ */ d(f, { flexDirection: "column", alignItems: "stretch", children: [
     /* @__PURE__ */ d(
-      h,
+      f,
       {
         flexDirection: c ? "row" : "column",
         justifyContent: c ? "space-between" : "normal",
@@ -335,51 +344,51 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
         gap: c ? 0 : 16,
         children: [
           /* @__PURE__ */ d(z, { flexGrow: 1, children: [
-            /* @__PURE__ */ t(_, { as: "h1", children: r(w ? "summaryTitle" : "overviewTitle") }),
-            /* @__PURE__ */ t(a, { children: /* @__PURE__ */ t(
-              ye,
+            /* @__PURE__ */ r(V, { as: "h1", children: t(w ? "summaryTitle" : "overviewTitle") }),
+            /* @__PURE__ */ r(a, { children: /* @__PURE__ */ r(
+              be,
               {
                 i18nKey: "pageSubtitle",
-                t: r,
-                components: { dateWrapper: /* @__PURE__ */ t(a, { weight: "bold", as: "span" }) },
-                values: _e(o.payPeriod, s)
+                t,
+                components: { dateWrapper: /* @__PURE__ */ r(a, { weight: "bold", as: "span" }) },
+                values: we(o.payPeriod, s)
               }
             ) })
           ] }),
-          /* @__PURE__ */ t(z, { flexGrow: c ? 1 : 0, children: /* @__PURE__ */ t(
-            h,
+          /* @__PURE__ */ r(z, { flexGrow: c ? 1 : 0, children: /* @__PURE__ */ r(
+            f,
             {
               flexDirection: c ? "row" : "column",
               justifyContent: c ? "flex-end" : "normal",
               alignItems: c ? "flex-start" : "stretch",
               gap: 12,
-              children: w ? /* @__PURE__ */ d(P, { children: [
-                /* @__PURE__ */ t(g, { onClick: Z, variant: "secondary", isDisabled: T, children: r("payrollReceiptCta") }),
-                /* @__PURE__ */ t(
-                  g,
+              children: w ? /* @__PURE__ */ d(x, { children: [
+                /* @__PURE__ */ r(D, { onClick: ee, variant: "secondary", isDisabled: T, children: t("payrollReceiptCta") }),
+                /* @__PURE__ */ r(
+                  D,
                   {
                     onClick: () => {
-                      V(!0);
+                      U(!0);
                     },
                     variant: "error",
                     isDisabled: T,
-                    children: r("cancelCta")
+                    children: t("cancelCta")
                   }
                 )
-              ] }) : /* @__PURE__ */ d(P, { children: [
-                /* @__PURE__ */ t(g, { onClick: p, variant: "secondary", isDisabled: T, children: r("editCta") }),
-                /* @__PURE__ */ t(
-                  g,
+              ] }) : /* @__PURE__ */ d(x, { children: [
+                /* @__PURE__ */ r(D, { onClick: p, variant: "secondary", isDisabled: T, children: t("editCta") }),
+                /* @__PURE__ */ r(
+                  D,
                   {
-                    onClick: k,
-                    isDisabled: T || f.length > 0 && (f.some(
-                      (e) => !J.includes(
+                    onClick: C,
+                    isDisabled: T || h.length > 0 && (h.some(
+                      (e) => !Q.includes(
                         e.blockerType || ""
                       )
-                    ) || f.some(
-                      (e) => !N[e.blockerType || ""]
+                    ) || h.some(
+                      (e) => !_[e.blockerType || ""]
                     )),
-                    children: r("submitCta")
+                    children: t("submitCta")
                   }
                 )
               ] })
@@ -388,14 +397,10 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
         ]
       }
     ),
-    T ? /* @__PURE__ */ t(de, { children: /* @__PURE__ */ d(h, { flexDirection: "column", alignItems: "center", gap: 4, children: [
-      /* @__PURE__ */ t(ie, { size: "lg" }),
-      /* @__PURE__ */ t(_, { as: "h4", children: r("loadingTitle") }),
-      /* @__PURE__ */ t(a, { children: r("loadingDescription") })
-    ] }) }) : /* @__PURE__ */ d(P, { children: [
-      re,
-      M.length > 0 && /* @__PURE__ */ t(h, { flexDirection: "column", gap: 16, children: M.map((e, n) => /* @__PURE__ */ t(
-        I,
+    T ? /* @__PURE__ */ r(ke, { title: t("loadingTitle"), description: t("loadingDescription") }) : /* @__PURE__ */ d(x, { children: [
+      ae,
+      M.length > 0 && /* @__PURE__ */ r(f, { flexDirection: "column", gap: 16, children: M.map((e, n) => /* @__PURE__ */ r(
+        Y,
         {
           label: e.title,
           status: e.type,
@@ -404,148 +409,148 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
         },
         `${e.type}-${e.title}`
       )) }),
-      f.length > 0 && W && f.map((e) => {
+      h.length > 0 && W && h.map((e) => {
         const n = e.blockerType || "";
-        return J.includes(n) ? /* @__PURE__ */ t(
-          we,
+        return Q.includes(n) ? /* @__PURE__ */ r(
+          Ce,
           {
             blocker: e,
-            selectedValue: N[n],
+            selectedValue: _[n],
             onUnblockOptionChange: W
           },
           n
-        ) : /* @__PURE__ */ t(Ne, { blocker: e }, n);
+        ) : /* @__PURE__ */ r(Ne, { blocker: e }, n);
       }),
-      /* @__PURE__ */ t(_, { as: "h3", children: r(F ? "payrollSummaryTitleWire" : j ? "payrollSummaryTitleFourDay" : "payrollSummaryTitle") }),
-      F ? /* @__PURE__ */ t(
+      /* @__PURE__ */ r(V, { as: "h3", children: t(j ? "payrollSummaryTitleWire" : G ? "payrollSummaryTitleFourDay" : "payrollSummaryTitle") }),
+      j ? /* @__PURE__ */ r(
         m,
         {
-          label: r("payrollSummaryLabel"),
+          label: t("payrollSummaryLabel"),
           columns: [
             {
-              title: r("tableHeaders.totalPayroll"),
-              render: () => /* @__PURE__ */ t(a, { children: l(D) })
+              title: t("tableHeaders.totalPayroll"),
+              render: () => /* @__PURE__ */ r(a, { children: l(g) })
             },
             {
-              title: r("tableHeaders.wireAmount"),
+              title: t("tableHeaders.wireAmount"),
               render: () => {
                 const n = b?.metadata?.wire_in_amount;
-                return /* @__PURE__ */ t(a, { children: n ? l(Number(n)) : "-" });
+                return /* @__PURE__ */ r(a, { children: n ? l(Number(n)) : "-" });
               }
             },
             {
-              title: r("tableHeaders.wireTransferDeadline"),
+              title: t("tableHeaders.wireTransferDeadline"),
               render: () => {
                 const n = b?.metadata?.wire_in_deadline, i = s.formatWithTime(n), y = s.formatShortWithYear(n);
-                return /* @__PURE__ */ t(a, { children: n ? `${i.time} on ${y}` : "-" });
+                return /* @__PURE__ */ r(a, { children: n ? `${i.time} on ${y}` : "-" });
               }
             },
             {
-              title: r("tableHeaders.employeePayDate"),
-              render: () => /* @__PURE__ */ t(a, { children: b?.checkDate ? s.formatShortWithYear(b.checkDate) : "-" })
+              title: t("tableHeaders.employeePayDate"),
+              render: () => /* @__PURE__ */ r(a, { children: b?.checkDate ? s.formatShortWithYear(b.checkDate) : "-" })
             }
           ],
           data: [{}]
         }
-      ) : j ? /* @__PURE__ */ t(
+      ) : G ? /* @__PURE__ */ r(
         m,
         {
-          label: r("payrollSummaryLabel"),
+          label: t("payrollSummaryLabel"),
           columns: [
             {
-              title: r("tableHeaders.totalPayroll"),
-              render: () => /* @__PURE__ */ t(a, { children: l(D) })
+              title: t("tableHeaders.totalPayroll"),
+              render: () => /* @__PURE__ */ r(a, { children: l(g) })
             },
             {
-              title: r("tableHeaders.debitAmount"),
+              title: t("tableHeaders.debitAmount"),
               render: () => {
                 const e = o.totals?.companyDebit;
-                return /* @__PURE__ */ t(a, { children: l(Number(e ?? 0)) });
+                return /* @__PURE__ */ r(a, { children: l(Number(e ?? 0)) });
               }
             },
             {
-              title: r("tableHeaders.debitAccount"),
-              render: () => /* @__PURE__ */ t(a, { children: O?.hiddenAccountNumber ?? "" })
+              title: t("tableHeaders.debitAccount"),
+              render: () => /* @__PURE__ */ r(a, { children: O?.hiddenAccountNumber ?? "" })
             },
             {
-              title: r("tableHeaders.debitDate"),
+              title: t("tableHeaders.debitDate"),
               render: () => {
                 const n = b?.metadata?.debit_date;
-                return /* @__PURE__ */ t(a, { children: s.formatShortWithYear(n) });
+                return /* @__PURE__ */ r(a, { children: s.formatShortWithYear(n) });
               }
             },
             {
-              title: r("tableHeaders.employeePayDate"),
-              render: () => /* @__PURE__ */ t(a, { children: b?.checkDate ? s.formatShortWithYear(b.checkDate) : "-" })
+              title: t("tableHeaders.employeePayDate"),
+              render: () => /* @__PURE__ */ r(a, { children: b?.checkDate ? s.formatShortWithYear(b.checkDate) : "-" })
             }
           ],
           data: [{}]
         }
-      ) : /* @__PURE__ */ t(
+      ) : /* @__PURE__ */ r(
         m,
         {
-          label: r("payrollSummaryLabel"),
+          label: t("payrollSummaryLabel"),
           columns: [
             {
-              title: r("tableHeaders.totalPayroll"),
-              render: () => /* @__PURE__ */ t(a, { children: l(D) })
+              title: t("tableHeaders.totalPayroll"),
+              render: () => /* @__PURE__ */ r(a, { children: l(g) })
             },
             {
-              title: r("tableHeaders.debitAmount"),
-              render: () => /* @__PURE__ */ t(a, { children: l(Number(o.totals?.companyDebit ?? 0)) })
+              title: t("tableHeaders.debitAmount"),
+              render: () => /* @__PURE__ */ r(a, { children: l(Number(o.totals?.companyDebit ?? 0)) })
             },
             {
-              title: r("tableHeaders.debitAccount"),
-              render: () => /* @__PURE__ */ t(a, { children: O?.hiddenAccountNumber ?? "" })
+              title: t("tableHeaders.debitAccount"),
+              render: () => /* @__PURE__ */ r(a, { children: O?.hiddenAccountNumber ?? "" })
             },
             {
-              title: r("tableHeaders.debitDate"),
-              render: () => /* @__PURE__ */ t(a, { children: s.formatShortWithYear(ce) })
+              title: t("tableHeaders.debitDate"),
+              render: () => /* @__PURE__ */ r(a, { children: s.formatShortWithYear(de) })
             },
             {
-              title: r("tableHeaders.employeePayDate"),
-              render: () => /* @__PURE__ */ t(a, { children: s.formatShortWithYear(o.checkDate) })
+              title: t("tableHeaders.employeePayDate"),
+              render: () => /* @__PURE__ */ r(a, { children: s.formatShortWithYear(o.checkDate) })
             }
           ],
           data: [{}]
         }
       ),
-      $ > 0 && /* @__PURE__ */ t(
-        I,
+      K > 0 && /* @__PURE__ */ r(
+        Y,
         {
           status: "warning",
-          label: r("alerts.checkPaymentWarning", { count: $ }),
-          children: /* @__PURE__ */ t(a, { children: r("alerts.checkPaymentWarningDescription") })
+          label: t("alerts.checkPaymentWarning", { count: K }),
+          children: /* @__PURE__ */ r(a, { children: t("alerts.checkPaymentWarningDescription") })
         }
       ),
-      /* @__PURE__ */ t(
-        le,
+      /* @__PURE__ */ r(
+        ie,
         {
           onSelectionChange: se,
           selectedId: oe,
-          "aria-label": r("dataViews.label"),
-          tabs: ue
+          "aria-label": t("dataViews.label"),
+          tabs: me
         }
       ),
-      Y && /* @__PURE__ */ t(
-        ne,
+      B && /* @__PURE__ */ r(
+        le,
         {
-          isOpen: Y,
+          isOpen: B,
           onClose: () => {
-            V(!1);
+            U(!1);
           },
-          onPrimaryActionClick: Q,
+          onPrimaryActionClick: Z,
           shouldCloseOnBackdropClick: !0,
-          primaryActionLabel: r("confirmCancelCta"),
+          primaryActionLabel: t("confirmCancelCta"),
           isDestructive: !0,
-          closeActionLabel: r("declineCancelCta"),
-          title: r("cancelDialogTitle", {
+          closeActionLabel: t("declineCancelCta"),
+          title: t("cancelDialogTitle", {
             startDate: s.formatLong(o.payPeriod?.startDate),
             endDate: s.formatLongWithYear(o.payPeriod?.endDate)
           }),
-          children: /* @__PURE__ */ d(h, { gap: 14, flexDirection: "column", children: [
-            /* @__PURE__ */ t(a, { children: r("cancelDialogDescription") }),
-            /* @__PURE__ */ t(a, { children: r("cancelDialogDescriptionDeadline", {
+          children: /* @__PURE__ */ d(f, { gap: 14, flexDirection: "column", children: [
+            /* @__PURE__ */ r(a, { children: t("cancelDialogDescription") }),
+            /* @__PURE__ */ r(a, { children: t("cancelDialogDescriptionDeadline", {
               deadline: s.formatWithTime(o.payrollDeadline).time
             }) })
           ] })
@@ -555,6 +560,6 @@ const _e = (p, k) => p?.startDate && p.endDate ? k.formatPayPeriod(p.startDate,
   ] }) });
 };
 export {
-  ze as PayrollOverviewPresentation
+  Xe as PayrollOverviewPresentation
 };
 //# sourceMappingURL=PayrollOverviewPresentation.js.map