@gusto/embedded-react-sdk 0.55.0 → 0.55.2

package/dist/components/Contractor/shared/SelectContractors/SelectContractors.d.ts

@@ -3,6 +3,11 @@ export interface SelectContractorsProps {
     companyId: string;
     /** Called with the currently selected contractor ids whenever the selection changes. */
     onSelectionChange: (selectedIds: string[]) => void;
+    /**
+     * Seeds selection state on mount. Pass the caller's own previously-selected ids to survive
+     * this component unmounting and remounting (e.g. behind a "Back" button).
+     */
+    initialSelectedIds?: Iterable<string>;
     /** Overrides the default empty-state title shown when no contractors match. */
     emptyStateTitle?: string;
     /** Overrides the default empty-state description shown when no contractors match. */
@@ -16,4 +21,4 @@ export interface SelectContractorsProps {
  *
  * @internal
  */
-export declare function SelectContractors({ companyId, onSelectionChange, emptyStateTitle, emptyStateDescription, }: SelectContractorsProps): import("react").JSX.Element;
+export declare function SelectContractors({ companyId, onSelectionChange, initialSelectedIds, emptyStateTitle, emptyStateDescription, }: SelectContractorsProps): import("react").JSX.Element;

package/dist/components/Contractor/shared/SelectContractors/SelectContractors.js

@@ -1,23 +1,24 @@
 import { jsx as o } from "react/jsx-runtime";
-import { useMemo as i, useEffect as d } from "react";
-import { useSelectContractors as u } from "./useSelectContractors.js";
-import { SelectContractorsPresentation as m } from "./SelectContractorsPresentation.js";
+import { useMemo as d, useEffect as u } from "react";
+import { useSelectContractors as m } from "./useSelectContractors.js";
+import { SelectContractorsPresentation as f } from "./SelectContractorsPresentation.js";
 import { BaseLayout as s } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
-function I({
+function L({
   companyId: a,
   onSelectionChange: n,
-  emptyStateTitle: c,
-  emptyStateDescription: l
+  initialSelectedIds: c,
+  emptyStateTitle: l,
+  emptyStateDescription: i
 }) {
-  const e = u(a), r = e.isLoading ? null : [...e.selectedIds].sort().join(","), t = i(
+  const e = m(a, c), r = e.isLoading ? null : [...e.selectedIds].sort().join(","), t = d(
     () => r === null ? null : r.split(",").filter(Boolean),
     [r]
   );
-  return d(() => {
+  return u(() => {
     t !== null && n(t);
   }, [t, n]), e.isLoading ? /* @__PURE__ */ o(s, { isLoading: !0, error: e.errorHandling.errors }) : /* @__PURE__ */ o(s, { error: e.errorHandling.errors, children: /* @__PURE__ */ o(
-    m,
+    f,
     {
       contractors: e.data.contractors,
       selectedIds: e.selectedIds,
@@ -28,12 +29,12 @@ function I({
       onSearchClear: e.actions.onSearchClear,
       pagination: e.pagination,
       isFetching: e.status.isFetching,
-      emptyStateTitle: c,
-      emptyStateDescription: l
+      emptyStateTitle: l,
+      emptyStateDescription: i
     }
   ) });
 }
 export {
-  I as SelectContractors
+  L as SelectContractors
 };
 //# sourceMappingURL=SelectContractors.js.map

package/dist/components/Contractor/shared/SelectContractors/SelectContractors.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectContractors.js","sources":["../../../../../src/components/Contractor/shared/SelectContractors/SelectContractors.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react'\nimport { useSelectContractors } from './useSelectContractors'\nimport { SelectContractorsPresentation } from './SelectContractorsPresentation'\nimport { BaseLayout } from '@/components/Base'\n\n/** @internal */\nexport interface SelectContractorsProps {\n  companyId: string\n  /** Called with the currently selected contractor ids whenever the selection changes. */\n  onSelectionChange: (selectedIds: string[]) => void\n  /** Overrides the default empty-state title shown when no contractors match. */\n  emptyStateTitle?: string\n  /** Overrides the default empty-state description shown when no contractors match. */\n  emptyStateDescription?: string\n}\n\n/**\n * Multi-select contractor table. Fetches and filters eligible contractors via\n * {@link useSelectContractors} and reports the current selection through\n * `onSelectionChange` rather than emitting an SDK event — the composing\n * screen is responsible for translating the selection into its own events.\n *\n * @internal\n */\nexport function SelectContractors({\n  companyId,\n  onSelectionChange,\n  emptyStateTitle,\n  emptyStateDescription,\n}: SelectContractorsProps) {\n  const result = useSelectContractors(companyId)\n\n  const selectedIdsKey = result.isLoading ? null : [...result.selectedIds].sort().join(',')\n\n  const selectedIds = useMemo(\n    () => (selectedIdsKey === null ? null : selectedIdsKey.split(',').filter(Boolean)),\n    [selectedIdsKey],\n  )\n\n  useEffect(() => {\n    if (selectedIds === null) return\n    onSelectionChange(selectedIds)\n  }, [selectedIds, onSelectionChange])\n\n  if (result.isLoading) {\n    return <BaseLayout isLoading error={result.errorHandling.errors} />\n  }\n\n  return (\n    <BaseLayout error={result.errorHandling.errors}>\n      <SelectContractorsPresentation\n        contractors={result.data.contractors}\n        selectedIds={result.selectedIds}\n        searchValue={result.searchValue}\n        onSelect={result.actions.onSelect}\n        onSelectAll={result.actions.onSelectAll}\n        onSearchChange={result.actions.onSearchChange}\n        onSearchClear={result.actions.onSearchClear}\n        pagination={result.pagination}\n        isFetching={result.status.isFetching}\n        emptyStateTitle={emptyStateTitle}\n        emptyStateDescription={emptyStateDescription}\n      />\n    </BaseLayout>\n  )\n}\n"],"names":["SelectContractors","companyId","onSelectionChange","emptyStateTitle","emptyStateDescription","result","useSelectContractors","selectedIdsKey","selectedIds","useMemo","useEffect","BaseLayout","jsx","SelectContractorsPresentation"],"mappings":";;;;;;AAwBO,SAASA,EAAkB;AAAA,EAChC,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,uBAAAC;AACF,GAA2B;AACzB,QAAMC,IAASC,EAAqBL,CAAS,GAEvCM,IAAiBF,EAAO,YAAY,OAAO,CAAC,GAAGA,EAAO,WAAW,EAAE,OAAO,KAAK,GAAG,GAElFG,IAAcC;AAAA,IAClB,MAAOF,MAAmB,OAAO,OAAOA,EAAe,MAAM,GAAG,EAAE,OAAO,OAAO;AAAA,IAChF,CAACA,CAAc;AAAA,EAAA;AAQjB,SALAG,EAAU,MAAM;AACd,IAAIF,MAAgB,QACpBN,EAAkBM,CAAW;AAAA,EAC/B,GAAG,CAACA,GAAaN,CAAiB,CAAC,GAE/BG,EAAO,8BACDM,GAAA,EAAW,WAAS,IAAC,OAAON,EAAO,cAAc,QAAQ,IAIjE,gBAAAO,EAACD,GAAA,EAAW,OAAON,EAAO,cAAc,QACtC,UAAA,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAaR,EAAO,KAAK;AAAA,MACzB,aAAaA,EAAO;AAAA,MACpB,aAAaA,EAAO;AAAA,MACpB,UAAUA,EAAO,QAAQ;AAAA,MACzB,aAAaA,EAAO,QAAQ;AAAA,MAC5B,gBAAgBA,EAAO,QAAQ;AAAA,MAC/B,eAAeA,EAAO,QAAQ;AAAA,MAC9B,YAAYA,EAAO;AAAA,MACnB,YAAYA,EAAO,OAAO;AAAA,MAC1B,iBAAAF;AAAA,MACA,uBAAAC;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"SelectContractors.js","sources":["../../../../../src/components/Contractor/shared/SelectContractors/SelectContractors.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react'\nimport { useSelectContractors } from './useSelectContractors'\nimport { SelectContractorsPresentation } from './SelectContractorsPresentation'\nimport { BaseLayout } from '@/components/Base'\n\n/** @internal */\nexport interface SelectContractorsProps {\n  companyId: string\n  /** Called with the currently selected contractor ids whenever the selection changes. */\n  onSelectionChange: (selectedIds: string[]) => void\n  /**\n   * Seeds selection state on mount. Pass the caller's own previously-selected ids to survive\n   * this component unmounting and remounting (e.g. behind a \"Back\" button).\n   */\n  initialSelectedIds?: Iterable<string>\n  /** Overrides the default empty-state title shown when no contractors match. */\n  emptyStateTitle?: string\n  /** Overrides the default empty-state description shown when no contractors match. */\n  emptyStateDescription?: string\n}\n\n/**\n * Multi-select contractor table. Fetches and filters eligible contractors via\n * {@link useSelectContractors} and reports the current selection through\n * `onSelectionChange` rather than emitting an SDK event — the composing\n * screen is responsible for translating the selection into its own events.\n *\n * @internal\n */\nexport function SelectContractors({\n  companyId,\n  onSelectionChange,\n  initialSelectedIds,\n  emptyStateTitle,\n  emptyStateDescription,\n}: SelectContractorsProps) {\n  const result = useSelectContractors(companyId, initialSelectedIds)\n\n  const selectedIdsKey = result.isLoading ? null : [...result.selectedIds].sort().join(',')\n\n  const selectedIds = useMemo(\n    () => (selectedIdsKey === null ? null : selectedIdsKey.split(',').filter(Boolean)),\n    [selectedIdsKey],\n  )\n\n  useEffect(() => {\n    if (selectedIds === null) return\n    onSelectionChange(selectedIds)\n  }, [selectedIds, onSelectionChange])\n\n  if (result.isLoading) {\n    return <BaseLayout isLoading error={result.errorHandling.errors} />\n  }\n\n  return (\n    <BaseLayout error={result.errorHandling.errors}>\n      <SelectContractorsPresentation\n        contractors={result.data.contractors}\n        selectedIds={result.selectedIds}\n        searchValue={result.searchValue}\n        onSelect={result.actions.onSelect}\n        onSelectAll={result.actions.onSelectAll}\n        onSearchChange={result.actions.onSearchChange}\n        onSearchClear={result.actions.onSearchClear}\n        pagination={result.pagination}\n        isFetching={result.status.isFetching}\n        emptyStateTitle={emptyStateTitle}\n        emptyStateDescription={emptyStateDescription}\n      />\n    </BaseLayout>\n  )\n}\n"],"names":["SelectContractors","companyId","onSelectionChange","initialSelectedIds","emptyStateTitle","emptyStateDescription","result","useSelectContractors","selectedIdsKey","selectedIds","useMemo","useEffect","BaseLayout","jsx","SelectContractorsPresentation"],"mappings":";;;;;;AA6BO,SAASA,EAAkB;AAAA,EAChC,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,uBAAAC;AACF,GAA2B;AACzB,QAAMC,IAASC,EAAqBN,GAAWE,CAAkB,GAE3DK,IAAiBF,EAAO,YAAY,OAAO,CAAC,GAAGA,EAAO,WAAW,EAAE,OAAO,KAAK,GAAG,GAElFG,IAAcC;AAAA,IAClB,MAAOF,MAAmB,OAAO,OAAOA,EAAe,MAAM,GAAG,EAAE,OAAO,OAAO;AAAA,IAChF,CAACA,CAAc;AAAA,EAAA;AAQjB,SALAG,EAAU,MAAM;AACd,IAAIF,MAAgB,QACpBP,EAAkBO,CAAW;AAAA,EAC/B,GAAG,CAACA,GAAaP,CAAiB,CAAC,GAE/BI,EAAO,8BACDM,GAAA,EAAW,WAAS,IAAC,OAAON,EAAO,cAAc,QAAQ,IAIjE,gBAAAO,EAACD,GAAA,EAAW,OAAON,EAAO,cAAc,QACtC,UAAA,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAaR,EAAO,KAAK;AAAA,MACzB,aAAaA,EAAO;AAAA,MACpB,aAAaA,EAAO;AAAA,MACpB,UAAUA,EAAO,QAAQ;AAAA,MACzB,aAAaA,EAAO,QAAQ;AAAA,MAC5B,gBAAgBA,EAAO,QAAQ;AAAA,MAC/B,eAAeA,EAAO,QAAQ;AAAA,MAC9B,YAAYA,EAAO;AAAA,MACnB,YAAYA,EAAO,OAAO;AAAA,MAC1B,iBAAAF;AAAA,MACA,uBAAAC;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/Contractor/shared/SelectContractors/useSelectContractors.d.ts

@@ -53,6 +53,10 @@ export type UseSelectContractorsResult = HookLoadingResult | UseSelectContractor
  * all pages, not just the current page slice — "select all" means every
  * matching contractor, including ones scrolled off-screen.
  *
+ * `initialSelectedIds` seeds selection state and is only read on mount. Pass the caller's own
+ * previously-selected ids here to survive an unmount/remount (e.g. a "Back" button that swaps
+ * this component out for another screen and back).
+ *
  * @internal
  */
-export declare function useSelectContractors(companyId: string): UseSelectContractorsResult;
+export declare function useSelectContractors(companyId: string, initialSelectedIds?: Iterable<string>): UseSelectContractorsResult;

package/dist/components/Contractor/shared/SelectContractors/useSelectContractors.js

@@ -1,49 +1,51 @@
-import { useState as y, useMemo as I, useCallback as C } from "react";
-import { useContractorsList as _, buildContractorsListQuery as N } from "@gusto/embedded-api/react-query/contractorsList";
-import { useGustoEmbeddedContext as O } from "@gusto/embedded-api/react-query/_context";
-import { useQueries as v } from "@tanstack/react-query";
-import { useClientPagination as D } from "../../../../hooks/useClientPagination/useClientPagination.js";
-import { composeErrorHandler as G } from "../../../../partner-hook-utils/composeErrorHandler.js";
-import { ContractorOnboardingStatus as Q } from "../../../../shared/constants.js";
-import { getContractorDisplayName as H } from "../helpers.js";
+import { useState as I, useMemo as _, useCallback as C } from "react";
+import { useContractorsList as N, buildContractorsListQuery as O } from "@gusto/embedded-api/react-query/contractorsList";
+import { useGustoEmbeddedContext as v } from "@gusto/embedded-api/react-query/_context";
+import { useQueries as D } from "@tanstack/react-query";
+import { useClientPagination as G } from "../../../../hooks/useClientPagination/useClientPagination.js";
+import { composeErrorHandler as Q } from "../../../../partner-hook-utils/composeErrorHandler.js";
+import { ContractorOnboardingStatus as H } from "../../../../shared/constants.js";
+import { getContractorDisplayName as U } from "../helpers.js";
 const h = 100;
-function U(e) {
-  return e.isActive && e.onboardingStatus === Q.ONBOARDING_COMPLETED;
+function V(e) {
+  return e.isActive && e.onboardingStatus === H.ONBOARDING_COMPLETED;
 }
 function S(e, u) {
-  return H(e).toLowerCase().includes(u.toLowerCase());
+  return U(e).toLowerCase().includes(u.toLowerCase());
 }
-function J(e) {
-  const u = O(), [P, l] = y(() => /* @__PURE__ */ new Set()), d = _({
+function K(e, u) {
+  const P = v(), [b, l] = I(
+    () => new Set(u)
+  ), d = N({
     companyUuid: e,
     page: 1,
     per: h
-  }), { data: n, isFetching: g } = d, b = Number(n?.httpMeta.response.headers.get("x-total-pages") ?? 1), a = v({
-    queries: Array.from({ length: Math.max(0, b - 1) }, (t, o) => ({
-      ...N(u, {
+  }), { data: n, isFetching: g } = d, w = Number(n?.httpMeta.response.headers.get("x-total-pages") ?? 1), a = D({
+    queries: Array.from({ length: Math.max(0, w - 1) }, (t, o) => ({
+      ...O(P, {
         companyUuid: e,
         page: o + 2,
         per: h
       }),
       enabled: !!n
     }))
-  }), w = !n && g || a.some((t) => !t.data && t.isFetching), m = G([d, ...a]), s = I(() => n ? [
+  }), E = !n && g || a.some((t) => !t.data && t.isFetching), m = Q([d, ...a]), s = _(() => n ? [
     ...n.contractors ?? [],
     ...a.flatMap((o) => o.data?.contractors ?? [])
-  ].filter(U) : [], [n, a]), {
-    data: E,
-    pagination: L,
+  ].filter(V) : [], [n, a]), {
+    data: L,
+    pagination: A,
     searchValue: c,
     actions: f
-  } = D(s, {
+  } = G(s, {
     searchPredicate: S,
     defaultItemsPerPage: 25
-  }), A = g || a.some((t) => t.isFetching), x = new Set(s.map((t) => t.uuid)), F = new Set([...P].filter((t) => x.has(t))), M = C((t, o) => {
+  }), x = g || a.some((t) => t.isFetching), F = new Set(s.map((t) => t.uuid)), M = new Set([...b].filter((t) => F.has(t))), R = C((t, o) => {
     l((i) => {
       const r = new Set(i);
       return o ? r.add(t.uuid) : r.delete(t.uuid), r;
     });
-  }, []), R = C(
+  }, []), y = C(
     (t) => {
       const o = c ? s.filter((i) => S(i, c)) : s;
       l((i) => {
@@ -55,20 +57,20 @@ function J(e) {
     },
     [s, c]
   );
-  return w ? {
+  return E ? {
     isLoading: !0,
     errorHandling: m
   } : {
     isLoading: !1,
-    data: { contractors: E },
-    status: { isFetching: A },
+    data: { contractors: L },
+    status: { isFetching: x },
     eligibleCount: s.length,
-    selectedIds: F,
-    pagination: L,
+    selectedIds: M,
+    pagination: A,
     searchValue: c,
     actions: {
-      onSelect: M,
-      onSelectAll: R,
+      onSelect: R,
+      onSelectAll: y,
       onSearchChange: f.onSearchChange,
       onSearchClear: f.onSearchClear
     },
@@ -76,7 +78,7 @@ function J(e) {
   };
 }
 export {
-  U as isEligibleContractor,
-  J as useSelectContractors
+  V as isEligibleContractor,
+  K as useSelectContractors
 };
 //# sourceMappingURL=useSelectContractors.js.map

package/dist/components/Contractor/shared/SelectContractors/useSelectContractors.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSelectContractors.js","sources":["../../../../../src/components/Contractor/shared/SelectContractors/useSelectContractors.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport {\n  buildContractorsListQuery,\n  useContractorsList,\n} from '@gusto/embedded-api/react-query/contractorsList'\nimport { useGustoEmbeddedContext } from '@gusto/embedded-api/react-query/_context'\nimport { useQueries } from '@tanstack/react-query'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { useClientPagination } from '@/hooks/useClientPagination/useClientPagination'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { ContractorOnboardingStatus } from '@/shared/constants'\nimport type { HookLoadingResult, BaseHookReady } from '@/partner-hook-utils/types'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\nimport { getContractorDisplayName } from '@/components/Contractor/shared/helpers'\n\nconst SERVER_MAX_PER_PAGE = 100\n\n/** @internal */\nexport function isEligibleContractor(contractor: Contractor): boolean {\n  return (\n    contractor.isActive &&\n    contractor.onboardingStatus === ContractorOnboardingStatus.ONBOARDING_COMPLETED\n  )\n}\n\nfunction matchesContractorSearch(contractor: Contractor, query: string): boolean {\n  return getContractorDisplayName(contractor).toLowerCase().includes(query.toLowerCase())\n}\n\n/**\n * Ready state of {@link useSelectContractors}.\n *\n * @internal\n */\nexport interface UseSelectContractorsReady extends BaseHookReady<\n  { contractors: Contractor[] },\n  { isFetching: boolean }\n> {\n  /**\n   * Count of eligible (active + onboarded) contractors across every page.\n   * Unaffected by the current search — see `pagination.totalCount` for the\n   * eligible-and-search-matching count instead.\n   */\n  eligibleCount: number\n  /**\n   * Currently selected contractor uuids. Always a subset of the current\n   * eligible contractors: uuids for contractors that become ineligible or\n   * disappear from the list on a refetch are dropped automatically.\n   */\n  selectedIds: Set<string>\n  /** Pagination controls for the client-paginated, search-filtered contractor list. */\n  pagination: PaginationControlProps\n  /** Current search value. */\n  searchValue: string\n  /** Selection and search actions. */\n  actions: {\n    /** Selects or deselects a single contractor. */\n    onSelect: (contractor: Contractor, checked: boolean) => void\n    /** Selects or deselects every eligible contractor in the current search scope, across all pages. */\n    onSelectAll: (checked: boolean) => void\n    /** Updates the search value. */\n    onSearchChange: (value: string) => void\n    /** Clears the search value. */\n    onSearchClear: () => void\n  }\n}\n\n/** @internal */\nexport type UseSelectContractorsResult = HookLoadingResult | UseSelectContractorsReady\n\n/**\n * Fetches every contractor page up front, filters to active + onboarded\n * contractors, and owns client-side pagination, search, and selection state\n * over the result.\n *\n * @remarks\n * `actions.onSelectAll` scopes to the full eligible, search-filtered list across\n * all pages, not just the current page slice — \"select all\" means every\n * matching contractor, including ones scrolled off-screen.\n *\n * @internal\n */\nexport function useSelectContractors(companyId: string): UseSelectContractorsResult {\n  const gustoClient = useGustoEmbeddedContext()\n  const [rawSelectedIds, setRawSelectedIds] = useState<Set<string>>(() => new Set())\n\n  const firstPageQuery = useContractorsList({\n    companyUuid: companyId,\n    page: 1,\n    per: SERVER_MAX_PER_PAGE,\n  })\n  const { data: firstPage, isFetching: isFirstPageFetching } = firstPageQuery\n\n  const totalServerPages = Number(firstPage?.httpMeta.response.headers.get('x-total-pages') ?? 1)\n\n  // No explicit concurrency cap: typical embedded customers are <100\n  // contractors (one server page, zero extra requests). For larger companies\n  // the browser's per-origin connection limit (~6) acts as the natural\n  // ceiling. If this ever needs to support thousands of contractors,\n  // reconsider — either a server-side eligibility filter or a paginated\n  // fetch-as-you-scroll strategy would be the right escape hatches.\n  const restPageResults = useQueries({\n    queries: Array.from({ length: Math.max(0, totalServerPages - 1) }, (_, i) => ({\n      ...buildContractorsListQuery(gustoClient, {\n        companyUuid: companyId,\n        page: i + 2,\n        per: SERVER_MAX_PER_PAGE,\n      }),\n      enabled: !!firstPage,\n    })),\n  })\n\n  const isLoading =\n    (!firstPage && isFirstPageFetching) || restPageResults.some(r => !r.data && r.isFetching)\n\n  const errorHandling = composeErrorHandler([firstPageQuery, ...restPageResults])\n\n  const eligibleContractors = useMemo<Contractor[]>(() => {\n    if (!firstPage) return []\n    const contractors = [\n      ...(firstPage.contractors ?? []),\n      ...restPageResults.flatMap(r => r.data?.contractors ?? []),\n    ]\n    return contractors.filter(isEligibleContractor)\n  }, [firstPage, restPageResults])\n\n  const {\n    data: filteredContractors,\n    pagination,\n    searchValue,\n    actions: paginationActions,\n  } = useClientPagination(eligibleContractors, {\n    searchPredicate: matchesContractorSearch,\n    defaultItemsPerPage: 25,\n  })\n\n  const isFetching = isFirstPageFetching || restPageResults.some(r => r.isFetching)\n\n  const validContractorIds = new Set(eligibleContractors.map(contractor => contractor.uuid))\n  const selectedIds = new Set([...rawSelectedIds].filter(uuid => validContractorIds.has(uuid)))\n\n  const onSelect = useCallback((contractor: Contractor, checked: boolean) => {\n    setRawSelectedIds(prev => {\n      const next = new Set(prev)\n      if (checked) next.add(contractor.uuid)\n      else next.delete(contractor.uuid)\n      return next\n    })\n  }, [])\n\n  const onSelectAll = useCallback(\n    (checked: boolean) => {\n      const scope = searchValue\n        ? eligibleContractors.filter(contractor => matchesContractorSearch(contractor, searchValue))\n        : eligibleContractors\n      setRawSelectedIds(prev => {\n        const next = new Set(prev)\n        for (const contractor of scope) {\n          if (checked) next.add(contractor.uuid)\n          else next.delete(contractor.uuid)\n        }\n        return next\n      })\n    },\n    [eligibleContractors, searchValue],\n  )\n\n  if (isLoading) {\n    return {\n      isLoading: true,\n      errorHandling,\n    }\n  }\n\n  return {\n    isLoading: false,\n    data: { contractors: filteredContractors },\n    status: { isFetching },\n    eligibleCount: eligibleContractors.length,\n    selectedIds,\n    pagination,\n    searchValue,\n    actions: {\n      onSelect,\n      onSelectAll,\n      onSearchChange: paginationActions.onSearchChange,\n      onSearchClear: paginationActions.onSearchClear,\n    },\n    errorHandling,\n  }\n}\n"],"names":["SERVER_MAX_PER_PAGE","isEligibleContractor","contractor","ContractorOnboardingStatus","matchesContractorSearch","query","getContractorDisplayName","useSelectContractors","companyId","gustoClient","useGustoEmbeddedContext","rawSelectedIds","setRawSelectedIds","useState","firstPageQuery","useContractorsList","firstPage","isFirstPageFetching","totalServerPages","restPageResults","useQueries","_","i","buildContractorsListQuery","isLoading","r","errorHandling","composeErrorHandler","eligibleContractors","useMemo","filteredContractors","pagination","searchValue","paginationActions","useClientPagination","isFetching","validContractorIds","selectedIds","uuid","onSelect","useCallback","checked","prev","next","onSelectAll","scope"],"mappings":"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"}
+{"version":3,"file":"useSelectContractors.js","sources":["../../../../../src/components/Contractor/shared/SelectContractors/useSelectContractors.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport {\n  buildContractorsListQuery,\n  useContractorsList,\n} from '@gusto/embedded-api/react-query/contractorsList'\nimport { useGustoEmbeddedContext } from '@gusto/embedded-api/react-query/_context'\nimport { useQueries } from '@tanstack/react-query'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { useClientPagination } from '@/hooks/useClientPagination/useClientPagination'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { ContractorOnboardingStatus } from '@/shared/constants'\nimport type { HookLoadingResult, BaseHookReady } from '@/partner-hook-utils/types'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\nimport { getContractorDisplayName } from '@/components/Contractor/shared/helpers'\n\nconst SERVER_MAX_PER_PAGE = 100\n\n/** @internal */\nexport function isEligibleContractor(contractor: Contractor): boolean {\n  return (\n    contractor.isActive &&\n    contractor.onboardingStatus === ContractorOnboardingStatus.ONBOARDING_COMPLETED\n  )\n}\n\nfunction matchesContractorSearch(contractor: Contractor, query: string): boolean {\n  return getContractorDisplayName(contractor).toLowerCase().includes(query.toLowerCase())\n}\n\n/**\n * Ready state of {@link useSelectContractors}.\n *\n * @internal\n */\nexport interface UseSelectContractorsReady extends BaseHookReady<\n  { contractors: Contractor[] },\n  { isFetching: boolean }\n> {\n  /**\n   * Count of eligible (active + onboarded) contractors across every page.\n   * Unaffected by the current search — see `pagination.totalCount` for the\n   * eligible-and-search-matching count instead.\n   */\n  eligibleCount: number\n  /**\n   * Currently selected contractor uuids. Always a subset of the current\n   * eligible contractors: uuids for contractors that become ineligible or\n   * disappear from the list on a refetch are dropped automatically.\n   */\n  selectedIds: Set<string>\n  /** Pagination controls for the client-paginated, search-filtered contractor list. */\n  pagination: PaginationControlProps\n  /** Current search value. */\n  searchValue: string\n  /** Selection and search actions. */\n  actions: {\n    /** Selects or deselects a single contractor. */\n    onSelect: (contractor: Contractor, checked: boolean) => void\n    /** Selects or deselects every eligible contractor in the current search scope, across all pages. */\n    onSelectAll: (checked: boolean) => void\n    /** Updates the search value. */\n    onSearchChange: (value: string) => void\n    /** Clears the search value. */\n    onSearchClear: () => void\n  }\n}\n\n/** @internal */\nexport type UseSelectContractorsResult = HookLoadingResult | UseSelectContractorsReady\n\n/**\n * Fetches every contractor page up front, filters to active + onboarded\n * contractors, and owns client-side pagination, search, and selection state\n * over the result.\n *\n * @remarks\n * `actions.onSelectAll` scopes to the full eligible, search-filtered list across\n * all pages, not just the current page slice — \"select all\" means every\n * matching contractor, including ones scrolled off-screen.\n *\n * `initialSelectedIds` seeds selection state and is only read on mount. Pass the caller's own\n * previously-selected ids here to survive an unmount/remount (e.g. a \"Back\" button that swaps\n * this component out for another screen and back).\n *\n * @internal\n */\nexport function useSelectContractors(\n  companyId: string,\n  initialSelectedIds?: Iterable<string>,\n): UseSelectContractorsResult {\n  const gustoClient = useGustoEmbeddedContext()\n  const [rawSelectedIds, setRawSelectedIds] = useState<Set<string>>(\n    () => new Set(initialSelectedIds),\n  )\n\n  const firstPageQuery = useContractorsList({\n    companyUuid: companyId,\n    page: 1,\n    per: SERVER_MAX_PER_PAGE,\n  })\n  const { data: firstPage, isFetching: isFirstPageFetching } = firstPageQuery\n\n  const totalServerPages = Number(firstPage?.httpMeta.response.headers.get('x-total-pages') ?? 1)\n\n  // No explicit concurrency cap: typical embedded customers are <100\n  // contractors (one server page, zero extra requests). For larger companies\n  // the browser's per-origin connection limit (~6) acts as the natural\n  // ceiling. If this ever needs to support thousands of contractors,\n  // reconsider — either a server-side eligibility filter or a paginated\n  // fetch-as-you-scroll strategy would be the right escape hatches.\n  const restPageResults = useQueries({\n    queries: Array.from({ length: Math.max(0, totalServerPages - 1) }, (_, i) => ({\n      ...buildContractorsListQuery(gustoClient, {\n        companyUuid: companyId,\n        page: i + 2,\n        per: SERVER_MAX_PER_PAGE,\n      }),\n      enabled: !!firstPage,\n    })),\n  })\n\n  const isLoading =\n    (!firstPage && isFirstPageFetching) || restPageResults.some(r => !r.data && r.isFetching)\n\n  const errorHandling = composeErrorHandler([firstPageQuery, ...restPageResults])\n\n  const eligibleContractors = useMemo<Contractor[]>(() => {\n    if (!firstPage) return []\n    const contractors = [\n      ...(firstPage.contractors ?? []),\n      ...restPageResults.flatMap(r => r.data?.contractors ?? []),\n    ]\n    return contractors.filter(isEligibleContractor)\n  }, [firstPage, restPageResults])\n\n  const {\n    data: filteredContractors,\n    pagination,\n    searchValue,\n    actions: paginationActions,\n  } = useClientPagination(eligibleContractors, {\n    searchPredicate: matchesContractorSearch,\n    defaultItemsPerPage: 25,\n  })\n\n  const isFetching = isFirstPageFetching || restPageResults.some(r => r.isFetching)\n\n  const validContractorIds = new Set(eligibleContractors.map(contractor => contractor.uuid))\n  const selectedIds = new Set([...rawSelectedIds].filter(uuid => validContractorIds.has(uuid)))\n\n  const onSelect = useCallback((contractor: Contractor, checked: boolean) => {\n    setRawSelectedIds(prev => {\n      const next = new Set(prev)\n      if (checked) next.add(contractor.uuid)\n      else next.delete(contractor.uuid)\n      return next\n    })\n  }, [])\n\n  const onSelectAll = useCallback(\n    (checked: boolean) => {\n      const scope = searchValue\n        ? eligibleContractors.filter(contractor => matchesContractorSearch(contractor, searchValue))\n        : eligibleContractors\n      setRawSelectedIds(prev => {\n        const next = new Set(prev)\n        for (const contractor of scope) {\n          if (checked) next.add(contractor.uuid)\n          else next.delete(contractor.uuid)\n        }\n        return next\n      })\n    },\n    [eligibleContractors, searchValue],\n  )\n\n  if (isLoading) {\n    return {\n      isLoading: true,\n      errorHandling,\n    }\n  }\n\n  return {\n    isLoading: false,\n    data: { contractors: filteredContractors },\n    status: { isFetching },\n    eligibleCount: eligibleContractors.length,\n    selectedIds,\n    pagination,\n    searchValue,\n    actions: {\n      onSelect,\n      onSelectAll,\n      onSearchChange: paginationActions.onSearchChange,\n      onSearchClear: paginationActions.onSearchClear,\n    },\n    errorHandling,\n  }\n}\n"],"names":["SERVER_MAX_PER_PAGE","isEligibleContractor","contractor","ContractorOnboardingStatus","matchesContractorSearch","query","getContractorDisplayName","useSelectContractors","companyId","initialSelectedIds","gustoClient","useGustoEmbeddedContext","rawSelectedIds","setRawSelectedIds","useState","firstPageQuery","useContractorsList","firstPage","isFirstPageFetching","totalServerPages","restPageResults","useQueries","_","i","buildContractorsListQuery","isLoading","r","errorHandling","composeErrorHandler","eligibleContractors","useMemo","filteredContractors","pagination","searchValue","paginationActions","useClientPagination","isFetching","validContractorIds","selectedIds","uuid","onSelect","useCallback","checked","prev","next","onSelectAll","scope"],"mappings":"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"}

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

@@ -19,6 +19,12 @@ export interface PayrollConfigurationProps extends BaseComponentInterface<'Payro
  * Handles the configuration phase of payroll processing, allowing users to review and modify employee compensation before calculating the payroll.
  *
  * @remarks
+ * If the payroll turns out to already be processed (e.g. another actor submitted it while this
+ * screen was open), this component emits `runPayroll/alreadyProcessed` and then renders
+ * {@link PayrollOverview} in its place — the read-only breakdown with the gated "Cancel payroll"
+ * action — instead of the configuration table. Events from that delegated view (e.g.
+ * `runPayroll/cancelled`) are emitted through this component's own `onEvent`.
+ *
  * Emits the following events:
  *
  * @events
@@ -28,6 +34,7 @@ export interface PayrollConfigurationProps extends BaseComponentInterface<'Payro
  * | `runPayroll/employee/skip` | An employee is skipped or unskipped for this payroll | `{ employeeId }` |
  * | `runPayroll/employee/saved` | Employee compensation changes are persisted | `{ payrollPrepared }` |
  * | `runPayroll/calculated` | Payroll calculation completes successfully | `{ payrollId, alert, payPeriod }` |
+ * | `runPayroll/alreadyProcessed` | The payroll turns out to already be processed while configuring it | `{ payrollId, alert, payPeriod }` |
  * | `runPayroll/processingFailed` | Payroll calculation fails or times out | — |
  * | `runPayroll/blockers/viewAll` | The "view all blockers" affordance is selected | — |
  * | `runPayroll/grossUp/selected` | The set-net-earnings menu item is selected for an employee | `{ employeeUuid }` |