Skip to main content

Blocks

Address

Management surface for viewing and editing a contractor's mailing address after onboarding.

Remarks

Drives the read-view card and edit form via an internal state machine. Emits events on the supplied onEvent handler when the user requests an edit, saves changes, or cancels.


AddressProps

Props for Address.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementAddress>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/address/editRequestedFired when the user clicks Edit on the read-view card{ contractorId: string }
contractor/management/address/updatedFired after the address is successfully savedAPIModels.ContractorAddress
contractor/management/address/editCancelledFired when the user cancels editing

Endpoints


AddressCard

Read-only card showing a contractor's mailing address with an Edit action.

Remarks

Standalone card that fetches its own data. Emits an event when the user clicks Edit so the parent can switch to the edit form. The card does not render success or error alerts itself — alert presentation is the surrounding surface's responsibility.


AddressCardProps

Props for AddressCard.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Event handler fired when the user requests to edit the address.
LoaderComponent?LoaderComponentTypeCustom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on GustoProvider for this instance only.

Events

EventDescriptionData
contractor/management/address/editRequestedFired when the user clicks the Edit button{ contractorId: string }

AddressEditForm

Standalone edit form for a contractor's mailing address.

Remarks

Renders fields for street address, city, state, and ZIP code — all required — and shows a success alert when the save completes. Save and Cancel both emit events so the parent can return to the read view.


AddressEditFormProps

Props for AddressEditForm.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementAddress>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/address/updatedFired after the address is successfully savedThe updated ContractorAddress entity
contractor/management/address/editCancelledFired when the user clicks Cancel

Compensation

Management surface for viewing and editing a contractor's compensation after onboarding.

Remarks

Drives the read-view card and edit form via an internal state machine. Emits events on the supplied onEvent handler when the user requests an edit, saves changes, or cancels.


CompensationProps

Props for Compensation.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementCompensation>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/compensation/editRequestedFired when the user clicks Edit on the read-view card{ contractorId: string }
contractor/management/compensation/updatedFired after compensation is successfully savedAPIModels.Contractor
contractor/management/compensation/editCancelledFired when the user cancels editing

Endpoints


CompensationCard

Read-only card showing a contractor's compensation type and rate with an Edit action.

Remarks

Standalone card that fetches its own data. Emits an event when the user clicks Edit so the parent can switch to the edit form. The card does not render success or error alerts itself — alert presentation is the surrounding surface's responsibility.


CompensationCardProps

Props for CompensationCard.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Event handler fired when the user requests to edit compensation.
LoaderComponent?LoaderComponentTypeCustom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on GustoProvider for this instance only.

Events

EventDescriptionData
contractor/management/compensation/editRequestedFired when the user clicks the Edit button{ contractorId: string }

CompensationEditForm

Standalone edit form for a contractor's compensation type and rate.

Remarks

Renders a Fixed/Hourly compensation-type selector and, when Hourly, an hourly-rate field. Save and Cancel both emit events so the parent can return to the read view.


CompensationEditFormProps

Props for CompensationEditForm.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementCompensation>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/compensation/updatedFired after compensation is successfully savedThe updated Contractor entity
contractor/management/compensation/editCancelledFired when the user clicks Cancel

ContractorList

Renders a tabbed list of a company's contractors split across Active, Onboarding, and Dismissed tabs, with per-row actions tailored to each tab (edit, delete, view details, dismiss, rehire, cancel a scheduled dismissal or rehire).


ManagementContractorListProps

Props for ManagementContractorList.

PropertyTypeDescription
companyIdstringThe associated company identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementContractorList>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.
initialTab?ContractorTabTab to render first: Active, Onboarding, or Dismissed. Defaults to 'active'.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/createFired when the user clicks "Add contractor".
contractor/updateFired when the user selects "Edit"/"Review" on an onboarding-tab row.{ contractorId: string }
contractor/viewFired when the user selects "View details" on an active or dismissed row.{ contractorId: string }
contractor/deletedFired after an onboarding-tab row's "Remove" action completes.{ contractorId: string }
contractor/selfOnboarding/cancelledFired after the "Cancel self-onboarding" action updates a contractor's onboarding status.The updated contractorOnboardingStatus returned by the API.
contractor/dismissFired when the user selects "Dismiss" on an active row. No mutation is performed by this component.{ contractorId: string }
contractor/rehireFired when the user selects "Rehire" on a dismissed row. No mutation is performed by this component.{ contractorId: string }
contractor/dismissal/cancelledFired after a scheduled dismissal is cancelled via the confirm dialog.{ contractorId: string }
contractor/rehire/cancelledFired after a scheduled rehire is cancelled via the confirm dialog.{ contractorId: string }

Endpoints


CreatePayment

Form for creating a contractor payment group, including date selection, per-contractor edits, preview, and submission blockers.

Remarks

Active, fully onboarded contractors are listed for the given company. Hours and bonuses apply to hourly contractors; wages apply to fixed contractors; reimbursements apply to both. The form previews the payment group before final submission and surfaces Fast ACH submission blockers when applicable.

Features:

  • Payment date selection — choose the payment date; a notice shows the resulting payment speed.
  • Per-contractor editing — edit hours and bonus (hourly contractors), wage (fixed contractors), and reimbursement (all) in a modal, with a running total.
  • Payment method — choose Check or Direct Deposit per contractor.
  • Live totals — wage, bonus, reimbursement, and overall totals update as amounts change.
  • Preview before submit — review per-contractor amounts, debit amount, debit account, debit date, contractor pay date, and the submission deadline before finalizing.
  • Submission blockers — Fast ACH blockers surface inline with selectable unblock options (wire transfer or slower direct deposit); submission stays disabled until every blocker is resolved.

Example

import { ContractorManagement } from '@gusto/embedded-react-sdk'

function CreateContractorPayment() {
return (
<ContractorManagement.CreatePayment
companyId="a007e1ab-3595-43c2-ab4b-af7a5af2e365"
onEvent={() => {}}
/>
)
}

CreatePaymentProps

Props for CreatePayment.

PropertyTypeDescription
companyIdstringUUID of the company for which to create a contractor payment group.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorPaymentsCreatePayment>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/payments/editThe edit modal was opened for a contractor.
contractor/payments/updateA contractor's payment values were updated locally.The updated form values (hours, wage, bonus, reimbursement, payment method, etc.).
contractor/payments/previewThe preview API call succeeded.The contractor payment group preview response.
contractor/payments/backToEditThe user returned from preview to continue editing.
contractor/payments/createdThe payment group was successfully created.The created contractor payment group response.
contractor/payments/rfi/respondThe user clicked to respond to a payment blocker.

Endpoints


Dashboard

Contractor management dashboard summarizing a single contractor's basic details, pay, and documents.

Remarks

Renders a tabbed overview of the contractor, wrapped in the SDK's standard error and suspense boundaries. The active tab may be controlled via selectedTab or left uncontrolled, in which case it defaults to details. Each tab composes the read-only section cards listed below.


DashboardProps

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorDashboard>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.
selectedTab?DashboardTabThe currently active tab. Defaults to 'details' when uncontrolled.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Components


DocumentsCard

Standalone read-only "Documents" card.

Remarks

Fetches its own data via useContractorDocumentsList and renders a table of the contractor's forms with a per-row "View" action that opens the document's PDF in a new tab. Read-only — signing happens during contractor onboarding, not from this surface.


DocumentsCardProps

Props for DocumentsCard.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Event handler fired when the user views a document.
LoaderComponent?LoaderComponentTypeCustom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on GustoProvider for this instance only.

Events

EventDescriptionData
contractor/management/documents/card/viewRequestedFired when a document row's "View" button is clicked, before the PDF is fetched{ contractorId: string, documentUuid: string }
contractor/management/documents/card/viewedFired after the PDF is fetched and opened in a new tab{ contractorId: string, documentUuid: string }

Endpoints


PaymentHistory

Displays a contractor payment group, including each individual contractor payment, with actions to view details or cancel.

Remarks

Features:

  • Payment group overview — debit date and group context in the header.
  • Per-contractor table — contractor, wage type, payment method, hours, wage, bonus, reimbursement, and total for each payment.
  • Row actions — view an individual contractor payment, or cancel it when the payment is cancelable.

Example

import { ContractorManagement } from '@gusto/embedded-react-sdk'

<ContractorManagement.PaymentHistory
paymentId="payment-group-uuid"
onEvent={() => {}}
/>

PaymentHistoryProps

Props for PaymentHistory.

PropertyTypeDescription
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
paymentIdstringUUID of the contractor payment group to display.
dictionary?Record<"en", DeepPartial<ContractorPaymentsPaymentHistory>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/payments/view/detailsA row's view-details action was triggered.{ contractor: Contractor | undefined, paymentGroupId: string }contractor is undefined if the contractor UUID is not found in the loaded list
contractor/payments/cancelAn individual contractor payment was successfully canceled.{ paymentId: string } — the individual contractor payment UUID, not the payment group UUID passed as paymentId prop

Endpoints


PaymentMethod

Management surface for viewing and editing a contractor's payment method after onboarding.

Remarks

Drives the read-view card and bank-account form via an internal state machine. Emits events on the supplied onEvent handler when the user requests to add or edit a bank account, saves changes, or cancels.


PaymentMethodProps

Props for PaymentMethod.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementPaymentMethod>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/paymentMethod/card/addRequestedFired when the user clicks "Add bank account" on the read-view card{ contractorId: string }
contractor/management/paymentMethod/card/editRequestedFired when the user chooses "Edit" from the bank account row menu{ contractorId: string }
contractor/management/paymentMethod/card/removedFired after the bank account is removed and the payment method reverts to CheckAPIModels.ContractorPaymentMethod
contractor/management/paymentMethod/bankForm/submittedFired after the bank-account form is successfully savedAPIModels.ContractorBankAccount
contractor/management/paymentMethod/bankForm/cancelledFired when the user cancels the bank-account form

Endpoints


PaymentMethodCard

Standalone "Payment" card showing a contractor's payment method.

Remarks

Fetches its own data and emits the management block's scoped events when the user clicks the card's CTAs or confirms removing the bank account. The card has no alert API — alert rendering is the orchestrator's responsibility.


PaymentMethodCardProps

Props for PaymentMethodCard.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Event handler fired on card interactions.
LoaderComponent?LoaderComponentTypeCustom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on GustoProvider for this instance only.

Events

EventDescriptionData
contractor/management/paymentMethod/card/addRequestedFired when the user clicks "Add bank account"{ contractorId: string }
contractor/management/paymentMethod/card/editRequestedFired when the user chooses "Edit" from the bank account row menu{ contractorId: string }
contractor/management/paymentMethod/card/removedFired after the bank account is removed and the payment method reverts to CheckThe updated ContractorPaymentMethod entity

PaymentMethodEditForm

Standalone bank-account form for a contractor's payment method.

Remarks

Renders fields for the account nickname, routing number, account number, and account type. Saving creates the bank account, which updates the contractor's payment method to Direct Deposit as a server-side effect. Save and Cancel both emit events so the parent can return to the read view.


PaymentMethodEditFormProps

Props for PaymentMethodEditForm.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementPaymentMethod>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/paymentMethod/bankForm/submittedFired after the bank account is successfully savedThe created ContractorBankAccount entity
contractor/management/paymentMethod/bankForm/cancelledFired when the user clicks Cancel

PaymentsList

Displays a list of contractor payment groups for a company.

Supports viewing payment history, creating new payments, and filtering by date range. Surfaces alerts for pending information requests and wire transfer requirements.


PaymentsListProps

Props for PaymentsList.

PropertyTypeDescription
companyIdstringUUID of the company whose contractor payment groups should be listed.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorPaymentsPaymentsList>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/payments/createUser chooses to create a new payment
contractor/payments/viewUser selects a payment group to view{ paymentId: string }
contractor/payments/rfi/respondUser clicks to respond to an information request alert

Endpoints


PaymentStatement

Displays a single contractor's payment statement within a payment group, including wage breakdown, bonuses, reimbursements, and a receipt card for funded direct-deposit payments.


PaymentStatementProps

Props for PaymentStatement.

PropertyTypeDescription
contractorUuidstringUUID of the contractor whose payment within the group is being displayed.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
paymentGroupIdstringUUID of the contractor payment group the statement belongs to.
dictionary?Record<"en", DeepPartial<ContractorPaymentsPaymentStatement>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Endpoints


PaymentSummary

Displays a summary of a created contractor payment group, including payment totals, debit information, contractor details, and wire transfer instructions when required.

Remarks

Features:

  • Success confirmation — confirms the number of payments scheduled.
  • Payment summary — total amount, debit amount, debit account, debit date, and contractor pay date, plus a per-contractor breakdown.
  • Debit account — shows the company bank account used for the debit.
  • Wire transfer confirmation — when a wire is required, surfaces the wire-details confirmation workflow.

PaymentSummaryProps

Props for PaymentSummary.

PropertyTypeDescription
companyIdstringUUID of the company that owns the payment group.
onEvent(type: EventType, data?: unknown) => voidCallback invoked when a flow event occurs, e.g. when the user exits.
paymentGroupIdstringUUID of the contractor payment group to summarize.

Events

EventDescriptionData
contractor/payments/exitUser completes the payment flow.

Endpoints


Profile

Management surface for viewing and editing a contractor's basic profile details after onboarding.

Remarks

Drives the read-view card and edit form via an internal state machine. Emits events on the supplied onEvent handler when the user requests an edit, saves changes, or cancels.


ProfileProps

Props for Profile.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementProfile>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/profile/editRequestedFired when the user clicks Edit on the read-view card{ contractorId: string }
contractor/management/profile/updatedFired after the profile is successfully savedAPIModels.Contractor
contractor/management/profile/editCancelledFired when the user cancels editing

Endpoints


ProfileCard

Read-only card showing a contractor's basic profile details with an Edit action.

Remarks

Standalone card that fetches its own data. Emits an event when the user clicks Edit so the parent can switch to the edit form. The card does not render success or error alerts itself — alert presentation is the surrounding surface's responsibility.


ProfileCardProps

Props for ProfileCard.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Event handler fired when the user requests to edit the profile.
LoaderComponent?LoaderComponentTypeCustom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on GustoProvider for this instance only.

Events

EventDescriptionData
contractor/management/profile/editRequestedFired when the user clicks the Edit button{ contractorId: string }

ProfileEditForm

Standalone edit form for a contractor's basic profile details.

Remarks

Renders fields for the contractor's name (or business name), start date, tax ID (SSN or EIN, depending on the contractor's type), and email — all required on update except tax ID and email — and shows a success alert when the save completes. An SSN/EIN already on file renders as a locked, masked value with a "Change" action rather than a blank editable input. Save and Cancel both emit events so the parent can return to the read view.


ProfileEditFormProps

Props for ProfileEditForm.

PropertyTypeDescription
contractorIdstringThe associated contractor identifier.
onEventOnEventType<EventType, unknown>Callback invoked each time the component emits an event — user interactions, successful API responses, step transitions, or errors. Receives the event type constant and an optional payload whose shape varies by event. See the Event Handling guide and each component's event table for the full list of emitted events.
dictionary?Record<"en", DeepPartial<ContractorManagementProfile>>Overrides for the component's i18n strings. Supply a partial object whose keys match the component's resource namespace — any omitted keys fall back to SDK defaults. See the Translation guide for details.

Inherits children, className, defaultValues, FallbackComponent, LoaderComponent from BaseComponentInterface.


Events

EventDescriptionData
contractor/management/profile/updatedFired after the contractor profile is successfully savedAPIModels.Contractor
contractor/management/profile/editCancelledFired when the user clicks Cancel

Utility types

ContractorTab

ContractorTab = "active" | "onboarding" | "dismissed"

The tab currently selected on ManagementContractorList.


DashboardTab

DashboardTab = "details" | "pay" | "documents"