@gusto/embedded-react-sdk 0.14.0 → 0.15.0

package/dist/components/Payroll/PayrollBlocker/PayrollBlocker.js

@@ -0,0 +1,32 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useTranslation as y } from "react-i18next";
+import { usePayrollsGetBlockersSuspense as k } from "@gusto/embedded-api/react-query/payrollsGetBlockers";
+import { PayrollBlockerList as f } from "./components/PayrollBlockerList.js";
+import { getBlockerTranslationKeys as B } from "./payrollHelpers.js";
+import { BaseComponent as d } from "../../Base/Base.js";
+import { useComponentDictionary as P, useI18n as g } from "../../../i18n/I18n.js";
+function U(o) {
+  return /* @__PURE__ */ t(d, { ...o, children: /* @__PURE__ */ t(K, { ...o, children: o.children }) });
+}
+function K({ className: o, dictionary: i, companyId: s }) {
+  P("PayrollBlocker", i), g("PayrollBlocker");
+  const { t: e } = y("PayrollBlocker"), { data: a } = k({
+    companyUuid: s
+  }), l = (a.payrollBlockerList ?? []).map((n) => {
+    const r = n.key ?? "unknown", c = B(r), m = e(c.titleKey, {
+      defaultValue: r.replace(/_/g, " ").replace(/\b\w/g, (u) => u.toUpperCase())
+    }), p = e(c.descriptionKey, {
+      defaultValue: n.message || e("defaultBlockerDescription")
+    });
+    return {
+      id: r,
+      title: m,
+      description: p
+    };
+  });
+  return l.length === 0 ? null : /* @__PURE__ */ t(f, { className: o, blockers: l });
+}
+export {
+  U as PayrollBlocker
+};
+//# sourceMappingURL=PayrollBlocker.js.map

package/dist/components/Payroll/PayrollBlocker/PayrollBlocker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PayrollBlocker.js","sources":["../../../../src/components/Payroll/PayrollBlocker/PayrollBlocker.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { usePayrollsGetBlockersSuspense } from '@gusto/embedded-api/react-query/payrollsGetBlockers'\nimport { PayrollBlockerList, type PayrollBlocker } from './components/PayrollBlockerList'\nimport { getBlockerTranslationKeys } from './payrollHelpers'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base/Base'\nimport { useComponentDictionary, useI18n } from '@/i18n'\n\ninterface PayrollBlockerProps extends BaseComponentInterface<'PayrollBlocker'> {\n  companyId: string\n}\n\nexport function PayrollBlocker(props: PayrollBlockerProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nfunction Root({ className, dictionary, companyId }: PayrollBlockerProps) {\n  useComponentDictionary('PayrollBlocker', dictionary)\n  useI18n('PayrollBlocker')\n  const { t } = useTranslation('PayrollBlocker')\n\n  const { data } = usePayrollsGetBlockersSuspense({\n    companyUuid: companyId,\n  })\n\n  const payrollBlockerList = data.payrollBlockerList ?? []\n\n  const blockers: PayrollBlocker[] = payrollBlockerList.map(blocker => {\n    const blockerKey = blocker.key ?? 'unknown'\n    const translationKeys = getBlockerTranslationKeys(blockerKey)\n\n    const title = t(translationKeys.titleKey, {\n      defaultValue: blockerKey.replace(/_/g, ' ').replace(/\\b\\w/g, letter => letter.toUpperCase()),\n    })\n\n    const description = t(translationKeys.descriptionKey, {\n      defaultValue: blocker.message || t('defaultBlockerDescription'),\n    })\n\n    return {\n      id: blockerKey,\n      title,\n      description,\n    }\n  })\n\n  if (blockers.length === 0) {\n    return null\n  }\n\n  return <PayrollBlockerList className={className} blockers={blockers} />\n}\n"],"names":["PayrollBlocker","props","jsx","BaseComponent","Root","className","dictionary","companyId","useComponentDictionary","useI18n","t","useTranslation","data","usePayrollsGetBlockersSuspense","blockers","blocker","blockerKey","translationKeys","getBlockerTranslationKeys","title","letter","description","PayrollBlockerList"],"mappings":";;;;;;;AAWO,SAASA,EAAeC,GAA4B;AACzD,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GACjB,UAAA,gBAAAC,EAACE,KAAM,GAAGH,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,SAASG,EAAK,EAAE,WAAAC,GAAW,YAAAC,GAAY,WAAAC,KAAkC;AACvE,EAAAC,EAAuB,kBAAkBF,CAAU,GACnDG,EAAQ,gBAAgB;AACxB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,gBAAgB,GAEvC,EAAE,MAAAC,EAAA,IAASC,EAA+B;AAAA,IAC9C,aAAaN;AAAA,EAAA,CACd,GAIKO,KAFqBF,EAAK,sBAAsB,CAAA,GAEA,IAAI,CAAAG,MAAW;AACnE,UAAMC,IAAaD,EAAQ,OAAO,WAC5BE,IAAkBC,EAA0BF,CAAU,GAEtDG,IAAQT,EAAEO,EAAgB,UAAU;AAAA,MACxC,cAAcD,EAAW,QAAQ,MAAM,GAAG,EAAE,QAAQ,SAAS,CAAAI,MAAUA,EAAO,YAAA,CAAa;AAAA,IAAA,CAC5F,GAEKC,IAAcX,EAAEO,EAAgB,gBAAgB;AAAA,MACpD,cAAcF,EAAQ,WAAWL,EAAE,2BAA2B;AAAA,IAAA,CAC/D;AAED,WAAO;AAAA,MACL,IAAIM;AAAA,MACJ,OAAAG;AAAA,MACA,aAAAE;AAAA,IAAA;AAAA,EAEJ,CAAC;AAED,SAAIP,EAAS,WAAW,IACf,OAGF,gBAAAZ,EAACoB,GAAA,EAAmB,WAAAjB,GAAsB,UAAAS,EAAA,CAAoB;AACvE;"}

package/dist/components/Payroll/PayrollBlocker/{PayrollBlockerAlerts.d.ts → components/PayrollBlockerAlerts.d.ts}

@@ -1,4 +1,4 @@
-import { ApiPayrollBlocker } from './payrollHelpers';
+import { ApiPayrollBlocker } from '../payrollHelpers';
 interface PayrollBlockerAlertsProps {
     blockers: ApiPayrollBlocker[];
     className?: string;

package/dist/components/Payroll/PayrollBlocker/{PayrollBlockerAlerts.js → components/PayrollBlockerAlerts.js}

@@ -1,27 +1,28 @@
-import { jsx as l, jsxs as d } from "react/jsx-runtime";
+import { jsx as l, jsxs as m } from "react/jsx-runtime";
 import { useTranslation as v } from "react-i18next";
-import { getBlockerTranslationKeys as A } from "./payrollHelpers.js";
-import { useComponentContext as C } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { Flex as m } from "../../Common/Flex/Flex.js";
+import { getBlockerTranslationKeys as A } from "../payrollHelpers.js";
+import { useComponentContext as C } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { Flex as d } from "../../../Common/Flex/Flex.js";
 import "classnames";
-import "../../../shared/constants.js";
-import { useI18n as D } from "../../../i18n/I18n.js";
-function F({
-  blockers: n,
+import "../../../../shared/constants.js";
+import "react";
+import { useI18n as D } from "../../../../i18n/I18n.js";
+function H({
+  blockers: o,
   onMultipleViewClick: i,
   multipleViewLabel: h,
   className: s
 }) {
   D("PayrollBlocker");
   const { t: e } = v("PayrollBlocker"), { Alert: c, Button: f, Text: a, UnorderedList: x } = C();
-  if (n.length === 0)
+  if (o.length === 0)
     return null;
-  const g = n.length > 1, p = n.map((r) => {
-    const o = A(r.key), B = e(o.titleKey, {
+  const g = o.length > 1, p = o.map((r) => {
+    const n = A(r.key), B = e(n.titleKey, {
       defaultValue: r.key.replace(/_/g, " ").replace(/\b\w/g, (K) => K.toUpperCase())
-    }), T = e(o.descriptionKey, {
+    }), T = e(n.descriptionKey, {
       defaultValue: r.message || e("defaultBlockerDescription")
-    }), k = e(o.helpTextKey, { defaultValue: e("defaultBlockerHelpText") });
+    }), k = e(n.helpTextKey, { defaultValue: e("defaultBlockerHelpText") });
     return {
       ...r,
       title: B,
@@ -30,7 +31,7 @@ function F({
     };
   }), t = p[0];
   if (!g && t)
-    return /* @__PURE__ */ l(c, { status: "error", label: t.title, className: s, children: /* @__PURE__ */ d(m, { flexDirection: "column", gap: 8, children: [
+    return /* @__PURE__ */ l(c, { status: "error", label: t.title, className: s, children: /* @__PURE__ */ m(d, { flexDirection: "column", gap: 8, children: [
       /* @__PURE__ */ l(a, { children: t.description }),
       t.helpText && t.helpText !== t.description && /* @__PURE__ */ l(a, { variant: "supporting", size: "sm", children: t.helpText })
     ] }) });
@@ -39,9 +40,9 @@ function F({
     c,
     {
       status: "error",
-      label: e("multipleIssuesTitle", { count: n.length }),
+      label: e("multipleIssuesTitle", { count: o.length }),
       className: s,
-      children: /* @__PURE__ */ d(m, { flexDirection: "column", gap: 16, children: [
+      children: /* @__PURE__ */ m(d, { flexDirection: "column", gap: 16, children: [
         /* @__PURE__ */ l(x, { items: y }),
         i && /* @__PURE__ */ l("div", { children: /* @__PURE__ */ l(f, { variant: "secondary", onClick: i, title: u, children: u }) })
       ] })
@@ -49,6 +50,6 @@ function F({
   );
 }
 export {
-  F as PayrollBlockerAlerts
+  H as PayrollBlockerAlerts
 };
 //# sourceMappingURL=PayrollBlockerAlerts.js.map

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerAlerts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PayrollBlockerAlerts.js","sources":["../../../../../src/components/Payroll/PayrollBlocker/components/PayrollBlockerAlerts.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { type ApiPayrollBlocker, getBlockerTranslationKeys } from '../payrollHelpers'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex } from '@/components/Common'\nimport { useI18n } from '@/i18n'\n\ninterface PayrollBlockerAlertsProps {\n  blockers: ApiPayrollBlocker[]\n  className?: string\n  onMultipleViewClick?: () => void\n  multipleViewLabel?: string\n}\n\n/**\n * PayrollBlockerAlerts - Alert-style component for inline blocker display\n * Shows single blocker as alert, or multiple blockers as summary with \"Review\" button\n * Returns null for empty blocker arrays\n */\nexport function PayrollBlockerAlerts({\n  blockers,\n  onMultipleViewClick,\n  multipleViewLabel,\n  className,\n}: PayrollBlockerAlertsProps) {\n  useI18n('PayrollBlocker')\n  const { t } = useTranslation('PayrollBlocker')\n  const { Alert, Button, Text, UnorderedList } = useComponentContext()\n\n  // Return null for empty blockers array\n  if (blockers.length === 0) {\n    return null\n  }\n\n  const hasMultipleBlockers = blockers.length > 1\n\n  const enrichedBlockers = blockers.map(blocker => {\n    const translationKeys = getBlockerTranslationKeys(blocker.key)\n\n    const title = t(translationKeys.titleKey, {\n      defaultValue: blocker.key.replace(/_/g, ' ').replace(/\\b\\w/g, l => l.toUpperCase()),\n    })\n    const description = t(translationKeys.descriptionKey, {\n      defaultValue: blocker.message || t('defaultBlockerDescription'),\n    })\n    const helpText = t(translationKeys.helpTextKey, { defaultValue: t('defaultBlockerHelpText') })\n\n    return {\n      ...blocker,\n      title,\n      description,\n      helpText,\n    }\n  })\n\n  const singleBlocker = enrichedBlockers[0]\n\n  if (!hasMultipleBlockers && singleBlocker) {\n    return (\n      <Alert status=\"error\" label={singleBlocker.title} className={className}>\n        <Flex flexDirection=\"column\" gap={8}>\n          <Text>{singleBlocker.description}</Text>\n          {singleBlocker.helpText && singleBlocker.helpText !== singleBlocker.description && (\n            <Text variant=\"supporting\" size=\"sm\">\n              {singleBlocker.helpText}\n            </Text>\n          )}\n        </Flex>\n      </Alert>\n    )\n  }\n\n  const listItems = enrichedBlockers.map(blocker => blocker.title)\n  const defaultMultipleLabel = multipleViewLabel || t('viewAllBlockers')\n\n  return (\n    <Alert\n      status=\"error\"\n      label={t('multipleIssuesTitle', { count: blockers.length })}\n      className={className}\n    >\n      <Flex flexDirection=\"column\" gap={16}>\n        <UnorderedList items={listItems} />\n        {onMultipleViewClick && (\n          <div>\n            <Button variant=\"secondary\" onClick={onMultipleViewClick} title={defaultMultipleLabel}>\n              {defaultMultipleLabel}\n            </Button>\n          </div>\n        )}\n      </Flex>\n    </Alert>\n  )\n}\n"],"names":["PayrollBlockerAlerts","blockers","onMultipleViewClick","multipleViewLabel","className","useI18n","t","useTranslation","Alert","Button","Text","UnorderedList","useComponentContext","hasMultipleBlockers","enrichedBlockers","blocker","translationKeys","getBlockerTranslationKeys","title","l","description","helpText","singleBlocker","jsx","jsxs","Flex","listItems","defaultMultipleLabel"],"mappings":";;;;;;;;;AAkBO,SAASA,EAAqB;AAAA,EACnC,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,WAAAC;AACF,GAA8B;AAC5B,EAAAC,EAAQ,gBAAgB;AACxB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,gBAAgB,GACvC,EAAE,OAAAC,GAAO,QAAAC,GAAQ,MAAAC,GAAM,eAAAC,EAAA,IAAkBC,EAAA;AAG/C,MAAIX,EAAS,WAAW;AACtB,WAAO;AAGT,QAAMY,IAAsBZ,EAAS,SAAS,GAExCa,IAAmBb,EAAS,IAAI,CAAAc,MAAW;AAC/C,UAAMC,IAAkBC,EAA0BF,EAAQ,GAAG,GAEvDG,IAAQZ,EAAEU,EAAgB,UAAU;AAAA,MACxC,cAAcD,EAAQ,IAAI,QAAQ,MAAM,GAAG,EAAE,QAAQ,SAAS,CAAAI,MAAKA,EAAE,YAAA,CAAa;AAAA,IAAA,CACnF,GACKC,IAAcd,EAAEU,EAAgB,gBAAgB;AAAA,MACpD,cAAcD,EAAQ,WAAWT,EAAE,2BAA2B;AAAA,IAAA,CAC/D,GACKe,IAAWf,EAAEU,EAAgB,aAAa,EAAE,cAAcV,EAAE,wBAAwB,GAAG;AAE7F,WAAO;AAAA,MACL,GAAGS;AAAA,MACH,OAAAG;AAAA,MACA,aAAAE;AAAA,MACA,UAAAC;AAAA,IAAA;AAAA,EAEJ,CAAC,GAEKC,IAAgBR,EAAiB,CAAC;AAExC,MAAI,CAACD,KAAuBS;AAC1B,WACE,gBAAAC,EAACf,GAAA,EAAM,QAAO,SAAQ,OAAOc,EAAc,OAAO,WAAAlB,GAChD,UAAA,gBAAAoB,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAF,EAACb,GAAA,EAAM,YAAc,YAAA,CAAY;AAAA,MAChCY,EAAc,YAAYA,EAAc,aAAaA,EAAc,eAClE,gBAAAC,EAACb,GAAA,EAAK,SAAQ,cAAa,MAAK,MAC7B,YAAc,SAAA,CACjB;AAAA,IAAA,EAAA,CAEJ,EAAA,CACF;AAIJ,QAAMgB,IAAYZ,EAAiB,IAAI,CAAAC,MAAWA,EAAQ,KAAK,GACzDY,IAAuBxB,KAAqBG,EAAE,iBAAiB;AAErE,SACE,gBAAAiB;AAAA,IAACf;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,OAAOF,EAAE,uBAAuB,EAAE,OAAOL,EAAS,QAAQ;AAAA,MAC1D,WAAAG;AAAA,MAEA,UAAA,gBAAAoB,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,QAAA,gBAAAF,EAACZ,GAAA,EAAc,OAAOe,EAAA,CAAW;AAAA,QAChCxB,KACC,gBAAAqB,EAAC,OAAA,EACC,UAAA,gBAAAA,EAACd,GAAA,EAAO,SAAQ,aAAY,SAASP,GAAqB,OAAOyB,GAC9D,UAAAA,EAAA,CACH,EAAA,CACF;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerList.js

@@ -0,0 +1,41 @@
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+import { useTranslation as p } from "react-i18next";
+import f from "classnames";
+import u from "./PayrollBlockerList.module.scss.js";
+import { useComponentContext as h } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { FlexItem as x, Flex as i } from "../../../Common/Flex/Flex.js";
+import "../../../../shared/constants.js";
+import "react";
+import { DataView as g } from "../../../Common/DataView/DataView.js";
+import { useDataView as y } from "../../../Common/DataView/useDataView.js";
+import { useI18n as b } from "../../../../i18n/I18n.js";
+function V({ blockers: l, className: a }) {
+  b("PayrollBlocker");
+  const { t: o } = p("PayrollBlocker"), { Button: c, Text: n, Heading: m } = h(), d = y({
+    data: l,
+    columns: [
+      {
+        title: o("blockerSectionLabel"),
+        render: (t) => /* @__PURE__ */ e(x, { flexGrow: 1, children: /* @__PURE__ */ s(i, { flexDirection: "column", gap: 8, children: [
+          /* @__PURE__ */ e(n, { weight: "semibold", children: t.title }),
+          /* @__PURE__ */ e(n, { variant: "supporting", children: t.description })
+        ] }) })
+      },
+      {
+        title: "",
+        render: (t) => {
+          const r = t.action;
+          return r ? /* @__PURE__ */ e(i, { justifyContent: "flex-end", alignItems: "center", children: /* @__PURE__ */ e(c, { variant: "secondary", onClick: r.onClick, title: r.label, children: r.label }) }) : null;
+        }
+      }
+    ]
+  });
+  return l.length === 0 ? null : /* @__PURE__ */ e("div", { className: f(u.root, a), children: /* @__PURE__ */ s(i, { flexDirection: "column", gap: 24, children: [
+    /* @__PURE__ */ e(m, { as: "h2", styledAs: "h4", children: o("blockersListTitle") }),
+    /* @__PURE__ */ e(g, { ...d, label: o("blockersListTitle") })
+  ] }) });
+}
+export {
+  V as PayrollBlockerList
+};
+//# sourceMappingURL=PayrollBlockerList.js.map

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PayrollBlockerList.js","sources":["../../../../../src/components/Payroll/PayrollBlocker/components/PayrollBlockerList.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport styles from './PayrollBlockerList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, FlexItem } from '@/components/Common'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { useI18n } from '@/i18n'\n\nexport interface PayrollBlocker {\n  id: string\n  title: string\n  description: string\n  action?: {\n    label: string\n    onClick: () => void\n  }\n}\n\ninterface PayrollBlockerListProps {\n  blockers: PayrollBlocker[]\n  className?: string\n}\n\n/**\n * PayrollBlockerList - DataView-based component displaying payroll blockers\n * Shows each blocker with individual resolution buttons\n */\nexport function PayrollBlockerList({ blockers, className }: PayrollBlockerListProps) {\n  useI18n('PayrollBlocker')\n  const { t } = useTranslation('PayrollBlocker')\n  const { Button, Text, Heading } = useComponentContext()\n\n  const dataViewProps = useDataView({\n    data: blockers,\n    columns: [\n      {\n        title: t('blockerSectionLabel'),\n        render: blocker => (\n          <FlexItem flexGrow={1}>\n            <Flex flexDirection=\"column\" gap={8}>\n              <Text weight=\"semibold\">{blocker.title}</Text>\n              <Text variant=\"supporting\">{blocker.description}</Text>\n            </Flex>\n          </FlexItem>\n        ),\n      },\n      {\n        title: '',\n        render: blocker => {\n          // For presentational purposes, just show the primary action if it exists\n          const action = blocker.action\n\n          if (!action) {\n            return null\n          }\n\n          return (\n            <Flex justifyContent=\"flex-end\" alignItems=\"center\">\n              <Button variant=\"secondary\" onClick={action.onClick} title={action.label}>\n                {action.label}\n              </Button>\n            </Flex>\n          )\n        },\n      },\n    ],\n  })\n\n  if (blockers.length === 0) {\n    return null\n  }\n\n  return (\n    <div className={classNames(styles.root, className)}>\n      <Flex flexDirection=\"column\" gap={24}>\n        <Heading as=\"h2\" styledAs=\"h4\">\n          {t('blockersListTitle')}\n        </Heading>\n\n        <DataView {...dataViewProps} label={t('blockersListTitle')} />\n      </Flex>\n    </div>\n  )\n}\n"],"names":["PayrollBlockerList","blockers","className","useI18n","t","useTranslation","Button","Text","Heading","useComponentContext","dataViewProps","useDataView","blocker","jsx","FlexItem","jsxs","Flex","action","classNames","styles","DataView"],"mappings":";;;;;;;;;;;AA4BO,SAASA,EAAmB,EAAE,UAAAC,GAAU,WAAAC,KAAsC;AACnF,EAAAC,EAAQ,gBAAgB;AACxB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,gBAAgB,GACvC,EAAE,QAAAC,GAAQ,MAAAC,GAAM,SAAAC,EAAA,IAAYC,EAAA,GAE5BC,IAAgBC,EAAY;AAAA,IAChC,MAAMV;AAAA,IACN,SAAS;AAAA,MACP;AAAA,QACE,OAAOG,EAAE,qBAAqB;AAAA,QAC9B,QAAQ,CAAAQ,MACN,gBAAAC,EAACC,GAAA,EAAS,UAAU,GAClB,UAAA,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,UAAA,gBAAAH,EAACN,GAAA,EAAK,QAAO,YAAY,UAAAK,EAAQ,OAAM;AAAA,UACvC,gBAAAC,EAACN,GAAA,EAAK,SAAQ,cAAc,YAAQ,YAAA,CAAY;AAAA,QAAA,EAAA,CAClD,EAAA,CACF;AAAA,MAAA;AAAA,MAGJ;AAAA,QACE,OAAO;AAAA,QACP,QAAQ,CAAAK,MAAW;AAEjB,gBAAMK,IAASL,EAAQ;AAEvB,iBAAKK,sBAKFD,GAAA,EAAK,gBAAe,YAAW,YAAW,UACzC,4BAACV,GAAA,EAAO,SAAQ,aAAY,SAASW,EAAO,SAAS,OAAOA,EAAO,OAChE,UAAAA,EAAO,OACV,EAAA,CACF,IARO;AAAA,QAUX;AAAA,MAAA;AAAA,IACF;AAAA,EACF,CACD;AAED,SAAIhB,EAAS,WAAW,IACf,OAIP,gBAAAY,EAAC,OAAA,EAAI,WAAWK,EAAWC,EAAO,MAAMjB,CAAS,GAC/C,UAAA,gBAAAa,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,IAAA,gBAAAH,EAACL,KAAQ,IAAG,MAAK,UAAS,MACvB,UAAAJ,EAAE,mBAAmB,GACxB;AAAA,sBAECgB,GAAA,EAAU,GAAGV,GAAe,OAAON,EAAE,mBAAmB,EAAA,CAAG;AAAA,EAAA,EAAA,CAC9D,EAAA,CACF;AAEJ;"}

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerList.module.scss.js

@@ -0,0 +1,8 @@
+const o = "_root_gqrwc_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};
+//# sourceMappingURL=PayrollBlockerList.module.scss.js.map

package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerList.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PayrollBlockerList.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/Payroll/PayrollBlocker/index.d.ts

@@ -1,3 +1,5 @@
 import "./types/i18next.d.ts"
-export { PayrollBlockerAlerts } from './PayrollBlockerAlerts';
+export { PayrollBlocker } from './PayrollBlocker';
+export { PayrollBlockerAlerts } from './components/PayrollBlockerAlerts';
+export { PayrollBlockerList } from './components/PayrollBlockerList';
 export type { ApiPayrollBlocker } from './payrollHelpers';

package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.js

@@ -1,90 +1,152 @@
-import { jsx as u } from "react/jsx-runtime";
-import { useState as f, useEffect as E } from "react";
-import { useEmployeesListSuspense as A } from "@gusto/embedded-api/react-query/employeesList";
-import { usePayrollsGetSuspense as D } from "@gusto/embedded-api/react-query/payrollsGet";
-import { usePayrollsCalculateMutation as _ } from "@gusto/embedded-api/react-query/payrollsCalculate";
-import { PayrollProcessingRequestStatus as m } from "@gusto/embedded-api/models/components/payrollprocessingrequest";
-import { useTranslation as b } from "react-i18next";
-import { usePreparedPayrollData as q } from "../usePreparedPayrollData.js";
-import { payrollSubmitHandler as O } from "../PayrollBlocker/payrollHelpers.js";
-import { PayrollConfigurationPresentation as k } from "./PayrollConfigurationPresentation.js";
-import { BaseComponent as B } from "../../Base/Base.js";
-import { componentEvents as c } from "../../../shared/constants.js";
-import { useComponentDictionary as N, useI18n as U } from "../../../i18n/I18n.js";
-import { useBase as Y } from "../../Base/useBase.js";
-const x = (e) => e?.status === m.Calculating, T = (e) => e?.status === m.CalculateSuccess;
-function $(e) {
-  return /* @__PURE__ */ u(B, { ...e, children: /* @__PURE__ */ u(F, { ...e, children: e.children }) });
+import { jsx as g } from "react/jsx-runtime";
+import { useState as P, useMemo as H, useEffect as V } from "react";
+import { useEmployeesListSuspense as G } from "@gusto/embedded-api/react-query/employeesList";
+import { usePayrollsGetSuspense as K } from "@gusto/embedded-api/react-query/payrollsGet";
+import { usePayrollsCalculateMutation as j } from "@gusto/embedded-api/react-query/payrollsCalculate";
+import { PayrollProcessingRequestStatus as d } from "@gusto/embedded-api/models/components/payrollprocessingrequest";
+import { useTranslation as W } from "react-i18next";
+import { usePayrollsUpdateMutation as v } from "@gusto/embedded-api/react-query/payrollsUpdate";
+import { usePreparedPayrollData as z } from "../usePreparedPayrollData.js";
+import { payrollSubmitHandler as J } from "../PayrollBlocker/payrollHelpers.js";
+import { PayrollConfigurationPresentation as Q } from "./PayrollConfigurationPresentation.js";
+import { BaseComponent as X } from "../../Base/Base.js";
+import { componentEvents as o } from "../../../shared/constants.js";
+import { useComponentDictionary as Z, useI18n as $ } from "../../../i18n/I18n.js";
+import { useBase as ee } from "../../Base/useBase.js";
+const te = (t) => t?.status === d.Calculating, se = (t) => t?.status === d.CalculateSuccess;
+function _e(t) {
+  return /* @__PURE__ */ g(X, { ...t, children: /* @__PURE__ */ g(ae, { ...t, children: t.children }) });
 }
-const F = ({
-  onEvent: e,
-  companyId: l,
+const ae = ({
+  onEvent: t,
+  companyId: r,
   payrollId: s,
-  dictionary: y,
-  alerts: P
+  dictionary: E,
+  alerts: R
 }) => {
-  N("Payroll.PayrollConfiguration", y), U("Payroll.PayrollConfiguration");
-  const { t: p } = b("Payroll.PayrollConfiguration"), { baseSubmitHandler: g } = Y(), [o, r] = f(!1), [C, i] = f([]), { data: d } = A({
-    companyId: l
-  }), { data: t } = D(
+  Z("Payroll.PayrollConfiguration", E), $("Payroll.PayrollConfiguration");
+  const { t: f } = W("Payroll.PayrollConfiguration"), { baseSubmitHandler: h } = ee(), S = 10, [C, i] = P(1), [L, _] = P(S), [a, c] = P(!1), [w, m] = P([]), { data: u, isFetching: A } = G({
+    companyId: r,
+    payrollUuid: s,
+    // get back list of employees to specific payroll
+    per: L,
+    page: C,
+    sortBy: "name"
+    // sort alphanumeric by employee last_names
+  }), U = H(() => u.showEmployees?.map((e) => e.uuid) || [], [u.showEmployees]), p = Number(u.httpMeta.response.headers.get("x-total-pages") ?? 1), O = {
+    currentPage: C,
+    handleFirstPage: () => {
+      i(1);
+    },
+    handlePreviousPage: () => {
+      i((e) => Math.max(e - 1, 1));
+    },
+    handleNextPage: () => {
+      i((e) => Math.min(e + 1, p));
+    },
+    handleLastPage: () => {
+      i(p);
+    },
+    handleItemsPerPageChange: (e) => {
+      _(e);
+    },
+    totalPages: p,
+    isFetching: A,
+    itemsPerPage: L
+  }, { data: l } = K(
     {
-      companyId: l,
+      companyId: r,
       payrollId: s,
       include: ["taxes", "benefits", "deductions"]
     },
-    { refetchInterval: o ? 5e3 : !1 }
-  ), { mutateAsync: S } = _(), {
-    preparedPayroll: n,
-    paySchedule: L,
-    isLoading: R
-  } = q({
-    companyId: l,
-    payrollId: s
-  }), h = async () => {
-    i([]), await g({}, async () => {
-      const a = await O(async () => {
-        await S({
+    { refetchInterval: a ? 5e3 : !1 }
+  ), { mutateAsync: x } = j(), { mutateAsync: D, isPending: N } = v(), {
+    preparedPayroll: y,
+    paySchedule: Y,
+    isLoading: B,
+    handlePreparePayroll: b
+  } = z({
+    companyId: r,
+    payrollId: s,
+    employeeUuids: U,
+    sortBy: "last_name"
+    // sort alphanumeric by employee last_names to match employees GET
+  }), q = async () => {
+    m([]), await h({}, async () => {
+      const e = await J(async () => {
+        await x({
           request: {
-            companyId: l,
+            companyId: r,
             payrollId: s
           }
-        }), r(!0);
+        }), c(!0);
+      });
+      !e.success && e.blockers.length > 0 && m(e.blockers);
+    });
+  }, F = (e) => {
+    t(o.RUN_PAYROLL_EMPLOYEE_EDIT, { employeeId: e.uuid });
+  }, M = ({
+    paymentMethod: e,
+    ...n
+  }) => ({
+    ...n,
+    ...e && e !== "Historical" ? { paymentMethod: e } : {},
+    memo: n.memo || void 0
+  }), k = async (e) => {
+    t(o.RUN_PAYROLL_EMPLOYEE_SKIP, {
+      employeeId: e.employeeUuid
+    }), await h({}, async () => {
+      const n = M(e), T = await D({
+        request: {
+          companyId: r,
+          payrollId: s,
+          payrollUpdate: {
+            employeeCompensations: [
+              { ...n, excluded: !n.excluded }
+            ]
+          }
+        }
       });
-      !a.success && a.blockers.length > 0 && i(a.blockers);
+      t(o.RUN_PAYROLL_EMPLOYEE_SAVED, {
+        payrollPrepared: T.payrollPrepared
+      }), await b();
     });
-  }, w = (a) => {
-    e(c.RUN_PAYROLL_EMPLOYEE_EDIT, { employeeId: a.uuid });
+  }, I = () => {
+    t(o.RUN_PAYROLL_BLOCKERS_VIEW_ALL);
   };
-  return E(() => {
-    x(t.payrollShow?.processingRequest) && !o && r(!0), o && T(t.payrollShow?.processingRequest) && (e(c.RUN_PAYROLL_CALCULATED, {
+  return V(() => {
+    te(l.payrollShow?.processingRequest) && !a && c(!0), a && se(l.payrollShow?.processingRequest) && (t(o.RUN_PAYROLL_CALCULATED, {
       payrollId: s,
-      alert: { type: "success", title: p("alerts.progressSaved") }
-    }), i([]), r(!1)), o && t.payrollShow?.processingRequest?.status === m.ProcessingFailed && (e(c.RUN_PAYROLL_PROCESSING_FAILED), r(!1));
+      alert: { type: "success", title: f("alerts.progressSaved") }
+    }), m([]), c(!1)), a && l.payrollShow?.processingRequest?.status === d.ProcessingFailed && (t(o.RUN_PAYROLL_PROCESSING_FAILED), c(!1));
   }, [
-    t.payrollShow?.processingRequest,
-    o,
-    e,
-    p,
+    l.payrollShow?.processingRequest,
+    a,
+    t,
+    f,
     s,
-    t.payrollShow?.calculatedAt
-  ]), /* @__PURE__ */ u(
-    k,
+    l.payrollShow?.calculatedAt
+  ]), /* @__PURE__ */ g(
+    Q,
     {
-      onCalculatePayroll: h,
-      onEdit: w,
-      employeeCompensations: n?.employeeCompensations || [],
-      employeeDetails: d.showEmployees || [],
-      payPeriod: n?.payPeriod,
-      paySchedule: L,
-      isOffCycle: n?.offCycle,
-      alerts: P,
-      isPending: o || R,
-      payrollBlockers: C
+      onCalculatePayroll: q,
+      onEdit: F,
+      onToggleExclude: k,
+      onViewBlockers: I,
+      employeeCompensations: y?.employeeCompensations || [],
+      employeeDetails: u.showEmployees || [],
+      payPeriod: y?.payPeriod,
+      paySchedule: Y,
+      isOffCycle: y?.offCycle,
+      alerts: R,
+      isPending: a || B || N,
+      payrollBlockers: w,
+      pagination: O
     }
   );
 };
 export {
-  $ as PayrollConfiguration,
-  F as Root
+  _e as PayrollConfiguration,
+  ae as Root
 };
 //# sourceMappingURL=PayrollConfiguration.js.map

package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayrollConfiguration.js","sources":["../../../../src/components/Payroll/PayrollConfiguration/PayrollConfiguration.tsx"],"sourcesContent":["import { useEffect, useState, type ReactNode } from 'react'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport { usePayrollsGetSuspense } from '@gusto/embedded-api/react-query/payrollsGet'\nimport { usePayrollsCalculateMutation } from '@gusto/embedded-api/react-query/payrollsCalculate'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollProcessingRequest } from '@gusto/embedded-api/models/components/payrollprocessingrequest'\nimport { PayrollProcessingRequestStatus } from '@gusto/embedded-api/models/components/payrollprocessingrequest'\nimport { useTranslation } from 'react-i18next'\nimport { usePreparedPayrollData } from '../usePreparedPayrollData'\nimport { payrollSubmitHandler, type ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { PayrollConfigurationPresentation } from './PayrollConfigurationPresentation'\nimport type { BaseComponentInterface } from '@/components/Base/Base'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { componentEvents } from '@/shared/constants'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { useBase } from '@/components/Base'\n\nconst isCalculating = (processingRequest?: PayrollProcessingRequest | null) =>\n  processingRequest?.status === PayrollProcessingRequestStatus.Calculating\nconst isCalculated = (processingRequest?: PayrollProcessingRequest | null) =>\n  processingRequest?.status === PayrollProcessingRequestStatus.CalculateSuccess\n\ninterface PayrollConfigurationProps extends BaseComponentInterface<'Payroll.PayrollConfiguration'> {\n  companyId: string\n  payrollId: string\n  alerts?: ReactNode\n}\n\nexport function PayrollConfiguration(props: PayrollConfigurationProps & BaseComponentInterface) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nexport const Root = ({\n  onEvent,\n  companyId,\n  payrollId,\n  dictionary,\n  alerts,\n}: PayrollConfigurationProps) => {\n  useComponentDictionary('Payroll.PayrollConfiguration', dictionary)\n  useI18n('Payroll.PayrollConfiguration')\n  const { t } = useTranslation('Payroll.PayrollConfiguration')\n  const { baseSubmitHandler } = useBase()\n\n  const [isPolling, setIsPolling] = useState(false)\n  const [payrollBlockers, setPayrollBlockers] = useState<ApiPayrollBlocker[]>([])\n  const { data: employeeData } = useEmployeesListSuspense({\n    companyId,\n  })\n\n  const { data: payrollData } = usePayrollsGetSuspense(\n    {\n      companyId,\n      payrollId,\n      include: ['taxes', 'benefits', 'deductions'],\n    },\n    { refetchInterval: isPolling ? 5_000 : false },\n  )\n\n  const { mutateAsync: calculatePayroll } = usePayrollsCalculateMutation()\n\n  const {\n    preparedPayroll,\n    paySchedule,\n    isLoading: isPrepareLoading,\n  } = usePreparedPayrollData({\n    companyId,\n    payrollId,\n  })\n\n  const onCalculatePayroll = async () => {\n    // Clear any existing blockers before attempting calculation\n    setPayrollBlockers([])\n\n    await baseSubmitHandler({}, async () => {\n      const result = await payrollSubmitHandler(async () => {\n        await calculatePayroll({\n          request: {\n            companyId,\n            payrollId,\n          },\n        })\n        setIsPolling(true)\n      })\n\n      if (!result.success && result.blockers.length > 0) {\n        setPayrollBlockers(result.blockers)\n      }\n    })\n  }\n  const onEdit = (employee: Employee) => {\n    onEvent(componentEvents.RUN_PAYROLL_EMPLOYEE_EDIT, { employeeId: employee.uuid })\n  }\n\n  useEffect(() => {\n    // Start polling when payroll is calculating and not already polling\n    if (isCalculating(payrollData.payrollShow?.processingRequest) && !isPolling) {\n      setIsPolling(true)\n    }\n    // Stop polling and emit event when payroll is calculated successfully\n    if (isPolling && isCalculated(payrollData.payrollShow?.processingRequest)) {\n      onEvent(componentEvents.RUN_PAYROLL_CALCULATED, {\n        payrollId,\n        alert: { type: 'success', title: t('alerts.progressSaved') },\n      })\n      // Clear blockers on successful calculation\n      setPayrollBlockers([])\n      setIsPolling(false)\n    }\n    // If we are polling and payroll is in failed state, stop polling, and emit failure event\n    if (\n      isPolling &&\n      payrollData.payrollShow?.processingRequest?.status ===\n        PayrollProcessingRequestStatus.ProcessingFailed\n    ) {\n      onEvent(componentEvents.RUN_PAYROLL_PROCESSING_FAILED)\n      setIsPolling(false)\n    }\n  }, [\n    payrollData.payrollShow?.processingRequest,\n    isPolling,\n    onEvent,\n    t,\n    payrollId,\n    payrollData.payrollShow?.calculatedAt,\n  ])\n\n  return (\n    <PayrollConfigurationPresentation\n      onCalculatePayroll={onCalculatePayroll}\n      onEdit={onEdit}\n      employeeCompensations={preparedPayroll?.employeeCompensations || []}\n      employeeDetails={employeeData.showEmployees || []}\n      payPeriod={preparedPayroll?.payPeriod}\n      paySchedule={paySchedule}\n      isOffCycle={preparedPayroll?.offCycle}\n      alerts={alerts}\n      isPending={isPolling || isPrepareLoading}\n      payrollBlockers={payrollBlockers}\n    />\n  )\n}\n"],"names":["isCalculating","processingRequest","PayrollProcessingRequestStatus","isCalculated","PayrollConfiguration","props","jsx","BaseComponent","Root","onEvent","companyId","payrollId","dictionary","alerts","useComponentDictionary","useI18n","t","useTranslation","baseSubmitHandler","useBase","isPolling","setIsPolling","useState","payrollBlockers","setPayrollBlockers","employeeData","useEmployeesListSuspense","payrollData","usePayrollsGetSuspense","calculatePayroll","usePayrollsCalculateMutation","preparedPayroll","paySchedule","isPrepareLoading","usePreparedPayrollData","onCalculatePayroll","result","payrollSubmitHandler","onEdit","employee","componentEvents","useEffect","PayrollConfigurationPresentation"],"mappings":"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"}
+{"version":3,"file":"PayrollConfiguration.js","sources":["../../../../src/components/Payroll/PayrollConfiguration/PayrollConfiguration.tsx"],"sourcesContent":["import { useEffect, useMemo, useState, type ReactNode } from 'react'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport { usePayrollsGetSuspense } from '@gusto/embedded-api/react-query/payrollsGet'\nimport { usePayrollsCalculateMutation } from '@gusto/embedded-api/react-query/payrollsCalculate'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollProcessingRequest } from '@gusto/embedded-api/models/components/payrollprocessingrequest'\nimport { PayrollProcessingRequestStatus } from '@gusto/embedded-api/models/components/payrollprocessingrequest'\nimport { useTranslation } from 'react-i18next'\nimport { usePayrollsUpdateMutation } from '@gusto/embedded-api/react-query/payrollsUpdate'\nimport type { PayrollEmployeeCompensationsType } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport type { PayrollUpdateEmployeeCompensations } from '@gusto/embedded-api/models/components/payrollupdate'\nimport { usePreparedPayrollData } from '../usePreparedPayrollData'\nimport { payrollSubmitHandler, type ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { PayrollConfigurationPresentation } from './PayrollConfigurationPresentation'\nimport type { BaseComponentInterface } from '@/components/Base/Base'\nimport { BaseComponent } from '@/components/Base/Base'\nimport { componentEvents } from '@/shared/constants'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { useBase } from '@/components/Base'\nimport type { PaginationItemsPerPage } from '@/components/Common/PaginationControl/PaginationControlTypes'\n\nconst isCalculating = (processingRequest?: PayrollProcessingRequest | null) =>\n  processingRequest?.status === PayrollProcessingRequestStatus.Calculating\nconst isCalculated = (processingRequest?: PayrollProcessingRequest | null) =>\n  processingRequest?.status === PayrollProcessingRequestStatus.CalculateSuccess\n\ninterface PayrollConfigurationProps extends BaseComponentInterface<'Payroll.PayrollConfiguration'> {\n  companyId: string\n  payrollId: string\n  alerts?: ReactNode\n}\n\nexport function PayrollConfiguration(props: PayrollConfigurationProps & BaseComponentInterface) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nexport const Root = ({\n  onEvent,\n  companyId,\n  payrollId,\n  dictionary,\n  alerts,\n}: PayrollConfigurationProps) => {\n  useComponentDictionary('Payroll.PayrollConfiguration', dictionary)\n  useI18n('Payroll.PayrollConfiguration')\n  const { t } = useTranslation('Payroll.PayrollConfiguration')\n  const { baseSubmitHandler } = useBase()\n  const defaultItemsPerPage = 10\n\n  const [currentPage, setCurrentPage] = useState(1)\n  const [itemsPerPage, setItemsPerPage] = useState<PaginationItemsPerPage>(defaultItemsPerPage)\n  const [isPolling, setIsPolling] = useState(false)\n  const [payrollBlockers, setPayrollBlockers] = useState<ApiPayrollBlocker[]>([])\n\n  const { data: employeeData, isFetching: isFetchingEmployeeData } = useEmployeesListSuspense({\n    companyId,\n    payrollUuid: payrollId, // get back list of employees to specific payroll\n    per: itemsPerPage,\n    page: currentPage,\n    sortBy: 'name', // sort alphanumeric by employee last_names\n  })\n\n  // get list of employee uuids to filter into prepare endpoint to get back employee_compensation data\n  const employeeUuids = useMemo(() => {\n    return employeeData.showEmployees?.map(e => e.uuid) || []\n  }, [employeeData.showEmployees])\n\n  const totalPages = Number(employeeData.httpMeta.response.headers.get('x-total-pages') ?? 1)\n\n  const handleItemsPerPageChange = (newCount: PaginationItemsPerPage) => {\n    setItemsPerPage(newCount)\n  }\n  const handleFirstPage = () => {\n    setCurrentPage(1)\n  }\n  const handlePreviousPage = () => {\n    setCurrentPage(prevPage => Math.max(prevPage - 1, 1))\n  }\n  const handleNextPage = () => {\n    setCurrentPage(prevPage => Math.min(prevPage + 1, totalPages))\n  }\n  const handleLastPage = () => {\n    setCurrentPage(totalPages)\n  }\n\n  const pagination = {\n    currentPage,\n    handleFirstPage,\n    handlePreviousPage,\n    handleNextPage,\n    handleLastPage,\n    handleItemsPerPageChange,\n    totalPages,\n    isFetching: isFetchingEmployeeData,\n    itemsPerPage,\n  }\n\n  const { data: payrollData } = usePayrollsGetSuspense(\n    {\n      companyId,\n      payrollId,\n      include: ['taxes', 'benefits', 'deductions'],\n    },\n    { refetchInterval: isPolling ? 5_000 : false },\n  )\n\n  const { mutateAsync: calculatePayroll } = usePayrollsCalculateMutation()\n\n  const { mutateAsync: updatePayroll, isPending: isUpdatingPayroll } = usePayrollsUpdateMutation()\n\n  const {\n    preparedPayroll,\n    paySchedule,\n    isLoading: isPrepareLoading,\n    handlePreparePayroll,\n  } = usePreparedPayrollData({\n    companyId,\n    payrollId,\n    employeeUuids,\n    sortBy: 'last_name', // sort alphanumeric by employee last_names to match employees GET\n  })\n\n  const onCalculatePayroll = async () => {\n    // Clear any existing blockers before attempting calculation\n    setPayrollBlockers([])\n\n    await baseSubmitHandler({}, async () => {\n      const result = await payrollSubmitHandler(async () => {\n        await calculatePayroll({\n          request: {\n            companyId,\n            payrollId,\n          },\n        })\n        setIsPolling(true)\n      })\n\n      if (!result.success && result.blockers.length > 0) {\n        setPayrollBlockers(result.blockers)\n      }\n    })\n  }\n  const onEdit = (employee: Employee) => {\n    onEvent(componentEvents.RUN_PAYROLL_EMPLOYEE_EDIT, { employeeId: employee.uuid })\n  }\n  const transformEmployeeCompensation = ({\n    paymentMethod,\n    ...compensation\n  }: PayrollEmployeeCompensationsType): PayrollUpdateEmployeeCompensations => {\n    return {\n      ...compensation,\n      ...(paymentMethod && paymentMethod !== 'Historical' ? { paymentMethod } : {}),\n      memo: compensation.memo || undefined,\n    }\n  }\n  const onToggleExclude = async (employeeCompensation: PayrollEmployeeCompensationsType) => {\n    onEvent(componentEvents.RUN_PAYROLL_EMPLOYEE_SKIP, {\n      employeeId: employeeCompensation.employeeUuid,\n    })\n    await baseSubmitHandler({}, async () => {\n      const transformedCompensation = transformEmployeeCompensation(employeeCompensation)\n      const result = await updatePayroll({\n        request: {\n          companyId,\n          payrollId,\n          payrollUpdate: {\n            employeeCompensations: [\n              { ...transformedCompensation, excluded: !transformedCompensation.excluded },\n            ],\n          },\n        },\n      })\n      onEvent(componentEvents.RUN_PAYROLL_EMPLOYEE_SAVED, {\n        payrollPrepared: result.payrollPrepared,\n      })\n      // Refresh preparedPayroll to get updated data\n      await handlePreparePayroll()\n    })\n  }\n\n  const onViewBlockers = () => {\n    onEvent(componentEvents.RUN_PAYROLL_BLOCKERS_VIEW_ALL)\n  }\n\n  useEffect(() => {\n    // Start polling when payroll is calculating and not already polling\n    if (isCalculating(payrollData.payrollShow?.processingRequest) && !isPolling) {\n      setIsPolling(true)\n    }\n    // Stop polling and emit event when payroll is calculated successfully\n    if (isPolling && isCalculated(payrollData.payrollShow?.processingRequest)) {\n      onEvent(componentEvents.RUN_PAYROLL_CALCULATED, {\n        payrollId,\n        alert: { type: 'success', title: t('alerts.progressSaved') },\n      })\n      // Clear blockers on successful calculation\n      setPayrollBlockers([])\n      setIsPolling(false)\n    }\n    // If we are polling and payroll is in failed state, stop polling, and emit failure event\n    if (\n      isPolling &&\n      payrollData.payrollShow?.processingRequest?.status ===\n        PayrollProcessingRequestStatus.ProcessingFailed\n    ) {\n      onEvent(componentEvents.RUN_PAYROLL_PROCESSING_FAILED)\n      setIsPolling(false)\n    }\n  }, [\n    payrollData.payrollShow?.processingRequest,\n    isPolling,\n    onEvent,\n    t,\n    payrollId,\n    payrollData.payrollShow?.calculatedAt,\n  ])\n\n  return (\n    <PayrollConfigurationPresentation\n      onCalculatePayroll={onCalculatePayroll}\n      onEdit={onEdit}\n      onToggleExclude={onToggleExclude}\n      onViewBlockers={onViewBlockers}\n      employeeCompensations={preparedPayroll?.employeeCompensations || []}\n      employeeDetails={employeeData.showEmployees || []}\n      payPeriod={preparedPayroll?.payPeriod}\n      paySchedule={paySchedule}\n      isOffCycle={preparedPayroll?.offCycle}\n      alerts={alerts}\n      isPending={isPolling || isPrepareLoading || isUpdatingPayroll}\n      payrollBlockers={payrollBlockers}\n      pagination={pagination}\n    />\n  )\n}\n"],"names":["isCalculating","processingRequest","PayrollProcessingRequestStatus","isCalculated","PayrollConfiguration","props","jsx","BaseComponent","Root","onEvent","companyId","payrollId","dictionary","alerts","useComponentDictionary","useI18n","t","useTranslation","baseSubmitHandler","useBase","defaultItemsPerPage","currentPage","setCurrentPage","useState","itemsPerPage","setItemsPerPage","isPolling","setIsPolling","payrollBlockers","setPayrollBlockers","employeeData","isFetchingEmployeeData","useEmployeesListSuspense","employeeUuids","useMemo","totalPages","pagination","prevPage","newCount","payrollData","usePayrollsGetSuspense","calculatePayroll","usePayrollsCalculateMutation","updatePayroll","isUpdatingPayroll","usePayrollsUpdateMutation","preparedPayroll","paySchedule","isPrepareLoading","handlePreparePayroll","usePreparedPayrollData","onCalculatePayroll","result","payrollSubmitHandler","onEdit","employee","componentEvents","transformEmployeeCompensation","paymentMethod","compensation","onToggleExclude","employeeCompensation","transformedCompensation","onViewBlockers","useEffect","PayrollConfigurationPresentation"],"mappings":"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"}

package/dist/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.d.ts

@@ -3,7 +3,9 @@ import { EmployeeCompensations } from '@gusto/embedded-api/models/components/pay
 import { Employee } from '@gusto/embedded-api/models/components/employee';
 import { PayrollPayPeriodType } from '@gusto/embedded-api/models/components/payrollpayperiodtype';
 import { PayScheduleObject } from '@gusto/embedded-api/models/components/payscheduleobject';
+import { PayrollEmployeeCompensationsType } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype';
 import { ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers';
+import { PaginationControlProps } from '../../Common/PaginationControl/PaginationControlTypes';
 interface PayrollConfigurationPresentationProps {
     employeeCompensations: EmployeeCompensations[];
     employeeDetails: Employee[];
@@ -11,10 +13,13 @@ interface PayrollConfigurationPresentationProps {
     paySchedule?: PayScheduleObject;
     onCalculatePayroll: () => void;
     onEdit: (employee: Employee) => void;
+    onToggleExclude: (employeeCompensation: PayrollEmployeeCompensationsType) => void;
+    onViewBlockers: () => void;
     isOffCycle?: boolean;
     alerts?: ReactNode;
     isPending?: boolean;
     payrollBlockers?: ApiPayrollBlocker[];
+    pagination?: PaginationControlProps;
 }
-export declare const PayrollConfigurationPresentation: ({ employeeCompensations, employeeDetails, payPeriod, paySchedule, onEdit, onCalculatePayroll, isOffCycle, alerts, isPending, payrollBlockers, }: PayrollConfigurationPresentationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PayrollConfigurationPresentation: ({ employeeCompensations, employeeDetails, payPeriod, paySchedule, onEdit, onToggleExclude, onCalculatePayroll, onViewBlockers, isOffCycle, alerts, isPending, payrollBlockers, pagination, }: PayrollConfigurationPresentationProps) => import("react/jsx-runtime").JSX.Element;
 export {};