@gusto/embedded-react-sdk 0.54.0 → 0.54.1-rc.1

package/dist/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.d.ts

@@ -0,0 +1,41 @@
+import { BaseComponentInterface } from '../../../Base';
+/**
+ * Props for {@link CreateHistoricalPayment}.
+ *
+ * @alpha
+ */
+export interface CreateHistoricalPaymentProps extends BaseComponentInterface<'Contractor.Payments.CreateHistoricalPayment'> {
+    /** UUID of the company recording the historical payment. */
+    companyId: string;
+}
+/**
+ * Records a historical contractor payment — one that already happened outside Gusto and does not
+ * move money — by picking a paid date and the contractors being paid, entering hours, wages,
+ * bonuses, and reimbursements for them, then reviewing and submitting.
+ *
+ * @remarks
+ * Every contractor payment is fixed to the `Historical Payment` payment method, so there is no
+ * payment method choice or debit information to review.
+ * Continue on the contractor-selection step is disabled until the paid date is valid and at least
+ * one contractor is selected. Continue on the amounts step is disabled until at least one selected
+ * contractor has a payment total greater than zero, and swaps the amounts grid for an in-place
+ * review (mirroring `CreatePayment`'s preview step); Edit returns to the grid without losing
+ * entered amounts, and Submit creates the contractor payment group. Once creation succeeds, the
+ * Edit and Submit buttons are replaced with a success message, since the creation token has been
+ * consumed and the host is expected to navigate away (e.g. to `HistoricalPaymentSummary`).
+ *
+ * @events
+ * | Event | Description | Data |
+ * | ----- | ----------- | ---- |
+ * | `contractor/historicalPayments/edit` | The edit modal was opened for a contractor. | — |
+ * | `contractor/historicalPayments/update` | A contractor's payment values were updated locally. | The updated form values (hours, wage, bonus, reimbursement, payment method, etc.). |
+ * | `contractor/historicalPayments/preview` | The preview API call succeeded. | The contractor payment group preview response. |
+ * | `contractor/historicalPayments/backToEdit` | The user returned from preview to continue editing. | — |
+ * | `contractor/historicalPayments/created` | The payment group was successfully created. | The created contractor payment group response. |
+ *
+ * @param props - See {@link CreateHistoricalPaymentProps}.
+ * @returns The rendered contractor-selection screen, the payment-amounts entry screen, or its
+ * in-place review.
+ * @alpha
+ */
+export declare function CreateHistoricalPayment(props: CreateHistoricalPaymentProps): import("react").JSX.Element;

package/dist/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.js

@@ -0,0 +1,175 @@
+import { jsx as t, jsxs as i } from "react/jsx-runtime";
+import { useContractorsListSuspense as j } from "@gusto/embedded-api/react-query/contractorsList";
+import { useContractorPaymentGroupsPreviewMutation as q } from "@gusto/embedded-api/react-query/contractorPaymentGroupsPreview";
+import { useContractorPaymentGroupsCreateMutation as W } from "@gusto/embedded-api/react-query/contractorPaymentGroupsCreate";
+import { RFCDate as O } from "@gusto/embedded-api/types/rfcdate";
+import { useMemo as U, useState as y } from "react";
+import { useTranslation as x } from "react-i18next";
+import { usePaymentAmountsEditor as K } from "../shared/usePaymentAmountsEditor.js";
+import { getHistoricalPaymentCheckDateBounds as V } from "../shared/historicalPaymentDateBounds.js";
+import { useCreateHistoricalPaymentDictionary as z, useCreateHistoricalPaymentReviewDictionary as J } from "./useFormDictionary.js";
+import { formatDateToStringDate as Q } from "../../../../helpers/dateFormatting.js";
+import { Flex as c, FlexItem as X } from "../../../Common/Flex/Flex.js";
+import { ActionsLayout as Z } from "../../../Common/ActionsLayout/ActionsLayout.js";
+import { BaseComponent as $ } from "../../../Base/Base.js";
+import { useBase as tt } from "../../../Base/useBase.js";
+import { useComponentContext as M } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as et, useComponentDictionary as nt } from "../../../../i18n/I18n.js";
+import { useDateFormatter as rt } from "../../../../hooks/useDateFormatter.js";
+import { componentEvents as p } from "../../../../shared/constants.js";
+import { SelectContractors as ot } from "../../shared/SelectContractors/SelectContractors.js";
+import { PaymentSummaryBlock as at } from "../shared/PaymentSummaryBlock/PaymentSummaryBlock.js";
+import { SetPaymentAmounts as it } from "../shared/SetPaymentAmounts/SetPaymentAmounts.js";
+const S = ["Historical Payment"];
+function Ot(a) {
+  return /* @__PURE__ */ t($, { ...a, componentName: "Contractor.Payments.CreateHistoricalPayment", children: /* @__PURE__ */ t(ct, { ...a }) });
+}
+function ct({ companyId: a, dictionary: R, onEvent: h }) {
+  et("Contractor.Payments.CreateHistoricalPayment"), nt("Contractor.Payments.CreateHistoricalPayment", R);
+  const { t: e } = x("Contractor.Payments.CreateHistoricalPayment"), { Heading: r, Text: f, Button: u, DatePicker: m } = M(), { minDate: d, maxDate: C } = U(() => V(), []), [o, I] = y(null), [P, E] = y([]), [l, D] = y(null);
+  let s = null;
+  o !== null && o > C ? s = e("select.dateInFutureError") : o !== null && o < d && (s = e("select.dateTooEarlyError", {
+    year: o.getFullYear(),
+    allowedYear: d.getFullYear()
+  }));
+  const T = P.length > 0 && o !== null && s === null, g = () => {
+    if (!T) return;
+    const A = Q(o);
+    A && D({ contractorIds: P, checkDate: A });
+  };
+  return l ? /* @__PURE__ */ t(
+    st,
+    {
+      companyId: a,
+      contractorIds: l.contractorIds,
+      checkDate: l.checkDate,
+      onEvent: h
+    }
+  ) : /* @__PURE__ */ i(c, { flexDirection: "column", gap: 32, children: [
+    /* @__PURE__ */ i(c, { flexDirection: "column", gap: 4, children: [
+      /* @__PURE__ */ t(r, { as: "h2", children: e("select.heading") }),
+      /* @__PURE__ */ t(f, { variant: "supporting", children: e("select.subtitle") })
+    ] }),
+    /* @__PURE__ */ t(
+      m,
+      {
+        label: e("select.dateLabel"),
+        isRequired: !0,
+        value: o,
+        onChange: I,
+        minDate: d,
+        maxDate: C,
+        isInvalid: s !== null,
+        errorMessage: s ?? void 0
+      }
+    ),
+    /* @__PURE__ */ t(ot, { companyId: a, onSelectionChange: E }),
+    /* @__PURE__ */ t(Z, { children: /* @__PURE__ */ t(u, { onClick: g, variant: "primary", isDisabled: !T, children: e("select.continueButton") }) })
+  ] });
+}
+function st({ companyId: a, contractorIds: R, checkDate: h, onEvent: e }) {
+  const { t: r } = x("Contractor.Payments.CreateHistoricalPayment"), { Heading: f, Text: u, Button: m, Alert: d } = M(), { baseSubmitHandler: C } = tt(), { formatLongWithYear: o } = rt(), I = z(), P = J(), { data: E } = j({ companyUuid: a }), l = (E.contractors ?? []).filter(
+    (n) => R.includes(n.uuid)
+  ), { virtualContractorPayments: D, totals: s, editModal: T } = K({
+    contractors: l,
+    allowedPaymentMethods: S,
+    onEditOpen: () => {
+      e(p.CONTRACTOR_HISTORICAL_PAYMENT_EDIT);
+    },
+    onEditSave: (n) => {
+      e(p.CONTRACTOR_HISTORICAL_PAYMENT_UPDATE, n);
+    }
+  }), g = s.total > 0, { mutateAsync: A, isPending: b } = q(), { mutateAsync: B, isPending: L } = W(), [w, k] = y(null), [_, N] = y(!1), H = () => D.filter((n) => n.isTouched).map(({ isTouched: n, ...v }) => v), Y = async () => {
+    g && await C(null, async () => {
+      const n = await A({
+        request: {
+          companyId: a,
+          requestBody: {
+            checkDate: new O(h),
+            contractorPayments: H()
+          }
+        }
+      });
+      k(n.contractorPaymentGroupPreview || null), e(
+        p.CONTRACTOR_HISTORICAL_PAYMENT_PREVIEW,
+        n.contractorPaymentGroupPreview
+      );
+    });
+  }, G = () => {
+    k(null), e(p.CONTRACTOR_HISTORICAL_PAYMENT_BACK_TO_EDIT);
+  }, F = async () => {
+    const n = w?.creationToken;
+    !n || _ || await C(null, async () => {
+      const v = await B({
+        request: {
+          companyId: a,
+          requestBody: {
+            checkDate: new O(h),
+            creationToken: n,
+            contractorPayments: H()
+          }
+        }
+      });
+      v.contractorPaymentGroup && (N(!0), e(
+        p.CONTRACTOR_HISTORICAL_PAYMENT_CREATED,
+        v.contractorPaymentGroup
+      ));
+    });
+  };
+  return w ? /* @__PURE__ */ i(c, { flexDirection: "column", gap: 32, children: [
+    /* @__PURE__ */ i(c, { justifyContent: "space-between", alignItems: "flex-start", gap: 16, children: [
+      /* @__PURE__ */ i(c, { flexDirection: "column", gap: 4, children: [
+        /* @__PURE__ */ t(f, { as: "h2", children: r("review.title") }),
+        /* @__PURE__ */ t(u, { variant: "supporting", children: r("review.subtitle", {
+          checkDate: o(w.checkDate ?? "")
+        }) })
+      ] }),
+      !_ && /* @__PURE__ */ i(c, { justifyContent: "flex-end", gap: 16, children: [
+        /* @__PURE__ */ t(m, { onClick: G, variant: "secondary", children: r("review.editButton") }),
+        /* @__PURE__ */ t(m, { onClick: F, variant: "primary", isLoading: L, children: r("review.submitButton") })
+      ] })
+    ] }),
+    _ && /* @__PURE__ */ t(d, { status: "success", label: r("review.successTitle"), children: /* @__PURE__ */ t(u, { children: r("review.successMessage") }) }),
+    /* @__PURE__ */ t(
+      at,
+      {
+        contractorPaymentGroup: w,
+        contractors: l,
+        showDebitColumns: !1,
+        dictionary: P
+      }
+    )
+  ] }) : /* @__PURE__ */ i(c, { flexDirection: "column", gap: 32, children: [
+    /* @__PURE__ */ i(c, { justifyContent: "flex-end", gap: 16, children: [
+      /* @__PURE__ */ i(c, { flexDirection: "column", gap: 4, children: [
+        /* @__PURE__ */ t(f, { as: "h2", children: r("amounts.heading") }),
+        /* @__PURE__ */ t(u, { variant: "supporting", children: r("amounts.subtitle") })
+      ] }),
+      /* @__PURE__ */ t(X, { children: /* @__PURE__ */ t(
+        m,
+        {
+          onClick: Y,
+          variant: "primary",
+          isDisabled: !g,
+          isLoading: b,
+          children: r("amounts.continueButton")
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ t(
+      it,
+      {
+        contractors: l,
+        contractorPayments: D,
+        totals: s,
+        allowedPaymentMethods: S,
+        editModal: T,
+        dictionary: I
+      }
+    )
+  ] });
+}
+export {
+  Ot as CreateHistoricalPayment
+};
+//# sourceMappingURL=CreateHistoricalPayment.js.map

package/dist/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CreateHistoricalPayment.js","sources":["../../../../../src/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.tsx"],"sourcesContent":["import { useContractorsListSuspense } from '@gusto/embedded-api/react-query/contractorsList'\nimport { useContractorPaymentGroupsPreviewMutation } from '@gusto/embedded-api/react-query/contractorPaymentGroupsPreview'\nimport { useContractorPaymentGroupsCreateMutation } from '@gusto/embedded-api/react-query/contractorPaymentGroupsCreate'\nimport type { ContractorPaymentGroupPreview } from '@gusto/embedded-api/models/components/contractorpaymentgrouppreview'\nimport type { PostV1CompaniesCompanyIdContractorPaymentGroupsPaymentMethod as ContractorPaymentMethod } from '@gusto/embedded-api/models/operations/postv1companiescompanyidcontractorpaymentgroups'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useMemo, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { usePaymentAmountsEditor } from '../shared/usePaymentAmountsEditor'\nimport { SetPaymentAmounts } from '../shared/SetPaymentAmounts'\nimport { PaymentSummaryBlock } from '../shared/PaymentSummaryBlock'\nimport { getHistoricalPaymentCheckDateBounds } from '../shared/historicalPaymentDateBounds'\nimport {\n  useCreateHistoricalPaymentDictionary,\n  useCreateHistoricalPaymentReviewDictionary,\n} from './useFormDictionary'\nimport { formatDateToStringDate } from '@/helpers/dateFormatting'\nimport { ActionsLayout, Flex, FlexItem } from '@/components/Common'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { componentEvents } from '@/shared/constants'\nimport { SelectContractors } from '@/components/Contractor/shared/SelectContractors/SelectContractors'\n\nconst ALLOWED_PAYMENT_METHODS: ContractorPaymentMethod[] = ['Historical Payment']\n\n/**\n * Props for {@link CreateHistoricalPayment}.\n *\n * @alpha\n */\nexport interface CreateHistoricalPaymentProps extends BaseComponentInterface<'Contractor.Payments.CreateHistoricalPayment'> {\n  /** UUID of the company recording the historical payment. */\n  companyId: string\n}\n\n/**\n * Records a historical contractor payment — one that already happened outside Gusto and does not\n * move money — by picking a paid date and the contractors being paid, entering hours, wages,\n * bonuses, and reimbursements for them, then reviewing and submitting.\n *\n * @remarks\n * Every contractor payment is fixed to the `Historical Payment` payment method, so there is no\n * payment method choice or debit information to review.\n * Continue on the contractor-selection step is disabled until the paid date is valid and at least\n * one contractor is selected. Continue on the amounts step is disabled until at least one selected\n * contractor has a payment total greater than zero, and swaps the amounts grid for an in-place\n * review (mirroring `CreatePayment`'s preview step); Edit returns to the grid without losing\n * entered amounts, and Submit creates the contractor payment group. Once creation succeeds, the\n * Edit and Submit buttons are replaced with a success message, since the creation token has been\n * consumed and the host is expected to navigate away (e.g. to `HistoricalPaymentSummary`).\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `contractor/historicalPayments/edit` | The edit modal was opened for a contractor. | — |\n * | `contractor/historicalPayments/update` | A contractor's payment values were updated locally. | The updated form values (hours, wage, bonus, reimbursement, payment method, etc.). |\n * | `contractor/historicalPayments/preview` | The preview API call succeeded. | The contractor payment group preview response. |\n * | `contractor/historicalPayments/backToEdit` | The user returned from preview to continue editing. | — |\n * | `contractor/historicalPayments/created` | The payment group was successfully created. | The created contractor payment group response. |\n *\n * @param props - See {@link CreateHistoricalPaymentProps}.\n * @returns The rendered contractor-selection screen, the payment-amounts entry screen, or its\n * in-place review.\n * @alpha\n */\nexport function CreateHistoricalPayment(props: CreateHistoricalPaymentProps) {\n  return (\n    <BaseComponent {...props} componentName=\"Contractor.Payments.CreateHistoricalPayment\">\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\ninterface ContractorSelection {\n  contractorIds: string[]\n  checkDate: string\n}\n\nfunction Root({ companyId, dictionary, onEvent }: CreateHistoricalPaymentProps) {\n  useI18n('Contractor.Payments.CreateHistoricalPayment')\n  useComponentDictionary('Contractor.Payments.CreateHistoricalPayment', dictionary)\n  const { t } = useTranslation('Contractor.Payments.CreateHistoricalPayment')\n  const { Heading, Text, Button, DatePicker } = useComponentContext()\n\n  const { minDate, maxDate } = useMemo(() => getHistoricalPaymentCheckDateBounds(), [])\n  const [checkDate, setCheckDate] = useState<Date | null>(null)\n  const [selectedIds, setSelectedIds] = useState<string[]>([])\n  const [selection, setSelection] = useState<ContractorSelection | null>(null)\n\n  let dateError: string | null = null\n  if (checkDate !== null && checkDate > maxDate) {\n    dateError = t('select.dateInFutureError')\n  } else if (checkDate !== null && checkDate < minDate) {\n    dateError = t('select.dateTooEarlyError', {\n      year: checkDate.getFullYear(),\n      allowedYear: minDate.getFullYear(),\n    })\n  }\n\n  const canContinue = selectedIds.length > 0 && checkDate !== null && dateError === null\n\n  const handleContinue = () => {\n    if (!canContinue) return\n    const checkDateString = formatDateToStringDate(checkDate)\n    if (!checkDateString) return\n    setSelection({ contractorIds: selectedIds, checkDate: checkDateString })\n  }\n\n  if (!selection) {\n    return (\n      <Flex flexDirection=\"column\" gap={32}>\n        <Flex flexDirection=\"column\" gap={4}>\n          <Heading as=\"h2\">{t('select.heading')}</Heading>\n          <Text variant=\"supporting\">{t('select.subtitle')}</Text>\n        </Flex>\n\n        <DatePicker\n          label={t('select.dateLabel')}\n          isRequired\n          value={checkDate}\n          onChange={setCheckDate}\n          minDate={minDate}\n          maxDate={maxDate}\n          isInvalid={dateError !== null}\n          errorMessage={dateError ?? undefined}\n        />\n\n        <SelectContractors companyId={companyId} onSelectionChange={setSelectedIds} />\n\n        <ActionsLayout>\n          <Button onClick={handleContinue} variant=\"primary\" isDisabled={!canContinue}>\n            {t('select.continueButton')}\n          </Button>\n        </ActionsLayout>\n      </Flex>\n    )\n  }\n\n  return (\n    <AmountsAndReview\n      companyId={companyId}\n      contractorIds={selection.contractorIds}\n      checkDate={selection.checkDate}\n      onEvent={onEvent}\n    />\n  )\n}\n\ninterface AmountsAndReviewProps {\n  companyId: string\n  contractorIds: string[]\n  checkDate: string\n  onEvent: CreateHistoricalPaymentProps['onEvent']\n}\n\nfunction AmountsAndReview({ companyId, contractorIds, checkDate, onEvent }: AmountsAndReviewProps) {\n  const { t } = useTranslation('Contractor.Payments.CreateHistoricalPayment')\n  const { Heading, Text, Button, Alert } = useComponentContext()\n  const { baseSubmitHandler } = useBase()\n  const { formatLongWithYear } = useDateFormatter()\n  const paymentAmountsDictionary = useCreateHistoricalPaymentDictionary()\n  const reviewDictionary = useCreateHistoricalPaymentReviewDictionary()\n\n  const { data: contractorList } = useContractorsListSuspense({ companyUuid: companyId })\n  const contractors = (contractorList.contractors ?? []).filter(contractor =>\n    contractorIds.includes(contractor.uuid),\n  )\n\n  const { virtualContractorPayments, totals, editModal } = usePaymentAmountsEditor({\n    contractors,\n    allowedPaymentMethods: ALLOWED_PAYMENT_METHODS,\n    onEditOpen: () => {\n      onEvent(componentEvents.CONTRACTOR_HISTORICAL_PAYMENT_EDIT)\n    },\n    onEditSave: data => {\n      onEvent(componentEvents.CONTRACTOR_HISTORICAL_PAYMENT_UPDATE, data)\n    },\n  })\n\n  const canContinue = totals.total > 0\n\n  const { mutateAsync: previewContractorPaymentGroup, isPending: isPreviewing } =\n    useContractorPaymentGroupsPreviewMutation()\n  const { mutateAsync: createContractorPaymentGroup, isPending: isCreating } =\n    useContractorPaymentGroupsCreateMutation()\n\n  const [previewData, setPreviewData] = useState<ContractorPaymentGroupPreview | null>(null)\n  const [isCreated, setIsCreated] = useState(false)\n\n  const touchedContractorPayments = () =>\n    virtualContractorPayments\n      .filter(payment => payment.isTouched)\n      .map(({ isTouched: _isTouched, ...rest }) => rest)\n\n  const handleContinue = async () => {\n    if (!canContinue) return\n\n    await baseSubmitHandler(null, async () => {\n      const response = await previewContractorPaymentGroup({\n        request: {\n          companyId,\n          requestBody: {\n            checkDate: new RFCDate(checkDate),\n            contractorPayments: touchedContractorPayments(),\n          },\n        },\n      })\n      setPreviewData(response.contractorPaymentGroupPreview || null)\n      onEvent(\n        componentEvents.CONTRACTOR_HISTORICAL_PAYMENT_PREVIEW,\n        response.contractorPaymentGroupPreview,\n      )\n    })\n  }\n\n  const handleBackToEdit = () => {\n    setPreviewData(null)\n    onEvent(componentEvents.CONTRACTOR_HISTORICAL_PAYMENT_BACK_TO_EDIT)\n  }\n\n  const handleSubmit = async () => {\n    const creationToken = previewData?.creationToken\n    if (!creationToken || isCreated) return\n\n    await baseSubmitHandler(null, async () => {\n      const response = await createContractorPaymentGroup({\n        request: {\n          companyId,\n          requestBody: {\n            checkDate: new RFCDate(checkDate),\n            creationToken,\n            contractorPayments: touchedContractorPayments(),\n          },\n        },\n      })\n\n      if (!response.contractorPaymentGroup) return\n\n      setIsCreated(true)\n      onEvent(\n        componentEvents.CONTRACTOR_HISTORICAL_PAYMENT_CREATED,\n        response.contractorPaymentGroup,\n      )\n    })\n  }\n\n  if (previewData) {\n    return (\n      <Flex flexDirection=\"column\" gap={32}>\n        <Flex justifyContent=\"space-between\" alignItems=\"flex-start\" gap={16}>\n          <Flex flexDirection=\"column\" gap={4}>\n            <Heading as=\"h2\">{t('review.title')}</Heading>\n            <Text variant=\"supporting\">\n              {t('review.subtitle', {\n                checkDate: formatLongWithYear(previewData.checkDate ?? ''),\n              })}\n            </Text>\n          </Flex>\n          {!isCreated && (\n            <Flex justifyContent=\"flex-end\" gap={16}>\n              <Button onClick={handleBackToEdit} variant=\"secondary\">\n                {t('review.editButton')}\n              </Button>\n              <Button onClick={handleSubmit} variant=\"primary\" isLoading={isCreating}>\n                {t('review.submitButton')}\n              </Button>\n            </Flex>\n          )}\n        </Flex>\n\n        {isCreated && (\n          <Alert status=\"success\" label={t('review.successTitle')}>\n            <Text>{t('review.successMessage')}</Text>\n          </Alert>\n        )}\n\n        <PaymentSummaryBlock\n          contractorPaymentGroup={previewData}\n          contractors={contractors}\n          showDebitColumns={false}\n          dictionary={reviewDictionary}\n        />\n      </Flex>\n    )\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex justifyContent=\"flex-end\" gap={16}>\n        <Flex flexDirection=\"column\" gap={4}>\n          <Heading as=\"h2\">{t('amounts.heading')}</Heading>\n          <Text variant=\"supporting\">{t('amounts.subtitle')}</Text>\n        </Flex>\n        <FlexItem>\n          <Button\n            onClick={handleContinue}\n            variant=\"primary\"\n            isDisabled={!canContinue}\n            isLoading={isPreviewing}\n          >\n            {t('amounts.continueButton')}\n          </Button>\n        </FlexItem>\n      </Flex>\n\n      <SetPaymentAmounts\n        contractors={contractors}\n        contractorPayments={virtualContractorPayments}\n        totals={totals}\n        allowedPaymentMethods={ALLOWED_PAYMENT_METHODS}\n        editModal={editModal}\n        dictionary={paymentAmountsDictionary}\n      />\n    </Flex>\n  )\n}\n"],"names":["ALLOWED_PAYMENT_METHODS","CreateHistoricalPayment","props","jsx","BaseComponent","Root","companyId","dictionary","onEvent","useI18n","useComponentDictionary","t","useTranslation","Heading","Text","Button","DatePicker","useComponentContext","minDate","maxDate","useMemo","getHistoricalPaymentCheckDateBounds","checkDate","setCheckDate","useState","selectedIds","setSelectedIds","selection","setSelection","dateError","canContinue","handleContinue","checkDateString","formatDateToStringDate","AmountsAndReview","jsxs","Flex","SelectContractors","ActionsLayout","contractorIds","Alert","baseSubmitHandler","useBase","formatLongWithYear","useDateFormatter","paymentAmountsDictionary","useCreateHistoricalPaymentDictionary","reviewDictionary","useCreateHistoricalPaymentReviewDictionary","contractorList","useContractorsListSuspense","contractors","contractor","virtualContractorPayments","totals","editModal","usePaymentAmountsEditor","componentEvents","data","previewContractorPaymentGroup","isPreviewing","useContractorPaymentGroupsPreviewMutation","createContractorPaymentGroup","isCreating","useContractorPaymentGroupsCreateMutation","previewData","setPreviewData","isCreated","setIsCreated","touchedContractorPayments","payment","_isTouched","rest","response","RFCDate","handleBackToEdit","handleSubmit","creationToken","PaymentSummaryBlock","FlexItem","SetPaymentAmounts"],"mappings":"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"}

package/dist/components/Contractor/Payments/CreateHistoricalPayment/index.d.ts

@@ -0,0 +1 @@
+export { CreateHistoricalPayment, type CreateHistoricalPaymentProps, } from './CreateHistoricalPayment';

package/dist/components/Contractor/Payments/CreateHistoricalPayment/useFormDictionary.d.ts

@@ -0,0 +1,18 @@
+import { SetPaymentAmountsDictionary } from '../shared/SetPaymentAmounts';
+import { PaymentSummaryBlockDictionary } from '../shared/PaymentSummaryBlock';
+/**
+ * Resolves `SetPaymentAmounts`'s text against `CreateHistoricalPayment`'s own
+ * `Contractor.Payments.CreateHistoricalPayment` namespace, so partner
+ * overrides on that namespace flow into the shared grid and edit modal.
+ *
+ * @internal
+ */
+export declare function useCreateHistoricalPaymentDictionary(): SetPaymentAmountsDictionary;
+/**
+ * Resolves `PaymentSummaryBlock`'s text against `CreateHistoricalPayment`'s own
+ * `Contractor.Payments.CreateHistoricalPayment` namespace (under the `review` key), so partner
+ * overrides on that namespace flow into the in-place review step.
+ *
+ * @internal
+ */
+export declare function useCreateHistoricalPaymentReviewDictionary(): PaymentSummaryBlockDictionary;

package/dist/components/Contractor/Payments/{HistoricalPaymentAmounts → CreateHistoricalPayment}/useFormDictionary.js

@@ -1,8 +1,8 @@
-import { useMemo as r } from "react";
-import { useTranslation as o } from "react-i18next";
-function s() {
-  const { t } = o("Contractor.Payments.HistoricalPaymentAmounts");
-  return r(
+import { useMemo as e } from "react";
+import { useTranslation as a } from "react-i18next";
+function i() {
+  const { t } = a("Contractor.Payments.CreateHistoricalPayment");
+  return e(
     () => ({
       hoursAndPaymentsLabel: t("hoursAndPaymentsLabel"),
       contractorTableHeaders: {
@@ -26,7 +26,7 @@ function s() {
         subtitle: t("editContractorPayment.subtitle"),
         hoursLabel: t("editContractorPayment.hoursLabel"),
         hoursAdornment: t("editContractorPayment.hoursAdornment"),
-        hoursPayDescription: (e, a) => t("editContractorPayment.hoursPayDescription", { rate: e, total: a }),
+        hoursPayDescription: (o, r) => t("editContractorPayment.hoursPayDescription", { rate: o, total: r }),
         wageLabel: t("editContractorPayment.wageLabel"),
         bonusLabel: t("editContractorPayment.bonusLabel"),
         reimbursementLabel: t("editContractorPayment.reimbursementLabel"),
@@ -47,7 +47,37 @@ function s() {
     [t]
   );
 }
+function s() {
+  const { t } = a("Contractor.Payments.CreateHistoricalPayment", {
+    keyPrefix: "review"
+  });
+  return e(
+    () => ({
+      paymentSummaryTitle: t("paymentSummaryTitle"),
+      totalAmount: t("totalAmount"),
+      contractorPayDate: t("contractorPayDate"),
+      contractorPaymentsTitle: t("contractorPaymentsTitle"),
+      contractor: t("contractor"),
+      wageType: t("wageType"),
+      paymentMethod: t("paymentMethod"),
+      paymentMethods: {
+        directDeposit: t("paymentMethods.directDeposit"),
+        check: t("paymentMethods.check"),
+        historicalPayment: t("paymentMethods.historicalPayment")
+      },
+      hours: t("hours"),
+      wage: t("wage"),
+      bonus: t("bonus"),
+      reimbursement: t("reimbursement"),
+      total: t("total"),
+      totalsLabel: t("totalsLabel"),
+      notAvailable: t("notAvailable")
+    }),
+    [t]
+  );
+}
 export {
-  s as useHistoricalPaymentAmountsDictionary
+  i as useCreateHistoricalPaymentDictionary,
+  s as useCreateHistoricalPaymentReviewDictionary
 };
 //# sourceMappingURL=useFormDictionary.js.map

package/dist/components/Contractor/Payments/CreateHistoricalPayment/useFormDictionary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormDictionary.js","sources":["../../../../../src/components/Contractor/Payments/CreateHistoricalPayment/useFormDictionary.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { SetPaymentAmountsDictionary } from '../shared/SetPaymentAmounts'\nimport type { PaymentSummaryBlockDictionary } from '../shared/PaymentSummaryBlock'\n\n/**\n * Resolves `SetPaymentAmounts`'s text against `CreateHistoricalPayment`'s own\n * `Contractor.Payments.CreateHistoricalPayment` namespace, so partner\n * overrides on that namespace flow into the shared grid and edit modal.\n *\n * @internal\n */\nexport function useCreateHistoricalPaymentDictionary(): SetPaymentAmountsDictionary {\n  const { t } = useTranslation('Contractor.Payments.CreateHistoricalPayment')\n\n  return useMemo<SetPaymentAmountsDictionary>(\n    () => ({\n      hoursAndPaymentsLabel: t('hoursAndPaymentsLabel'),\n      contractorTableHeaders: {\n        contractor: t('contractorTableHeaders.contractor'),\n        wageType: t('contractorTableHeaders.wageType'),\n        paymentMethod: t('contractorTableHeaders.paymentMethod'),\n        hours: t('contractorTableHeaders.hours'),\n        wage: t('contractorTableHeaders.wage'),\n        bonus: t('contractorTableHeaders.bonus'),\n        reimbursement: t('contractorTableHeaders.reimbursement'),\n        total: t('contractorTableHeaders.total'),\n      },\n      emptyTableTitle: t('emptyTableTitle'),\n      emptyTableDescription: t('emptyTableDescription'),\n      na: t('na'),\n      totalsLabel: t('totalsLabel'),\n      editContractor: t('editContractor'),\n      perHour: t('perHour'),\n      editContractorPayment: {\n        title: t('editContractorPayment.title'),\n        subtitle: t('editContractorPayment.subtitle'),\n        hoursLabel: t('editContractorPayment.hoursLabel'),\n        hoursAdornment: t('editContractorPayment.hoursAdornment'),\n        hoursPayDescription: (rate, total) =>\n          t('editContractorPayment.hoursPayDescription', { rate, total }),\n        wageLabel: t('editContractorPayment.wageLabel'),\n        bonusLabel: t('editContractorPayment.bonusLabel'),\n        reimbursementLabel: t('editContractorPayment.reimbursementLabel'),\n        paymentMethodLabel: t('editContractorPayment.paymentMethodLabel'),\n        cancelCta: t('editContractorPayment.cancelCta'),\n        saveCta: t('editContractorPayment.saveCta'),\n        paymentMethods: {\n          check: t('editContractorPayment.paymentMethods.check'),\n          directDeposit: t('editContractorPayment.paymentMethods.directDeposit'),\n          historicalPayment: t('editContractorPayment.paymentMethods.historicalPayment'),\n        },\n        errors: {\n          directDepositNotAvailable: t('editContractorPayment.errors.directDepositNotAvailable'),\n          unsupportedPaymentMethod: t('editContractorPayment.errors.unsupportedPaymentMethod'),\n        },\n      },\n    }),\n    [t],\n  )\n}\n\n/**\n * Resolves `PaymentSummaryBlock`'s text against `CreateHistoricalPayment`'s own\n * `Contractor.Payments.CreateHistoricalPayment` namespace (under the `review` key), so partner\n * overrides on that namespace flow into the in-place review step.\n *\n * @internal\n */\nexport function useCreateHistoricalPaymentReviewDictionary(): PaymentSummaryBlockDictionary {\n  const { t } = useTranslation('Contractor.Payments.CreateHistoricalPayment', {\n    keyPrefix: 'review',\n  })\n\n  return useMemo<PaymentSummaryBlockDictionary>(\n    () => ({\n      paymentSummaryTitle: t('paymentSummaryTitle'),\n      totalAmount: t('totalAmount'),\n      contractorPayDate: t('contractorPayDate'),\n      contractorPaymentsTitle: t('contractorPaymentsTitle'),\n      contractor: t('contractor'),\n      wageType: t('wageType'),\n      paymentMethod: t('paymentMethod'),\n      paymentMethods: {\n        directDeposit: t('paymentMethods.directDeposit'),\n        check: t('paymentMethods.check'),\n        historicalPayment: t('paymentMethods.historicalPayment'),\n      },\n      hours: t('hours'),\n      wage: t('wage'),\n      bonus: t('bonus'),\n      reimbursement: t('reimbursement'),\n      total: t('total'),\n      totalsLabel: t('totalsLabel'),\n      notAvailable: t('notAvailable'),\n    }),\n    [t],\n  )\n}\n"],"names":["useCreateHistoricalPaymentDictionary","useTranslation","useMemo","rate","total","useCreateHistoricalPaymentReviewDictionary"],"mappings":";;AAYO,SAASA,IAAoE;AAClF,QAAM,EAAE,EAAA,IAAMC,EAAe,6CAA6C;AAE1E,SAAOC;AAAA,IACL,OAAO;AAAA,MACL,uBAAuB,EAAE,uBAAuB;AAAA,MAChD,wBAAwB;AAAA,QACtB,YAAY,EAAE,mCAAmC;AAAA,QACjD,UAAU,EAAE,iCAAiC;AAAA,QAC7C,eAAe,EAAE,sCAAsC;AAAA,QACvD,OAAO,EAAE,8BAA8B;AAAA,QACvC,MAAM,EAAE,6BAA6B;AAAA,QACrC,OAAO,EAAE,8BAA8B;AAAA,QACvC,eAAe,EAAE,sCAAsC;AAAA,QACvD,OAAO,EAAE,8BAA8B;AAAA,MAAA;AAAA,MAEzC,iBAAiB,EAAE,iBAAiB;AAAA,MACpC,uBAAuB,EAAE,uBAAuB;AAAA,MAChD,IAAI,EAAE,IAAI;AAAA,MACV,aAAa,EAAE,aAAa;AAAA,MAC5B,gBAAgB,EAAE,gBAAgB;AAAA,MAClC,SAAS,EAAE,SAAS;AAAA,MACpB,uBAAuB;AAAA,QACrB,OAAO,EAAE,6BAA6B;AAAA,QACtC,UAAU,EAAE,gCAAgC;AAAA,QAC5C,YAAY,EAAE,kCAAkC;AAAA,QAChD,gBAAgB,EAAE,sCAAsC;AAAA,QACxD,qBAAqB,CAACC,GAAMC,MAC1B,EAAE,6CAA6C,EAAE,MAAAD,GAAM,OAAAC,GAAO;AAAA,QAChE,WAAW,EAAE,iCAAiC;AAAA,QAC9C,YAAY,EAAE,kCAAkC;AAAA,QAChD,oBAAoB,EAAE,0CAA0C;AAAA,QAChE,oBAAoB,EAAE,0CAA0C;AAAA,QAChE,WAAW,EAAE,iCAAiC;AAAA,QAC9C,SAAS,EAAE,+BAA+B;AAAA,QAC1C,gBAAgB;AAAA,UACd,OAAO,EAAE,4CAA4C;AAAA,UACrD,eAAe,EAAE,oDAAoD;AAAA,UACrE,mBAAmB,EAAE,wDAAwD;AAAA,QAAA;AAAA,QAE/E,QAAQ;AAAA,UACN,2BAA2B,EAAE,wDAAwD;AAAA,UACrF,0BAA0B,EAAE,uDAAuD;AAAA,QAAA;AAAA,MACrF;AAAA,IACF;AAAA,IAEF,CAAC,CAAC;AAAA,EAAA;AAEN;AASO,SAASC,IAA4E;AAC1F,QAAM,EAAE,EAAA,IAAMJ,EAAe,+CAA+C;AAAA,IAC1E,WAAW;AAAA,EAAA,CACZ;AAED,SAAOC;AAAA,IACL,OAAO;AAAA,MACL,qBAAqB,EAAE,qBAAqB;AAAA,MAC5C,aAAa,EAAE,aAAa;AAAA,MAC5B,mBAAmB,EAAE,mBAAmB;AAAA,MACxC,yBAAyB,EAAE,yBAAyB;AAAA,MACpD,YAAY,EAAE,YAAY;AAAA,MAC1B,UAAU,EAAE,UAAU;AAAA,MACtB,eAAe,EAAE,eAAe;AAAA,MAChC,gBAAgB;AAAA,QACd,eAAe,EAAE,8BAA8B;AAAA,QAC/C,OAAO,EAAE,sBAAsB;AAAA,QAC/B,mBAAmB,EAAE,kCAAkC;AAAA,MAAA;AAAA,MAEzD,OAAO,EAAE,OAAO;AAAA,MAChB,MAAM,EAAE,MAAM;AAAA,MACd,OAAO,EAAE,OAAO;AAAA,MAChB,eAAe,EAAE,eAAe;AAAA,MAChC,OAAO,EAAE,OAAO;AAAA,MAChB,aAAa,EAAE,aAAa;AAAA,MAC5B,cAAc,EAAE,cAAc;AAAA,IAAA;AAAA,IAEhC,CAAC,CAAC;AAAA,EAAA;AAEN;"}

package/dist/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.js

@@ -1,8 +1,8 @@
 import { jsx as r } from "react/jsx-runtime";
-import { createMachine as u } from "robot3";
-import { useState as b } from "react";
-import { createPaymentMachine as p, createPaymentBreadcrumbsNodes as d } from "./createPaymentMachine.js";
-import { CreatePaymentContextual as f } from "./CreatePaymentFlowComponents.js";
+import { useState as u } from "react";
+import { createPaymentMachine as b, createPaymentBreadcrumbsNodes as p } from "./createPaymentMachine.js";
+import { CreatePaymentContextual as d } from "./CreatePaymentFlowComponents.js";
+import { createMachine as f } from "../../../../lib/state-machine/core.js";
 import { Flow as y } from "../../../Flow/Flow.js";
 import { buildBreadcrumbs as P, updateBreadcrumbs as l } from "../../../../helpers/breadcrumbHelpers.js";
 const B = [];
@@ -14,8 +14,8 @@ function C({
   onEvent: a,
   prefixBreadcrumbs: m = B
 }) {
-  const [n] = b(() => {
-    const o = P(d), c = Object.fromEntries(
+  const [n] = u(() => {
+    const o = P(p), c = Object.fromEntries(
       Object.entries(o).map(([t, s]) => [
         t,
         [...m, ...s]
@@ -26,13 +26,13 @@ function C({
         breadcrumbs: c
       }
     });
-    return u(
+    return f(
       "createPayment",
-      p,
+      b,
       (t) => ({
         ...t,
         ...i,
-        component: f,
+        component: d,
         companyId: e
       })
     );

package/dist/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreatePaymentFlow.js","sources":["../../../../../src/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useState } from 'react'\nimport { createPaymentBreadcrumbsNodes, createPaymentMachine } from './createPaymentMachine'\nimport {\n  CreatePaymentContextual,\n  type CreatePaymentFlowContextInterface,\n  type CreatePaymentFlowProps,\n} from './CreatePaymentFlowComponents'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { FlowBreadcrumb } from '@/components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport { buildBreadcrumbs, updateBreadcrumbs } from '@/helpers/breadcrumbHelpers'\n\nconst EMPTY_BREADCRUMBS: FlowBreadcrumb[] = []\n\n/**\n * Props for the flow-internal {@link CreatePaymentInternalFlow}, which layers a parent flow's\n * prefix breadcrumbs on top of the public {@link CreatePaymentFlowProps}.\n *\n * @internal\n */\nexport interface CreatePaymentInternalFlowProps extends CreatePaymentFlowProps {\n  /**\n   * Breadcrumbs prepended to the flow's own breadcrumb trail. Set by a parent flow (e.g.\n   * `PaymentFlow`) so the breadcrumb history remains coherent across the handoff.\n   */\n  prefixBreadcrumbs?: FlowBreadcrumb[]\n}\n\n/**\n * Guided flow to create a contractor payment and review the resulting summary.\n *\n * @remarks\n * This is the inner flow that powers the create-payment spoke of `ContractorManagement.PaymentFlow`.\n * Render it directly when you have built your own payments landing page and want to hand the user\n * off to the standard create-payment experience without re-implementing it. The flow ships with\n * breadcrumb navigation and handles Fast ACH blockers and wire transfer requirements inline.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `contractor/payments/created` | Fired when a payment group is successfully created | The created `ContractorPaymentGroup` |\n * | `contractor/payments/exit` | Fired when the user completes the payment flow | `{ uuid?: string \\| null }` |\n * | `payroll/wire/form/done` | Fired when wire transfer details are submitted | `{ wireInRequest: WireInRequest, confirmationAlert: { title: string, content?: string } }` |\n * | `breadcrumb/navigate` | Fired when the user clicks a breadcrumb to navigate back | `{ key: string, onNavigate: (ctx) => ctx }` |\n *\n * @components\n * - {@link CreatePayment}\n * - {@link PaymentSummary}\n *\n * @param props - See {@link CreatePaymentFlowProps}.\n * @returns The composed create-payment flow.\n * @alpha\n *\n * @example\n * ```tsx title=\"App.tsx\"\n * import { ContractorManagement } from '@gusto/embedded-react-sdk'\n *\n * function MyApp() {\n *   return (\n *     <ContractorManagement.CreatePaymentFlow\n *       companyId=\"a007e1ab-3595-43c2-ab4b-af7a5af2e365\"\n *       onEvent={() => {}}\n *     />\n *   )\n * }\n * ```\n */\nexport function CreatePaymentFlow(props: CreatePaymentFlowProps) {\n  return <CreatePaymentInternalFlow {...props} />\n}\n\n/**\n * Flow-internal entry point for {@link CreatePaymentFlow} that additionally accepts\n * flow-injected `prefixBreadcrumbs`. Partners use {@link CreatePaymentFlow}; `PaymentFlow` renders\n * this directly to prepend its own breadcrumb trail.\n *\n * @internal\n */\nexport function CreatePaymentInternalFlow({\n  companyId,\n  onEvent,\n  prefixBreadcrumbs = EMPTY_BREADCRUMBS,\n}: CreatePaymentInternalFlowProps) {\n  // Built once via a lazy useState initializer, not useMemo: the machine's identity must survive\n  // re-renders no matter what, and useMemo is only a performance hint React may discard, not an\n  // identity guarantee. A useMemo keyed on `prefixBreadcrumbs` previously recreated this machine\n  // (and reset in-flight state) whenever the parent app re-rendered in response to a bubbled\n  // `onEvent` call, since an inline array literal upstream gets a new reference every render.\n  const [createPaymentFlow] = useState(() => {\n    const baseBreadcrumbs = buildBreadcrumbs(createPaymentBreadcrumbsNodes)\n    const breadcrumbs = Object.fromEntries(\n      Object.entries(baseBreadcrumbs).map(([stateKey, trail]) => [\n        stateKey,\n        [...prefixBreadcrumbs, ...trail],\n      ]),\n    )\n\n    const initialBreadcrumbContext = updateBreadcrumbs('createPayment', {\n      header: {\n        type: 'breadcrumbs' as const,\n        breadcrumbs,\n      },\n    })\n\n    return createMachine(\n      'createPayment',\n      createPaymentMachine,\n      (initialContext: CreatePaymentFlowContextInterface) => ({\n        ...initialContext,\n        ...initialBreadcrumbContext,\n        component: CreatePaymentContextual,\n        companyId,\n      }),\n    )\n  })\n\n  return <Flow machine={createPaymentFlow} onEvent={onEvent} />\n}\n"],"names":["EMPTY_BREADCRUMBS","CreatePaymentFlow","props","jsx","CreatePaymentInternalFlow","companyId","onEvent","prefixBreadcrumbs","createPaymentFlow","useState","baseBreadcrumbs","buildBreadcrumbs","createPaymentBreadcrumbsNodes","breadcrumbs","stateKey","trail","initialBreadcrumbContext","updateBreadcrumbs","createMachine","createPaymentMachine","initialContext","CreatePaymentContextual","Flow"],"mappings":";;;;;;;AAYA,MAAMA,IAAsC,CAAA;AAuDrC,SAASC,EAAkBC,GAA+B;AAC/D,SAAO,gBAAAC,EAACC,GAAA,EAA2B,GAAGF,EAAA,CAAO;AAC/C;AASO,SAASE,EAA0B;AAAA,EACxC,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAC,IAAoBP;AACtB,GAAmC;AAMjC,QAAM,CAACQ,CAAiB,IAAIC,EAAS,MAAM;AACzC,UAAMC,IAAkBC,EAAiBC,CAA6B,GAChEC,IAAc,OAAO;AAAA,MACzB,OAAO,QAAQH,CAAe,EAAE,IAAI,CAAC,CAACI,GAAUC,CAAK,MAAM;AAAA,QACzDD;AAAA,QACA,CAAC,GAAGP,GAAmB,GAAGQ,CAAK;AAAA,MAAA,CAChC;AAAA,IAAA,GAGGC,IAA2BC,EAAkB,iBAAiB;AAAA,MAClE,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,aAAAJ;AAAA,MAAA;AAAA,IACF,CACD;AAED,WAAOK;AAAA,MACL;AAAA,MACAC;AAAA,MACA,CAACC,OAAuD;AAAA,QACtD,GAAGA;AAAA,QACH,GAAGJ;AAAA,QACH,WAAWK;AAAA,QACX,WAAAhB;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SAAO,gBAAAF,EAACmB,GAAA,EAAK,SAASd,GAAmB,SAAAF,EAAA,CAAkB;AAC7D;"}
+{"version":3,"file":"CreatePaymentFlow.js","sources":["../../../../../src/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { createPaymentBreadcrumbsNodes, createPaymentMachine } from './createPaymentMachine'\nimport {\n  CreatePaymentContextual,\n  type CreatePaymentFlowContextInterface,\n  type CreatePaymentFlowProps,\n} from './CreatePaymentFlowComponents'\nimport { createMachine } from '@/lib/state-machine'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { FlowBreadcrumb } from '@/components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport { buildBreadcrumbs, updateBreadcrumbs } from '@/helpers/breadcrumbHelpers'\n\nconst EMPTY_BREADCRUMBS: FlowBreadcrumb[] = []\n\n/**\n * Props for the flow-internal {@link CreatePaymentInternalFlow}, which layers a parent flow's\n * prefix breadcrumbs on top of the public {@link CreatePaymentFlowProps}.\n *\n * @internal\n */\nexport interface CreatePaymentInternalFlowProps extends CreatePaymentFlowProps {\n  /**\n   * Breadcrumbs prepended to the flow's own breadcrumb trail. Set by a parent flow (e.g.\n   * `PaymentFlow`) so the breadcrumb history remains coherent across the handoff.\n   */\n  prefixBreadcrumbs?: FlowBreadcrumb[]\n}\n\n/**\n * Guided flow to create a contractor payment and review the resulting summary.\n *\n * @remarks\n * This is the inner flow that powers the create-payment spoke of `ContractorManagement.PaymentFlow`.\n * Render it directly when you have built your own payments landing page and want to hand the user\n * off to the standard create-payment experience without re-implementing it. The flow ships with\n * breadcrumb navigation and handles Fast ACH blockers and wire transfer requirements inline.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `contractor/payments/created` | Fired when a payment group is successfully created | The created `ContractorPaymentGroup` |\n * | `contractor/payments/exit` | Fired when the user completes the payment flow | `{ uuid?: string \\| null }` |\n * | `payroll/wire/form/done` | Fired when wire transfer details are submitted | `{ wireInRequest: WireInRequest, confirmationAlert: { title: string, content?: string } }` |\n * | `breadcrumb/navigate` | Fired when the user clicks a breadcrumb to navigate back | `{ key: string, onNavigate: (ctx) => ctx }` |\n *\n * @components\n * - {@link CreatePayment}\n * - {@link PaymentSummary}\n *\n * @param props - See {@link CreatePaymentFlowProps}.\n * @returns The composed create-payment flow.\n * @alpha\n *\n * @example\n * ```tsx title=\"App.tsx\"\n * import { ContractorManagement } from '@gusto/embedded-react-sdk'\n *\n * function MyApp() {\n *   return (\n *     <ContractorManagement.CreatePaymentFlow\n *       companyId=\"a007e1ab-3595-43c2-ab4b-af7a5af2e365\"\n *       onEvent={() => {}}\n *     />\n *   )\n * }\n * ```\n */\nexport function CreatePaymentFlow(props: CreatePaymentFlowProps) {\n  return <CreatePaymentInternalFlow {...props} />\n}\n\n/**\n * Flow-internal entry point for {@link CreatePaymentFlow} that additionally accepts\n * flow-injected `prefixBreadcrumbs`. Partners use {@link CreatePaymentFlow}; `PaymentFlow` renders\n * this directly to prepend its own breadcrumb trail.\n *\n * @internal\n */\nexport function CreatePaymentInternalFlow({\n  companyId,\n  onEvent,\n  prefixBreadcrumbs = EMPTY_BREADCRUMBS,\n}: CreatePaymentInternalFlowProps) {\n  // Built once via a lazy useState initializer, not useMemo: the machine's identity must survive\n  // re-renders no matter what, and useMemo is only a performance hint React may discard, not an\n  // identity guarantee. A useMemo keyed on `prefixBreadcrumbs` previously recreated this machine\n  // (and reset in-flight state) whenever the parent app re-rendered in response to a bubbled\n  // `onEvent` call, since an inline array literal upstream gets a new reference every render.\n  const [createPaymentFlow] = useState(() => {\n    const baseBreadcrumbs = buildBreadcrumbs(createPaymentBreadcrumbsNodes)\n    const breadcrumbs = Object.fromEntries(\n      Object.entries(baseBreadcrumbs).map(([stateKey, trail]) => [\n        stateKey,\n        [...prefixBreadcrumbs, ...trail],\n      ]),\n    )\n\n    const initialBreadcrumbContext = updateBreadcrumbs('createPayment', {\n      header: {\n        type: 'breadcrumbs' as const,\n        breadcrumbs,\n      },\n    })\n\n    return createMachine(\n      'createPayment',\n      createPaymentMachine,\n      (initialContext: CreatePaymentFlowContextInterface) => ({\n        ...initialContext,\n        ...initialBreadcrumbContext,\n        component: CreatePaymentContextual,\n        companyId,\n      }),\n    )\n  })\n\n  return <Flow machine={createPaymentFlow} onEvent={onEvent} />\n}\n"],"names":["EMPTY_BREADCRUMBS","CreatePaymentFlow","props","jsx","CreatePaymentInternalFlow","companyId","onEvent","prefixBreadcrumbs","createPaymentFlow","useState","baseBreadcrumbs","buildBreadcrumbs","createPaymentBreadcrumbsNodes","breadcrumbs","stateKey","trail","initialBreadcrumbContext","updateBreadcrumbs","createMachine","createPaymentMachine","initialContext","CreatePaymentContextual","Flow"],"mappings":";;;;;;;AAYA,MAAMA,IAAsC,CAAA;AAuDrC,SAASC,EAAkBC,GAA+B;AAC/D,SAAO,gBAAAC,EAACC,GAAA,EAA2B,GAAGF,EAAA,CAAO;AAC/C;AASO,SAASE,EAA0B;AAAA,EACxC,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAC,IAAoBP;AACtB,GAAmC;AAMjC,QAAM,CAACQ,CAAiB,IAAIC,EAAS,MAAM;AACzC,UAAMC,IAAkBC,EAAiBC,CAA6B,GAChEC,IAAc,OAAO;AAAA,MACzB,OAAO,QAAQH,CAAe,EAAE,IAAI,CAAC,CAACI,GAAUC,CAAK,MAAM;AAAA,QACzDD;AAAA,QACA,CAAC,GAAGP,GAAmB,GAAGQ,CAAK;AAAA,MAAA,CAChC;AAAA,IAAA,GAGGC,IAA2BC,EAAkB,iBAAiB;AAAA,MAClE,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,aAAAJ;AAAA,MAAA;AAAA,IACF,CACD;AAED,WAAOK;AAAA,MACL;AAAA,MACAC;AAAA,MACA,CAACC,OAAuD;AAAA,QACtD,GAAGA;AAAA,QACH,GAAGJ;AAAA,QACH,WAAWK;AAAA,QACX,WAAAhB;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SAAO,gBAAAF,EAACmB,GAAA,EAAK,SAASd,GAAmB,SAAAF,EAAA,CAAkB;AAC7D;"}

package/dist/components/Contractor/Payments/CreatePaymentFlow/createPaymentMachine.d.ts

@@ -3,6 +3,6 @@ import { BreadcrumbNodes } from '../../../Common/FlowBreadcrumbs/FlowBreadcrumbs
 export declare const createPaymentBreadcrumbsNodes: BreadcrumbNodes;
 /** @internal */
 export declare const createPaymentMachine: {
-    createPayment: import('robot3').MachineState<any>;
-    paymentSummary: import('robot3').MachineState<any>;
+    createPayment: import('../../../../lib/state-machine').StateDefinition;
+    paymentSummary: import('../../../../lib/state-machine').StateDefinition;
 };

package/dist/components/Contractor/Payments/CreatePaymentFlow/createPaymentMachine.js

@@ -1,8 +1,9 @@
-import { state as a, transition as m, reduce as r } from "robot3";
 import { PaymentSummaryContextual as o } from "./CreatePaymentFlowComponents.js";
-import { payrollWireEvents as y, componentEvents as c } from "../../../../shared/constants.js";
+import "react";
+import { state as a, transition as m, reduce as r } from "../../../../lib/state-machine/core.js";
+import { componentEvents as y, payrollWireEvents as c } from "../../../../shared/constants.js";
 import { updateBreadcrumbs as n } from "../../../../helpers/breadcrumbHelpers.js";
-const s = {
+const d = {
   createPayment: {
     parent: null,
     item: {
@@ -22,10 +23,10 @@ const s = {
       namespace: "Contractor.Payments.PaymentSummary"
     }
   }
-}, d = {
+}, P = {
   createPayment: a(
     m(
-      c.CONTRACTOR_PAYMENT_CREATED,
+      y.CONTRACTOR_PAYMENT_CREATED,
       "paymentSummary",
       r(
         (e, t) => ({
@@ -39,7 +40,7 @@ const s = {
   ),
   paymentSummary: a(
     m(
-      y.PAYROLL_WIRE_FORM_DONE,
+      c.PAYROLL_WIRE_FORM_DONE,
       "paymentSummary",
       r(
         (e, t) => ({
@@ -57,7 +58,7 @@ const s = {
   )
 };
 export {
-  s as createPaymentBreadcrumbsNodes,
-  d as createPaymentMachine
+  d as createPaymentBreadcrumbsNodes,
+  P as createPaymentMachine
 };
 //# sourceMappingURL=createPaymentMachine.js.map

package/dist/components/Contractor/Payments/CreatePaymentFlow/createPaymentMachine.js.map

@@ -1 +1 @@
-{"version":3,"file":"createPaymentMachine.js","sources":["../../../../../src/components/Contractor/Payments/CreatePaymentFlow/createPaymentMachine.ts"],"sourcesContent":["import { reduce, state, transition } from 'robot3'\nimport type { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup'\nimport type { WireInRequest } from '@gusto/embedded-api/models/components/wireinrequest'\nimport {\n  PaymentSummaryContextual,\n  type CreatePaymentFlowContextInterface,\n} from './CreatePaymentFlowComponents'\nimport { payrollWireEvents, componentEvents } from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\nimport { updateBreadcrumbs } from '@/helpers/breadcrumbHelpers'\nimport type { BreadcrumbNodes } from '@/components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\n\ntype EventPayloads = {\n  [componentEvents.CONTRACTOR_PAYMENT_CREATED]: ContractorPaymentGroup\n  [payrollWireEvents.PAYROLL_WIRE_FORM_DONE]: {\n    wireInRequest: WireInRequest\n    confirmationAlert: {\n      title: string\n      content?: string\n    }\n  }\n}\n\n/** @internal */\nexport const createPaymentBreadcrumbsNodes: BreadcrumbNodes = {\n  createPayment: {\n    parent: null,\n    item: {\n      id: 'createPayment',\n      label: 'breadcrumbLabel',\n      namespace: 'Contractor.Payments.CreatePayment',\n      onNavigate: ((ctx: CreatePaymentFlowContextInterface) => ({\n        ...updateBreadcrumbs('createPayment', ctx),\n      })) as (context: unknown) => unknown,\n    },\n  },\n  paymentSummary: {\n    parent: null,\n    item: {\n      id: 'paymentSummary',\n      label: 'breadcrumbLabel',\n      namespace: 'Contractor.Payments.PaymentSummary',\n    },\n  },\n}\n\n/** @internal */\nexport const createPaymentMachine = {\n  createPayment: state<MachineTransition>(\n    transition(\n      componentEvents.CONTRACTOR_PAYMENT_CREATED,\n      'paymentSummary',\n      reduce(\n        (\n          ctx: CreatePaymentFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_PAYMENT_CREATED>,\n        ): CreatePaymentFlowContextInterface => {\n          return {\n            ...updateBreadcrumbs('paymentSummary', ctx),\n            component: PaymentSummaryContextual,\n            createdPaymentGroupId: ev.payload.uuid,\n            alerts: undefined,\n          }\n        },\n      ),\n    ),\n  ),\n  paymentSummary: state<MachineTransition>(\n    transition(\n      payrollWireEvents.PAYROLL_WIRE_FORM_DONE,\n      'paymentSummary',\n      reduce(\n        (\n          ctx: CreatePaymentFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof payrollWireEvents.PAYROLL_WIRE_FORM_DONE>,\n        ): CreatePaymentFlowContextInterface => {\n          return {\n            ...ctx,\n            alerts: [\n              {\n                type: 'success',\n                title: 'wireDetailsSubmitted',\n                content: ev.payload.confirmationAlert.content,\n              },\n            ],\n          }\n        },\n      ),\n    ),\n  ),\n}\n"],"names":["createPaymentBreadcrumbsNodes","ctx","updateBreadcrumbs","createPaymentMachine","state","transition","componentEvents","reduce","ev","PaymentSummaryContextual","payrollWireEvents"],"mappings":";;;;AAwBO,MAAMA,IAAiD;AAAA,EAC5D,eAAe;AAAA,IACb,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,aAAa,CAACC,OAA4C;AAAA,QACxD,GAAGC,EAAkB,iBAAiBD,CAAG;AAAA,MAAA;AAAA,IAC3C;AAAA,EACF;AAAA,EAEF,gBAAgB;AAAA,IACd,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ,GAGaE,IAAuB;AAAA,EAClC,eAAeC;AAAA,IACbC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEN,GACAO,OAEO;AAAA,UACL,GAAGN,EAAkB,kBAAkBD,CAAG;AAAA,UAC1C,WAAWQ;AAAA,UACX,uBAAuBD,EAAG,QAAQ;AAAA,UAClC,QAAQ;AAAA,QAAA;AAAA,MAEZ;AAAA,IACF;AAAA,EACF;AAAA,EAEF,gBAAgBJ;AAAA,IACdC;AAAA,MACEK,EAAkB;AAAA,MAClB;AAAA,MACAH;AAAA,QACE,CACEN,GACAO,OAEO;AAAA,UACL,GAAGP;AAAA,UACH,QAAQ;AAAA,YACN;AAAA,cACE,MAAM;AAAA,cACN,OAAO;AAAA,cACP,SAASO,EAAG,QAAQ,kBAAkB;AAAA,YAAA;AAAA,UACxC;AAAA,QACF;AAAA,MAEJ;AAAA,IACF;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"createPaymentMachine.js","sources":["../../../../../src/components/Contractor/Payments/CreatePaymentFlow/createPaymentMachine.ts"],"sourcesContent":["import type { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup'\nimport type { WireInRequest } from '@gusto/embedded-api/models/components/wireinrequest'\nimport {\n  PaymentSummaryContextual,\n  type CreatePaymentFlowContextInterface,\n} from './CreatePaymentFlowComponents'\nimport { reduce, state, transition } from '@/lib/state-machine'\nimport { payrollWireEvents, componentEvents } from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\nimport { updateBreadcrumbs } from '@/helpers/breadcrumbHelpers'\nimport type { BreadcrumbNodes } from '@/components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\n\ntype EventPayloads = {\n  [componentEvents.CONTRACTOR_PAYMENT_CREATED]: ContractorPaymentGroup\n  [payrollWireEvents.PAYROLL_WIRE_FORM_DONE]: {\n    wireInRequest: WireInRequest\n    confirmationAlert: {\n      title: string\n      content?: string\n    }\n  }\n}\n\n/** @internal */\nexport const createPaymentBreadcrumbsNodes: BreadcrumbNodes = {\n  createPayment: {\n    parent: null,\n    item: {\n      id: 'createPayment',\n      label: 'breadcrumbLabel',\n      namespace: 'Contractor.Payments.CreatePayment',\n      onNavigate: ((ctx: CreatePaymentFlowContextInterface) => ({\n        ...updateBreadcrumbs('createPayment', ctx),\n      })) as (context: unknown) => unknown,\n    },\n  },\n  paymentSummary: {\n    parent: null,\n    item: {\n      id: 'paymentSummary',\n      label: 'breadcrumbLabel',\n      namespace: 'Contractor.Payments.PaymentSummary',\n    },\n  },\n}\n\n/** @internal */\nexport const createPaymentMachine = {\n  createPayment: state<MachineTransition>(\n    transition(\n      componentEvents.CONTRACTOR_PAYMENT_CREATED,\n      'paymentSummary',\n      reduce(\n        (\n          ctx: CreatePaymentFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.CONTRACTOR_PAYMENT_CREATED>,\n        ): CreatePaymentFlowContextInterface => {\n          return {\n            ...updateBreadcrumbs('paymentSummary', ctx),\n            component: PaymentSummaryContextual,\n            createdPaymentGroupId: ev.payload.uuid,\n            alerts: undefined,\n          }\n        },\n      ),\n    ),\n  ),\n  paymentSummary: state<MachineTransition>(\n    transition(\n      payrollWireEvents.PAYROLL_WIRE_FORM_DONE,\n      'paymentSummary',\n      reduce(\n        (\n          ctx: CreatePaymentFlowContextInterface,\n          ev: MachineEventType<EventPayloads, typeof payrollWireEvents.PAYROLL_WIRE_FORM_DONE>,\n        ): CreatePaymentFlowContextInterface => {\n          return {\n            ...ctx,\n            alerts: [\n              {\n                type: 'success',\n                title: 'wireDetailsSubmitted',\n                content: ev.payload.confirmationAlert.content,\n              },\n            ],\n          }\n        },\n      ),\n    ),\n  ),\n}\n"],"names":["createPaymentBreadcrumbsNodes","ctx","updateBreadcrumbs","createPaymentMachine","state","transition","componentEvents","reduce","ev","PaymentSummaryContextual","payrollWireEvents"],"mappings":";;;;;AAwBO,MAAMA,IAAiD;AAAA,EAC5D,eAAe;AAAA,IACb,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,aAAa,CAACC,OAA4C;AAAA,QACxD,GAAGC,EAAkB,iBAAiBD,CAAG;AAAA,MAAA;AAAA,IAC3C;AAAA,EACF;AAAA,EAEF,gBAAgB;AAAA,IACd,QAAQ;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ,GAGaE,IAAuB;AAAA,EAClC,eAAeC;AAAA,IACbC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAC;AAAA,QACE,CACEN,GACAO,OAEO;AAAA,UACL,GAAGN,EAAkB,kBAAkBD,CAAG;AAAA,UAC1C,WAAWQ;AAAA,UACX,uBAAuBD,EAAG,QAAQ;AAAA,UAClC,QAAQ;AAAA,QAAA;AAAA,MAEZ;AAAA,IACF;AAAA,EACF;AAAA,EAEF,gBAAgBJ;AAAA,IACdC;AAAA,MACEK,EAAkB;AAAA,MAClB;AAAA,MACAH;AAAA,QACE,CACEN,GACAO,OAEO;AAAA,UACL,GAAGP;AAAA,UACH,QAAQ;AAAA,YACN;AAAA,cACE,MAAM;AAAA,cACN,OAAO;AAAA,cACP,SAASO,EAAG,QAAQ,kBAAkB;AAAA,YAAA;AAAA,UACxC;AAAA,QACF;AAAA,MAEJ;AAAA,IACF;AAAA,EACF;AAEJ;"}

package/dist/components/Contractor/Payments/HistoricalPaymentSummary/HistoricalPaymentSummary.d.ts

@@ -0,0 +1,30 @@
+import { BaseComponentInterface } from '../../../Base';
+/**
+ * Props for {@link HistoricalPaymentSummary}.
+ *
+ * @alpha
+ */
+export interface HistoricalPaymentSummaryProps extends BaseComponentInterface<'Contractor.Payments.HistoricalPaymentSummary'> {
+    /** UUID of the historical contractor payment group to summarize. */
+    paymentGroupId: string;
+    /** UUID of the company that owns the payment group. */
+    companyId: string;
+}
+/**
+ * Displays the summary of a successfully recorded historical contractor payment.
+ *
+ * @remarks
+ * Fetches the created contractor payment group by ID and renders a per-contractor breakdown.
+ * Historical payments don't move money, so unlike `PaymentSummary` there is no debit account,
+ * debit date, or wire-transfer confirmation to show.
+ *
+ * @events
+ * | Event | Description | Data |
+ * | ----- | ----------- | ---- |
+ * | `contractor/historicalPayments/exit` | User is done reviewing the summary. | — |
+ *
+ * @param props - See {@link HistoricalPaymentSummaryProps}.
+ * @returns The rendered payment summary, or `null` when the payment group cannot be loaded.
+ * @alpha
+ */
+export declare function HistoricalPaymentSummary(props: HistoricalPaymentSummaryProps): import("react").JSX.Element;

package/dist/components/Contractor/Payments/HistoricalPaymentSummary/HistoricalPaymentSummary.js

@@ -0,0 +1,56 @@
+import { jsx as t, jsxs as e } from "react/jsx-runtime";
+import { useTranslation as S } from "react-i18next";
+import { useContractorPaymentGroupsGetSuspense as g } from "@gusto/embedded-api/react-query/contractorPaymentGroupsGet";
+import { useContractorsListSuspense as T } from "@gusto/embedded-api/react-query/contractorsList";
+import { useHistoricalPaymentSummaryDictionary as x } from "./useFormDictionary.js";
+import { Flex as a } from "../../../Common/Flex/Flex.js";
+import { BaseComponent as H } from "../../../Base/Base.js";
+import "../../../Base/useBase.js";
+import { useComponentContext as G } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as O, useComponentDictionary as b } from "../../../../i18n/I18n.js";
+import { useDateFormatter as A } from "../../../../hooks/useDateFormatter.js";
+import { ContractorOnboardingStatus as I, componentEvents as E } from "../../../../shared/constants.js";
+import { PaymentSummaryBlock as L } from "../shared/PaymentSummaryBlock/PaymentSummaryBlock.js";
+function q(r) {
+  return /* @__PURE__ */ t(H, { ...r, componentName: "Contractor.Payments.HistoricalPaymentSummary", children: /* @__PURE__ */ t(N, { ...r }) });
+}
+function N({ paymentGroupId: r, companyId: c, dictionary: s, onEvent: u }) {
+  O("Contractor.Payments.HistoricalPaymentSummary"), b("Contractor.Payments.HistoricalPaymentSummary", s);
+  const { t: o } = S("Contractor.Payments.HistoricalPaymentSummary"), { Heading: l, Text: m, Button: y, Alert: p } = G(), { formatLongWithYear: f } = A(), d = x(), { data: C } = g({
+    contractorPaymentGroupUuid: r
+  }), n = C.contractorPaymentGroup, { data: P } = T({ companyUuid: c }), h = (P.contractors || []).filter(
+    (i) => i.isActive && i.onboardingStatus === I.ONBOARDING_COMPLETED
+  );
+  if (!n)
+    return null;
+  const D = () => {
+    u(E.CONTRACTOR_HISTORICAL_PAYMENT_EXIT);
+  };
+  return /* @__PURE__ */ e(a, { flexDirection: "column", gap: 24, children: [
+    /* @__PURE__ */ t(p, { status: "success", label: o("successTitle"), children: /* @__PURE__ */ t(m, { children: o("successMessage", {
+      count: n.contractorPayments?.length ?? 0
+    }) }) }),
+    /* @__PURE__ */ e(a, { justifyContent: "space-between", alignItems: "flex-start", children: [
+      /* @__PURE__ */ e(a, { flexDirection: "column", gap: 2, children: [
+        /* @__PURE__ */ t(l, { as: "h2", children: o("summaryTitle") }),
+        /* @__PURE__ */ t(m, { variant: "supporting", children: o("summarySubtitle", {
+          checkDate: f(n.checkDate ?? "")
+        }) })
+      ] }),
+      /* @__PURE__ */ t(y, { onClick: D, variant: "primary", children: o("doneCta") })
+    ] }),
+    /* @__PURE__ */ t(
+      L,
+      {
+        contractorPaymentGroup: n,
+        contractors: h,
+        showDebitColumns: !1,
+        dictionary: d
+      }
+    )
+  ] });
+}
+export {
+  q as HistoricalPaymentSummary
+};
+//# sourceMappingURL=HistoricalPaymentSummary.js.map

package/dist/components/Contractor/Payments/HistoricalPaymentSummary/HistoricalPaymentSummary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HistoricalPaymentSummary.js","sources":["../../../../../src/components/Contractor/Payments/HistoricalPaymentSummary/HistoricalPaymentSummary.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useContractorPaymentGroupsGetSuspense } from '@gusto/embedded-api/react-query/contractorPaymentGroupsGet'\nimport { useContractorsListSuspense } from '@gusto/embedded-api/react-query/contractorsList'\nimport { PaymentSummaryBlock } from '../shared/PaymentSummaryBlock'\nimport { useHistoricalPaymentSummaryDictionary } from './useFormDictionary'\nimport { Flex } from '@/components/Common'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { componentEvents, ContractorOnboardingStatus } from '@/shared/constants'\n\n/**\n * Props for {@link HistoricalPaymentSummary}.\n *\n * @alpha\n */\nexport interface HistoricalPaymentSummaryProps extends BaseComponentInterface<'Contractor.Payments.HistoricalPaymentSummary'> {\n  /** UUID of the historical contractor payment group to summarize. */\n  paymentGroupId: string\n  /** UUID of the company that owns the payment group. */\n  companyId: string\n}\n\n/**\n * Displays the summary of a successfully recorded historical contractor payment.\n *\n * @remarks\n * Fetches the created contractor payment group by ID and renders a per-contractor breakdown.\n * Historical payments don't move money, so unlike `PaymentSummary` there is no debit account,\n * debit date, or wire-transfer confirmation to show.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `contractor/historicalPayments/exit` | User is done reviewing the summary. | — |\n *\n * @param props - See {@link HistoricalPaymentSummaryProps}.\n * @returns The rendered payment summary, or `null` when the payment group cannot be loaded.\n * @alpha\n */\nexport function HistoricalPaymentSummary(props: HistoricalPaymentSummaryProps) {\n  return (\n    <BaseComponent {...props} componentName=\"Contractor.Payments.HistoricalPaymentSummary\">\n      <Root {...props} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ paymentGroupId, companyId, dictionary, onEvent }: HistoricalPaymentSummaryProps) {\n  useI18n('Contractor.Payments.HistoricalPaymentSummary')\n  useComponentDictionary('Contractor.Payments.HistoricalPaymentSummary', dictionary)\n  const { t } = useTranslation('Contractor.Payments.HistoricalPaymentSummary')\n  const { Heading, Text, Button, Alert } = useComponentContext()\n  const { formatLongWithYear } = useDateFormatter()\n  const summaryDictionary = useHistoricalPaymentSummaryDictionary()\n\n  const { data: paymentGroupData } = useContractorPaymentGroupsGetSuspense({\n    contractorPaymentGroupUuid: paymentGroupId,\n  })\n  const contractorPaymentGroup = paymentGroupData.contractorPaymentGroup\n\n  const { data: contractorList } = useContractorsListSuspense({ companyUuid: companyId })\n  const contractors = (contractorList.contractors || []).filter(\n    contractor =>\n      contractor.isActive &&\n      contractor.onboardingStatus === ContractorOnboardingStatus.ONBOARDING_COMPLETED,\n  )\n\n  if (!contractorPaymentGroup) {\n    return null\n  }\n\n  const handleDone = () => {\n    onEvent(componentEvents.CONTRACTOR_HISTORICAL_PAYMENT_EXIT)\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <Alert status=\"success\" label={t('successTitle')}>\n        <Text>\n          {t('successMessage', {\n            count: contractorPaymentGroup.contractorPayments?.length ?? 0,\n          })}\n        </Text>\n      </Alert>\n\n      <Flex justifyContent=\"space-between\" alignItems=\"flex-start\">\n        <Flex flexDirection=\"column\" gap={2}>\n          <Heading as=\"h2\">{t('summaryTitle')}</Heading>\n          <Text variant=\"supporting\">\n            {t('summarySubtitle', {\n              checkDate: formatLongWithYear(contractorPaymentGroup.checkDate ?? ''),\n            })}\n          </Text>\n        </Flex>\n        <Button onClick={handleDone} variant=\"primary\">\n          {t('doneCta')}\n        </Button>\n      </Flex>\n\n      <PaymentSummaryBlock\n        contractorPaymentGroup={contractorPaymentGroup}\n        contractors={contractors}\n        showDebitColumns={false}\n        dictionary={summaryDictionary}\n      />\n    </Flex>\n  )\n}\n"],"names":["HistoricalPaymentSummary","props","jsx","BaseComponent","Root","paymentGroupId","companyId","dictionary","onEvent","useI18n","useComponentDictionary","t","useTranslation","Heading","Text","Button","Alert","useComponentContext","formatLongWithYear","useDateFormatter","summaryDictionary","useHistoricalPaymentSummaryDictionary","paymentGroupData","useContractorPaymentGroupsGetSuspense","contractorPaymentGroup","contractorList","useContractorsListSuspense","contractors","contractor","ContractorOnboardingStatus","handleDone","componentEvents","jsxs","Flex","PaymentSummaryBlock"],"mappings":";;;;;;;;;;;;;AAyCO,SAASA,EAAyBC,GAAsC;AAC7E,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GAAO,eAAc,gDACtC,UAAA,gBAAAC,EAACE,GAAA,EAAM,GAAGH,EAAA,CAAO,EAAA,CACnB;AAEJ;AAEA,SAASG,EAAK,EAAE,gBAAAC,GAAgB,WAAAC,GAAW,YAAAC,GAAY,SAAAC,KAA0C;AAC/F,EAAAC,EAAQ,8CAA8C,GACtDC,EAAuB,gDAAgDH,CAAU;AACjF,QAAM,EAAE,GAAAI,EAAA,IAAMC,EAAe,8CAA8C,GACrE,EAAE,SAAAC,GAAS,MAAAC,GAAM,QAAAC,GAAQ,OAAAC,EAAA,IAAUC,EAAA,GACnC,EAAE,oBAAAC,EAAA,IAAuBC,EAAA,GACzBC,IAAoBC,EAAA,GAEpB,EAAE,MAAMC,EAAA,IAAqBC,EAAsC;AAAA,IACvE,4BAA4BlB;AAAA,EAAA,CAC7B,GACKmB,IAAyBF,EAAiB,wBAE1C,EAAE,MAAMG,EAAA,IAAmBC,EAA2B,EAAE,aAAapB,GAAW,GAChFqB,KAAeF,EAAe,eAAe,CAAA,GAAI;AAAA,IACrD,CAAAG,MACEA,EAAW,YACXA,EAAW,qBAAqBC,EAA2B;AAAA,EAAA;AAG/D,MAAI,CAACL;AACH,WAAO;AAGT,QAAMM,IAAa,MAAM;AACvB,IAAAtB,EAAQuB,EAAgB,kCAAkC;AAAA,EAC5D;AAEA,SACE,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,IAAA,gBAAA/B,EAACc,GAAA,EAAM,QAAO,WAAU,OAAOL,EAAE,cAAc,GAC7C,UAAA,gBAAAT,EAACY,GAAA,EACE,UAAAH,EAAE,kBAAkB;AAAA,MACnB,OAAOa,EAAuB,oBAAoB,UAAU;AAAA,IAAA,CAC7D,GACH,EAAA,CACF;AAAA,IAEA,gBAAAQ,EAACC,GAAA,EAAK,gBAAe,iBAAgB,YAAW,cAC9C,UAAA;AAAA,MAAA,gBAAAD,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,QAAA,gBAAA/B,EAACW,GAAA,EAAQ,IAAG,MAAM,UAAAF,EAAE,cAAc,GAAE;AAAA,QACpC,gBAAAT,EAACY,GAAA,EAAK,SAAQ,cACX,YAAE,mBAAmB;AAAA,UACpB,WAAWI,EAAmBM,EAAuB,aAAa,EAAE;AAAA,QAAA,CACrE,EAAA,CACH;AAAA,MAAA,GACF;AAAA,MACA,gBAAAtB,EAACa,KAAO,SAASe,GAAY,SAAQ,WAClC,UAAAnB,EAAE,SAAS,EAAA,CACd;AAAA,IAAA,GACF;AAAA,IAEA,gBAAAT;AAAA,MAACgC;AAAA,MAAA;AAAA,QACC,wBAAAV;AAAA,QACA,aAAAG;AAAA,QACA,kBAAkB;AAAA,QAClB,YAAYP;AAAA,MAAA;AAAA,IAAA;AAAA,EACd,GACF;AAEJ;"}