@gusto/embedded-react-sdk 0.53.0 → 0.54.0

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

@@ -0,0 +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":";;;;;;;;AAeA,MAAMA,IAAsB;AAGrB,SAASC,EAAqBC,GAAiC;AACpE,SACEA,EAAW,YACXA,EAAW,qBAAqBC,EAA2B;AAE/D;AAEA,SAASC,EAAwBF,GAAwBG,GAAwB;AAC/E,SAAOC,EAAyBJ,CAAU,EAAE,YAAA,EAAc,SAASG,EAAM,aAAa;AACxF;AAuDO,SAASE,EAAqBC,GAA+C;AAClF,QAAMC,IAAcC,EAAA,GACd,CAACC,GAAgBC,CAAiB,IAAIC,EAAsB,MAAM,oBAAI,KAAK,GAE3EC,IAAiBC,EAAmB;AAAA,IACxC,aAAaP;AAAA,IACb,MAAM;AAAA,IACN,KAAKR;AAAA,EAAA,CACN,GACK,EAAE,MAAMgB,GAAW,YAAYC,MAAwBH,GAEvDI,IAAmB,OAAOF,GAAW,SAAS,SAAS,QAAQ,IAAI,eAAe,KAAK,CAAC,GAQxFG,IAAkBC,EAAW;AAAA,IACjC,SAAS,MAAM,KAAK,EAAE,QAAQ,KAAK,IAAI,GAAGF,IAAmB,CAAC,EAAA,GAAK,CAACG,GAAGC,OAAO;AAAA,MAC5E,GAAGC,EAA0Bd,GAAa;AAAA,QACxC,aAAaD;AAAA,QACb,MAAMc,IAAI;AAAA,QACV,KAAKtB;AAAA,MAAA,CACN;AAAA,MACD,SAAS,CAAC,CAACgB;AAAA,IAAA,EACX;AAAA,EAAA,CACH,GAEKQ,IACH,CAACR,KAAaC,KAAwBE,EAAgB,KAAK,CAAAM,MAAK,CAACA,EAAE,QAAQA,EAAE,UAAU,GAEpFC,IAAgBC,EAAoB,CAACb,GAAgB,GAAGK,CAAe,CAAC,GAExES,IAAsBC,EAAsB,MAC3Cb,IACe;AAAA,IAClB,GAAIA,EAAU,eAAe,CAAA;AAAA,IAC7B,GAAGG,EAAgB,QAAQ,CAAAM,MAAKA,EAAE,MAAM,eAAe,CAAA,CAAE;AAAA,EAAA,EAExC,OAAOxB,CAAoB,IALvB,CAAA,GAMtB,CAACe,GAAWG,CAAe,CAAC,GAEzB;AAAA,IACJ,MAAMW;AAAA,IACN,YAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAASC;AAAA,EAAA,IACPC,EAAoBN,GAAqB;AAAA,IAC3C,iBAAiBxB;AAAA,IACjB,qBAAqB;AAAA,EAAA,CACtB,GAEK+B,IAAalB,KAAuBE,EAAgB,KAAK,CAAAM,MAAKA,EAAE,UAAU,GAE1EW,IAAqB,IAAI,IAAIR,EAAoB,IAAI,CAAA1B,MAAcA,EAAW,IAAI,CAAC,GACnFmC,IAAc,IAAI,IAAI,CAAC,GAAG1B,CAAc,EAAE,OAAO,CAAA2B,MAAQF,EAAmB,IAAIE,CAAI,CAAC,CAAC,GAEtFC,IAAWC,EAAY,CAACtC,GAAwBuC,MAAqB;AACzE,IAAA7B,EAAkB,CAAA8B,MAAQ;AACxB,YAAMC,IAAO,IAAI,IAAID,CAAI;AACzB,aAAID,IAASE,EAAK,IAAIzC,EAAW,IAAI,IAChCyC,EAAK,OAAOzC,EAAW,IAAI,GACzByC;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAA,CAAE,GAECC,IAAcJ;AAAA,IAClB,CAACC,MAAqB;AACpB,YAAMI,IAAQb,IACVJ,EAAoB,OAAO,OAAcxB,EAAwBF,GAAY8B,CAAW,CAAC,IACzFJ;AACJ,MAAAhB,EAAkB,CAAA8B,MAAQ;AACxB,cAAMC,IAAO,IAAI,IAAID,CAAI;AACzB,mBAAWxC,KAAc2C;AACvB,UAAIJ,IAASE,EAAK,IAAIzC,EAAW,IAAI,IAChCyC,EAAK,OAAOzC,EAAW,IAAI;AAElC,eAAOyC;AAAA,MACT,CAAC;AAAA,IACH;AAAA,IACA,CAACf,GAAqBI,CAAW;AAAA,EAAA;AAGnC,SAAIR,IACK;AAAA,IACL,WAAW;AAAA,IACX,eAAAE;AAAA,EAAA,IAIG;AAAA,IACL,WAAW;AAAA,IACX,MAAM,EAAE,aAAaI,EAAA;AAAA,IACrB,QAAQ,EAAE,YAAAK,EAAA;AAAA,IACV,eAAeP,EAAoB;AAAA,IACnC,aAAAS;AAAA,IACA,YAAAN;AAAA,IACA,aAAAC;AAAA,IACA,SAAS;AAAA,MACP,UAAAO;AAAA,MACA,aAAAK;AAAA,MACA,gBAAgBX,EAAkB;AAAA,MAClC,eAAeA,EAAkB;AAAA,IAAA;AAAA,IAEnC,eAAAP;AAAA,EAAA;AAEJ;"}

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

@@ -0,0 +1 @@
+export {};

package/dist/components/Contractor/{Payments/CreatePayment → shared}/helpers.js

@@ -1,4 +1,4 @@
-import { firstLastName as s } from "../../../../helpers/formattedStrings.js";
+import { firstLastName as s } from "../../../helpers/formattedStrings.js";
 const a = (e) => e ? e.type === "Individual" ? s({ first_name: e.firstName, last_name: e.lastName }) : e.businessName || "" : "";
 export {
   a as getContractorDisplayName

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

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sources":["../../../../src/components/Contractor/shared/helpers.ts"],"sourcesContent":["import type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { firstLastName } from '@/helpers/formattedStrings'\n\n/** @internal */\nexport const getContractorDisplayName = (contractor?: Contractor): string => {\n  if (!contractor) {\n    return ''\n  }\n  if (contractor.type === 'Individual') {\n    return firstLastName({ first_name: contractor.firstName, last_name: contractor.lastName })\n  } else {\n    return contractor.businessName || ''\n  }\n}\n"],"names":["getContractorDisplayName","contractor","firstLastName"],"mappings":";AAIO,MAAMA,IAA2B,CAACC,MAClCA,IAGDA,EAAW,SAAS,eACfC,EAAc,EAAE,YAAYD,EAAW,WAAW,WAAWA,EAAW,UAAU,IAElFA,EAAW,gBAAgB,KAL3B;"}

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

@@ -1,5 +1,5 @@
 import { useContractorDocumentsGetAllSuspense as n } from "@gusto/embedded-api/react-query/contractorDocumentsGetAll";
-import { isW9Document as r } from "../Documents/SignatureForm/useContractorSignatureForm/w9Fields.js";
+import { isW9Document as r } from "../Documents/shared/SignatureForm/useContractorSignatureForm/w9Fields.js";
 function c(o) {
   const { data: e } = n({ contractorUuid: o });
   return (e.documents ?? []).some((t) => r(t) && !!t.signedAt);

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

@@ -1 +1 @@
-{"version":3,"file":"useContractorHasSignedW9.js","sources":["../../../../src/components/Contractor/shared/useContractorHasSignedW9.ts"],"sourcesContent":["import { useContractorDocumentsGetAllSuspense } from '@gusto/embedded-api/react-query/contractorDocumentsGetAll'\nimport { isW9Document } from '@/components/Contractor/Documents/SignatureForm/useContractorSignatureForm'\n\n/**\n * Returns `true` when the contractor has a W-9 with a `signedAt` timestamp on\n * file. Fetches via Suspense — must be rendered inside a Suspense boundary\n * (SDK `BaseBoundaries` supplies one).\n *\n * @internal\n */\nexport function useContractorHasSignedW9(contractorId: string): boolean {\n  const { data } = useContractorDocumentsGetAllSuspense({ contractorUuid: contractorId })\n  return (data.documents ?? []).some(doc => isW9Document(doc) && !!doc.signedAt)\n}\n"],"names":["useContractorHasSignedW9","contractorId","data","useContractorDocumentsGetAllSuspense","doc","isW9Document"],"mappings":";;AAUO,SAASA,EAAyBC,GAA+B;AACtE,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAqC,EAAE,gBAAgBF,GAAc;AACtF,UAAQC,EAAK,aAAa,CAAA,GAAI,KAAK,CAAAE,MAAOC,EAAaD,CAAG,KAAK,CAAC,CAACA,EAAI,QAAQ;AAC/E;"}
+{"version":3,"file":"useContractorHasSignedW9.js","sources":["../../../../src/components/Contractor/shared/useContractorHasSignedW9.ts"],"sourcesContent":["import { useContractorDocumentsGetAllSuspense } from '@gusto/embedded-api/react-query/contractorDocumentsGetAll'\nimport { isW9Document } from '@/components/Contractor/Documents/shared/SignatureForm/useContractorSignatureForm'\n\n/**\n * Returns `true` when the contractor has a W-9 with a `signedAt` timestamp on\n * file. Fetches via Suspense — must be rendered inside a Suspense boundary\n * (SDK `BaseBoundaries` supplies one).\n *\n * @internal\n */\nexport function useContractorHasSignedW9(contractorId: string): boolean {\n  const { data } = useContractorDocumentsGetAllSuspense({ contractorUuid: contractorId })\n  return (data.documents ?? []).some(doc => isW9Document(doc) && !!doc.signedAt)\n}\n"],"names":["useContractorHasSignedW9","contractorId","data","useContractorDocumentsGetAllSuspense","doc","isW9Document"],"mappings":";;AAUO,SAASA,EAAyBC,GAA+B;AACtE,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAqC,EAAE,gBAAgBF,GAAc;AACtF,UAAQC,EAAK,aAAa,CAAA,GAAI,KAAK,CAAAE,MAAOC,EAAaD,CAAG,KAAK,CAAC,CAACA,EAAI,QAAQ;AAC/E;"}

package/dist/components/Employee/Compensation/management/Compensation.d.ts

@@ -37,4 +37,4 @@ export interface CompensationProps extends BaseComponentInterface<'Employee.Mana
  * @public
  * @group Block components
  */
-export declare function Compensation({ dictionary, FallbackComponent, ...props }: CompensationProps): import("react").JSX.Element;
+export declare function Compensation({ dictionary, FallbackComponent, LoaderComponent, ...props }: CompensationProps): import("react").JSX.Element;

package/dist/components/Employee/Compensation/management/Compensation.js

@@ -1,36 +1,43 @@
-import { jsx as m } from "react/jsx-runtime";
-import { createMachine as r } from "robot3";
+import { jsx as t } from "react/jsx-runtime";
+import { createMachine as i } from "robot3";
 import { useMemo as a } from "react";
-import { CompensationCardContextual as i } from "./CompensationComponents.js";
-import { compensationStateMachine as p } from "./compensationStateMachine.js";
-import { Flow as s } from "../../../Flow/Flow.js";
-import { BaseBoundaries as c } from "../../../Base/Base.js";
+import { CompensationCardContextual as p } from "./CompensationComponents.js";
+import { compensationStateMachine as s } from "./compensationStateMachine.js";
+import { Flow as c } from "../../../Flow/Flow.js";
+import { BaseBoundaries as u } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
-import { useComponentDictionary as u, useI18n as f } from "../../../../i18n/I18n.js";
-function l({ employeeId: o, onEvent: n }) {
-  f("Employee.Management.Compensation");
-  const e = a(
-    () => r("card", p, (t) => ({
-      ...t,
-      component: i,
-      employeeId: o,
-      successAlert: null
+import { useComponentDictionary as f, useI18n as l } from "../../../../i18n/I18n.js";
+function C({ employeeId: n, onEvent: e, LoaderComponent: o }) {
+  l("Employee.Management.Compensation");
+  const m = a(
+    () => i("card", s, (r) => ({
+      ...r,
+      component: p,
+      employeeId: n,
+      successAlert: null,
+      LoaderComponent: o
     })),
-    [o]
+    [n, o]
   );
-  return /* @__PURE__ */ m(s, { machine: e, onEvent: n });
+  return /* @__PURE__ */ t(c, { machine: m, onEvent: e });
 }
-function B({ dictionary: o, FallbackComponent: n, ...e }) {
-  return u("Employee.Management.Compensation", o), /* @__PURE__ */ m(
-    c,
+function d({
+  dictionary: n,
+  FallbackComponent: e,
+  LoaderComponent: o,
+  ...m
+}) {
+  return f("Employee.Management.Compensation", n), /* @__PURE__ */ t(
+    u,
     {
       componentName: "Employee.Management.Compensation",
-      FallbackComponent: n,
-      children: /* @__PURE__ */ m(l, { ...e })
+      FallbackComponent: e,
+      LoaderComponent: o,
+      children: /* @__PURE__ */ t(C, { LoaderComponent: o, ...m })
     }
   );
 }
 export {
-  B as Compensation
+  d as Compensation
 };
 //# sourceMappingURL=Compensation.js.map

package/dist/components/Employee/Compensation/management/Compensation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Compensation.js","sources":["../../../../../src/components/Employee/Compensation/management/Compensation.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport {\n  CompensationCardContextual,\n  type CompensationContextInterface,\n} from './CompensationComponents'\nimport { compensationStateMachine } from './compensationStateMachine'\nimport { Flow } from '@/components/Flow/Flow'\nimport { BaseBoundaries, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { useI18n } from '@/i18n'\n\n/**\n * Props for {@link Compensation}.\n *\n * @public\n */\nexport interface CompensationProps extends BaseComponentInterface<'Employee.Management.Compensation'> {\n  /** The associated employee identifier. */\n  employeeId: string\n}\n\nfunction CompensationFlow({ employeeId, onEvent }: CompensationProps) {\n  useI18n('Employee.Management.Compensation')\n\n  const machine = useMemo(\n    () =>\n      createMachine('card', compensationStateMachine, (ctx: CompensationContextInterface) => ({\n        ...ctx,\n        component: CompensationCardContextual,\n        employeeId,\n        successAlert: null,\n      })),\n    [employeeId],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n\n/**\n * Self-contained block for viewing and managing an employee's jobs and compensation — the same experience the dashboard surfaces, but as a drop-in component that doesn't require the surrounding dashboard chrome.\n *\n * @remarks\n * Renders a read-only card showing the employee's job(s), pay type, wage, and effective date, along with affordances to edit a job's compensation, add a first job from the empty state, add another job (when the primary job is Nonexempt), delete a non-primary job, and cancel a scheduled future-dated change. Choosing to edit or add a job swaps the card for the corresponding form; a successful add returns to the card with a dismissible \"Job successfully added.\" alert, an edit returns to the card without an alert, and cancelling returns without saving. Wraps everything in error and suspense boundaries.\n *\n * The card and form surfaces ({@link CompensationCard}, {@link CompensationEditForm}, {@link CompensationAddJobForm}, {@link CompensationAddAnotherJobForm}) are also exported individually for cases where that orchestration is the wrong fit — for example, when a form needs to render in a modal or drawer, when the card needs to appear read-only with no edit/add affordances, or when the swap is driven by a router. Using them directly means owning the swap, the alert, and any cross-component state yourself.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/card/editRequested` | Fired when an \"Edit\" CTA is clicked for a job; the block opens the edit form for that job | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/addRequested` | Fired when the \"Add job\" CTA is clicked from the card's empty state; the block opens the add-first-job form | `{ employeeId: string }` |\n * | `employee/management/compensation/card/addAnotherRequested` | Fired when the \"Add another job\" CTA is clicked; the block opens the add-another-job form | `{ employeeId: string }` |\n * | `employee/management/compensation/card/jobDeleted` | Fired after a non-primary job is deleted via the card's confirm dialog; the block stays on the card | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/changeCancelled` | Fired after a scheduled future-dated change is cancelled from the card; the block stays on the card | `{ employeeId: string, compensationId: string }` |\n * | `employee/management/compensation/editForm/submitted` | Fired after an edit-compensation save completes; the block returns to the card view | Updated `Compensation` entity |\n * | `employee/management/compensation/editForm/cancelled` | Fired when the user cancels the edit form; the block returns to the card view | — |\n * | `employee/management/compensation/addJobForm/submitted` | Fired after the first job + compensation are saved; the block returns to the card and surfaces the \"Job added\" alert | Updated `Compensation` entity |\n * | `employee/management/compensation/addJobForm/cancelled` | Fired when the user cancels the add-job form; the block returns to the card view | — |\n * | `employee/management/compensation/addAnotherJobForm/submitted` | Fired after a secondary job + compensation are saved; the block returns to the card and surfaces the \"Job added\" alert | Updated `Compensation` entity |\n * | `employee/management/compensation/addAnotherJobForm/cancelled` | Fired when the user cancels the add-another-job form; the block returns to the card view | — |\n * | `employee/management/compensation/alertDismissed` | Fired when the user dismisses the \"Job added\" success alert above the card | `null` |\n *\n * @param props - See {@link CompensationProps}.\n * @returns The rendered compensation block.\n * @public\n * @group Block components\n */\nexport function Compensation({ dictionary, FallbackComponent, ...props }: CompensationProps) {\n  useComponentDictionary('Employee.Management.Compensation', dictionary)\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.Compensation\"\n      FallbackComponent={FallbackComponent}\n    >\n      <CompensationFlow {...props} />\n    </BaseBoundaries>\n  )\n}\n"],"names":["CompensationFlow","employeeId","onEvent","useI18n","machine","useMemo","createMachine","compensationStateMachine","ctx","CompensationCardContextual","jsx","Flow","Compensation","dictionary","FallbackComponent","props","useComponentDictionary","BaseBoundaries"],"mappings":";;;;;;;;;AAsBA,SAASA,EAAiB,EAAE,YAAAC,GAAY,SAAAC,KAA8B;AACpE,EAAAC,EAAQ,kCAAkC;AAE1C,QAAMC,IAAUC;AAAA,IACd,MACEC,EAAc,QAAQC,GAA0B,CAACC,OAAuC;AAAA,MACtF,GAAGA;AAAA,MACH,WAAWC;AAAA,MACX,YAAAR;AAAA,MACA,cAAc;AAAA,IAAA,EACd;AAAA,IACJ,CAACA,CAAU;AAAA,EAAA;AAGb,SAAO,gBAAAS,EAACC,GAAA,EAAK,SAAAP,GAAkB,SAAAF,EAAA,CAAkB;AACnD;AA+BO,SAASU,EAAa,EAAE,YAAAC,GAAY,mBAAAC,GAAmB,GAAGC,KAA4B;AAC3F,SAAAC,EAAuB,oCAAoCH,CAAU,GAEnE,gBAAAH;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,mBAAAH;AAAA,MAEA,UAAA,gBAAAJ,EAACV,GAAA,EAAkB,GAAGe,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAGnC;"}
+{"version":3,"file":"Compensation.js","sources":["../../../../../src/components/Employee/Compensation/management/Compensation.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport {\n  CompensationCardContextual,\n  type CompensationContextInterface,\n} from './CompensationComponents'\nimport { compensationStateMachine } from './compensationStateMachine'\nimport { Flow } from '@/components/Flow/Flow'\nimport { BaseBoundaries, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { useI18n } from '@/i18n'\n\n/**\n * Props for {@link Compensation}.\n *\n * @public\n */\nexport interface CompensationProps extends BaseComponentInterface<'Employee.Management.Compensation'> {\n  /** The associated employee identifier. */\n  employeeId: string\n}\n\nfunction CompensationFlow({ employeeId, onEvent, LoaderComponent }: CompensationProps) {\n  useI18n('Employee.Management.Compensation')\n\n  const machine = useMemo(\n    () =>\n      createMachine('card', compensationStateMachine, (ctx: CompensationContextInterface) => ({\n        ...ctx,\n        component: CompensationCardContextual,\n        employeeId,\n        successAlert: null,\n        LoaderComponent,\n      })),\n    [employeeId, LoaderComponent],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n\n/**\n * Self-contained block for viewing and managing an employee's jobs and compensation — the same experience the dashboard surfaces, but as a drop-in component that doesn't require the surrounding dashboard chrome.\n *\n * @remarks\n * Renders a read-only card showing the employee's job(s), pay type, wage, and effective date, along with affordances to edit a job's compensation, add a first job from the empty state, add another job (when the primary job is Nonexempt), delete a non-primary job, and cancel a scheduled future-dated change. Choosing to edit or add a job swaps the card for the corresponding form; a successful add returns to the card with a dismissible \"Job successfully added.\" alert, an edit returns to the card without an alert, and cancelling returns without saving. Wraps everything in error and suspense boundaries.\n *\n * The card and form surfaces ({@link CompensationCard}, {@link CompensationEditForm}, {@link CompensationAddJobForm}, {@link CompensationAddAnotherJobForm}) are also exported individually for cases where that orchestration is the wrong fit — for example, when a form needs to render in a modal or drawer, when the card needs to appear read-only with no edit/add affordances, or when the swap is driven by a router. Using them directly means owning the swap, the alert, and any cross-component state yourself.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/card/editRequested` | Fired when an \"Edit\" CTA is clicked for a job; the block opens the edit form for that job | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/addRequested` | Fired when the \"Add job\" CTA is clicked from the card's empty state; the block opens the add-first-job form | `{ employeeId: string }` |\n * | `employee/management/compensation/card/addAnotherRequested` | Fired when the \"Add another job\" CTA is clicked; the block opens the add-another-job form | `{ employeeId: string }` |\n * | `employee/management/compensation/card/jobDeleted` | Fired after a non-primary job is deleted via the card's confirm dialog; the block stays on the card | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/changeCancelled` | Fired after a scheduled future-dated change is cancelled from the card; the block stays on the card | `{ employeeId: string, compensationId: string }` |\n * | `employee/management/compensation/editForm/submitted` | Fired after an edit-compensation save completes; the block returns to the card view | Updated `Compensation` entity |\n * | `employee/management/compensation/editForm/cancelled` | Fired when the user cancels the edit form; the block returns to the card view | — |\n * | `employee/management/compensation/addJobForm/submitted` | Fired after the first job + compensation are saved; the block returns to the card and surfaces the \"Job added\" alert | Updated `Compensation` entity |\n * | `employee/management/compensation/addJobForm/cancelled` | Fired when the user cancels the add-job form; the block returns to the card view | — |\n * | `employee/management/compensation/addAnotherJobForm/submitted` | Fired after a secondary job + compensation are saved; the block returns to the card and surfaces the \"Job added\" alert | Updated `Compensation` entity |\n * | `employee/management/compensation/addAnotherJobForm/cancelled` | Fired when the user cancels the add-another-job form; the block returns to the card view | — |\n * | `employee/management/compensation/alertDismissed` | Fired when the user dismisses the \"Job added\" success alert above the card | `null` |\n *\n * @param props - See {@link CompensationProps}.\n * @returns The rendered compensation block.\n * @public\n * @group Block components\n */\nexport function Compensation({\n  dictionary,\n  FallbackComponent,\n  LoaderComponent,\n  ...props\n}: CompensationProps) {\n  useComponentDictionary('Employee.Management.Compensation', dictionary)\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.Compensation\"\n      FallbackComponent={FallbackComponent}\n      LoaderComponent={LoaderComponent}\n    >\n      <CompensationFlow LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n"],"names":["CompensationFlow","employeeId","onEvent","LoaderComponent","useI18n","machine","useMemo","createMachine","compensationStateMachine","ctx","CompensationCardContextual","jsx","Flow","Compensation","dictionary","FallbackComponent","props","useComponentDictionary","BaseBoundaries"],"mappings":";;;;;;;;;AAsBA,SAASA,EAAiB,EAAE,YAAAC,GAAY,SAAAC,GAAS,iBAAAC,KAAsC;AACrF,EAAAC,EAAQ,kCAAkC;AAE1C,QAAMC,IAAUC;AAAA,IACd,MACEC,EAAc,QAAQC,GAA0B,CAACC,OAAuC;AAAA,MACtF,GAAGA;AAAA,MACH,WAAWC;AAAA,MACX,YAAAT;AAAA,MACA,cAAc;AAAA,MACd,iBAAAE;AAAA,IAAA,EACA;AAAA,IACJ,CAACF,GAAYE,CAAe;AAAA,EAAA;AAG9B,SAAO,gBAAAQ,EAACC,GAAA,EAAK,SAAAP,GAAkB,SAAAH,EAAA,CAAkB;AACnD;AA+BO,SAASW,EAAa;AAAA,EAC3B,YAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAZ;AAAA,EACA,GAAGa;AACL,GAAsB;AACpB,SAAAC,EAAuB,oCAAoCH,CAAU,GAEnE,gBAAAH;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,mBAAAH;AAAA,MACA,iBAAAZ;AAAA,MAEA,UAAA,gBAAAQ,EAACX,GAAA,EAAiB,iBAAAG,GAAmC,GAAGa,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAGrE;"}

package/dist/components/Employee/Compensation/management/CompensationAddAnotherJobForm/CompensationAddAnotherJobForm.d.ts

@@ -1,4 +1,4 @@
-import { CommonComponentInterface } from '../../../../Base';
+import { CommonComponentInterface, LoaderComponentType } from '../../../../Base';
 import { OnEventType } from '../../../../Base/useBase';
 import { EventType } from '../../../../../shared/constants';
 /**
@@ -11,6 +11,8 @@ export interface CompensationAddAnotherJobFormProps extends CommonComponentInter
     employeeId: string;
     /** Callback invoked when the form emits an event. See the events table on {@link CompensationAddAnotherJobForm} for the available event types and payloads. */
     onEvent: OnEventType<EventType, unknown>;
+    /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */
+    LoaderComponent?: LoaderComponentType;
 }
 /**
  * Standalone form for adding a secondary job and compensation to an employee from the management surface.
@@ -29,4 +31,4 @@ export interface CompensationAddAnotherJobFormProps extends CommonComponentInter
  * @public
  * @group Block components
  */
-export declare function CompensationAddAnotherJobForm({ dictionary, ...props }: CompensationAddAnotherJobFormProps): import("react").JSX.Element;
+export declare function CompensationAddAnotherJobForm({ dictionary, LoaderComponent, ...props }: CompensationAddAnotherJobFormProps): import("react").JSX.Element;

package/dist/components/Employee/Compensation/management/CompensationAddAnotherJobForm/CompensationAddAnotherJobForm.js

@@ -1,86 +1,95 @@
 import { jsx as n } from "react/jsx-runtime";
-import { useState as N } from "react";
-import D from "classnames";
-import { useTranslation as _ } from "react-i18next";
-import { useJobForm as h } from "../../shared/useJobForm/useJobForm.js";
-import { useCompensationForm as y } from "../../shared/useCompensationForm/useCompensationForm.js";
-import { AddCompensationFormBody as v } from "../../shared/AddCompensationFormBody.js";
-import { useManagementCompensationDictionary as O } from "../useManagementCompensationDictionary.js";
-import T from "./CompensationAddAnotherJobForm.module.scss.js";
-import { BaseBoundaries as R, BaseLayout as p } from "../../../../Base/Base.js";
+import { useState as D } from "react";
+import _ from "classnames";
+import { useTranslation as h } from "react-i18next";
+import { useJobForm as y } from "../../shared/useJobForm/useJobForm.js";
+import { useCompensationForm as v } from "../../shared/useCompensationForm/useCompensationForm.js";
+import { AddCompensationFormBody as O } from "../../shared/AddCompensationFormBody.js";
+import { useManagementCompensationDictionary as T } from "../useManagementCompensationDictionary.js";
+import R from "./CompensationAddAnotherJobForm.module.scss.js";
+import { BaseBoundaries as I, BaseLayout as p } from "../../../../Base/Base.js";
 import "../../../../Base/useBase.js";
-import { Form as I } from "../../../../Common/Form/Form.js";
-import { useComponentDictionary as L, useI18n as S } from "../../../../../i18n/I18n.js";
-import { composeErrorHandler as c } from "../../../../../partner-hook-utils/composeErrorHandler.js";
-import { composeSubmitHandler as J } from "../../../../../partner-hook-utils/form/composeSubmitHandler.js";
-import { componentEvents as l } from "../../../../../shared/constants.js";
-function Z({
+import { Form as S } from "../../../../Common/Form/Form.js";
+import { useComponentDictionary as J, useI18n as H } from "../../../../../i18n/I18n.js";
+import { composeErrorHandler as l } from "../../../../../partner-hook-utils/composeErrorHandler.js";
+import { composeSubmitHandler as L } from "../../../../../partner-hook-utils/form/composeSubmitHandler.js";
+import { componentEvents as f } from "../../../../../shared/constants.js";
+function $({
   dictionary: i,
-  ...r
+  LoaderComponent: r,
+  ...a
 }) {
-  return L("Employee.Management.Compensation", i), /* @__PURE__ */ n(R, { componentName: "Employee.Management.Compensation", children: /* @__PURE__ */ n(H, { ...r }) });
+  return J("Employee.Management.Compensation", i), /* @__PURE__ */ n(
+    I,
+    {
+      componentName: "Employee.Management.Compensation",
+      LoaderComponent: r,
+      children: /* @__PURE__ */ n(j, { LoaderComponent: r, ...a })
+    }
+  );
 }
-function H({
+function j({
   employeeId: i,
   className: r,
-  onEvent: a
+  onEvent: a,
+  LoaderComponent: s
 }) {
-  S("Employee.Management.Compensation");
-  const { t: s } = _("Employee.Management.Compensation"), f = O(), [m, E] = N(void 0), t = h({
+  H("Employee.Management.Compensation");
+  const { t: m } = h("Employee.Management.Compensation"), E = T(), [d, b] = D(void 0), t = y({
     employeeId: i,
-    jobId: m,
+    jobId: d,
     withHireDateField: !1,
     optionalFieldsToRequire: { update: ["title"] },
     shouldFocusError: !1
-  }), b = t.isLoading ? void 0 : t.data.currentJob?.currentCompensationUuid ?? void 0, e = y({
+  }), C = t.isLoading ? void 0 : t.data.currentJob?.currentCompensationUuid ?? void 0, e = v({
     employeeId: i,
-    jobId: m,
-    compensationId: b,
+    jobId: d,
+    compensationId: C,
     withEffectiveDateField: !0,
     optionalFieldsToRequire: { update: ["flsaStatus", "rate", "paymentUnit"] },
     shouldFocusError: !1
   });
   if (t.isLoading || e.isLoading) {
-    const o = c([t, e]);
-    return /* @__PURE__ */ n(p, { isLoading: !0, error: o.errors });
+    const o = l([t, e]);
+    return /* @__PURE__ */ n(p, { isLoading: !0, error: o.errors, LoaderComponent: s });
   }
-  const C = t.data.jobs?.find((o) => o.primary)?.hireDate ?? void 0, d = J([t, e], async () => {
-    const o = await t.actions.onSubmit({ employeeId: i, hireDate: C });
+  const M = t.data.jobs?.find((o) => o.primary)?.hireDate ?? void 0, u = L([t, e], async () => {
+    const o = await t.actions.onSubmit({ employeeId: i, hireDate: M });
     if (!o) return;
-    const A = o.data.compensations?.find(
-      (F) => F.uuid === o.data.currentCompensationUuid
-    ), u = await e.actions.onSubmit({
+    const F = o.data.compensations?.find(
+      (N) => N.uuid === o.data.currentCompensationUuid
+    ), c = await e.actions.onSubmit({
       jobId: o.data.uuid,
       compensationId: o.data.currentCompensationUuid ?? void 0,
-      compensationVersion: A?.version ?? void 0
+      compensationVersion: F?.version ?? void 0
     });
-    if (!u) {
-      E(o.data.uuid);
+    if (!c) {
+      b(o.data.uuid);
       return;
     }
     a(
-      l.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_SUBMITTED,
-      u.data
+      f.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_SUBMITTED,
+      c.data
     );
-  }), M = c([d]), g = t.status.isPending || e.status.isPending;
-  return /* @__PURE__ */ n("section", { className: D(T.container, r), children: /* @__PURE__ */ n(p, { error: M.errors, children: /* @__PURE__ */ n(I, { onSubmit: d.handleSubmit, children: /* @__PURE__ */ n(
-    v,
+  }), g = l([u]), A = t.status.isPending || e.status.isPending;
+  return /* @__PURE__ */ n("section", { className: _(R.container, r), children: /* @__PURE__ */ n(p, { error: g.errors, LoaderComponent: s, children: /* @__PURE__ */ n(S, { onSubmit: u.handleSubmit, children: /* @__PURE__ */ n(
+    O,
     {
       jobForm: t,
       compensationForm: e,
-      title: s("addAnotherJobTitle"),
-      submitCtaLabel: s("saveNewJobCta"),
-      isPending: g,
+      title: m("addAnotherJobTitle"),
+      submitCtaLabel: m("saveNewJobCta"),
+      isPending: A,
       onCancel: () => {
         a(
-          l.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_CANCELLED
+          f.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_CANCELLED
         );
       },
-      dictionary: f
+      dictionary: E
     }
   ) }) }) });
 }
 export {
-  Z as CompensationAddAnotherJobForm
+  $ as CompensationAddAnotherJobForm
 };
 //# sourceMappingURL=CompensationAddAnotherJobForm.js.map

package/dist/components/Employee/Compensation/management/CompensationAddAnotherJobForm/CompensationAddAnotherJobForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompensationAddAnotherJobForm.js","sources":["../../../../../../src/components/Employee/Compensation/management/CompensationAddAnotherJobForm/CompensationAddAnotherJobForm.tsx"],"sourcesContent":["import { useState } from 'react'\nimport classNames from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport { useJobForm } from '../../shared/useJobForm'\nimport { useCompensationForm } from '../../shared/useCompensationForm'\nimport { AddCompensationFormBody } from '../../shared/AddCompensationFormBody'\nimport { useManagementCompensationDictionary } from '../useManagementCompensationDictionary'\nimport styles from './CompensationAddAnotherJobForm.module.scss'\nimport { BaseBoundaries, BaseLayout, type CommonComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { composeSubmitHandler } from '@/partner-hook-utils/form/composeSubmitHandler'\nimport { componentEvents, type EventType } from '@/shared/constants'\n\n/**\n * Props for {@link CompensationAddAnotherJobForm}.\n *\n * @public\n */\nexport interface CompensationAddAnotherJobFormProps extends CommonComponentInterface<'Employee.Management.Compensation'> {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** Callback invoked when the form emits an event. See the events table on {@link CompensationAddAnotherJobForm} for the available event types and payloads. */\n  onEvent: OnEventType<EventType, unknown>\n}\n\n/**\n * Standalone form for adding a secondary job and compensation to an employee from the management surface.\n *\n * @remarks\n * Routed from {@link CompensationCard}'s `employee/management/compensation/card/addAnotherRequested` event. Emits its own scoped `submitted` and `cancelled` events — both are your cue to return to the card. {@link Compensation} bundles the card, this form, and the swap and alert wiring as a single drop-in; reach for this form directly only when that orchestration is the wrong fit.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/addAnotherJobForm/submitted` | Fired after the secondary job and compensation are saved; use it to return to the card | Saved `Compensation` entity |\n * | `employee/management/compensation/addAnotherJobForm/cancelled` | Fired when the user clicks Cancel; use it to return to the card | — |\n *\n * @param props - See {@link CompensationAddAnotherJobFormProps}.\n * @returns The rendered add-another-job form.\n * @public\n * @group Block components\n */\nexport function CompensationAddAnotherJobForm({\n  dictionary,\n  ...props\n}: CompensationAddAnotherJobFormProps) {\n  useComponentDictionary('Employee.Management.Compensation', dictionary)\n  return (\n    <BaseBoundaries componentName=\"Employee.Management.Compensation\">\n      <Root {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction Root({\n  employeeId,\n  className,\n  onEvent,\n}: Omit<CompensationAddAnotherJobFormProps, 'dictionary'>) {\n  useI18n('Employee.Management.Compensation')\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const formDictionary = useManagementCompensationDictionary()\n\n  // Track jobId locally so a partial-failure submit chain (job POST succeeds,\n  // comp PUT fails) doesn't re-POST and create a duplicate job on retry.\n  const [resolvedJobId, setResolvedJobId] = useState<string | undefined>(undefined)\n\n  const jobForm = useJobForm({\n    employeeId,\n    jobId: resolvedJobId,\n    withHireDateField: false,\n    optionalFieldsToRequire: { update: ['title'] },\n    shouldFocusError: false,\n  })\n\n  const resolvedCompensationId = jobForm.isLoading\n    ? undefined\n    : (jobForm.data.currentJob?.currentCompensationUuid ?? undefined)\n\n  const compensationForm = useCompensationForm({\n    employeeId,\n    jobId: resolvedJobId,\n    compensationId: resolvedCompensationId,\n    withEffectiveDateField: true,\n    optionalFieldsToRequire: { update: ['flsaStatus', 'rate', 'paymentUnit'] },\n    shouldFocusError: false,\n  })\n\n  if (jobForm.isLoading || compensationForm.isLoading) {\n    const loadingErrorHandling = composeErrorHandler([jobForm, compensationForm])\n    return <BaseLayout isLoading error={loadingErrorHandling.errors} />\n  }\n\n  // The API defaults a secondary job's hire_date to the primary job's hire_date\n  // when omitted. We pass it explicitly to satisfy the SDK hook's requirement\n  // and mirror the API's own default behavior. React Query dedupes this query\n  // since useJobForm has already loaded it.\n  const primaryHireDate = jobForm.data.jobs?.find(j => j.primary)?.hireDate ?? undefined\n\n  const submitResult = composeSubmitHandler([jobForm, compensationForm], async () => {\n    const jobResult = await jobForm.actions.onSubmit({ employeeId, hireDate: primaryHireDate })\n    if (!jobResult) return\n\n    const stubCompensation = jobResult.data.compensations?.find(\n      c => c.uuid === jobResult.data.currentCompensationUuid,\n    )\n\n    const compensationResult = await compensationForm.actions.onSubmit({\n      jobId: jobResult.data.uuid,\n      compensationId: jobResult.data.currentCompensationUuid ?? undefined,\n      compensationVersion: stubCompensation?.version ?? undefined,\n    })\n    if (!compensationResult) {\n      setResolvedJobId(jobResult.data.uuid)\n      return\n    }\n\n    onEvent(\n      componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_SUBMITTED,\n      compensationResult.data,\n    )\n  })\n\n  const errorHandling = composeErrorHandler([submitResult])\n  const isPending = jobForm.status.isPending || compensationForm.status.isPending\n\n  return (\n    <section className={classNames(styles.container, className)}>\n      <BaseLayout error={errorHandling.errors}>\n        <Form onSubmit={submitResult.handleSubmit}>\n          <AddCompensationFormBody\n            jobForm={jobForm}\n            compensationForm={compensationForm}\n            title={t('addAnotherJobTitle')}\n            submitCtaLabel={t('saveNewJobCta')}\n            isPending={isPending}\n            onCancel={() => {\n              onEvent(\n                componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_CANCELLED,\n              )\n            }}\n            dictionary={formDictionary}\n          />\n        </Form>\n      </BaseLayout>\n    </section>\n  )\n}\n"],"names":["CompensationAddAnotherJobForm","dictionary","props","useComponentDictionary","jsx","BaseBoundaries","Root","employeeId","className","onEvent","useI18n","t","useTranslation","formDictionary","useManagementCompensationDictionary","resolvedJobId","setResolvedJobId","useState","jobForm","useJobForm","resolvedCompensationId","compensationForm","useCompensationForm","loadingErrorHandling","composeErrorHandler","BaseLayout","primaryHireDate","j","submitResult","composeSubmitHandler","jobResult","stubCompensation","c","compensationResult","componentEvents","errorHandling","isPending","classNames","styles","Form","AddCompensationFormBody"],"mappings":";;;;;;;;;;;;;;;;AA6CO,SAASA,EAA8B;AAAA,EAC5C,YAAAC;AAAA,EACA,GAAGC;AACL,GAAuC;AACrC,SAAAC,EAAuB,oCAAoCF,CAAU,GAEnE,gBAAAG,EAACC,KAAe,eAAc,oCAC5B,4BAACC,GAAA,EAAM,GAAGJ,GAAO,EAAA,CACnB;AAEJ;AAEA,SAASI,EAAK;AAAA,EACZ,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AACF,GAA2D;AACzD,EAAAC,EAAQ,kCAAkC;AAC1C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,kCAAkC,GACzDC,IAAiBC,EAAA,GAIjB,CAACC,GAAeC,CAAgB,IAAIC,EAA6B,MAAS,GAE1EC,IAAUC,EAAW;AAAA,IACzB,YAAAZ;AAAA,IACA,OAAOQ;AAAA,IACP,mBAAmB;AAAA,IACnB,yBAAyB,EAAE,QAAQ,CAAC,OAAO,EAAA;AAAA,IAC3C,kBAAkB;AAAA,EAAA,CACnB,GAEKK,IAAyBF,EAAQ,YACnC,SACCA,EAAQ,KAAK,YAAY,2BAA2B,QAEnDG,IAAmBC,EAAoB;AAAA,IAC3C,YAAAf;AAAA,IACA,OAAOQ;AAAA,IACP,gBAAgBK;AAAA,IAChB,wBAAwB;AAAA,IACxB,yBAAyB,EAAE,QAAQ,CAAC,cAAc,QAAQ,aAAa,EAAA;AAAA,IACvE,kBAAkB;AAAA,EAAA,CACnB;AAED,MAAIF,EAAQ,aAAaG,EAAiB,WAAW;AACnD,UAAME,IAAuBC,EAAoB,CAACN,GAASG,CAAgB,CAAC;AAC5E,6BAAQI,GAAA,EAAW,WAAS,IAAC,OAAOF,EAAqB,QAAQ;AAAA,EACnE;AAMA,QAAMG,IAAkBR,EAAQ,KAAK,MAAM,KAAK,CAAAS,MAAKA,EAAE,OAAO,GAAG,YAAY,QAEvEC,IAAeC,EAAqB,CAACX,GAASG,CAAgB,GAAG,YAAY;AACjF,UAAMS,IAAY,MAAMZ,EAAQ,QAAQ,SAAS,EAAE,YAAAX,GAAY,UAAUmB,GAAiB;AAC1F,QAAI,CAACI,EAAW;AAEhB,UAAMC,IAAmBD,EAAU,KAAK,eAAe;AAAA,MACrD,CAAAE,MAAKA,EAAE,SAASF,EAAU,KAAK;AAAA,IAAA,GAG3BG,IAAqB,MAAMZ,EAAiB,QAAQ,SAAS;AAAA,MACjE,OAAOS,EAAU,KAAK;AAAA,MACtB,gBAAgBA,EAAU,KAAK,2BAA2B;AAAA,MAC1D,qBAAqBC,GAAkB,WAAW;AAAA,IAAA,CACnD;AACD,QAAI,CAACE,GAAoB;AACvB,MAAAjB,EAAiBc,EAAU,KAAK,IAAI;AACpC;AAAA,IACF;AAEA,IAAArB;AAAA,MACEyB,EAAgB;AAAA,MAChBD,EAAmB;AAAA,IAAA;AAAA,EAEvB,CAAC,GAEKE,IAAgBX,EAAoB,CAACI,CAAY,CAAC,GAClDQ,IAAYlB,EAAQ,OAAO,aAAaG,EAAiB,OAAO;AAEtE,2BACG,WAAA,EAAQ,WAAWgB,EAAWC,EAAO,WAAW9B,CAAS,GACxD,UAAA,gBAAAJ,EAACqB,GAAA,EAAW,OAAOU,EAAc,QAC/B,4BAACI,GAAA,EAAK,UAAUX,EAAa,cAC3B,UAAA,gBAAAxB;AAAA,IAACoC;AAAA,IAAA;AAAA,MACC,SAAAtB;AAAA,MACA,kBAAAG;AAAA,MACA,OAAOV,EAAE,oBAAoB;AAAA,MAC7B,gBAAgBA,EAAE,eAAe;AAAA,MACjC,WAAAyB;AAAA,MACA,UAAU,MAAM;AACd,QAAA3B;AAAA,UACEyB,EAAgB;AAAA,QAAA;AAAA,MAEpB;AAAA,MACA,YAAYrB;AAAA,IAAA;AAAA,EAAA,EACd,CACF,GACF,GACF;AAEJ;"}
+{"version":3,"file":"CompensationAddAnotherJobForm.js","sources":["../../../../../../src/components/Employee/Compensation/management/CompensationAddAnotherJobForm/CompensationAddAnotherJobForm.tsx"],"sourcesContent":["import { useState } from 'react'\nimport classNames from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport { useJobForm } from '../../shared/useJobForm'\nimport { useCompensationForm } from '../../shared/useCompensationForm'\nimport { AddCompensationFormBody } from '../../shared/AddCompensationFormBody'\nimport { useManagementCompensationDictionary } from '../useManagementCompensationDictionary'\nimport styles from './CompensationAddAnotherJobForm.module.scss'\nimport { BaseBoundaries, BaseLayout, type CommonComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { composeSubmitHandler } from '@/partner-hook-utils/form/composeSubmitHandler'\nimport { componentEvents, type EventType } from '@/shared/constants'\n\n/**\n * Props for {@link CompensationAddAnotherJobForm}.\n *\n * @public\n */\nexport interface CompensationAddAnotherJobFormProps extends CommonComponentInterface<'Employee.Management.Compensation'> {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** Callback invoked when the form emits an event. See the events table on {@link CompensationAddAnotherJobForm} for the available event types and payloads. */\n  onEvent: OnEventType<EventType, unknown>\n  /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */\n  LoaderComponent?: LoaderComponentType\n}\n\n/**\n * Standalone form for adding a secondary job and compensation to an employee from the management surface.\n *\n * @remarks\n * Routed from {@link CompensationCard}'s `employee/management/compensation/card/addAnotherRequested` event. Emits its own scoped `submitted` and `cancelled` events — both are your cue to return to the card. {@link Compensation} bundles the card, this form, and the swap and alert wiring as a single drop-in; reach for this form directly only when that orchestration is the wrong fit.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/addAnotherJobForm/submitted` | Fired after the secondary job and compensation are saved; use it to return to the card | Saved `Compensation` entity |\n * | `employee/management/compensation/addAnotherJobForm/cancelled` | Fired when the user clicks Cancel; use it to return to the card | — |\n *\n * @param props - See {@link CompensationAddAnotherJobFormProps}.\n * @returns The rendered add-another-job form.\n * @public\n * @group Block components\n */\nexport function CompensationAddAnotherJobForm({\n  dictionary,\n  LoaderComponent,\n  ...props\n}: CompensationAddAnotherJobFormProps) {\n  useComponentDictionary('Employee.Management.Compensation', dictionary)\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.Compensation\"\n      LoaderComponent={LoaderComponent}\n    >\n      <Root LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction Root({\n  employeeId,\n  className,\n  onEvent,\n  LoaderComponent,\n}: Omit<CompensationAddAnotherJobFormProps, 'dictionary'>) {\n  useI18n('Employee.Management.Compensation')\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const formDictionary = useManagementCompensationDictionary()\n\n  // Track jobId locally so a partial-failure submit chain (job POST succeeds,\n  // comp PUT fails) doesn't re-POST and create a duplicate job on retry.\n  const [resolvedJobId, setResolvedJobId] = useState<string | undefined>(undefined)\n\n  const jobForm = useJobForm({\n    employeeId,\n    jobId: resolvedJobId,\n    withHireDateField: false,\n    optionalFieldsToRequire: { update: ['title'] },\n    shouldFocusError: false,\n  })\n\n  const resolvedCompensationId = jobForm.isLoading\n    ? undefined\n    : (jobForm.data.currentJob?.currentCompensationUuid ?? undefined)\n\n  const compensationForm = useCompensationForm({\n    employeeId,\n    jobId: resolvedJobId,\n    compensationId: resolvedCompensationId,\n    withEffectiveDateField: true,\n    optionalFieldsToRequire: { update: ['flsaStatus', 'rate', 'paymentUnit'] },\n    shouldFocusError: false,\n  })\n\n  if (jobForm.isLoading || compensationForm.isLoading) {\n    const loadingErrorHandling = composeErrorHandler([jobForm, compensationForm])\n    return (\n      <BaseLayout isLoading error={loadingErrorHandling.errors} LoaderComponent={LoaderComponent} />\n    )\n  }\n\n  // The API defaults a secondary job's hire_date to the primary job's hire_date\n  // when omitted. We pass it explicitly to satisfy the SDK hook's requirement\n  // and mirror the API's own default behavior. React Query dedupes this query\n  // since useJobForm has already loaded it.\n  const primaryHireDate = jobForm.data.jobs?.find(j => j.primary)?.hireDate ?? undefined\n\n  const submitResult = composeSubmitHandler([jobForm, compensationForm], async () => {\n    const jobResult = await jobForm.actions.onSubmit({ employeeId, hireDate: primaryHireDate })\n    if (!jobResult) return\n\n    const stubCompensation = jobResult.data.compensations?.find(\n      c => c.uuid === jobResult.data.currentCompensationUuid,\n    )\n\n    const compensationResult = await compensationForm.actions.onSubmit({\n      jobId: jobResult.data.uuid,\n      compensationId: jobResult.data.currentCompensationUuid ?? undefined,\n      compensationVersion: stubCompensation?.version ?? undefined,\n    })\n    if (!compensationResult) {\n      setResolvedJobId(jobResult.data.uuid)\n      return\n    }\n\n    onEvent(\n      componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_SUBMITTED,\n      compensationResult.data,\n    )\n  })\n\n  const errorHandling = composeErrorHandler([submitResult])\n  const isPending = jobForm.status.isPending || compensationForm.status.isPending\n\n  return (\n    <section className={classNames(styles.container, className)}>\n      <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <Form onSubmit={submitResult.handleSubmit}>\n          <AddCompensationFormBody\n            jobForm={jobForm}\n            compensationForm={compensationForm}\n            title={t('addAnotherJobTitle')}\n            submitCtaLabel={t('saveNewJobCta')}\n            isPending={isPending}\n            onCancel={() => {\n              onEvent(\n                componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_ANOTHER_JOB_FORM_CANCELLED,\n              )\n            }}\n            dictionary={formDictionary}\n          />\n        </Form>\n      </BaseLayout>\n    </section>\n  )\n}\n"],"names":["CompensationAddAnotherJobForm","dictionary","LoaderComponent","props","useComponentDictionary","jsx","BaseBoundaries","Root","employeeId","className","onEvent","useI18n","t","useTranslation","formDictionary","useManagementCompensationDictionary","resolvedJobId","setResolvedJobId","useState","jobForm","useJobForm","resolvedCompensationId","compensationForm","useCompensationForm","loadingErrorHandling","composeErrorHandler","BaseLayout","primaryHireDate","j","submitResult","composeSubmitHandler","jobResult","stubCompensation","c","compensationResult","componentEvents","errorHandling","isPending","classNames","styles","Form","AddCompensationFormBody"],"mappings":"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"}

package/dist/components/Employee/Compensation/management/CompensationAddJobForm/CompensationAddJobForm.d.ts

@@ -1,4 +1,4 @@
-import { CommonComponentInterface } from '../../../../Base';
+import { CommonComponentInterface, LoaderComponentType } from '../../../../Base';
 import { OnEventType } from '../../../../Base/useBase';
 import { EventType } from '../../../../../shared/constants';
 /**
@@ -11,6 +11,8 @@ export interface CompensationAddJobFormProps extends CommonComponentInterface<'E
     employeeId: string;
     /** Callback invoked when the form emits an event. See the events table on {@link CompensationAddJobForm} for the available event types and payloads. */
     onEvent: OnEventType<EventType, unknown>;
+    /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */
+    LoaderComponent?: LoaderComponentType;
 }
 /**
  * Standalone form for adding an employee's first job and compensation from the management surface.
@@ -29,4 +31,4 @@ export interface CompensationAddJobFormProps extends CommonComponentInterface<'E
  * @public
  * @group Block components
  */
-export declare function CompensationAddJobForm({ dictionary, ...props }: CompensationAddJobFormProps): import("react").JSX.Element;
+export declare function CompensationAddJobForm({ dictionary, LoaderComponent, ...props }: CompensationAddJobFormProps): import("react").JSX.Element;

package/dist/components/Employee/Compensation/management/CompensationAddJobForm/CompensationAddJobForm.js

@@ -1,34 +1,50 @@
-import { jsx as t } from "react/jsx-runtime";
-import { useTranslation as E } from "react-i18next";
-import { EditCompensation as p } from "../../onboarding/EditCompensation/EditCompensation.js";
-import { useManagementCompensationDictionary as s } from "../useManagementCompensationDictionary.js";
-import { BaseBoundaries as M } from "../../../../Base/Base.js";
+import { jsx as m } from "react/jsx-runtime";
+import { useTranslation as p } from "react-i18next";
+import { EditCompensation as s } from "../../onboarding/EditCompensation/EditCompensation.js";
+import { useManagementCompensationDictionary as M } from "../useManagementCompensationDictionary.js";
+import { BaseBoundaries as C } from "../../../../Base/Base.js";
 import "../../../../Base/useBase.js";
-import { useComponentDictionary as C, useI18n as _ } from "../../../../../i18n/I18n.js";
-import { componentEvents as e } from "../../../../../shared/constants.js";
-function d({ dictionary: n, ...o }) {
-  return C("Employee.Management.Compensation", n), /* @__PURE__ */ t(M, { componentName: "Employee.Management.Compensation", children: /* @__PURE__ */ t(N, { ...o }) });
+import { useComponentDictionary as _, useI18n as N } from "../../../../../i18n/I18n.js";
+import { componentEvents as t } from "../../../../../shared/constants.js";
+function y({
+  dictionary: n,
+  LoaderComponent: o,
+  ...e
+}) {
+  return _("Employee.Management.Compensation", n), /* @__PURE__ */ m(
+    C,
+    {
+      componentName: "Employee.Management.Compensation",
+      LoaderComponent: o,
+      children: /* @__PURE__ */ m(O, { ...e, LoaderComponent: o })
+    }
+  );
 }
-function N({ employeeId: n, onEvent: o }) {
-  _("Employee.Management.Compensation");
-  const { t: m } = E("Employee.Management.Compensation"), i = s();
-  return /* @__PURE__ */ t(
-    p,
+function O({
+  employeeId: n,
+  onEvent: o,
+  LoaderComponent: e
+}) {
+  N("Employee.Management.Compensation");
+  const { t: i } = p("Employee.Management.Compensation"), a = M();
+  return /* @__PURE__ */ m(
+    s,
     {
       employeeId: n,
-      title: m("addJobTitle"),
-      submitCtaLabel: m("saveNewJobCta"),
-      dictionary: i,
-      onEvent: (a, r) => {
-        a === e.EMPLOYEE_COMPENSATION_UPDATED && o(e.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_SUBMITTED, r);
+      title: i("addJobTitle"),
+      submitCtaLabel: i("saveNewJobCta"),
+      dictionary: a,
+      LoaderComponent: e,
+      onEvent: (r, E) => {
+        r === t.EMPLOYEE_COMPENSATION_UPDATED && o(t.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_SUBMITTED, E);
       },
       onCancel: () => {
-        o(e.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_CANCELLED);
+        o(t.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_CANCELLED);
       }
     }
   );
 }
 export {
-  d as CompensationAddJobForm
+  y as CompensationAddJobForm
 };
 //# sourceMappingURL=CompensationAddJobForm.js.map

package/dist/components/Employee/Compensation/management/CompensationAddJobForm/CompensationAddJobForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompensationAddJobForm.js","sources":["../../../../../../src/components/Employee/Compensation/management/CompensationAddJobForm/CompensationAddJobForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { EditCompensation } from '../../onboarding/EditCompensation/EditCompensation'\nimport { useManagementCompensationDictionary } from '../useManagementCompensationDictionary'\nimport { BaseBoundaries, type CommonComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents, type EventType } from '@/shared/constants'\n\n/**\n * Props for {@link CompensationAddJobForm}.\n *\n * @public\n */\nexport interface CompensationAddJobFormProps extends CommonComponentInterface<'Employee.Management.Compensation'> {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** Callback invoked when the form emits an event. See the events table on {@link CompensationAddJobForm} for the available event types and payloads. */\n  onEvent: OnEventType<EventType, unknown>\n}\n\n/**\n * Standalone form for adding an employee's first job and compensation from the management surface.\n *\n * @remarks\n * Routed from {@link CompensationCard}'s `employee/management/compensation/card/addRequested` event. Emits its own scoped `submitted` and `cancelled` events — both are your cue to return to the card. {@link Compensation} bundles the card, this form, and the swap and alert wiring as a single drop-in; reach for this form directly only when that orchestration is the wrong fit.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/addJobForm/submitted` | Fired after the job and compensation are saved; use it to return to the card | Saved `Compensation` entity |\n * | `employee/management/compensation/addJobForm/cancelled` | Fired when the user clicks Cancel; use it to return to the card | — |\n *\n * @param props - See {@link CompensationAddJobFormProps}.\n * @returns The rendered add-job form.\n * @public\n * @group Block components\n */\nexport function CompensationAddJobForm({ dictionary, ...props }: CompensationAddJobFormProps) {\n  useComponentDictionary('Employee.Management.Compensation', dictionary)\n  return (\n    <BaseBoundaries componentName=\"Employee.Management.Compensation\">\n      <Root {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction Root({ employeeId, onEvent }: Omit<CompensationAddJobFormProps, 'dictionary'>) {\n  useI18n('Employee.Management.Compensation')\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const editCompensationDictionary = useManagementCompensationDictionary()\n\n  return (\n    <EditCompensation\n      employeeId={employeeId}\n      title={t('addJobTitle')}\n      submitCtaLabel={t('saveNewJobCta')}\n      dictionary={editCompensationDictionary}\n      onEvent={(type, data) => {\n        // The onboarding EditCompensation fires its own job/compensation events;\n        // the management block exposes a single scoped \"submitted\" event keyed off\n        // the compensation save (the terminal step of the create chain).\n        if (type === componentEvents.EMPLOYEE_COMPENSATION_UPDATED) {\n          onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_SUBMITTED, data)\n        }\n      }}\n      onCancel={() => {\n        onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_CANCELLED)\n      }}\n    />\n  )\n}\n"],"names":["CompensationAddJobForm","dictionary","props","useComponentDictionary","jsx","BaseBoundaries","Root","employeeId","onEvent","useI18n","t","useTranslation","editCompensationDictionary","useManagementCompensationDictionary","EditCompensation","type","data","componentEvents"],"mappings":";;;;;;;;AAqCO,SAASA,EAAuB,EAAE,YAAAC,GAAY,GAAGC,KAAsC;AAC5F,SAAAC,EAAuB,oCAAoCF,CAAU,GAEnE,gBAAAG,EAACC,KAAe,eAAc,oCAC5B,4BAACC,GAAA,EAAM,GAAGJ,GAAO,EAAA,CACnB;AAEJ;AAEA,SAASI,EAAK,EAAE,YAAAC,GAAY,SAAAC,KAA4D;AACtF,EAAAC,EAAQ,kCAAkC;AAC1C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,kCAAkC,GACzDC,IAA6BC,EAAA;AAEnC,SACE,gBAAAT;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,YAAAP;AAAA,MACA,OAAOG,EAAE,aAAa;AAAA,MACtB,gBAAgBA,EAAE,eAAe;AAAA,MACjC,YAAYE;AAAA,MACZ,SAAS,CAACG,GAAMC,MAAS;AAIvB,QAAID,MAASE,EAAgB,iCAC3BT,EAAQS,EAAgB,yDAAyDD,CAAI;AAAA,MAEzF;AAAA,MACA,UAAU,MAAM;AACd,QAAAR,EAAQS,EAAgB,uDAAuD;AAAA,MACjF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"CompensationAddJobForm.js","sources":["../../../../../../src/components/Employee/Compensation/management/CompensationAddJobForm/CompensationAddJobForm.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { EditCompensation } from '../../onboarding/EditCompensation/EditCompensation'\nimport { useManagementCompensationDictionary } from '../useManagementCompensationDictionary'\nimport { BaseBoundaries, type CommonComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { componentEvents, type EventType } from '@/shared/constants'\n\n/**\n * Props for {@link CompensationAddJobForm}.\n *\n * @public\n */\nexport interface CompensationAddJobFormProps extends CommonComponentInterface<'Employee.Management.Compensation'> {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** Callback invoked when the form emits an event. See the events table on {@link CompensationAddJobForm} for the available event types and payloads. */\n  onEvent: OnEventType<EventType, unknown>\n  /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */\n  LoaderComponent?: LoaderComponentType\n}\n\n/**\n * Standalone form for adding an employee's first job and compensation from the management surface.\n *\n * @remarks\n * Routed from {@link CompensationCard}'s `employee/management/compensation/card/addRequested` event. Emits its own scoped `submitted` and `cancelled` events — both are your cue to return to the card. {@link Compensation} bundles the card, this form, and the swap and alert wiring as a single drop-in; reach for this form directly only when that orchestration is the wrong fit.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/addJobForm/submitted` | Fired after the job and compensation are saved; use it to return to the card | Saved `Compensation` entity |\n * | `employee/management/compensation/addJobForm/cancelled` | Fired when the user clicks Cancel; use it to return to the card | — |\n *\n * @param props - See {@link CompensationAddJobFormProps}.\n * @returns The rendered add-job form.\n * @public\n * @group Block components\n */\nexport function CompensationAddJobForm({\n  dictionary,\n  LoaderComponent,\n  ...props\n}: CompensationAddJobFormProps) {\n  useComponentDictionary('Employee.Management.Compensation', dictionary)\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.Compensation\"\n      LoaderComponent={LoaderComponent}\n    >\n      <Root {...props} LoaderComponent={LoaderComponent} />\n    </BaseBoundaries>\n  )\n}\n\nfunction Root({\n  employeeId,\n  onEvent,\n  LoaderComponent,\n}: Omit<CompensationAddJobFormProps, 'dictionary'>) {\n  useI18n('Employee.Management.Compensation')\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const editCompensationDictionary = useManagementCompensationDictionary()\n\n  return (\n    <EditCompensation\n      employeeId={employeeId}\n      title={t('addJobTitle')}\n      submitCtaLabel={t('saveNewJobCta')}\n      dictionary={editCompensationDictionary}\n      LoaderComponent={LoaderComponent}\n      onEvent={(type, data) => {\n        // The onboarding EditCompensation fires its own job/compensation events;\n        // the management block exposes a single scoped \"submitted\" event keyed off\n        // the compensation save (the terminal step of the create chain).\n        if (type === componentEvents.EMPLOYEE_COMPENSATION_UPDATED) {\n          onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_SUBMITTED, data)\n        }\n      }}\n      onCancel={() => {\n        onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_ADD_JOB_FORM_CANCELLED)\n      }}\n    />\n  )\n}\n"],"names":["CompensationAddJobForm","dictionary","LoaderComponent","props","useComponentDictionary","jsx","BaseBoundaries","Root","employeeId","onEvent","useI18n","t","useTranslation","editCompensationDictionary","useManagementCompensationDictionary","EditCompensation","type","data","componentEvents"],"mappings":";;;;;;;;AAwCO,SAASA,EAAuB;AAAA,EACrC,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,GAAGC;AACL,GAAgC;AAC9B,SAAAC,EAAuB,oCAAoCH,CAAU,GAEnE,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,iBAAAJ;AAAA,MAEA,UAAA,gBAAAG,EAACE,GAAA,EAAM,GAAGJ,GAAO,iBAAAD,EAAA,CAAkC;AAAA,IAAA;AAAA,EAAA;AAGzD;AAEA,SAASK,EAAK;AAAA,EACZ,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,iBAAAP;AACF,GAAoD;AAClD,EAAAQ,EAAQ,kCAAkC;AAC1C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,kCAAkC,GACzDC,IAA6BC,EAAA;AAEnC,SACE,gBAAAT;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,YAAAP;AAAA,MACA,OAAOG,EAAE,aAAa;AAAA,MACtB,gBAAgBA,EAAE,eAAe;AAAA,MACjC,YAAYE;AAAA,MACZ,iBAAAX;AAAA,MACA,SAAS,CAACc,GAAMC,MAAS;AAIvB,QAAID,MAASE,EAAgB,iCAC3BT,EAAQS,EAAgB,yDAAyDD,CAAI;AAAA,MAEzF;AAAA,MACA,UAAU,MAAM;AACd,QAAAR,EAAQS,EAAgB,uDAAuD;AAAA,MACjF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Employee/Compensation/management/CompensationCard/CompensationCard.d.ts

@@ -1,5 +1,6 @@
 import { EventType } from '../../../../../shared/constants';
 import { OnEventType } from '../../../../Base/useBase';
+import { LoaderComponentType } from '../../../../Base';
 /**
  * Props for {@link CompensationCard}.
  *
@@ -10,6 +11,8 @@ export interface CompensationCardProps {
     employeeId: string;
     /** Callback invoked when the card emits an event. See the events table on {@link CompensationCard} for the available event types and payloads. */
     onEvent: OnEventType<EventType, unknown>;
+    /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */
+    LoaderComponent?: LoaderComponentType;
 }
 /**
  * Standalone "Compensation" management card that displays an employee's current jobs and compensation, surfaces pending future-dated changes, and exposes edit, add, and delete affordances.
@@ -31,4 +34,4 @@ export interface CompensationCardProps {
  * @public
  * @group Block components
  */
-export declare function CompensationCard(props: CompensationCardProps): import("react").JSX.Element;
+export declare function CompensationCard({ LoaderComponent, ...props }: CompensationCardProps): import("react").JSX.Element;