@gusto/embedded-react-sdk 0.26.0 → 0.28.0

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

@@ -9,16 +9,16 @@ import u from "./PayrollEditEmployeePresentation.module.scss.js";
 import { TimeOffField as ne } from "./TimeOffField.js";
 import { Flex as x } from "../../Common/Flex/Flex.js";
 import { Grid as P } from "../../Common/Grid/Grid.js";
-import { useComponentContext as re } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as ie } from "../../../i18n/I18n.js";
-import { Form as oe } from "../../Common/Form/Form.js";
-import { firstLastName as se, formatNumberAsCurrency as ae } from "../../../helpers/formattedStrings.js";
-import { getAdditionalEarningsCompensations as me, getReimbursementCompensation as le, calculateGrossPay as G } from "../helpers.js";
-import { HOURS_COMPENSATION_NAMES as k, EXCLUDED_ADDITIONAL_EARNINGS as de, COMPENSATION_NAME_DOUBLE_OVERTIME as ue, COMPENSATION_NAME_OVERTIME as ce, COMPENSATION_NAME_REGULAR_HOURS as pe, COMPENSATION_NAME_REIMBURSEMENT as fe, COMPENSATION_NAME_CASH_TIPS as he, COMPENSATION_NAME_COMMISSION as Ce, COMPENSATION_NAME_CORRECTION_PAYMENT as Ne, COMPENSATION_NAME_PAYCHECK_TIPS as Ee, COMPENSATION_NAME_BONUS as ge } from "../../../shared/constants.js";
-import { useContainerBreakpoints as be } from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
-import { TextInputField as Me } from "../../Common/Fields/TextInputField/TextInputField.js";
-import { NumberInputField as w } from "../../Common/Fields/NumberInputField/NumberInputField.js";
-import { RadioGroupField as Oe } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { RadioGroupField as re } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
+import { TextInputField as ie } from "../../Common/Fields/TextInputField/TextInputField.js";
+import { NumberInputField as G } from "../../Common/Fields/NumberInputField/NumberInputField.js";
+import { useComponentContext as oe } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as se } from "../../../i18n/I18n.js";
+import { Form as ae } from "../../Common/Form/Form.js";
+import { firstLastName as me, formatNumberAsCurrency as le } from "../../../helpers/formattedStrings.js";
+import { getAdditionalEarningsCompensations as de, getReimbursementCompensation as ue, calculateGrossPay as k } from "../helpers.js";
+import { HOURS_COMPENSATION_NAMES as w, EXCLUDED_ADDITIONAL_EARNINGS as ce, COMPENSATION_NAME_DOUBLE_OVERTIME as pe, COMPENSATION_NAME_OVERTIME as fe, COMPENSATION_NAME_REGULAR_HOURS as he, COMPENSATION_NAME_REIMBURSEMENT as Ce, COMPENSATION_NAME_CASH_TIPS as Ne, COMPENSATION_NAME_COMMISSION as Ee, COMPENSATION_NAME_CORRECTION_PAYMENT as ge, COMPENSATION_NAME_PAYCHECK_TIPS as be, COMPENSATION_NAME_BONUS as Me } from "../../../shared/constants.js";
+import { useContainerBreakpoints as Oe } from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
 const Te = m.object({
   hourlyCompensations: m.record(m.string(), m.record(m.string(), m.string().optional())),
   timeOffCompensations: m.record(m.string(), m.string().optional()),
@@ -72,22 +72,22 @@ const Te = m.object({
   withReimbursements: M = !0,
   hasDirectDepositSetup: $ = !0
 }) => {
-  const { Button: v, Heading: c, Text: B } = re(), { t } = ee("Payroll.PayrollEditEmployee");
-  ie("Payroll.PayrollEditEmployee");
-  const f = l.jobs?.find((e) => e.primary), O = f ? [f] : [], F = Z(null), p = be({
+  const { Button: v, Heading: c, Text: B } = oe(), { t } = ee("Payroll.PayrollEditEmployee");
+  se("Payroll.PayrollEditEmployee");
+  const f = l.jobs?.find((e) => e.primary), O = f ? [f] : [], F = Z(null), p = Oe({
     ref: F
   }).includes("small");
   o?.hourlyCompensations?.forEach((e) => {
     const n = l.jobs?.find((s) => s.uuid === e.jobUuid);
     n && !O.find((s) => s.uuid === n.uuid) && O.push(n);
   });
-  const A = (o?.paidTimeOff || []).filter((e) => e.name), _ = me({
+  const A = (o?.paidTimeOff || []).filter((e) => e.name), _ = de({
     flsaStatus: f?.compensations?.[0]?.flsaStatus,
     existingFixedCompensations: o?.fixedCompensations || [],
     primaryJobUuid: f?.uuid,
     fixedCompensationTypes: b,
-    excludedTypes: de
-  }), N = M ? le(
+    excludedTypes: ce
+  }), N = M ? ue(
     o?.fixedCompensations || [],
     b,
     f?.uuid
@@ -95,28 +95,28 @@ const Te = m.object({
     (s) => s.jobUuid === e && s.name?.toLowerCase() === n.toLowerCase()
   ), q = (e) => {
     switch (e) {
-      case pe:
+      case he:
         return t("compensationNames.regularHours");
-      case ce:
+      case fe:
         return t("compensationNames.overtime");
-      case ue:
+      case pe:
         return t("compensationNames.doubleOvertime");
       default:
         return e;
     }
   }, j = (e) => {
     switch (e) {
-      case ge:
+      case Me:
         return t("fixedCompensationNames.bonus");
-      case Ee:
+      case be:
         return t("fixedCompensationNames.paycheckTips");
-      case Ne:
+      case ge:
         return t("fixedCompensationNames.correctionPayment");
-      case Ce:
+      case Ee:
         return t("fixedCompensationNames.commission");
-      case he:
+      case Ne:
         return t("fixedCompensationNames.cashTips");
-      case fe:
+      case Ce:
         return t("fixedCompensationNames.reimbursement");
       default:
         return e;
@@ -125,7 +125,7 @@ const Te = m.object({
     hourlyCompensations: (() => {
       const e = {};
       return O.forEach((n) => {
-        k.forEach((s) => {
+        w.forEach((s) => {
           const h = R(n.uuid, s);
           h && (e[n.uuid] || (e[n.uuid] = {}), e[n.uuid][h.name] = h.hours ? parseFloat(h.hours).toString() : "");
         });
@@ -166,7 +166,7 @@ const Te = m.object({
         (o?.paidTimeOff || []).filter((h) => h.name),
         f?.uuid
       );
-      return G(
+      return k(
         s,
         l,
         i,
@@ -174,7 +174,7 @@ const Te = m.object({
         C
       );
     } catch {
-      return o ? G(
+      return o ? k(
         o,
         l,
         i,
@@ -190,7 +190,7 @@ const Te = m.object({
     i,
     d,
     C
-  ]), W = se({
+  ]), W = me({
     first_name: l.firstName,
     last_name: l.lastName
   }), Y = (e) => {
@@ -201,7 +201,7 @@ const Te = m.object({
       f?.uuid
     );
     E(n);
-  }, L = ae(z || 0), U = /* @__PURE__ */ a(
+  }, L = le(z || 0), U = /* @__PURE__ */ a(
     x,
     {
       flexDirection: p ? "row" : "column",
@@ -240,19 +240,19 @@ const Te = m.object({
       }
     ),
     /* @__PURE__ */ a(Q, { ...I, children: [
-      /* @__PURE__ */ a(oe, { children: [
+      /* @__PURE__ */ a(ae, { children: [
         O.length > 0 && /* @__PURE__ */ a("div", { className: u.fieldGroup, children: [
           /* @__PURE__ */ r(c, { as: "h3", children: t("regularHoursTitle") }),
           O.map((e) => /* @__PURE__ */ a(x, { flexDirection: "column", gap: 8, children: [
             O.length > 1 && /* @__PURE__ */ r(c, { as: "h4", children: e.title }),
-            /* @__PURE__ */ r(P, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: k.map((n) => {
+            /* @__PURE__ */ r(P, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: w.map((n) => {
               const s = R(
                 e.uuid,
                 n
               );
               if (s)
                 return /* @__PURE__ */ r(
-                  Me,
+                  ie,
                   {
                     type: "number",
                     min: 0,
@@ -285,7 +285,7 @@ const Te = m.object({
               gridTemplateColumns: { base: "1fr", small: [320, 320], large: [320, 320, 320] },
               gap: 20,
               children: _.map((e) => /* @__PURE__ */ r(
-                w,
+                G,
                 {
                   format: "currency",
                   min: 0,
@@ -301,7 +301,7 @@ const Te = m.object({
         N && /* @__PURE__ */ a("div", { className: u.fieldGroup, children: [
           /* @__PURE__ */ r(c, { as: "h4", children: t("reimbursementTitle") }),
           /* @__PURE__ */ r(P, { gridTemplateColumns: { base: "1fr", small: [320, 320] }, gap: 20, children: /* @__PURE__ */ r(
-            w,
+            G,
             {
               format: "currency",
               min: 0,
@@ -314,7 +314,7 @@ const Te = m.object({
         $ && /* @__PURE__ */ a("div", { className: u.fieldGroup, children: [
           /* @__PURE__ */ r(c, { as: "h4", children: t("paymentMethodTitle") }),
           /* @__PURE__ */ r(
-            Oe,
+            re,
             {
               name: "paymentMethod",
               isRequired: !0,

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

@@ -1,16 +1,16 @@
-const e = "_container_1ftl6_1", t = "_headerSection_1ftl6_5", o = "_headerSectionSticky_1ftl6_12", c = "_fieldGroup_1ftl6_20", n = "_grossPayLabel_1ftl6_32", a = {
+const e = "_container_1u64c_1", c = "_headerSection_1u64c_5", o = "_headerSectionSticky_1u64c_12", t = "_fieldGroup_1u64c_20", n = "_grossPayLabel_1u64c_32", a = {
   container: e,
-  headerSection: t,
+  headerSection: c,
   headerSectionSticky: o,
-  fieldGroup: c,
+  fieldGroup: t,
   grossPayLabel: n
 };
 export {
   e as container,
   a as default,
-  c as fieldGroup,
+  t as fieldGroup,
   n as grossPayLabel,
-  t as headerSection,
+  c as headerSection,
   o as headerSectionSticky
 };
 //# sourceMappingURL=PayrollEditEmployeePresentation.module.scss.js.map

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

@@ -1,35 +1,37 @@
-import { jsxs as u, jsx as i } from "react/jsx-runtime";
-import { useId as d } from "react";
-import { useFormContext as p, useWatch as f } from "react-hook-form";
-import { useTranslation as m } from "react-i18next";
+import { jsxs as u, jsx as l } from "react/jsx-runtime";
+import { useId as p } from "react";
+import { useFormContext as d, useWatch as f } from "react-hook-form";
+import { useTranslation as c } from "react-i18next";
 import { Flex as y } from "../../Common/Flex/Flex.js";
-import { useComponentContext as x } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as h } from "../../../i18n/I18n.js";
-import { TextInputField as B } from "../../Common/Fields/TextInputField/TextInputField.js";
+import "classnames";
+import "../../../shared/constants.js";
+import { TextInputField as x } from "../../Common/Fields/TextInputField/TextInputField.js";
+import { useComponentContext as h } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as B } from "../../../i18n/I18n.js";
 const P = ({
   accrualBalance: e,
   accrualMethod: o,
   hoursUsed: r,
   id: t
 }) => {
-  const { Text: n } = x(), { t: l } = m("Payroll.PayrollEditEmployee");
+  const { Text: n } = h(), { t: i } = c("Payroll.PayrollEditEmployee");
   if (o === "unlimited")
     return null;
   const a = parseFloat(e) - r;
-  return /* @__PURE__ */ i(n, { size: "sm", variant: "supporting", "aria-live": "polite", "aria-atomic": !0, id: t, children: l("timeOffBalance.remaining", { balance: a.toFixed(1) }) });
-}, j = ({ timeOff: e, employee: o }) => {
-  const { t: r } = m("Payroll.PayrollEditEmployee");
-  h("Payroll.PayrollEditEmployee");
-  const { control: t } = p(), n = d(), l = f({
+  return /* @__PURE__ */ l(n, { size: "sm", variant: "supporting", "aria-live": "polite", "aria-atomic": !0, id: t, children: i("timeOffBalance.remaining", { balance: a.toFixed(1) }) });
+}, U = ({ timeOff: e, employee: o }) => {
+  const { t: r } = c("Payroll.PayrollEditEmployee");
+  B("Payroll.PayrollEditEmployee");
+  const { control: t } = d(), n = p(), i = f({
     control: t,
     name: `timeOffCompensations.${e.name}`
   });
   if (!e.name)
     return null;
-  const c = parseFloat(l || "0"), a = o.eligiblePaidTimeOff?.find((s) => s.name === e.name);
+  const m = parseFloat(i || "0"), a = o.eligiblePaidTimeOff?.find((s) => s.name === e.name);
   return /* @__PURE__ */ u(y, { flexDirection: "column", gap: 4, children: [
-    /* @__PURE__ */ i(
-      B,
+    /* @__PURE__ */ l(
+      x,
       {
         name: `timeOffCompensations.${e.name}`,
         type: "number",
@@ -41,18 +43,18 @@ const P = ({
       },
       e.name
     ),
-    a?.accrualBalance && /* @__PURE__ */ i(
+    a?.accrualBalance && /* @__PURE__ */ l(
       P,
       {
         accrualBalance: a.accrualBalance,
         accrualMethod: a.accrualMethod ?? void 0,
-        hoursUsed: c,
+        hoursUsed: m,
         id: n
       }
     )
   ] });
 };
 export {
-  j as TimeOffField
+  U as TimeOffField
 };
 //# sourceMappingURL=TimeOffField.js.map

package/dist/components/Payroll/PayrollEditEmployee/TimeOffField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeOffField.js","sources":["../../../../src/components/Payroll/PayrollEditEmployee/TimeOffField.tsx"],"sourcesContent":["import { useId } from 'react'\nimport { useWatch, useFormContext } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollEmployeeCompensationsTypePaidTimeOff } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport type { PayrollEditEmployeeFormValues } from './PayrollEditEmployeePresentation'\nimport { Flex, TextInputField } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nexport interface TimeOffFieldProps {\n  timeOff: PayrollEmployeeCompensationsTypePaidTimeOff\n  employee: Employee\n}\n\nconst TimeOffBalance = ({\n  accrualBalance,\n  accrualMethod,\n  hoursUsed,\n  id,\n}: {\n  accrualBalance: string\n  accrualMethod?: string\n  hoursUsed: number\n  id: string\n}) => {\n  const { Text } = useComponentContext()\n  const { t } = useTranslation('Payroll.PayrollEditEmployee')\n\n  if (accrualMethod === 'unlimited') {\n    return null\n  }\n\n  const currentBalance = parseFloat(accrualBalance)\n  const remainingBalance = currentBalance - hoursUsed\n\n  return (\n    <Text size=\"sm\" variant=\"supporting\" aria-live=\"polite\" aria-atomic={true} id={id}>\n      {t('timeOffBalance.remaining', { balance: remainingBalance.toFixed(1) })}\n    </Text>\n  )\n}\n\nexport const TimeOffField = ({ timeOff, employee }: TimeOffFieldProps) => {\n  const { t } = useTranslation('Payroll.PayrollEditEmployee')\n  useI18n('Payroll.PayrollEditEmployee')\n\n  const { control } = useFormContext<PayrollEditEmployeeFormValues>()\n  const id = useId()\n\n  const watchedValue = useWatch({\n    control,\n    name: `timeOffCompensations.${timeOff.name}`,\n  })\n\n  if (!timeOff.name) {\n    return null\n  }\n\n  const hoursUsed = parseFloat(watchedValue || '0')\n  const eligiblePolicy = employee.eligiblePaidTimeOff?.find(policy => policy.name === timeOff.name)\n\n  return (\n    <Flex flexDirection=\"column\" gap={4}>\n      <TextInputField\n        key={timeOff.name}\n        name={`timeOffCompensations.${timeOff.name}`}\n        type=\"number\"\n        min={0}\n        adornmentEnd={t('hoursUnit')}\n        isRequired\n        label={timeOff.name}\n        aria-describedby={id}\n      />\n      {eligiblePolicy?.accrualBalance && (\n        <TimeOffBalance\n          accrualBalance={eligiblePolicy.accrualBalance}\n          accrualMethod={eligiblePolicy.accrualMethod ?? undefined}\n          hoursUsed={hoursUsed}\n          id={id}\n        />\n      )}\n    </Flex>\n  )\n}\n"],"names":["TimeOffBalance","accrualBalance","accrualMethod","hoursUsed","id","Text","useComponentContext","t","useTranslation","remainingBalance","jsx","TimeOffField","timeOff","employee","useI18n","control","useFormContext","useId","watchedValue","useWatch","eligiblePolicy","policy","jsxs","Flex","TextInputField"],"mappings":";;;;;;;;AAeA,MAAMA,IAAiB,CAAC;AAAA,EACtB,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AACF,MAKM;AACJ,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAA,GACX,EAAE,GAAAC,EAAA,IAAMC,EAAe,6BAA6B;AAE1D,MAAIN,MAAkB;AACpB,WAAO;AAIT,QAAMO,IADiB,WAAWR,CAAc,IACNE;AAE1C,SACE,gBAAAO,EAACL,KAAK,MAAK,MAAK,SAAQ,cAAa,aAAU,UAAS,eAAa,IAAM,IAAAD,GACxE,UAAAG,EAAE,4BAA4B,EAAE,SAASE,EAAiB,QAAQ,CAAC,EAAA,CAAG,GACzE;AAEJ,GAEaE,IAAe,CAAC,EAAE,SAAAC,GAAS,UAAAC,QAAkC;AACxE,QAAM,EAAE,GAAAN,EAAA,IAAMC,EAAe,6BAA6B;AAC1D,EAAAM,EAAQ,6BAA6B;AAErC,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdZ,IAAKa,EAAA,GAELC,IAAeC,EAAS;AAAA,IAC5B,SAAAJ;AAAA,IACA,MAAM,wBAAwBH,EAAQ,IAAI;AAAA,EAAA,CAC3C;AAED,MAAI,CAACA,EAAQ;AACX,WAAO;AAGT,QAAMT,IAAY,WAAWe,KAAgB,GAAG,GAC1CE,IAAiBP,EAAS,qBAAqB,KAAK,OAAUQ,EAAO,SAAST,EAAQ,IAAI;AAEhG,SACE,gBAAAU,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,IAAA,gBAAAb;AAAA,MAACc;AAAA,MAAA;AAAA,QAEC,MAAM,wBAAwBZ,EAAQ,IAAI;AAAA,QAC1C,MAAK;AAAA,QACL,KAAK;AAAA,QACL,cAAcL,EAAE,WAAW;AAAA,QAC3B,YAAU;AAAA,QACV,OAAOK,EAAQ;AAAA,QACf,oBAAkBR;AAAA,MAAA;AAAA,MAPbQ,EAAQ;AAAA,IAAA;AAAA,IASdQ,GAAgB,kBACf,gBAAAV;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,gBAAgBoB,EAAe;AAAA,QAC/B,eAAeA,EAAe,iBAAiB;AAAA,QAC/C,WAAAjB;AAAA,QACA,IAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}
+{"version":3,"file":"TimeOffField.js","sources":["../../../../src/components/Payroll/PayrollEditEmployee/TimeOffField.tsx"],"sourcesContent":["import { useId } from 'react'\nimport { useWatch, useFormContext } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollEmployeeCompensationsTypePaidTimeOff } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport type { PayrollEditEmployeeFormValues } from './PayrollEditEmployeePresentation'\nimport { Flex, TextInputField } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nexport interface TimeOffFieldProps {\n  timeOff: PayrollEmployeeCompensationsTypePaidTimeOff\n  employee: Employee\n}\n\nconst TimeOffBalance = ({\n  accrualBalance,\n  accrualMethod,\n  hoursUsed,\n  id,\n}: {\n  accrualBalance: string\n  accrualMethod?: string\n  hoursUsed: number\n  id: string\n}) => {\n  const { Text } = useComponentContext()\n  const { t } = useTranslation('Payroll.PayrollEditEmployee')\n\n  if (accrualMethod === 'unlimited') {\n    return null\n  }\n\n  const currentBalance = parseFloat(accrualBalance)\n  const remainingBalance = currentBalance - hoursUsed\n\n  return (\n    <Text size=\"sm\" variant=\"supporting\" aria-live=\"polite\" aria-atomic={true} id={id}>\n      {t('timeOffBalance.remaining', { balance: remainingBalance.toFixed(1) })}\n    </Text>\n  )\n}\n\nexport const TimeOffField = ({ timeOff, employee }: TimeOffFieldProps) => {\n  const { t } = useTranslation('Payroll.PayrollEditEmployee')\n  useI18n('Payroll.PayrollEditEmployee')\n\n  const { control } = useFormContext<PayrollEditEmployeeFormValues>()\n  const id = useId()\n\n  const watchedValue = useWatch({\n    control,\n    name: `timeOffCompensations.${timeOff.name}`,\n  })\n\n  if (!timeOff.name) {\n    return null\n  }\n\n  const hoursUsed = parseFloat(watchedValue || '0')\n  const eligiblePolicy = employee.eligiblePaidTimeOff?.find(policy => policy.name === timeOff.name)\n\n  return (\n    <Flex flexDirection=\"column\" gap={4}>\n      <TextInputField\n        key={timeOff.name}\n        name={`timeOffCompensations.${timeOff.name}`}\n        type=\"number\"\n        min={0}\n        adornmentEnd={t('hoursUnit')}\n        isRequired\n        label={timeOff.name}\n        aria-describedby={id}\n      />\n      {eligiblePolicy?.accrualBalance && (\n        <TimeOffBalance\n          accrualBalance={eligiblePolicy.accrualBalance}\n          accrualMethod={eligiblePolicy.accrualMethod ?? undefined}\n          hoursUsed={hoursUsed}\n          id={id}\n        />\n      )}\n    </Flex>\n  )\n}\n"],"names":["TimeOffBalance","accrualBalance","accrualMethod","hoursUsed","id","Text","useComponentContext","t","useTranslation","remainingBalance","jsx","TimeOffField","timeOff","employee","useI18n","control","useFormContext","useId","watchedValue","useWatch","eligiblePolicy","policy","jsxs","Flex","TextInputField"],"mappings":";;;;;;;;;;AAeA,MAAMA,IAAiB,CAAC;AAAA,EACtB,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AACF,MAKM;AACJ,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAA,GACX,EAAE,GAAAC,EAAA,IAAMC,EAAe,6BAA6B;AAE1D,MAAIN,MAAkB;AACpB,WAAO;AAIT,QAAMO,IADiB,WAAWR,CAAc,IACNE;AAE1C,SACE,gBAAAO,EAACL,KAAK,MAAK,MAAK,SAAQ,cAAa,aAAU,UAAS,eAAa,IAAM,IAAAD,GACxE,UAAAG,EAAE,4BAA4B,EAAE,SAASE,EAAiB,QAAQ,CAAC,EAAA,CAAG,GACzE;AAEJ,GAEaE,IAAe,CAAC,EAAE,SAAAC,GAAS,UAAAC,QAAkC;AACxE,QAAM,EAAE,GAAAN,EAAA,IAAMC,EAAe,6BAA6B;AAC1D,EAAAM,EAAQ,6BAA6B;AAErC,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdZ,IAAKa,EAAA,GAELC,IAAeC,EAAS;AAAA,IAC5B,SAAAJ;AAAA,IACA,MAAM,wBAAwBH,EAAQ,IAAI;AAAA,EAAA,CAC3C;AAED,MAAI,CAACA,EAAQ;AACX,WAAO;AAGT,QAAMT,IAAY,WAAWe,KAAgB,GAAG,GAC1CE,IAAiBP,EAAS,qBAAqB,KAAK,OAAUQ,EAAO,SAAST,EAAQ,IAAI;AAEhG,SACE,gBAAAU,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,IAAA,gBAAAb;AAAA,MAACc;AAAA,MAAA;AAAA,QAEC,MAAM,wBAAwBZ,EAAQ,IAAI;AAAA,QAC1C,MAAK;AAAA,QACL,KAAK;AAAA,QACL,cAAcL,EAAE,WAAW;AAAA,QAC3B,YAAU;AAAA,QACV,OAAOK,EAAQ;AAAA,QACf,oBAAkBR;AAAA,MAAA;AAAA,MAPbQ,EAAQ;AAAA,IAAA;AAAA,IASdQ,GAAgB,kBACf,gBAAAV;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,gBAAgBoB,EAAe;AAAA,QAC/B,eAAeA,EAAe,iBAAiB;AAAA,QAC/C,WAAAjB;AAAA,QACA,IAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}

package/dist/components/Payroll/PayrollHistory/PayrollHistoryPresentation.js

@@ -3,6 +3,8 @@ import { useTranslation as U } from "react-i18next";
 import { getPayrollType as L, calculateTotalPayroll as N, canCancelPayroll as O } from "../helpers.js";
 import j from "./PayrollHistoryPresentation.module.scss.js";
 import { Flex as n } from "../../Common/Flex/Flex.js";
+import "classnames";
+import "../../../shared/constants.js";
 import { HamburgerMenu as M } from "../../Common/HamburgerMenu/HamburgerMenu.js";
 import { useComponentContext as V } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { formatNumberAsCurrency as q } from "../../../helpers/formattedStrings.js";
@@ -13,7 +15,7 @@ import $ from "../../../assets/icons/icon-file-outline.svg.js";
 import B from "../../../assets/icons/icon-receipt-outline.svg.js";
 import { PayrollStatusBadges as W } from "../PayrollStatusBadges/PayrollStatusBadges.js";
 import { DataView as _ } from "../../Common/DataView/DataView.js";
-const me = ({
+const de = ({
   payrollHistory: c,
   wireInRequests: p,
   selectedTimeFilter: y,
@@ -33,9 +35,9 @@ const me = ({
     { value: "6months", label: t("timeFilter.options.6months") },
     { value: "year", label: t("timeFilter.options.year") }
   ], w = (e) => {
-    const a = e.payrollDeadline;
-    if (!a) return "";
-    const i = new Date(a), u = "America/New_York", T = new Intl.DateTimeFormat("en-US", {
+    const i = e.payrollDeadline;
+    if (!i) return "";
+    const a = new Date(i), u = "America/New_York", T = new Intl.DateTimeFormat("en-US", {
       weekday: "short",
       month: "short",
       day: "numeric",
@@ -45,37 +47,37 @@ const me = ({
       minute: "2-digit",
       timeZoneName: "short",
       timeZone: u
-    }), H = T.format(i);
-    return `${R.format(i)} on ${H}`;
+    }), H = T.format(a);
+    return `${R.format(a)} on ${H}`;
   }, x = (e) => {
     g(e);
   }, k = () => {
     o && D(o);
   }, A = (e) => {
-    const a = e.payrollUuid || e.uuid, i = [
+    const i = e.payrollUuid || e.uuid, a = [
       {
         label: t("menu.viewSummary"),
         icon: /* @__PURE__ */ r($, { "aria-hidden": !0 }),
         onClick: () => {
-          f(a, e.payPeriod?.startDate, e.payPeriod?.endDate);
+          f(i, e.payPeriod?.startDate, e.payPeriod?.endDate);
         }
       },
       {
         label: t("menu.viewReceipt"),
         icon: /* @__PURE__ */ r(B, { "aria-hidden": !0 }),
         onClick: () => {
-          P(a, e.payPeriod?.startDate, e.payPeriod?.endDate);
+          P(i, e.payPeriod?.startDate, e.payPeriod?.endDate);
         }
       }
     ];
-    return O(e) && i.push({
+    return O(e) && a.push({
       label: t("menu.cancelPayroll"),
       icon: /* @__PURE__ */ r(Z, { "aria-hidden": !0 }),
       onClick: () => {
         x(e);
       },
       "data-destructive": "true"
-    }), i;
+    }), a;
   };
   return c.length === 0 ? /* @__PURE__ */ l(n, { flexDirection: "column", alignItems: "center", gap: 24, children: [
     /* @__PURE__ */ r(d, { as: "h3", children: t("emptyState.title") }),
@@ -129,10 +131,10 @@ const me = ({
           {
             title: t("columns.status"),
             render: (e) => {
-              const a = p.find(
-                (i) => i.paymentUuid === e.payrollUuid
+              const i = p.find(
+                (a) => a.paymentUuid === e.payrollUuid
               );
-              return /* @__PURE__ */ r(W, { payroll: e, wireInRequest: a });
+              return /* @__PURE__ */ r(W, { payroll: e, wireInRequest: i });
             }
           },
           {
@@ -171,6 +173,6 @@ const me = ({
   ] });
 };
 export {
-  me as PayrollHistoryPresentation
+  de as PayrollHistoryPresentation
 };
 //# sourceMappingURL=PayrollHistoryPresentation.js.map

package/dist/components/Payroll/PayrollHistory/PayrollHistoryPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayrollHistoryPresentation.js","sources":["../../../../src/components/Payroll/PayrollHistory/PayrollHistoryPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { Payroll } from '@gusto/embedded-api/models/components/payroll'\nimport type { WireInRequest } from '@gusto/embedded-api/models/components/wireinrequest'\nimport { PayrollStatusBadges } from '../PayrollStatusBadges'\nimport { getPayrollType, calculateTotalPayroll, canCancelPayroll } from '../helpers'\nimport type { TimeFilterOption } from './PayrollHistory'\nimport styles from './PayrollHistoryPresentation.module.scss'\nimport type { MenuItem } from '@/components/Common/UI/Menu/MenuTypes'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport TrashcanIcon from '@/assets/icons/trashcan.svg?react'\nimport FileIcon from '@/assets/icons/icon-file-outline.svg?react'\nimport ReceiptIcon from '@/assets/icons/icon-receipt-outline.svg?react'\n\ninterface PayrollHistoryPresentationProps {\n  payrollHistory: Payroll[]\n  wireInRequests: WireInRequest[]\n  selectedTimeFilter: TimeFilterOption\n  onTimeFilterChange: (value: TimeFilterOption) => void\n  onViewSummary: (payrollId: string, startDate?: string, endDate?: string) => void\n  onViewReceipt: (payrollId: string, startDate?: string, endDate?: string) => void\n  onCancelPayroll: (item: Payroll) => void\n  cancelDialogItem: Payroll | null\n  onCancelDialogOpen: (item: Payroll) => void\n  onCancelDialogClose: () => void\n  isLoading?: boolean\n}\n\nexport const PayrollHistoryPresentation = ({\n  payrollHistory,\n  wireInRequests,\n  selectedTimeFilter,\n  onTimeFilterChange,\n  onViewSummary,\n  onViewReceipt,\n  onCancelPayroll,\n  cancelDialogItem,\n  onCancelDialogOpen,\n  onCancelDialogClose,\n  isLoading = false,\n}: PayrollHistoryPresentationProps) => {\n  const { Heading, Text, Select, Dialog } = useComponentContext()\n  useI18n('Payroll.PayrollHistory')\n  const { t } = useTranslation('Payroll.PayrollHistory')\n  const dateFormatter = useDateFormatter()\n\n  const timeFilterOptions = [\n    { value: '3months', label: t('timeFilter.options.3months') },\n    { value: '6months', label: t('timeFilter.options.6months') },\n    { value: 'year', label: t('timeFilter.options.year') },\n  ]\n\n  const formatDeadlineForDialog = (item: Payroll): string => {\n    const deadline = item.payrollDeadline\n    if (!deadline) return ''\n\n    const deadlineDate = new Date(deadline)\n    const timeZone = 'America/New_York'\n\n    const formatter = new Intl.DateTimeFormat('en-US', {\n      weekday: 'short',\n      month: 'short',\n      day: 'numeric',\n      timeZone,\n    })\n\n    const timeFormatter = new Intl.DateTimeFormat('en-US', {\n      hour: 'numeric',\n      minute: '2-digit',\n      timeZoneName: 'short',\n      timeZone,\n    })\n\n    const dateStr = formatter.format(deadlineDate)\n    const timeStr = timeFormatter.format(deadlineDate)\n\n    return `${timeStr} on ${dateStr}`\n  }\n\n  const handleCancelClick = (item: Payroll) => {\n    onCancelDialogOpen(item)\n  }\n\n  const handleConfirmCancel = () => {\n    if (cancelDialogItem) {\n      onCancelPayroll(cancelDialogItem)\n    }\n  }\n\n  const getMenuItems = (item: Payroll): MenuItem[] => {\n    const payrollId = item.payrollUuid || item.uuid!\n    const items: MenuItem[] = [\n      {\n        label: t('menu.viewSummary'),\n        icon: <FileIcon aria-hidden />,\n        onClick: () => {\n          onViewSummary(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n        },\n      },\n      {\n        label: t('menu.viewReceipt'),\n        icon: <ReceiptIcon aria-hidden />,\n        onClick: () => {\n          onViewReceipt(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n        },\n      },\n    ]\n\n    if (canCancelPayroll(item)) {\n      items.push({\n        label: t('menu.cancelPayroll'),\n        icon: <TrashcanIcon aria-hidden />,\n        onClick: () => {\n          handleCancelClick(item)\n        },\n        'data-destructive': 'true',\n      })\n    }\n\n    return items\n  }\n\n  if (payrollHistory.length === 0) {\n    return (\n      <Flex flexDirection=\"column\" alignItems=\"center\" gap={24}>\n        <Heading as=\"h3\">{t('emptyState.title')}</Heading>\n        <Text>{t('emptyState.description')}</Text>\n      </Flex>\n    )\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={16}>\n      <Flex\n        flexDirection={{ base: 'column', medium: 'row' }}\n        justifyContent=\"space-between\"\n        alignItems=\"flex-start\"\n        gap={{ base: 12, medium: 24 }}\n      >\n        <Flex>\n          <Heading as=\"h2\">{t('title')}</Heading>\n        </Flex>\n        <div className={styles.timeFilterContainer}>\n          <Select\n            value={selectedTimeFilter}\n            onChange={(value: string) => {\n              onTimeFilterChange(value as TimeFilterOption)\n            }}\n            options={timeFilterOptions}\n            label={t('timeFilter.placeholder')}\n            shouldVisuallyHideLabel\n            isRequired\n          />\n        </div>\n      </Flex>\n\n      <DataView\n        label={t('dataView.label')}\n        columns={[\n          {\n            title: t('columns.payPeriod'),\n            render: (item: Payroll) =>\n              dateFormatter.formatPayPeriodRange(\n                item.payPeriod?.startDate,\n                item.payPeriod?.endDate,\n              ),\n          },\n          {\n            title: t('columns.type'),\n            render: (item: Payroll) => getPayrollType(item),\n          },\n          {\n            title: t('columns.payDate'),\n            render: (item: Payroll) => dateFormatter.formatShortWithYear(item.checkDate),\n          },\n          {\n            title: t('columns.status'),\n            render: (item: Payroll) => {\n              const wireInRequest = wireInRequests.find(\n                wire => wire.paymentUuid === item.payrollUuid,\n              )\n              return <PayrollStatusBadges payroll={item} wireInRequest={wireInRequest} />\n            },\n          },\n          {\n            title: t('columns.totalPayroll'),\n            render: (item: Payroll) => formatNumberAsCurrency(calculateTotalPayroll(item)),\n          },\n        ]}\n        data={payrollHistory}\n        itemMenu={(item: Payroll) => <HamburgerMenu items={getMenuItems(item)} />}\n      />\n\n      <Dialog\n        isOpen={!!cancelDialogItem}\n        onClose={onCancelDialogClose}\n        onPrimaryActionClick={handleConfirmCancel}\n        isDestructive\n        isPrimaryActionLoading={isLoading}\n        primaryActionLabel={t('cancelDialog.primaryAction')}\n        closeActionLabel={t('cancelDialog.secondaryAction')}\n        title={\n          cancelDialogItem\n            ? t('cancelDialog.title', {\n                payPeriod: dateFormatter.formatPayPeriodRange(\n                  cancelDialogItem.payPeriod?.startDate,\n                  cancelDialogItem.payPeriod?.endDate,\n                ),\n              })\n            : ''\n        }\n      >\n        {cancelDialogItem && (\n          <Flex flexDirection=\"column\" gap={16}>\n            <Text>{t('cancelDialog.body')}</Text>\n            {cancelDialogItem.payrollDeadline && (\n              <Text>\n                {t('cancelDialog.deadline', {\n                  deadline: formatDeadlineForDialog(cancelDialogItem),\n                })}\n              </Text>\n            )}\n          </Flex>\n        )}\n      </Dialog>\n    </Flex>\n  )\n}\n"],"names":["PayrollHistoryPresentation","payrollHistory","wireInRequests","selectedTimeFilter","onTimeFilterChange","onViewSummary","onViewReceipt","onCancelPayroll","cancelDialogItem","onCancelDialogOpen","onCancelDialogClose","isLoading","Heading","Text","Select","Dialog","useComponentContext","useI18n","useTranslation","dateFormatter","useDateFormatter","timeFilterOptions","formatDeadlineForDialog","item","deadline","deadlineDate","timeZone","formatter","timeFormatter","dateStr","handleCancelClick","handleConfirmCancel","getMenuItems","payrollId","items","jsx","FileIcon","ReceiptIcon","canCancelPayroll","TrashcanIcon","Flex","jsxs","styles","value","DataView","getPayrollType","wireInRequest","wire","PayrollStatusBadges","formatNumberAsCurrency","calculateTotalPayroll","HamburgerMenu"],"mappings":"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"}
+{"version":3,"file":"PayrollHistoryPresentation.js","sources":["../../../../src/components/Payroll/PayrollHistory/PayrollHistoryPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { Payroll } from '@gusto/embedded-api/models/components/payroll'\nimport type { WireInRequest } from '@gusto/embedded-api/models/components/wireinrequest'\nimport { PayrollStatusBadges } from '../PayrollStatusBadges'\nimport { getPayrollType, calculateTotalPayroll, canCancelPayroll } from '../helpers'\nimport type { TimeFilterOption } from './PayrollHistory'\nimport styles from './PayrollHistoryPresentation.module.scss'\nimport type { MenuItem } from '@/components/Common/UI/Menu/MenuTypes'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport TrashcanIcon from '@/assets/icons/trashcan.svg?react'\nimport FileIcon from '@/assets/icons/icon-file-outline.svg?react'\nimport ReceiptIcon from '@/assets/icons/icon-receipt-outline.svg?react'\n\ninterface PayrollHistoryPresentationProps {\n  payrollHistory: Payroll[]\n  wireInRequests: WireInRequest[]\n  selectedTimeFilter: TimeFilterOption\n  onTimeFilterChange: (value: TimeFilterOption) => void\n  onViewSummary: (payrollId: string, startDate?: string, endDate?: string) => void\n  onViewReceipt: (payrollId: string, startDate?: string, endDate?: string) => void\n  onCancelPayroll: (item: Payroll) => void\n  cancelDialogItem: Payroll | null\n  onCancelDialogOpen: (item: Payroll) => void\n  onCancelDialogClose: () => void\n  isLoading?: boolean\n}\n\nexport const PayrollHistoryPresentation = ({\n  payrollHistory,\n  wireInRequests,\n  selectedTimeFilter,\n  onTimeFilterChange,\n  onViewSummary,\n  onViewReceipt,\n  onCancelPayroll,\n  cancelDialogItem,\n  onCancelDialogOpen,\n  onCancelDialogClose,\n  isLoading = false,\n}: PayrollHistoryPresentationProps) => {\n  const { Heading, Text, Select, Dialog } = useComponentContext()\n  useI18n('Payroll.PayrollHistory')\n  const { t } = useTranslation('Payroll.PayrollHistory')\n  const dateFormatter = useDateFormatter()\n\n  const timeFilterOptions = [\n    { value: '3months', label: t('timeFilter.options.3months') },\n    { value: '6months', label: t('timeFilter.options.6months') },\n    { value: 'year', label: t('timeFilter.options.year') },\n  ]\n\n  const formatDeadlineForDialog = (item: Payroll): string => {\n    const deadline = item.payrollDeadline\n    if (!deadline) return ''\n\n    const deadlineDate = new Date(deadline)\n    const timeZone = 'America/New_York'\n\n    const formatter = new Intl.DateTimeFormat('en-US', {\n      weekday: 'short',\n      month: 'short',\n      day: 'numeric',\n      timeZone,\n    })\n\n    const timeFormatter = new Intl.DateTimeFormat('en-US', {\n      hour: 'numeric',\n      minute: '2-digit',\n      timeZoneName: 'short',\n      timeZone,\n    })\n\n    const dateStr = formatter.format(deadlineDate)\n    const timeStr = timeFormatter.format(deadlineDate)\n\n    return `${timeStr} on ${dateStr}`\n  }\n\n  const handleCancelClick = (item: Payroll) => {\n    onCancelDialogOpen(item)\n  }\n\n  const handleConfirmCancel = () => {\n    if (cancelDialogItem) {\n      onCancelPayroll(cancelDialogItem)\n    }\n  }\n\n  const getMenuItems = (item: Payroll): MenuItem[] => {\n    const payrollId = item.payrollUuid || item.uuid!\n    const items: MenuItem[] = [\n      {\n        label: t('menu.viewSummary'),\n        icon: <FileIcon aria-hidden />,\n        onClick: () => {\n          onViewSummary(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n        },\n      },\n      {\n        label: t('menu.viewReceipt'),\n        icon: <ReceiptIcon aria-hidden />,\n        onClick: () => {\n          onViewReceipt(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n        },\n      },\n    ]\n\n    if (canCancelPayroll(item)) {\n      items.push({\n        label: t('menu.cancelPayroll'),\n        icon: <TrashcanIcon aria-hidden />,\n        onClick: () => {\n          handleCancelClick(item)\n        },\n        'data-destructive': 'true',\n      })\n    }\n\n    return items\n  }\n\n  if (payrollHistory.length === 0) {\n    return (\n      <Flex flexDirection=\"column\" alignItems=\"center\" gap={24}>\n        <Heading as=\"h3\">{t('emptyState.title')}</Heading>\n        <Text>{t('emptyState.description')}</Text>\n      </Flex>\n    )\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={16}>\n      <Flex\n        flexDirection={{ base: 'column', medium: 'row' }}\n        justifyContent=\"space-between\"\n        alignItems=\"flex-start\"\n        gap={{ base: 12, medium: 24 }}\n      >\n        <Flex>\n          <Heading as=\"h2\">{t('title')}</Heading>\n        </Flex>\n        <div className={styles.timeFilterContainer}>\n          <Select\n            value={selectedTimeFilter}\n            onChange={(value: string) => {\n              onTimeFilterChange(value as TimeFilterOption)\n            }}\n            options={timeFilterOptions}\n            label={t('timeFilter.placeholder')}\n            shouldVisuallyHideLabel\n            isRequired\n          />\n        </div>\n      </Flex>\n\n      <DataView\n        label={t('dataView.label')}\n        columns={[\n          {\n            title: t('columns.payPeriod'),\n            render: (item: Payroll) =>\n              dateFormatter.formatPayPeriodRange(\n                item.payPeriod?.startDate,\n                item.payPeriod?.endDate,\n              ),\n          },\n          {\n            title: t('columns.type'),\n            render: (item: Payroll) => getPayrollType(item),\n          },\n          {\n            title: t('columns.payDate'),\n            render: (item: Payroll) => dateFormatter.formatShortWithYear(item.checkDate),\n          },\n          {\n            title: t('columns.status'),\n            render: (item: Payroll) => {\n              const wireInRequest = wireInRequests.find(\n                wire => wire.paymentUuid === item.payrollUuid,\n              )\n              return <PayrollStatusBadges payroll={item} wireInRequest={wireInRequest} />\n            },\n          },\n          {\n            title: t('columns.totalPayroll'),\n            render: (item: Payroll) => formatNumberAsCurrency(calculateTotalPayroll(item)),\n          },\n        ]}\n        data={payrollHistory}\n        itemMenu={(item: Payroll) => <HamburgerMenu items={getMenuItems(item)} />}\n      />\n\n      <Dialog\n        isOpen={!!cancelDialogItem}\n        onClose={onCancelDialogClose}\n        onPrimaryActionClick={handleConfirmCancel}\n        isDestructive\n        isPrimaryActionLoading={isLoading}\n        primaryActionLabel={t('cancelDialog.primaryAction')}\n        closeActionLabel={t('cancelDialog.secondaryAction')}\n        title={\n          cancelDialogItem\n            ? t('cancelDialog.title', {\n                payPeriod: dateFormatter.formatPayPeriodRange(\n                  cancelDialogItem.payPeriod?.startDate,\n                  cancelDialogItem.payPeriod?.endDate,\n                ),\n              })\n            : ''\n        }\n      >\n        {cancelDialogItem && (\n          <Flex flexDirection=\"column\" gap={16}>\n            <Text>{t('cancelDialog.body')}</Text>\n            {cancelDialogItem.payrollDeadline && (\n              <Text>\n                {t('cancelDialog.deadline', {\n                  deadline: formatDeadlineForDialog(cancelDialogItem),\n                })}\n              </Text>\n            )}\n          </Flex>\n        )}\n      </Dialog>\n    </Flex>\n  )\n}\n"],"names":["PayrollHistoryPresentation","payrollHistory","wireInRequests","selectedTimeFilter","onTimeFilterChange","onViewSummary","onViewReceipt","onCancelPayroll","cancelDialogItem","onCancelDialogOpen","onCancelDialogClose","isLoading","Heading","Text","Select","Dialog","useComponentContext","useI18n","useTranslation","dateFormatter","useDateFormatter","timeFilterOptions","formatDeadlineForDialog","item","deadline","deadlineDate","timeZone","formatter","timeFormatter","dateStr","handleCancelClick","handleConfirmCancel","getMenuItems","payrollId","items","jsx","FileIcon","ReceiptIcon","canCancelPayroll","TrashcanIcon","Flex","jsxs","styles","value","DataView","getPayrollType","wireInRequest","wire","PayrollStatusBadges","formatNumberAsCurrency","calculateTotalPayroll","HamburgerMenu"],"mappings":"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"}

package/dist/components/Payroll/PayrollList/PayrollListPresentation.js

@@ -1,10 +1,12 @@
 import { jsx as a, jsxs as u } from "react/jsx-runtime";
-import { useRef as q, useState as E } from "react";
-import { useTranslation as V } from "react-i18next";
-import { getPayrollType as $ } from "../helpers.js";
+import { useRef as q, useState as z } from "react";
+import { useTranslation as E } from "react-i18next";
+import { getPayrollType as V } from "../helpers.js";
 import m from "./PayrollListPresentation.module.scss.js";
 import { Flex as i } from "../../Common/Flex/Flex.js";
-import { HamburgerMenu as z } from "../../Common/HamburgerMenu/HamburgerMenu.js";
+import "classnames";
+import "../../../shared/constants.js";
+import { HamburgerMenu as $ } from "../../Common/HamburgerMenu/HamburgerMenu.js";
 import { useComponentContext as G } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as J } from "../../../i18n/I18n.js";
 import { formatDateToStringDate as K } from "../../../helpers/dateFormatting.js";
@@ -13,7 +15,7 @@ import X from "../../../assets/icons/feature-icon-check.svg.js";
 import { useContainerBreakpoints as Z } from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
 import { PayrollStatusBadges as _ } from "../PayrollStatusBadges/PayrollStatusBadges.js";
 import { DataView as ee } from "../../Common/DataView/DataView.js";
-const ge = ({
+const De = ({
   onRunPayroll: I,
   onSubmitPayroll: w,
   onSkipPayroll: H,
@@ -27,7 +29,7 @@ const ge = ({
 }) => {
   const { Button: P, Dialog: W, Heading: B, Text: p, Alert: F } = G();
   J("Payroll.PayrollList");
-  const { t } = V("Payroll.PayrollList"), n = Q(), g = q(null), h = Z({ ref: g }).includes("large"), [s, D] = E({
+  const { t } = E("Payroll.PayrollList"), n = Q(), g = q(null), h = Z({ ref: g }).includes("large"), [s, D] = z({
     isOpen: !1,
     payrollId: null,
     payPeriod: null
@@ -46,18 +48,18 @@ const ge = ({
   }, j = () => {
     s.payrollId && (H({ payrollUuid: s.payrollId }), b());
   }, S = (e, r) => {
-    const o = n.formatShort(e), l = n.formatShortWithYear(r);
+    const l = n.formatShort(e), o = n.formatShortWithYear(r);
     return {
-      startDate: o,
-      endDate: l,
+      startDate: l,
+      endDate: o,
       fullPeriod: n.formatPayPeriodRange(e, r, { useShortMonth: !0 })
     };
   }, k = (e) => {
-    const { payrollUuid: r, calculatedAt: o, processed: l, payPeriod: c } = e;
-    if (l)
+    const { payrollUuid: r, calculatedAt: l, processed: o, payPeriod: c } = e;
+    if (o)
       return null;
     const d = f === r;
-    return o ? /* @__PURE__ */ a(
+    return l ? /* @__PURE__ */ a(
       P,
       {
         isLoading: d,
@@ -112,21 +114,21 @@ const ge = ({
         columns: [
           {
             render: ({ payPeriod: e }) => {
-              const { startDate: r, endDate: o } = S(
+              const { startDate: r, endDate: l } = S(
                 e?.startDate,
                 e?.endDate
               );
               return /* @__PURE__ */ u("div", { className: m.payPeriodCell, children: [
                 r,
                 " - ",
-                o,
-                /* @__PURE__ */ a(p, { variant: "supporting", children: y.find((l) => l.uuid === e?.payScheduleUuid)?.name || y.find((l) => l.uuid === e?.payScheduleUuid)?.customName })
+                l,
+                /* @__PURE__ */ a(p, { variant: "supporting", size: "sm", children: y.find((o) => o.uuid === e?.payScheduleUuid)?.name || y.find((o) => o.uuid === e?.payScheduleUuid)?.customName })
               ] });
             },
             title: t("tableHeaders.0")
           },
           {
-            render: (e) => /* @__PURE__ */ a(p, { children: t(`type.${$(e)}`) }),
+            render: (e) => /* @__PURE__ */ a(p, { children: t(`type.${V(e)}`) }),
             title: t("tableHeaders.1")
           },
           {
@@ -141,7 +143,7 @@ const ge = ({
             title: t("tableHeaders.4"),
             render: (e) => {
               const r = N.find(
-                (o) => o.paymentUuid === e.payrollUuid
+                (l) => l.paymentUuid === e.payrollUuid
               );
               return /* @__PURE__ */ a(_, { payroll: e, wireInRequest: r });
             }
@@ -158,14 +160,14 @@ const ge = ({
         ],
         label: t("payrollsListLabel"),
         itemMenu: (e) => {
-          const { payrollUuid: r, processed: o, payPeriod: l } = e;
-          if (o)
+          const { payrollUuid: r, processed: l, payPeriod: o } = e;
+          if (l)
             return null;
           const c = f === r, { fullPeriod: d } = S(
-            l?.startDate,
-            l?.endDate
-          ), C = K(/* @__PURE__ */ new Date()), L = C ? new Date(C) : null, x = l?.startDate ? new Date(l.startDate) : null, Y = T.length === 0 && L && x && L >= x, A = h ? k(e) : null, v = Y ? /* @__PURE__ */ a(
-            z,
+            o?.startDate,
+            o?.endDate
+          ), C = K(/* @__PURE__ */ new Date()), L = C ? new Date(C) : null, x = o?.startDate ? new Date(o.startDate) : null, Y = T.length === 0 && L && x && L >= x, A = h ? k(e) : null, v = Y ? /* @__PURE__ */ a(
+            $,
             {
               isLoading: c,
               menuLabel: t("payrollMenuLabel"),
@@ -202,6 +204,6 @@ const ge = ({
   ] }) });
 };
 export {
-  ge as PayrollListPresentation
+  De as PayrollListPresentation
 };
 //# sourceMappingURL=PayrollListPresentation.js.map