@gusto/embedded-react-sdk 0.55.4 → 0.55.6

package/CHANGELOG.md

@@ -1,5 +1,35 @@
 # Changelog
 
+## [0.55.6](https://github.com/Gusto/embedded-react-sdk/compare/v0.55.5...v0.55.6) (2026-09-08)
+
+### Fixes
+
+- Default the payment method to check when an employee has no bank account on file ([#2683](https://github.com/Gusto/embedded-react-sdk/issues/2683))
+- Give contractor row action-menu buttons a row-specific accessible name ([#2647](https://github.com/Gusto/embedded-react-sdk/issues/2647))
+- Add an accessible label to the completed-step checkmark icon ([#2672](https://github.com/Gusto/embedded-react-sdk/issues/2672))
+- Freeze `PaySchedule`'s initial routing decision so it no longer changes mid-flow ([#2703](https://github.com/Gusto/embedded-react-sdk/issues/2703))
+- Right-align numeric `DataView` columns (currency, hours, tax rate) that aren't the last column in the table ([#2648](https://github.com/Gusto/embedded-react-sdk/issues/2648))
+- Add helper text under the off-cycle Payment date ([#2701](https://github.com/Gusto/embedded-react-sdk/issues/2701))
+- Recover from a failed payroll calculation instead of stalling forever ([#2700](https://github.com/Gusto/embedded-react-sdk/issues/2700))
+- Include reimbursements in the employee take-home Payment total ([#2699](https://github.com/Gusto/embedded-react-sdk/issues/2699))
+- Persist `0` when an additional-earning field is cleared instead of dropping it ([#2649](https://github.com/Gusto/embedded-react-sdk/issues/2649))
+- Make the cancel payroll dialog describe cancelling ([#2652](https://github.com/Gusto/embedded-react-sdk/issues/2652))
+- Fix payroll calculation, submission, and check-generation screens getting stuck (e.g. an unresolving "Loading payroll..." state) when a status update was missed ([#2715](https://github.com/Gusto/embedded-react-sdk/issues/2715))
+- Cap the hourly rate input at the server's inline validation limit ([#2710](https://github.com/Gusto/embedded-react-sdk/issues/2710))
+- Save a contractor's email address when edited from the management Profile form ([#2696](https://github.com/Gusto/embedded-react-sdk/issues/2696))
+
+### Chores & Maintenance
+
+- Bump `@gusto/embedded-api` to `0.3.0-rc.2` ([#2678](https://github.com/Gusto/embedded-react-sdk/issues/2678))
+- Bump dependencies (`react-error-boundary`, `react-hook-form`)
+- Bump dev dependencies (`react-router-dom`, `@typescript-eslint/parser`, `typescript-eslint`, `json-schema-to-typescript`, `lint-staged`, `tsx`)
+
+## [0.55.5](https://github.com/Gusto/embedded-react-sdk/compare/v0.55.4...v0.55.5) (2026-08-31)
+
+### Fixes
+
+- Fix `InformationRequests` modal visibility so it is driven by the component's state machine ([#2662](https://github.com/Gusto/embedded-react-sdk/issues/2662))
+
 ## [0.55.4](https://github.com/Gusto/embedded-react-sdk/compare/v0.55.3...v0.55.4) (2026-08-31)
 
 ### Features & Enhancements

package/dist/components/Common/DataView/DataTable/DataTable.js

@@ -1,4 +1,4 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { useId as T, useState as E } from "react";
 import F from "classnames";
 import { useTranslation as S } from "react-i18next";
@@ -6,26 +6,26 @@ import { useSelectionState as A } from "../useSelectionState.js";
 import h from "./DataTable.module.scss.js";
 import { useComponentContext as B } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { VisuallyHidden as m } from "../../VisuallyHidden/VisuallyHidden.js";
-function f(n, o) {
-  return !o || o === "start" ? n : /* @__PURE__ */ r("div", { className: h.cellEnd, children: n });
+function d(r, o) {
+  return !o || o === "start" ? r : /* @__PURE__ */ a("div", { className: h.cellEnd, children: r });
 }
-function G(n, o) {
+function G(r, o) {
   if (o.render)
-    return o.render(n);
+    return o.render(r);
   if (o.key) {
     const i = o.key;
-    return String(n[i] ?? "");
+    return String(r[i] ?? "");
   }
   return "";
 }
 const Y = ({
-  label: n,
+  label: r,
   data: o,
   columns: i,
-  itemMenu: d,
+  itemMenu: u,
   onSelect: l,
   onSelectAll: R,
-  getIsItemSelected: u,
+  getIsItemSelected: p,
   hideSelectAll: v,
   emptyState: b,
   footer: k,
@@ -33,18 +33,18 @@ const Y = ({
   selectionMode: C = "multiple",
   isFetching: g
 }) => {
-  const p = B(), { t: c } = S("common"), $ = T(), [w, H] = E(null), { allSelected: L } = A(o, u), x = [
+  const y = B(), { t: c } = S("common"), $ = T(), [w, H] = E(null), { allSelected: L } = A(o, p), x = [
     ...l ? [
       {
         key: "select-header",
-        content: C === "multiple" && u && !v && o.length > 0 ? (
+        content: C === "multiple" && p && !v && o.length > 0 ? (
           // Stop propagation so the surrounding react-aria-components
           // <Column> press handler doesn't intercept the checkbox click
           // and desync the controlled DOM state. The inner <input> is
           // the actual interactive element; this span is a propagation
           // shield, not a click target itself.
           // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ a(
             "span",
             {
               onClick: (e) => {
@@ -56,8 +56,8 @@ const Y = ({
               onMouseDown: (e) => {
                 e.stopPropagation();
               },
-              children: /* @__PURE__ */ r(
-                p.Checkbox,
+              children: /* @__PURE__ */ a(
+                y.Checkbox,
                 {
                   value: L,
                   onChange: (e) => R?.(e, o),
@@ -67,29 +67,32 @@ const Y = ({
               )
             }
           )
-        ) : /* @__PURE__ */ r(m, { children: c("table.selectRowHeader") })
+        ) : /* @__PURE__ */ a(m, { children: c("table.selectRowHeader") })
       }
     ] : [],
     ...i.map((e, t) => ({
       key: typeof e.key == "string" ? e.key : `header-${t}`,
-      content: f(e.title, e.justify)
+      content: d(e.title, e.justify)
     })),
-    ...d ? [
+    ...u ? [
       {
         key: "actions-header",
-        content: /* @__PURE__ */ r(m, { children: c("table.actionsColumnHeader") })
+        content: d(
+          /* @__PURE__ */ a(m, { children: c("table.actionsColumnHeader") }),
+          "end"
+        )
       }
     ] : []
   ], N = (e, t) => {
     H(t), l?.(e, !0);
   }, P = (e, t) => {
     if (C === "single") {
-      const a = u?.(e) ?? w === t;
-      return /* @__PURE__ */ r(
-        p.Radio,
+      const n = p?.(e) ?? w === t;
+      return /* @__PURE__ */ a(
+        y.Radio,
         {
           name: $,
-          value: a,
+          value: n,
           onChange: () => {
             N(e, t);
           },
@@ -98,13 +101,13 @@ const Y = ({
         }
       );
     }
-    const s = u?.(e) ?? !1;
-    return /* @__PURE__ */ r(
-      p.Checkbox,
+    const s = p?.(e) ?? !1;
+    return /* @__PURE__ */ a(
+      y.Checkbox,
       {
         value: s,
-        onChange: (a) => {
-          l?.(e, a);
+        onChange: (n) => {
+          l?.(e, n);
         },
         label: c("table.selectRowLabel"),
         shouldVisuallyHideLabel: !0
@@ -118,14 +121,14 @@ const Y = ({
           content: P(e, t)
         }
       ] : [],
-      ...i.map((a, y) => ({
-        key: typeof a.key == "string" ? a.key : `cell-${y}`,
-        content: f(G(e, a), a.justify)
+      ...i.map((n, f) => ({
+        key: typeof n.key == "string" ? n.key : `cell-${f}`,
+        content: d(G(e, n), n.justify)
       })),
-      ...d ? [
+      ...u ? [
         {
           key: `menu-${t}`,
-          content: d(e)
+          content: d(u(e), "end")
         }
       ] : []
     ];
@@ -139,26 +142,26 @@ const Y = ({
     return l && t.push({
       key: "footer-select",
       content: ""
-    }), i.forEach((s, a) => {
-      const y = typeof s.key == "string" ? s.key : `column-${a}`;
+    }), i.forEach((s, n) => {
+      const f = typeof s.key == "string" ? s.key : `column-${n}`;
       t.push({
-        key: `footer-${y}`,
-        content: f(e[y] || "", s.justify)
+        key: `footer-${f}`,
+        content: d(e[f] || "", s.justify)
       });
-    }), d && t.push({
+    }), u && t.push({
       key: "footer-actions",
       content: ""
     }), t;
   })();
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ a(
     "div",
     {
       className: F(h.tableWrapper, g && h.isFetching),
       "aria-busy": !!g,
-      children: /* @__PURE__ */ r(
-        p.Table,
+      children: /* @__PURE__ */ a(
+        y.Table,
         {
-          "aria-label": n,
+          "aria-label": r,
           "data-testid": "data-table",
           headers: x,
           rows: V,

package/dist/components/Common/DataView/DataTable/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/Common/DataView/DataTable/DataTable.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport cn from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport type { useDataViewPropReturn, SelectionMode } from '../useDataView'\nimport { useSelectionState } from '../useSelectionState'\nimport type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport styles from './DataTable.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nfunction withJustify(content: React.ReactNode, justify?: 'start' | 'end') {\n  if (!justify || justify === 'start') return content\n  return <div className={styles.cellEnd}>{content}</div>\n}\n\n/** @internal */\nexport type DataTableProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  isWithinBox?: TableProps['isWithinBox']\n  selectionMode?: SelectionMode\n  isFetching?: useDataViewPropReturn<T>['isFetching']\n}\n\nfunction getCellContent<T>(\n  item: T,\n  column: { key?: string | keyof T; render?: (item: T) => React.ReactNode },\n) {\n  if (column.render) {\n    return column.render(item)\n  }\n\n  if (column.key) {\n    const key = column.key as keyof T\n    return String(item[key] ?? '')\n  }\n\n  return ''\n}\n\n/** @internal */\nexport const DataTable = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  emptyState,\n  footer,\n  isWithinBox,\n  selectionMode = 'multiple',\n  isFetching,\n}: DataTableProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const [selectedRadioIndex, setSelectedRadioIndex] = useState<number | null>(null)\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content:\n              selectionMode === 'multiple' &&\n              getIsItemSelected &&\n              !hideSelectAll &&\n              data.length > 0 ? (\n                // Stop propagation so the surrounding react-aria-components\n                // <Column> press handler doesn't intercept the checkbox click\n                // and desync the controlled DOM state. The inner <input> is\n                // the actual interactive element; this span is a propagation\n                // shield, not a click target itself.\n                // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n                <span\n                  onClick={e => {\n                    e.stopPropagation()\n                  }}\n                  onPointerDown={e => {\n                    e.stopPropagation()\n                  }}\n                  onMouseDown={e => {\n                    e.stopPropagation()\n                  }}\n                >\n                  <Components.Checkbox\n                    value={allSelected}\n                    onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n                    label={t('table.selectAllRowsLabel')}\n                    shouldVisuallyHideLabel\n                  />\n                </span>\n              ) : (\n                <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>\n              ),\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: withJustify(column.title, column.justify),\n    })),\n    ...(itemMenu\n      ? [\n          {\n            key: 'actions-header',\n            content: <VisuallyHidden>{t('table.actionsColumnHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n  ]\n\n  const handleRadioSelect = (item: T, rowIndex: number) => {\n    setSelectedRadioIndex(rowIndex)\n    onSelect?.(item, true)\n  }\n\n  const renderSelectionControl = (item: T, rowIndex: number) => {\n    if (selectionMode === 'single') {\n      const isSelected = getIsItemSelected?.(item) ?? selectedRadioIndex === rowIndex\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect?.(item, checked)\n        }}\n        label={t('table.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  const rows: TableRow[] = data.map((item, rowIndex) => {\n    const rowData: TableData[] = [\n      ...(onSelect\n        ? [\n            {\n              key: `select-${rowIndex}`,\n              content: renderSelectionControl(item, rowIndex),\n            },\n          ]\n        : []),\n      ...columns.map((column, colIndex) => {\n        return {\n          key: typeof column.key === 'string' ? column.key : `cell-${colIndex}`,\n          content: withJustify(getCellContent(item, column), column.justify),\n        }\n      }),\n      ...(itemMenu\n        ? [\n            {\n              key: `menu-${rowIndex}`,\n              content: itemMenu(item),\n            },\n          ]\n        : []),\n    ]\n\n    return {\n      key: `row-${rowIndex}`,\n      data: rowData,\n    }\n  })\n\n  const buildFooterData = () => {\n    if (!footer) return undefined\n\n    const footerContent = footer()\n    const footerCells: TableData[] = []\n\n    // Add select column footer (empty)\n    if (onSelect) {\n      footerCells.push({\n        key: 'footer-select',\n        content: '',\n      })\n    }\n\n    // Add data column footers\n    columns.forEach((column, index) => {\n      const columnKey = typeof column.key === 'string' ? column.key : `column-${index}`\n      footerCells.push({\n        key: `footer-${columnKey}`,\n        content: withJustify(footerContent[columnKey] || '', column.justify),\n      })\n    })\n\n    // Add actions column footer (empty)\n    if (itemMenu) {\n      footerCells.push({\n        key: 'footer-actions',\n        content: '',\n      })\n    }\n\n    return footerCells\n  }\n\n  const footerData = buildFooterData()\n\n  return (\n    <div\n      className={cn(styles.tableWrapper, isFetching && styles.isFetching)}\n      aria-busy={Boolean(isFetching)}\n    >\n      <Components.Table\n        aria-label={label}\n        data-testid=\"data-table\"\n        headers={headers}\n        rows={rows}\n        footer={footerData}\n        emptyState={emptyState ? emptyState() : undefined}\n        isWithinBox={isWithinBox}\n        hasCheckboxColumn={!!onSelect}\n      />\n    </div>\n  )\n}\n"],"names":["withJustify","content","justify","jsx","styles","getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","emptyState","footer","isWithinBox","selectionMode","isFetching","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","allSelected","useSelectionState","headers","checked","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey","cn"],"mappings":"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"}
+{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/Common/DataView/DataTable/DataTable.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport cn from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport type { useDataViewPropReturn, SelectionMode } from '../useDataView'\nimport { useSelectionState } from '../useSelectionState'\nimport type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport styles from './DataTable.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nfunction withJustify(content: React.ReactNode, justify?: 'start' | 'end') {\n  if (!justify || justify === 'start') return content\n  return <div className={styles.cellEnd}>{content}</div>\n}\n\n/** @internal */\nexport type DataTableProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  isWithinBox?: TableProps['isWithinBox']\n  selectionMode?: SelectionMode\n  isFetching?: useDataViewPropReturn<T>['isFetching']\n}\n\nfunction getCellContent<T>(\n  item: T,\n  column: { key?: string | keyof T; render?: (item: T) => React.ReactNode },\n) {\n  if (column.render) {\n    return column.render(item)\n  }\n\n  if (column.key) {\n    const key = column.key as keyof T\n    return String(item[key] ?? '')\n  }\n\n  return ''\n}\n\n/** @internal */\nexport const DataTable = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  emptyState,\n  footer,\n  isWithinBox,\n  selectionMode = 'multiple',\n  isFetching,\n}: DataTableProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const [selectedRadioIndex, setSelectedRadioIndex] = useState<number | null>(null)\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content:\n              selectionMode === 'multiple' &&\n              getIsItemSelected &&\n              !hideSelectAll &&\n              data.length > 0 ? (\n                // Stop propagation so the surrounding react-aria-components\n                // <Column> press handler doesn't intercept the checkbox click\n                // and desync the controlled DOM state. The inner <input> is\n                // the actual interactive element; this span is a propagation\n                // shield, not a click target itself.\n                // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n                <span\n                  onClick={e => {\n                    e.stopPropagation()\n                  }}\n                  onPointerDown={e => {\n                    e.stopPropagation()\n                  }}\n                  onMouseDown={e => {\n                    e.stopPropagation()\n                  }}\n                >\n                  <Components.Checkbox\n                    value={allSelected}\n                    onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n                    label={t('table.selectAllRowsLabel')}\n                    shouldVisuallyHideLabel\n                  />\n                </span>\n              ) : (\n                <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>\n              ),\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: withJustify(column.title, column.justify),\n    })),\n    ...(itemMenu\n      ? [\n          {\n            key: 'actions-header',\n            content: withJustify(\n              <VisuallyHidden>{t('table.actionsColumnHeader')}</VisuallyHidden>,\n              'end',\n            ),\n          },\n        ]\n      : []),\n  ]\n\n  const handleRadioSelect = (item: T, rowIndex: number) => {\n    setSelectedRadioIndex(rowIndex)\n    onSelect?.(item, true)\n  }\n\n  const renderSelectionControl = (item: T, rowIndex: number) => {\n    if (selectionMode === 'single') {\n      const isSelected = getIsItemSelected?.(item) ?? selectedRadioIndex === rowIndex\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect?.(item, checked)\n        }}\n        label={t('table.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  const rows: TableRow[] = data.map((item, rowIndex) => {\n    const rowData: TableData[] = [\n      ...(onSelect\n        ? [\n            {\n              key: `select-${rowIndex}`,\n              content: renderSelectionControl(item, rowIndex),\n            },\n          ]\n        : []),\n      ...columns.map((column, colIndex) => {\n        return {\n          key: typeof column.key === 'string' ? column.key : `cell-${colIndex}`,\n          content: withJustify(getCellContent(item, column), column.justify),\n        }\n      }),\n      ...(itemMenu\n        ? [\n            {\n              key: `menu-${rowIndex}`,\n              content: withJustify(itemMenu(item), 'end'),\n            },\n          ]\n        : []),\n    ]\n\n    return {\n      key: `row-${rowIndex}`,\n      data: rowData,\n    }\n  })\n\n  const buildFooterData = () => {\n    if (!footer) return undefined\n\n    const footerContent = footer()\n    const footerCells: TableData[] = []\n\n    // Add select column footer (empty)\n    if (onSelect) {\n      footerCells.push({\n        key: 'footer-select',\n        content: '',\n      })\n    }\n\n    // Add data column footers\n    columns.forEach((column, index) => {\n      const columnKey = typeof column.key === 'string' ? column.key : `column-${index}`\n      footerCells.push({\n        key: `footer-${columnKey}`,\n        content: withJustify(footerContent[columnKey] || '', column.justify),\n      })\n    })\n\n    // Add actions column footer (empty)\n    if (itemMenu) {\n      footerCells.push({\n        key: 'footer-actions',\n        content: '',\n      })\n    }\n\n    return footerCells\n  }\n\n  const footerData = buildFooterData()\n\n  return (\n    <div\n      className={cn(styles.tableWrapper, isFetching && styles.isFetching)}\n      aria-busy={Boolean(isFetching)}\n    >\n      <Components.Table\n        aria-label={label}\n        data-testid=\"data-table\"\n        headers={headers}\n        rows={rows}\n        footer={footerData}\n        emptyState={emptyState ? emptyState() : undefined}\n        isWithinBox={isWithinBox}\n        hasCheckboxColumn={!!onSelect}\n      />\n    </div>\n  )\n}\n"],"names":["withJustify","content","justify","jsx","styles","getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","emptyState","footer","isWithinBox","selectionMode","isFetching","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","allSelected","useSelectionState","headers","checked","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey","cn"],"mappings":"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"}

package/dist/components/Common/RequirementsList/RequirementsList.js

@@ -1,19 +1,28 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import l from "classnames";
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import a from "classnames";
 import { useId as d } from "react";
-import { Flex as m } from "../Flex/Flex.js";
+import { useTranslation as p } from "react-i18next";
+import { Flex as s } from "../Flex/Flex.js";
 import i from "./RequirementsList.module.scss.js";
-import { useComponentContext as a } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import p from "../../../assets/icons/checkbox.svg.js";
-const N = ({ requirements: n }) => {
-  const o = a(), c = d();
-  return /* @__PURE__ */ e(m, { flexDirection: "column", alignItems: "flex-start", gap: 8, children: /* @__PURE__ */ e(
+import { useComponentContext as h } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import f from "../../../assets/icons/checkbox.svg.js";
+const T = ({ requirements: n }) => {
+  const o = h(), c = d(), { t: l } = p("common");
+  return /* @__PURE__ */ e(s, { flexDirection: "column", alignItems: "flex-start", gap: 8, children: /* @__PURE__ */ e(
     o.UnorderedList,
     {
       className: i.list,
-      items: n.sort((t, r) => t.completed ? -1 : 1).map((t, r) => /* @__PURE__ */ s("div", { className: i.listItem, children: [
-        t.completed ? /* @__PURE__ */ e("div", { className: l(i.listItemIcon, i.success), children: /* @__PURE__ */ e(p, { width: 16, height: 16 }) }) : /* @__PURE__ */ e("div", { className: i.listItemIcon, children: r + 1 }),
-        /* @__PURE__ */ s(m, { flexDirection: "column", gap: 0, children: [
+      items: n.sort((t, r) => t.completed ? -1 : 1).map((t, r) => /* @__PURE__ */ m("div", { className: i.listItem, children: [
+        t.completed ? /* @__PURE__ */ e("div", { className: a(i.listItemIcon, i.success), children: /* @__PURE__ */ e(
+          f,
+          {
+            width: 16,
+            height: 16,
+            role: "img",
+            "aria-label": l("icons.completedStep")
+          }
+        ) }) : /* @__PURE__ */ e("div", { className: i.listItemIcon, children: r + 1 }),
+        /* @__PURE__ */ m(s, { flexDirection: "column", gap: 0, children: [
           /* @__PURE__ */ e(o.Text, { size: "md", weight: "medium", children: t.title }),
           /* @__PURE__ */ e(o.Text, { variant: "supporting", children: t.description })
         ] })
@@ -22,6 +31,6 @@ const N = ({ requirements: n }) => {
   ) });
 };
 export {
-  N as RequirementsList
+  T as RequirementsList
 };
 //# sourceMappingURL=RequirementsList.js.map

package/dist/components/Common/RequirementsList/RequirementsList.js.map

@@ -1 +1 @@
-{"version":3,"file":"RequirementsList.js","sources":["../../../../src/components/Common/RequirementsList/RequirementsList.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { useId } from 'react'\nimport { Flex } from '../Flex/Flex'\nimport styles from './RequirementsList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport SuccessCheck from '@/assets/icons/checkbox.svg?react'\n\ninterface RequirementsListProps {\n  requirements: {\n    title: string\n    description: string\n    completed: boolean\n  }[]\n}\n/** @internal */\nexport const RequirementsList = ({ requirements }: RequirementsListProps) => {\n  const Components = useComponentContext()\n  const id = useId()\n\n  return (\n    <Flex flexDirection=\"column\" alignItems=\"flex-start\" gap={8}>\n      <Components.UnorderedList\n        className={styles.list}\n        items={requirements\n          .sort((a, b) => (a.completed ? -1 : 1))\n          .map((step, i) => {\n            return (\n              <div key={`${id}-${i}-${step.description}`} className={styles.listItem}>\n                {step.completed ? (\n                  <div className={classNames(styles.listItemIcon, styles.success)}>\n                    <SuccessCheck width={16} height={16} />\n                  </div>\n                ) : (\n                  <div className={styles.listItemIcon}>{i + 1}</div>\n                )}\n                <Flex flexDirection=\"column\" gap={0}>\n                  <Components.Text size=\"md\" weight=\"medium\">\n                    {step.title}\n                  </Components.Text>\n                  <Components.Text variant=\"supporting\">{step.description}</Components.Text>\n                </Flex>\n              </div>\n            )\n          })}\n      />\n    </Flex>\n  )\n}\n"],"names":["RequirementsList","requirements","Components","useComponentContext","id","useId","Flex","jsx","styles","a","b","step","i","jsxs","classNames","SuccessCheck"],"mappings":";;;;;;;AAeO,MAAMA,IAAmB,CAAC,EAAE,cAAAC,QAA0C;AAC3E,QAAMC,IAAaC,EAAA,GACbC,IAAKC,EAAA;AAEX,2BACGC,GAAA,EAAK,eAAc,UAAS,YAAW,cAAa,KAAK,GACxD,UAAA,gBAAAC;AAAA,IAACL,EAAW;AAAA,IAAX;AAAA,MACC,WAAWM,EAAO;AAAA,MAClB,OAAOP,EACJ,KAAK,CAACQ,GAAGC,MAAOD,EAAE,YAAY,KAAK,CAAE,EACrC,IAAI,CAACE,GAAMC,MAER,gBAAAC,EAAC,OAAA,EAA2C,WAAWL,EAAO,UAC3D,UAAA;AAAA,QAAAG,EAAK,YACJ,gBAAAJ,EAAC,OAAA,EAAI,WAAWO,EAAWN,EAAO,cAAcA,EAAO,OAAO,GAC5D,UAAA,gBAAAD,EAACQ,GAAA,EAAa,OAAO,IAAI,QAAQ,GAAA,CAAI,EAAA,CACvC,IAEA,gBAAAR,EAAC,SAAI,WAAWC,EAAO,cAAe,UAAAI,IAAI,EAAA,CAAE;AAAA,QAE9C,gBAAAC,EAACP,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,UAAA,gBAAAC,EAACL,EAAW,MAAX,EAAgB,MAAK,MAAK,QAAO,UAC/B,YAAK,MAAA,CACR;AAAA,4BACCA,EAAW,MAAX,EAAgB,SAAQ,cAAc,YAAK,YAAA,CAAY;AAAA,QAAA,EAAA,CAC1D;AAAA,MAAA,KAbQ,GAAGE,CAAE,IAAIQ,CAAC,IAAID,EAAK,WAAW,EAcxC,CAEH;AAAA,IAAA;AAAA,EAAA,GAEP;AAEJ;"}
+{"version":3,"file":"RequirementsList.js","sources":["../../../../src/components/Common/RequirementsList/RequirementsList.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { useId } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Flex } from '../Flex/Flex'\nimport styles from './RequirementsList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport SuccessCheck from '@/assets/icons/checkbox.svg?react'\n\ninterface RequirementsListProps {\n  requirements: {\n    title: string\n    description: string\n    completed: boolean\n  }[]\n}\n/** @internal */\nexport const RequirementsList = ({ requirements }: RequirementsListProps) => {\n  const Components = useComponentContext()\n  const id = useId()\n  const { t } = useTranslation('common')\n\n  return (\n    <Flex flexDirection=\"column\" alignItems=\"flex-start\" gap={8}>\n      <Components.UnorderedList\n        className={styles.list}\n        items={requirements\n          .sort((a, b) => (a.completed ? -1 : 1))\n          .map((step, i) => {\n            return (\n              <div key={`${id}-${i}-${step.description}`} className={styles.listItem}>\n                {step.completed ? (\n                  <div className={classNames(styles.listItemIcon, styles.success)}>\n                    <SuccessCheck\n                      width={16}\n                      height={16}\n                      role=\"img\"\n                      aria-label={t('icons.completedStep')}\n                    />\n                  </div>\n                ) : (\n                  <div className={styles.listItemIcon}>{i + 1}</div>\n                )}\n                <Flex flexDirection=\"column\" gap={0}>\n                  <Components.Text size=\"md\" weight=\"medium\">\n                    {step.title}\n                  </Components.Text>\n                  <Components.Text variant=\"supporting\">{step.description}</Components.Text>\n                </Flex>\n              </div>\n            )\n          })}\n      />\n    </Flex>\n  )\n}\n"],"names":["RequirementsList","requirements","Components","useComponentContext","id","useId","t","useTranslation","Flex","jsx","styles","a","b","step","i","jsxs","classNames","SuccessCheck"],"mappings":";;;;;;;;AAgBO,MAAMA,IAAmB,CAAC,EAAE,cAAAC,QAA0C;AAC3E,QAAMC,IAAaC,EAAA,GACbC,IAAKC,EAAA,GACL,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ;AAErC,2BACGC,GAAA,EAAK,eAAc,UAAS,YAAW,cAAa,KAAK,GACxD,UAAA,gBAAAC;AAAA,IAACP,EAAW;AAAA,IAAX;AAAA,MACC,WAAWQ,EAAO;AAAA,MAClB,OAAOT,EACJ,KAAK,CAACU,GAAGC,MAAOD,EAAE,YAAY,KAAK,CAAE,EACrC,IAAI,CAACE,GAAMC,MAER,gBAAAC,EAAC,OAAA,EAA2C,WAAWL,EAAO,UAC3D,UAAA;AAAA,QAAAG,EAAK,8BACH,OAAA,EAAI,WAAWG,EAAWN,EAAO,cAAcA,EAAO,OAAO,GAC5D,UAAA,gBAAAD;AAAA,UAACQ;AAAAA,UAAA;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,MAAK;AAAA,YACL,cAAYX,EAAE,qBAAqB;AAAA,UAAA;AAAA,QAAA,EACrC,CACF,IAEA,gBAAAG,EAAC,OAAA,EAAI,WAAWC,EAAO,cAAe,cAAI,GAAE;AAAA,QAE9C,gBAAAK,EAACP,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,UAAA,gBAAAC,EAACP,EAAW,MAAX,EAAgB,MAAK,MAAK,QAAO,UAC/B,YAAK,MAAA,CACR;AAAA,4BACCA,EAAW,MAAX,EAAgB,SAAQ,cAAc,YAAK,YAAA,CAAY;AAAA,QAAA,EAAA,CAC1D;AAAA,MAAA,KAlBQ,GAAGE,CAAE,IAAIU,CAAC,IAAID,EAAK,WAAW,EAmBxC,CAEH;AAAA,IAAA;AAAA,EAAA,GAEP;AAEJ;"}

package/dist/components/Common/UI/Table/Table.module.scss.js

@@ -1,4 +1,4 @@
-const o = "_root_80o86_1", t = {
+const o = "_root_1b8fb_1", t = {
   root: o
 };
 export {

package/dist/components/Company/PaySchedule/PaySchedule.js

@@ -1,5 +1,5 @@
 import { jsx as r } from "react/jsx-runtime";
-import { useMemo as l } from "react";
+import { useState as u, useMemo as l } from "react";
 import { createMachine as p } from "robot3";
 import { usePaySchedulesGetAllSuspense as h } from "@gusto/embedded-api/react-query/paySchedulesGetAll";
 import { payScheduleStateMachine as S } from "./payScheduleStateMachine.js";
@@ -10,26 +10,32 @@ import { useI18n as P, useComponentDictionary as x } from "../../../i18n/I18n.js
 import { Flow as M } from "../../Flow/Flow.js";
 const L = ({
   companyId: e,
-  defaultValues: o,
-  dictionary: t,
-  ...n
-}) => /* @__PURE__ */ r(y, { ...n, children: /* @__PURE__ */ r(w, { companyId: e, defaultValues: o, dictionary: t }) });
-function w({ companyId: e, defaultValues: o, dictionary: t }) {
-  P("Company.PaySchedule"), x("Company.PaySchedule", t);
-  const { onEvent: n } = C(), { data: s } = h({ companyId: e }), m = (s.payScheduleShowResponse?.length ?? 0) > 0, c = m ? "listSchedules" : "addSchedule", i = m ? d : f, a = l(
+  defaultValues: t,
+  dictionary: n,
+  ...i
+}) => /* @__PURE__ */ r(y, { ...i, children: /* @__PURE__ */ r(w, { companyId: e, defaultValues: t, dictionary: n }) });
+function w({ companyId: e, defaultValues: t, dictionary: n }) {
+  P("Company.PaySchedule"), x("Company.PaySchedule", n);
+  const { onEvent: i } = C(), { data: s } = h({ companyId: e }), [{ initialState: a, initialComponent: m }] = u(() => {
+    const o = (s.payScheduleShowResponse?.length ?? 0) > 0;
+    return {
+      initialState: o ? "listSchedules" : "addSchedule",
+      initialComponent: o ? d : f
+    };
+  }), c = l(
     () => p(
-      c,
+      a,
       S,
-      (u) => ({
-        ...u,
-        component: i,
+      (o) => ({
+        ...o,
+        component: m,
         companyId: e,
-        defaultValues: o
+        defaultValues: t
       })
     ),
-    [e, o, c, i]
+    [e, t, a, m]
   );
-  return /* @__PURE__ */ r(M, { machine: a, onEvent: n });
+  return /* @__PURE__ */ r(M, { machine: c, onEvent: i });
 }
 export {
   L as PaySchedule

package/dist/components/Company/PaySchedule/PaySchedule.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaySchedule.js","sources":["../../../../src/components/Company/PaySchedule/PaySchedule.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { createMachine } from 'robot3'\nimport { usePaySchedulesGetAllSuspense } from '@gusto/embedded-api/react-query/paySchedulesGetAll'\nimport { payScheduleStateMachine } from './payScheduleStateMachine'\nimport type { PayScheduleContextInterface } from './PayScheduleComponents'\nimport { PayScheduleFormContextual, PayScheduleListContextual } from './PayScheduleComponents'\nimport type { PayScheduleFormData } from './shared/usePayScheduleForm/payScheduleSchema'\nimport type { BaseComponentInterface } from '@/components/Base'\nimport { BaseComponent, useBase } from '@/components/Base'\nimport type { BaseComponentKeys } from '@/components/Base/Base'\nimport { useI18n } from '@/i18n'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\n/**\n * The full set of fields that may be pre-filled on the {@link PaySchedule} create form.\n *\n * @public\n */\nexport type PayScheduleDefaultFields = {\n  [\n    K in keyof Pick<\n      PayScheduleFormData,\n      'anchorPayDate' | 'anchorEndOfPayPeriod' | 'day1' | 'day2' | 'customName' | 'frequency'\n    >\n  ]: NonNullable<PayScheduleFormData[K]>\n}\n\n/**\n * Default values for the {@link PaySchedule} form fields. Server data for an existing pay schedule\n * takes precedence over these defaults when editing.\n *\n * @public\n */\nexport type PayScheduleDefaultValues = RequireAtLeastOne<Partial<PayScheduleDefaultFields>>\n\n/**\n * Props for the {@link PaySchedule} component.\n *\n * @public\n */\nexport interface PayScheduleProps extends BaseComponentInterface<'Company.PaySchedule'> {\n  /** Identifier of the company whose pay schedules are managed. */\n  companyId: string\n  /** Default values used to pre-fill the create form. Ignored fields not listed in {@link PayScheduleDefaultValues}. */\n  defaultValues?: PayScheduleDefaultValues\n}\n\n/**\n * Manages a company's pay schedules, including listing existing schedules and creating or editing one.\n *\n * @remarks\n * Renders the schedule list when at least one pay schedule exists and the create form otherwise.\n * Emits the following events through `onEvent`:\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `paySchedule/created` | A new pay schedule was created | The created pay schedule entity |\n * | `paySchedule/updated` | An existing pay schedule was updated | The updated pay schedule entity |\n *\n * @param props - {@link PayScheduleProps} plus the standard base component props.\n * @returns The pay schedule list or form depending on whether any schedules exist.\n * @public\n */\nexport const PaySchedule = ({\n  companyId,\n  defaultValues,\n  dictionary,\n  ...props\n}: PayScheduleProps) => {\n  return (\n    <BaseComponent {...props}>\n      <Root companyId={companyId} defaultValues={defaultValues} dictionary={dictionary} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ companyId, defaultValues, dictionary }: Omit<PayScheduleProps, BaseComponentKeys>) {\n  useI18n('Company.PaySchedule')\n  useComponentDictionary('Company.PaySchedule', dictionary)\n  const { onEvent } = useBase()\n  const { data: paySchedules } = usePaySchedulesGetAllSuspense({ companyId })\n\n  const hasSchedules = (paySchedules.payScheduleShowResponse?.length ?? 0) > 0\n  const initialState = hasSchedules ? 'listSchedules' : 'addSchedule'\n  const initialComponent = hasSchedules ? PayScheduleListContextual : PayScheduleFormContextual\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        initialState,\n        payScheduleStateMachine,\n        (initialContext: PayScheduleContextInterface) => ({\n          ...initialContext,\n          component: initialComponent,\n          companyId,\n          defaultValues,\n        }),\n      ),\n    [companyId, defaultValues, initialState, initialComponent],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["PaySchedule","companyId","defaultValues","dictionary","props","jsx","BaseComponent","Root","useI18n","useComponentDictionary","onEvent","useBase","paySchedules","usePaySchedulesGetAllSuspense","hasSchedules","initialState","initialComponent","PayScheduleListContextual","PayScheduleFormContextual","machine","useMemo","createMachine","payScheduleStateMachine","initialContext","Flow"],"mappings":";;;;;;;;;;AAkEO,MAAMA,IAAc,CAAC;AAAA,EAC1B,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC,EAACC,KAAe,GAAGF,GACjB,4BAACG,GAAA,EAAK,WAAAN,GAAsB,eAAAC,GAA8B,YAAAC,EAAA,CAAwB,EAAA,CACpF;AAIJ,SAASI,EAAK,EAAE,WAAAN,GAAW,eAAAC,GAAe,YAAAC,KAAyD;AACjG,EAAAK,EAAQ,qBAAqB,GAC7BC,EAAuB,uBAAuBN,CAAU;AACxD,QAAM,EAAE,SAAAO,EAAA,IAAYC,EAAA,GACd,EAAE,MAAMC,EAAA,IAAiBC,EAA8B,EAAE,WAAAZ,GAAW,GAEpEa,KAAgBF,EAAa,yBAAyB,UAAU,KAAK,GACrEG,IAAeD,IAAe,kBAAkB,eAChDE,IAAmBF,IAAeG,IAA4BC,GAE9DC,IAAUC;AAAA,IACd,MACEC;AAAA,MACEN;AAAA,MACAO;AAAA,MACA,CAACC,OAAiD;AAAA,QAChD,GAAGA;AAAA,QACH,WAAWP;AAAA,QACX,WAAAf;AAAA,QACA,eAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACD,GAAWC,GAAea,GAAcC,CAAgB;AAAA,EAAA;AAG3D,SAAO,gBAAAX,EAACmB,GAAA,EAAK,SAAAL,GAAkB,SAAAT,EAAA,CAAkB;AACnD;"}
+{"version":3,"file":"PaySchedule.js","sources":["../../../../src/components/Company/PaySchedule/PaySchedule.tsx"],"sourcesContent":["import { useMemo, useState } from 'react'\nimport { createMachine } from 'robot3'\nimport { usePaySchedulesGetAllSuspense } from '@gusto/embedded-api/react-query/paySchedulesGetAll'\nimport { payScheduleStateMachine } from './payScheduleStateMachine'\nimport type { PayScheduleContextInterface } from './PayScheduleComponents'\nimport { PayScheduleFormContextual, PayScheduleListContextual } from './PayScheduleComponents'\nimport type { PayScheduleFormData } from './shared/usePayScheduleForm/payScheduleSchema'\nimport type { BaseComponentInterface } from '@/components/Base'\nimport { BaseComponent, useBase } from '@/components/Base'\nimport type { BaseComponentKeys } from '@/components/Base/Base'\nimport { useI18n } from '@/i18n'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\n/**\n * The full set of fields that may be pre-filled on the {@link PaySchedule} create form.\n *\n * @public\n */\nexport type PayScheduleDefaultFields = {\n  [\n    K in keyof Pick<\n      PayScheduleFormData,\n      'anchorPayDate' | 'anchorEndOfPayPeriod' | 'day1' | 'day2' | 'customName' | 'frequency'\n    >\n  ]: NonNullable<PayScheduleFormData[K]>\n}\n\n/**\n * Default values for the {@link PaySchedule} form fields. Server data for an existing pay schedule\n * takes precedence over these defaults when editing.\n *\n * @public\n */\nexport type PayScheduleDefaultValues = RequireAtLeastOne<Partial<PayScheduleDefaultFields>>\n\n/**\n * Props for the {@link PaySchedule} component.\n *\n * @public\n */\nexport interface PayScheduleProps extends BaseComponentInterface<'Company.PaySchedule'> {\n  /** Identifier of the company whose pay schedules are managed. */\n  companyId: string\n  /** Default values used to pre-fill the create form. Ignored fields not listed in {@link PayScheduleDefaultValues}. */\n  defaultValues?: PayScheduleDefaultValues\n}\n\n/**\n * Manages a company's pay schedules, including listing existing schedules and creating or editing one.\n *\n * @remarks\n * Renders the schedule list when at least one pay schedule exists and the create form otherwise.\n * Emits the following events through `onEvent`:\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `paySchedule/created` | A new pay schedule was created | The created pay schedule entity |\n * | `paySchedule/updated` | An existing pay schedule was updated | The updated pay schedule entity |\n *\n * @param props - {@link PayScheduleProps} plus the standard base component props.\n * @returns The pay schedule list or form depending on whether any schedules exist.\n * @public\n */\nexport const PaySchedule = ({\n  companyId,\n  defaultValues,\n  dictionary,\n  ...props\n}: PayScheduleProps) => {\n  return (\n    <BaseComponent {...props}>\n      <Root companyId={companyId} defaultValues={defaultValues} dictionary={dictionary} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ companyId, defaultValues, dictionary }: Omit<PayScheduleProps, BaseComponentKeys>) {\n  useI18n('Company.PaySchedule')\n  useComponentDictionary('Company.PaySchedule', dictionary)\n  const { onEvent } = useBase()\n  const { data: paySchedules } = usePaySchedulesGetAllSuspense({ companyId })\n\n  // Freeze the initial routing decision. Recomputing it after a later refetch (e.g. once\n  // the first schedule is created) would re-seat the machine and orphan its interpreter.\n  const [{ initialState, initialComponent }] = useState<{\n    initialState: keyof typeof payScheduleStateMachine\n    initialComponent: typeof PayScheduleListContextual | typeof PayScheduleFormContextual\n  }>(() => {\n    const hasSchedules = (paySchedules.payScheduleShowResponse?.length ?? 0) > 0\n    return {\n      initialState: hasSchedules ? 'listSchedules' : 'addSchedule',\n      initialComponent: hasSchedules ? PayScheduleListContextual : PayScheduleFormContextual,\n    }\n  })\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        initialState,\n        payScheduleStateMachine,\n        (initialContext: PayScheduleContextInterface) => ({\n          ...initialContext,\n          component: initialComponent,\n          companyId,\n          defaultValues,\n        }),\n      ),\n    [companyId, defaultValues, initialState, initialComponent],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["PaySchedule","companyId","defaultValues","dictionary","props","jsx","BaseComponent","Root","useI18n","useComponentDictionary","onEvent","useBase","paySchedules","usePaySchedulesGetAllSuspense","initialState","initialComponent","useState","hasSchedules","PayScheduleListContextual","PayScheduleFormContextual","machine","useMemo","createMachine","payScheduleStateMachine","initialContext","Flow"],"mappings":";;;;;;;;;;AAkEO,MAAMA,IAAc,CAAC;AAAA,EAC1B,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC,EAACC,KAAe,GAAGF,GACjB,4BAACG,GAAA,EAAK,WAAAN,GAAsB,eAAAC,GAA8B,YAAAC,EAAA,CAAwB,EAAA,CACpF;AAIJ,SAASI,EAAK,EAAE,WAAAN,GAAW,eAAAC,GAAe,YAAAC,KAAyD;AACjG,EAAAK,EAAQ,qBAAqB,GAC7BC,EAAuB,uBAAuBN,CAAU;AACxD,QAAM,EAAE,SAAAO,EAAA,IAAYC,EAAA,GACd,EAAE,MAAMC,EAAA,IAAiBC,EAA8B,EAAE,WAAAZ,GAAW,GAIpE,CAAC,EAAE,cAAAa,GAAc,kBAAAC,GAAkB,IAAIC,EAG1C,MAAM;AACP,UAAMC,KAAgBL,EAAa,yBAAyB,UAAU,KAAK;AAC3E,WAAO;AAAA,MACL,cAAcK,IAAe,kBAAkB;AAAA,MAC/C,kBAAkBA,IAAeC,IAA4BC;AAAA,IAAA;AAAA,EAEjE,CAAC,GAEKC,IAAUC;AAAA,IACd,MACEC;AAAA,MACER;AAAA,MACAS;AAAA,MACA,CAACC,OAAiD;AAAA,QAChD,GAAGA;AAAA,QACH,WAAWT;AAAA,QACX,WAAAd;AAAA,QACA,eAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACD,GAAWC,GAAeY,GAAcC,CAAgB;AAAA,EAAA;AAG3D,SAAO,gBAAAV,EAACoB,GAAA,EAAK,SAAAL,GAAkB,SAAAV,EAAA,CAAkB;AACnD;"}

package/dist/components/Company/StateTaxes/TaxRateManagement/TaxRateHistorySection.js

@@ -37,6 +37,7 @@ function Y({ group: t, showHeader: c = !0 }) {
       ...u.map((e) => ({
         key: e.key,
         title: e.label ?? e.key,
+        justify: "end",
         render: (y) => y.values[e.key] ?? ""
       }))
     ],

package/dist/components/Company/StateTaxes/TaxRateManagement/TaxRateHistorySection.js.map

@@ -1 +1 @@
-{"version":3,"file":"TaxRateHistorySection.js","sources":["../../../../../src/components/Company/StateTaxes/TaxRateManagement/TaxRateHistorySection.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useTaxRateManagement, type TaxRateKeyGroup } from './context'\nimport { extractRequirementColumns, toHistoryRows, type HistoryRow } from './toHistoryRows'\nimport { AddRateAction } from './AddRateAction'\nimport { DataView, EmptyData, Flex, useDataView, VisuallyHidden } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface TaxRateHistorySectionProps {\n  group: TaxRateKeyGroup\n  /**\n   * Whether to render this group's own heading + \"Add tax rate\" button.\n   *\n   * @remarks\n   * Set to `false` when this is the only group for the state — the page-level header already\n   * carries the title and the single add-rate action, so a repeated per-group header would be\n   * redundant.\n   *\n   * @defaultValue `true`\n   */\n  showHeader?: boolean\n}\n\ntype BadgeStatus = 'success' | 'info' | 'warning'\n\nconst statusBadgeMap = {\n  current: 'success',\n  scheduled: 'info',\n  historical: 'warning',\n} as const satisfies Record<HistoryRow['status'], BadgeStatus>\n\nconst statusLabelKeyMap = {\n  current: 'currentBadge',\n  scheduled: 'scheduledBadge',\n  historical: 'historicalBadge',\n} as const satisfies Record<HistoryRow['status'], string>\n\n/** @internal */\nexport function TaxRateHistorySection({ group, showHeader = true }: TaxRateHistorySectionProps) {\n  const { t } = useTranslation('Company.StateTaxes', { keyPrefix: 'manageRates' })\n  const Components = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const { state } = useTaxRateManagement()\n\n  const rows = useMemo(() => toHistoryRows(group.sets), [group.sets])\n  const requirementColumns = useMemo(() => extractRequirementColumns(group.sets), [group.sets])\n\n  const sectionLabel = group.label ?? group.key\n\n  const { ...dataViewProps } = useDataView<HistoryRow>({\n    data: rows,\n    columns: [\n      {\n        key: 'effectiveFrom',\n        title: t('effectiveDateColumnLabel'),\n        render: row => dateFormatter.formatLongWithYear(row.effectiveFrom),\n      },\n      {\n        key: 'status',\n        title: <VisuallyHidden>{t('statusColumnLabel')}</VisuallyHidden>,\n        render: row => (\n          <Components.Badge status={statusBadgeMap[row.status]}>\n            {t(statusLabelKeyMap[row.status])}\n          </Components.Badge>\n        ),\n      },\n      ...requirementColumns.map(column => ({\n        key: column.key,\n        title: column.label ?? column.key,\n        render: (row: HistoryRow) => row.values[column.key] ?? '',\n      })),\n    ],\n    emptyState: () => (\n      <EmptyData title={t('emptyHistoryTitle')} description={t('emptyHistoryDescription')} />\n    ),\n  })\n\n  return (\n    <section aria-label={sectionLabel}>\n      <Flex flexDirection=\"column\" gap={16} alignItems=\"stretch\">\n        {showHeader && (\n          <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={16}>\n            <Components.Heading as=\"h3\">{sectionLabel}</Components.Heading>\n            <AddRateAction state={state} group={group} />\n          </Flex>\n        )}\n        <DataView label={sectionLabel} {...dataViewProps} />\n      </Flex>\n    </section>\n  )\n}\n"],"names":["statusBadgeMap","statusLabelKeyMap","TaxRateHistorySection","group","showHeader","t","useTranslation","Components","useComponentContext","dateFormatter","useDateFormatter","state","useTaxRateManagement","rows","useMemo","toHistoryRows","requirementColumns","extractRequirementColumns","sectionLabel","dataViewProps","useDataView","row","jsx","VisuallyHidden","column","EmptyData","jsxs","Flex","AddRateAction","DataView"],"mappings":";;;;;;;;;;;;;AA0BA,MAAMA,IAAiB;AAAA,EACrB,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AACd,GAEMC,IAAoB;AAAA,EACxB,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AACd;AAGO,SAASC,EAAsB,EAAE,OAAAC,GAAO,YAAAC,IAAa,MAAoC;AAC9F,QAAM,EAAE,GAAAC,MAAMC,EAAe,sBAAsB,EAAE,WAAW,eAAe,GACzEC,IAAaC,EAAA,GACbC,IAAgBC,EAAA,GAChB,EAAE,OAAAC,EAAA,IAAUC,EAAA,GAEZC,IAAOC,EAAQ,MAAMC,EAAcZ,EAAM,IAAI,GAAG,CAACA,EAAM,IAAI,CAAC,GAC5Da,IAAqBF,EAAQ,MAAMG,EAA0Bd,EAAM,IAAI,GAAG,CAACA,EAAM,IAAI,CAAC,GAEtFe,IAAef,EAAM,SAASA,EAAM,KAEpC,EAAE,GAAGgB,EAAA,IAAkBC,EAAwB;AAAA,IACnD,MAAMP;AAAA,IACN,SAAS;AAAA,MACP;AAAA,QACE,KAAK;AAAA,QACL,OAAOR,EAAE,0BAA0B;AAAA,QACnC,QAAQ,CAAAgB,MAAOZ,EAAc,mBAAmBY,EAAI,aAAa;AAAA,MAAA;AAAA,MAEnE;AAAA,QACE,KAAK;AAAA,QACL,OAAO,gBAAAC,EAACC,GAAA,EAAgB,UAAAlB,EAAE,mBAAmB,GAAE;AAAA,QAC/C,QAAQ,CAAAgB,MACN,gBAAAC,EAACf,EAAW,OAAX,EAAiB,QAAQP,EAAeqB,EAAI,MAAM,GAChD,UAAAhB,EAAEJ,EAAkBoB,EAAI,MAAM,CAAC,EAAA,CAClC;AAAA,MAAA;AAAA,MAGJ,GAAGL,EAAmB,IAAI,CAAAQ,OAAW;AAAA,QACnC,KAAKA,EAAO;AAAA,QACZ,OAAOA,EAAO,SAASA,EAAO;AAAA,QAC9B,QAAQ,CAACH,MAAoBA,EAAI,OAAOG,EAAO,GAAG,KAAK;AAAA,MAAA,EACvD;AAAA,IAAA;AAAA,IAEJ,YAAY,MACV,gBAAAF,EAACG,GAAA,EAAU,OAAOpB,EAAE,mBAAmB,GAAG,aAAaA,EAAE,yBAAyB,EAAA,CAAG;AAAA,EAAA,CAExF;AAED,SACE,gBAAAiB,EAAC,WAAA,EAAQ,cAAYJ,GACnB,UAAA,gBAAAQ,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAAI,YAAW,WAC9C,UAAA;AAAA,IAAAvB,uBACEuB,GAAA,EAAK,gBAAe,iBAAgB,YAAW,UAAS,KAAK,IAC5D,UAAA;AAAA,MAAA,gBAAAL,EAACf,EAAW,SAAX,EAAmB,IAAG,MAAM,UAAAW,GAAa;AAAA,MAC1C,gBAAAI,EAACM,GAAA,EAAc,OAAAjB,GAAc,OAAAR,EAAA,CAAc;AAAA,IAAA,GAC7C;AAAA,IAEF,gBAAAmB,EAACO,GAAA,EAAS,OAAOX,GAAe,GAAGC,EAAA,CAAe;AAAA,EAAA,EAAA,CACpD,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"TaxRateHistorySection.js","sources":["../../../../../src/components/Company/StateTaxes/TaxRateManagement/TaxRateHistorySection.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useTaxRateManagement, type TaxRateKeyGroup } from './context'\nimport { extractRequirementColumns, toHistoryRows, type HistoryRow } from './toHistoryRows'\nimport { AddRateAction } from './AddRateAction'\nimport { DataView, EmptyData, Flex, useDataView, VisuallyHidden } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface TaxRateHistorySectionProps {\n  group: TaxRateKeyGroup\n  /**\n   * Whether to render this group's own heading + \"Add tax rate\" button.\n   *\n   * @remarks\n   * Set to `false` when this is the only group for the state — the page-level header already\n   * carries the title and the single add-rate action, so a repeated per-group header would be\n   * redundant.\n   *\n   * @defaultValue `true`\n   */\n  showHeader?: boolean\n}\n\ntype BadgeStatus = 'success' | 'info' | 'warning'\n\nconst statusBadgeMap = {\n  current: 'success',\n  scheduled: 'info',\n  historical: 'warning',\n} as const satisfies Record<HistoryRow['status'], BadgeStatus>\n\nconst statusLabelKeyMap = {\n  current: 'currentBadge',\n  scheduled: 'scheduledBadge',\n  historical: 'historicalBadge',\n} as const satisfies Record<HistoryRow['status'], string>\n\n/** @internal */\nexport function TaxRateHistorySection({ group, showHeader = true }: TaxRateHistorySectionProps) {\n  const { t } = useTranslation('Company.StateTaxes', { keyPrefix: 'manageRates' })\n  const Components = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const { state } = useTaxRateManagement()\n\n  const rows = useMemo(() => toHistoryRows(group.sets), [group.sets])\n  const requirementColumns = useMemo(() => extractRequirementColumns(group.sets), [group.sets])\n\n  const sectionLabel = group.label ?? group.key\n\n  const { ...dataViewProps } = useDataView<HistoryRow>({\n    data: rows,\n    columns: [\n      {\n        key: 'effectiveFrom',\n        title: t('effectiveDateColumnLabel'),\n        render: row => dateFormatter.formatLongWithYear(row.effectiveFrom),\n      },\n      {\n        key: 'status',\n        title: <VisuallyHidden>{t('statusColumnLabel')}</VisuallyHidden>,\n        render: row => (\n          <Components.Badge status={statusBadgeMap[row.status]}>\n            {t(statusLabelKeyMap[row.status])}\n          </Components.Badge>\n        ),\n      },\n      ...requirementColumns.map(column => ({\n        key: column.key,\n        title: column.label ?? column.key,\n        justify: 'end' as const,\n        render: (row: HistoryRow) => row.values[column.key] ?? '',\n      })),\n    ],\n    emptyState: () => (\n      <EmptyData title={t('emptyHistoryTitle')} description={t('emptyHistoryDescription')} />\n    ),\n  })\n\n  return (\n    <section aria-label={sectionLabel}>\n      <Flex flexDirection=\"column\" gap={16} alignItems=\"stretch\">\n        {showHeader && (\n          <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={16}>\n            <Components.Heading as=\"h3\">{sectionLabel}</Components.Heading>\n            <AddRateAction state={state} group={group} />\n          </Flex>\n        )}\n        <DataView label={sectionLabel} {...dataViewProps} />\n      </Flex>\n    </section>\n  )\n}\n"],"names":["statusBadgeMap","statusLabelKeyMap","TaxRateHistorySection","group","showHeader","t","useTranslation","Components","useComponentContext","dateFormatter","useDateFormatter","state","useTaxRateManagement","rows","useMemo","toHistoryRows","requirementColumns","extractRequirementColumns","sectionLabel","dataViewProps","useDataView","row","jsx","VisuallyHidden","column","EmptyData","jsxs","Flex","AddRateAction","DataView"],"mappings":";;;;;;;;;;;;;AA0BA,MAAMA,IAAiB;AAAA,EACrB,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AACd,GAEMC,IAAoB;AAAA,EACxB,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AACd;AAGO,SAASC,EAAsB,EAAE,OAAAC,GAAO,YAAAC,IAAa,MAAoC;AAC9F,QAAM,EAAE,GAAAC,MAAMC,EAAe,sBAAsB,EAAE,WAAW,eAAe,GACzEC,IAAaC,EAAA,GACbC,IAAgBC,EAAA,GAChB,EAAE,OAAAC,EAAA,IAAUC,EAAA,GAEZC,IAAOC,EAAQ,MAAMC,EAAcZ,EAAM,IAAI,GAAG,CAACA,EAAM,IAAI,CAAC,GAC5Da,IAAqBF,EAAQ,MAAMG,EAA0Bd,EAAM,IAAI,GAAG,CAACA,EAAM,IAAI,CAAC,GAEtFe,IAAef,EAAM,SAASA,EAAM,KAEpC,EAAE,GAAGgB,EAAA,IAAkBC,EAAwB;AAAA,IACnD,MAAMP;AAAA,IACN,SAAS;AAAA,MACP;AAAA,QACE,KAAK;AAAA,QACL,OAAOR,EAAE,0BAA0B;AAAA,QACnC,QAAQ,CAAAgB,MAAOZ,EAAc,mBAAmBY,EAAI,aAAa;AAAA,MAAA;AAAA,MAEnE;AAAA,QACE,KAAK;AAAA,QACL,OAAO,gBAAAC,EAACC,GAAA,EAAgB,UAAAlB,EAAE,mBAAmB,GAAE;AAAA,QAC/C,QAAQ,CAAAgB,MACN,gBAAAC,EAACf,EAAW,OAAX,EAAiB,QAAQP,EAAeqB,EAAI,MAAM,GAChD,UAAAhB,EAAEJ,EAAkBoB,EAAI,MAAM,CAAC,EAAA,CAClC;AAAA,MAAA;AAAA,MAGJ,GAAGL,EAAmB,IAAI,CAAAQ,OAAW;AAAA,QACnC,KAAKA,EAAO;AAAA,QACZ,OAAOA,EAAO,SAASA,EAAO;AAAA,QAC9B,SAAS;AAAA,QACT,QAAQ,CAACH,MAAoBA,EAAI,OAAOG,EAAO,GAAG,KAAK;AAAA,MAAA,EACvD;AAAA,IAAA;AAAA,IAEJ,YAAY,MACV,gBAAAF,EAACG,GAAA,EAAU,OAAOpB,EAAE,mBAAmB,GAAG,aAAaA,EAAE,yBAAyB,EAAA,CAAG;AAAA,EAAA,CAExF;AAED,SACE,gBAAAiB,EAAC,WAAA,EAAQ,cAAYJ,GACnB,UAAA,gBAAAQ,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAAI,YAAW,WAC9C,UAAA;AAAA,IAAAvB,uBACEuB,GAAA,EAAK,gBAAe,iBAAgB,YAAW,UAAS,KAAK,IAC5D,UAAA;AAAA,MAAA,gBAAAL,EAACf,EAAW,SAAX,EAAmB,IAAG,MAAM,UAAAW,GAAa;AAAA,MAC1C,gBAAAI,EAACM,GAAA,EAAc,OAAAjB,GAAc,OAAAR,EAAA,CAAc;AAAA,IAAA,GAC7C;AAAA,IAEF,gBAAAmB,EAACO,GAAA,EAAS,OAAOX,GAAe,GAAGC,EAAA,CAAe;AAAA,EAAA,EAAA,CACpD,EAAA,CACF;AAEJ;"}

package/dist/components/Contractor/Compensation/management/CompensationEditForm.js

@@ -1,25 +1,25 @@
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { useTranslation as T } from "react-i18next";
 import E from "classnames";
-import { useContractorPayForm as N } from "../shared/useContractorPayForm/useContractorPayForm.js";
+import { useContractorPayForm as R } from "../shared/useContractorPayForm/useContractorPayForm.js";
 import { WageType as d } from "../shared/useContractorPayForm/contractorPaySchema.js";
-import b from "./CompensationEditForm.module.scss.js";
-import { BaseBoundaries as R, BaseLayout as f } from "../../../Base/Base.js";
+import N from "./CompensationEditForm.module.scss.js";
+import { BaseBoundaries as A, BaseLayout as f } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
-import { Flex as A } from "../../../Common/Flex/Flex.js";
-import { ActionsLayout as M } from "../../../Common/ActionsLayout/ActionsLayout.js";
-import { Form as D } from "../../../Common/Form/Form.js";
-import { SDKFormProvider as F } from "../../../../partner-hook-utils/form/SDKFormProvider.js";
-import { useI18n as L, useComponentDictionary as x } from "../../../../i18n/I18n.js";
+import { Flex as M } from "../../../Common/Flex/Flex.js";
+import { ActionsLayout as b } from "../../../Common/ActionsLayout/ActionsLayout.js";
+import { Form as L } from "../../../Common/Form/Form.js";
+import { SDKFormProvider as x } from "../../../../partner-hook-utils/form/SDKFormProvider.js";
+import { useI18n as D, useComponentDictionary as F } from "../../../../i18n/I18n.js";
 import { componentEvents as C } from "../../../../shared/constants.js";
 import { useComponentContext as O } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-function z({
+function Y({
   FallbackComponent: a,
   LoaderComponent: i,
   ...m
 }) {
   return /* @__PURE__ */ o(
-    R,
+    A,
     {
       componentName: "Contractor.Management.Compensation",
       FallbackComponent: a,
@@ -35,8 +35,8 @@ function H({
   onEvent: l,
   LoaderComponent: c
 }) {
-  L("Contractor.Management.Compensation"), x("Contractor.Management.Compensation", m);
-  const { t: r } = T("Contractor.Management.Compensation"), e = O(), t = N({ contractorId: a });
+  D("Contractor.Management.Compensation"), F("Contractor.Management.Compensation", m);
+  const { t: r } = T("Contractor.Management.Compensation"), e = O(), t = R({ contractorId: a });
   if (t.isLoading)
     return /* @__PURE__ */ o(
       f,
@@ -61,8 +61,8 @@ function H({
       }))
     }
   );
-  return /* @__PURE__ */ o("section", { className: E(b.container, i), children: /* @__PURE__ */ o(f, { error: t.errorHandling.errors, LoaderComponent: c, children: /* @__PURE__ */ o(F, { formHookResult: t, children: /* @__PURE__ */ s(D, { onSubmit: y, children: [
-    /* @__PURE__ */ s(A, { flexDirection: "column", gap: 4, children: [
+  return /* @__PURE__ */ o("section", { className: E(N.container, i), children: /* @__PURE__ */ o(f, { error: t.errorHandling.errors, LoaderComponent: c, children: /* @__PURE__ */ o(x, { formHookResult: t, children: /* @__PURE__ */ s(L, { onSubmit: y, children: [
+    /* @__PURE__ */ s(M, { flexDirection: "column", gap: 4, children: [
       /* @__PURE__ */ o(e.Heading, { as: "h2", children: r("form.title") }),
       /* @__PURE__ */ o(e.Text, { variant: "supporting", children: r("form.description") })
     ] }),
@@ -79,16 +79,19 @@ function H({
       {
         label: r("form.hourlyRateLabel"),
         format: "currency",
-        validationMessages: { REQUIRED: r("form.validations.hourlyRate") }
+        validationMessages: {
+          REQUIRED: r("form.validations.hourlyRate"),
+          MAX_HOURLY_RATE: r("form.validations.hourlyRateMax")
+        }
       }
     ),
-    /* @__PURE__ */ s(M, { children: [
+    /* @__PURE__ */ s(b, { children: [
       /* @__PURE__ */ o(e.Button, { variant: "secondary", onClick: g, type: "button", children: r("form.cancelCta") }),
       /* @__PURE__ */ o(e.Button, { type: "submit", isLoading: t.status.isPending, children: r("form.saveCta") })
     ] })
   ] }) }) }) });
 }
 export {
-  z as CompensationEditForm
+  Y as CompensationEditForm
 };
 //# sourceMappingURL=CompensationEditForm.js.map

package/dist/components/Contractor/Compensation/management/CompensationEditForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompensationEditForm.js","sources":["../../../../../src/components/Contractor/Compensation/management/CompensationEditForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { useContractorPayForm, WageType } from '../shared/useContractorPayForm'\nimport styles from './CompensationEditForm.module.scss'\nimport { BaseBoundaries, BaseLayout, type BaseComponentInterface } from '@/components/Base'\nimport { ActionsLayout } from '@/components/Common'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { Form } from '@/components/Common/Form'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport type { RadioGroupProps } from '@/components/Common/UI/RadioGroup/RadioGroupTypes'\n\n/**\n * Props for {@link CompensationEditForm}.\n *\n * @public\n */\nexport interface CompensationEditFormProps extends BaseComponentInterface<'Contractor.Management.Compensation'> {\n  /** The associated contractor identifier. */\n  contractorId: string\n}\n\n/**\n * Standalone edit form for a contractor's compensation type and rate.\n *\n * @remarks\n * Renders a Fixed/Hourly compensation-type selector and, when Hourly, an\n * hourly-rate field. Save and Cancel both emit events so the parent can\n * return to the read view.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `contractor/management/compensation/updated` | Fired after compensation is successfully saved | The updated `Contractor` entity |\n * | `contractor/management/compensation/editCancelled` | Fired when the user clicks Cancel | — |\n *\n * @param input - See {@link CompensationEditFormProps}.\n * @returns The contractor compensation edit form.\n * @public\n */\nexport function CompensationEditForm({\n  FallbackComponent,\n  LoaderComponent,\n  ...props\n}: CompensationEditFormProps) {\n  return (\n    <BaseBoundaries\n      componentName=\"Contractor.Management.Compensation\"\n      FallbackComponent={FallbackComponent}\n      LoaderComponent={LoaderComponent}\n    >\n      <CompensationEditFormRoot LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction CompensationEditFormRoot({\n  contractorId,\n  className,\n  dictionary,\n  onEvent,\n  LoaderComponent,\n}: CompensationEditFormProps) {\n  useI18n('Contractor.Management.Compensation')\n  useComponentDictionary('Contractor.Management.Compensation', dictionary)\n  const { t } = useTranslation('Contractor.Management.Compensation')\n  const Components = useComponentContext()\n\n  const payForm = useContractorPayForm({ contractorId })\n\n  if (payForm.isLoading) {\n    return (\n      <BaseLayout\n        isLoading\n        error={payForm.errorHandling.errors}\n        LoaderComponent={LoaderComponent}\n      />\n    )\n  }\n\n  const { Fields } = payForm.form\n\n  const handleSubmit = async () => {\n    const result = await payForm.actions.onSubmit()\n    if (!result) return\n    onEvent(componentEvents.CONTRACTOR_MANAGEMENT_COMPENSATION_UPDATED, result.data)\n  }\n\n  const handleCancel = () => {\n    onEvent(componentEvents.CONTRACTOR_MANAGEMENT_COMPENSATION_EDIT_CANCELLED)\n  }\n\n  const WageTypeFieldComponent = (radioProps: RadioGroupProps) => (\n    <Components.RadioGroup\n      {...radioProps}\n      options={radioProps.options.map(option => ({\n        ...option,\n        description:\n          option.value === WageType.Hourly\n            ? t('form.hourlyDescription')\n            : t('form.fixedDescription'),\n      }))}\n    />\n  )\n\n  return (\n    <section className={classNames(styles.container, className)}>\n      <BaseLayout error={payForm.errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <SDKFormProvider formHookResult={payForm}>\n          <Form onSubmit={handleSubmit}>\n            <Flex flexDirection=\"column\" gap={4}>\n              <Components.Heading as=\"h2\">{t('form.title')}</Components.Heading>\n              <Components.Text variant=\"supporting\">{t('form.description')}</Components.Text>\n            </Flex>\n            <Fields.WageType\n              label={t('form.wageTypeLabel')}\n              getOptionLabel={(value: string) =>\n                value === WageType.Hourly ? t('hourlyLabel') : t('fixedLabel')\n              }\n              FieldComponent={WageTypeFieldComponent}\n            />\n            {payForm.status.isHourly && (\n              <Fields.HourlyRate\n                label={t('form.hourlyRateLabel')}\n                format=\"currency\"\n                validationMessages={{ REQUIRED: t('form.validations.hourlyRate') }}\n              />\n            )}\n            <ActionsLayout>\n              <Components.Button variant=\"secondary\" onClick={handleCancel} type=\"button\">\n                {t('form.cancelCta')}\n              </Components.Button>\n              <Components.Button type=\"submit\" isLoading={payForm.status.isPending}>\n                {t('form.saveCta')}\n              </Components.Button>\n            </ActionsLayout>\n          </Form>\n        </SDKFormProvider>\n      </BaseLayout>\n    </section>\n  )\n}\n"],"names":["CompensationEditForm","FallbackComponent","LoaderComponent","props","jsx","BaseBoundaries","CompensationEditFormRoot","contractorId","className","dictionary","onEvent","useI18n","useComponentDictionary","t","useTranslation","Components","useComponentContext","payForm","useContractorPayForm","BaseLayout","Fields","handleSubmit","result","componentEvents","handleCancel","WageTypeFieldComponent","radioProps","option","WageType","classNames","styles","SDKFormProvider","jsxs","Form","Flex","value","ActionsLayout"],"mappings":"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"}
+{"version":3,"file":"CompensationEditForm.js","sources":["../../../../../src/components/Contractor/Compensation/management/CompensationEditForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { useContractorPayForm, WageType } from '../shared/useContractorPayForm'\nimport styles from './CompensationEditForm.module.scss'\nimport { BaseBoundaries, BaseLayout, type BaseComponentInterface } from '@/components/Base'\nimport { ActionsLayout } from '@/components/Common'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { Form } from '@/components/Common/Form'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport type { RadioGroupProps } from '@/components/Common/UI/RadioGroup/RadioGroupTypes'\n\n/**\n * Props for {@link CompensationEditForm}.\n *\n * @public\n */\nexport interface CompensationEditFormProps extends BaseComponentInterface<'Contractor.Management.Compensation'> {\n  /** The associated contractor identifier. */\n  contractorId: string\n}\n\n/**\n * Standalone edit form for a contractor's compensation type and rate.\n *\n * @remarks\n * Renders a Fixed/Hourly compensation-type selector and, when Hourly, an\n * hourly-rate field. Save and Cancel both emit events so the parent can\n * return to the read view.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `contractor/management/compensation/updated` | Fired after compensation is successfully saved | The updated `Contractor` entity |\n * | `contractor/management/compensation/editCancelled` | Fired when the user clicks Cancel | — |\n *\n * @param input - See {@link CompensationEditFormProps}.\n * @returns The contractor compensation edit form.\n * @public\n */\nexport function CompensationEditForm({\n  FallbackComponent,\n  LoaderComponent,\n  ...props\n}: CompensationEditFormProps) {\n  return (\n    <BaseBoundaries\n      componentName=\"Contractor.Management.Compensation\"\n      FallbackComponent={FallbackComponent}\n      LoaderComponent={LoaderComponent}\n    >\n      <CompensationEditFormRoot LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction CompensationEditFormRoot({\n  contractorId,\n  className,\n  dictionary,\n  onEvent,\n  LoaderComponent,\n}: CompensationEditFormProps) {\n  useI18n('Contractor.Management.Compensation')\n  useComponentDictionary('Contractor.Management.Compensation', dictionary)\n  const { t } = useTranslation('Contractor.Management.Compensation')\n  const Components = useComponentContext()\n\n  const payForm = useContractorPayForm({ contractorId })\n\n  if (payForm.isLoading) {\n    return (\n      <BaseLayout\n        isLoading\n        error={payForm.errorHandling.errors}\n        LoaderComponent={LoaderComponent}\n      />\n    )\n  }\n\n  const { Fields } = payForm.form\n\n  const handleSubmit = async () => {\n    const result = await payForm.actions.onSubmit()\n    if (!result) return\n    onEvent(componentEvents.CONTRACTOR_MANAGEMENT_COMPENSATION_UPDATED, result.data)\n  }\n\n  const handleCancel = () => {\n    onEvent(componentEvents.CONTRACTOR_MANAGEMENT_COMPENSATION_EDIT_CANCELLED)\n  }\n\n  const WageTypeFieldComponent = (radioProps: RadioGroupProps) => (\n    <Components.RadioGroup\n      {...radioProps}\n      options={radioProps.options.map(option => ({\n        ...option,\n        description:\n          option.value === WageType.Hourly\n            ? t('form.hourlyDescription')\n            : t('form.fixedDescription'),\n      }))}\n    />\n  )\n\n  return (\n    <section className={classNames(styles.container, className)}>\n      <BaseLayout error={payForm.errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <SDKFormProvider formHookResult={payForm}>\n          <Form onSubmit={handleSubmit}>\n            <Flex flexDirection=\"column\" gap={4}>\n              <Components.Heading as=\"h2\">{t('form.title')}</Components.Heading>\n              <Components.Text variant=\"supporting\">{t('form.description')}</Components.Text>\n            </Flex>\n            <Fields.WageType\n              label={t('form.wageTypeLabel')}\n              getOptionLabel={(value: string) =>\n                value === WageType.Hourly ? t('hourlyLabel') : t('fixedLabel')\n              }\n              FieldComponent={WageTypeFieldComponent}\n            />\n            {payForm.status.isHourly && (\n              <Fields.HourlyRate\n                label={t('form.hourlyRateLabel')}\n                format=\"currency\"\n                validationMessages={{\n                  REQUIRED: t('form.validations.hourlyRate'),\n                  MAX_HOURLY_RATE: t('form.validations.hourlyRateMax'),\n                }}\n              />\n            )}\n            <ActionsLayout>\n              <Components.Button variant=\"secondary\" onClick={handleCancel} type=\"button\">\n                {t('form.cancelCta')}\n              </Components.Button>\n              <Components.Button type=\"submit\" isLoading={payForm.status.isPending}>\n                {t('form.saveCta')}\n              </Components.Button>\n            </ActionsLayout>\n          </Form>\n        </SDKFormProvider>\n      </BaseLayout>\n    </section>\n  )\n}\n"],"names":["CompensationEditForm","FallbackComponent","LoaderComponent","props","jsx","BaseBoundaries","CompensationEditFormRoot","contractorId","className","dictionary","onEvent","useI18n","useComponentDictionary","t","useTranslation","Components","useComponentContext","payForm","useContractorPayForm","BaseLayout","Fields","handleSubmit","result","componentEvents","handleCancel","WageTypeFieldComponent","radioProps","option","WageType","classNames","styles","SDKFormProvider","jsxs","Form","Flex","value","ActionsLayout"],"mappings":"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"}