@gusto/embedded-react-sdk 0.57.3 → 0.58.0

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

@@ -1 +1 @@
-{"version":3,"file":"CompensationCard.js","sources":["../../../../../../src/components/Employee/Compensation/management/CompensationCard/CompensationCard.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useJobsAndCompensationsDeleteMutation } from '@gusto/embedded-api/react-query/jobsAndCompensationsDelete'\nimport type { Job } from '@gusto/embedded-api/models/components/job'\nimport {\n  useCompensationManagement,\n  type UseCompensationManagementReady,\n} from '../../shared/useCompensationManagement'\nimport type { PendingCompensationChange } from '../../shared/getPendingCompensationChanges'\nimport { usePendingChangeDetailRenderer } from '../../shared/usePendingChangeDetailRenderer'\nimport { PendingChangesReviewModal } from '../../shared/PendingChangesReviewModal'\nimport styles from './CompensationCard.module.scss'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { DataView, useDataView, EmptyData, Loading, VisuallyHidden } from '@/components/Common'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base/Base'\nimport { formatDateLongWithYear, formatDateToStringDate } from '@/helpers/dateFormatting'\nimport { useFormatCompensationRate } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, FlsaStatus, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport PlusCircleIcon from '@/assets/icons/plus-circle.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\n\nfunction parseJobRate(rate: Job['rate']): number | null {\n  if (rate === undefined) return null\n  const numericRate = parseFloat(rate)\n  return Number.isFinite(numericRate) ? numericRate : null\n}\n\n/**\n * Props for {@link CompensationCard}.\n *\n * @public\n */\nexport interface CompensationCardProps {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** Callback invoked when the card emits an event. See the events table on {@link CompensationCard} for the available event types and payloads. */\n  onEvent: OnEventType<EventType, unknown>\n  /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */\n  LoaderComponent?: LoaderComponentType\n}\n\n/**\n * Standalone \"Compensation\" management card that displays an employee's current jobs and compensation, surfaces pending future-dated changes, and exposes edit, add, and delete affordances.\n *\n * @remarks\n * The card owns its own data fetch, the pending-change alerts and review modal, and the delete-job confirm dialog. It does not render the compensation edit or add-job forms — instead, it emits a distinct request event for each action, and the consumer routes those to {@link CompensationEditForm}, {@link CompensationAddJobForm}, or {@link CompensationAddAnotherJobForm} and renders any post-save success alerts. {@link Compensation} bundles the card, the three form surfaces, and the swap and alert wiring as a single drop-in; reach for the card directly only when that orchestration is the wrong fit (for example, when a form needs to render in a modal or drawer, or when the swap is driven by a router).\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/card/editRequested` | Fired when an \"Edit\" CTA is clicked for a job | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/addRequested` | Fired when the \"Add job\" CTA is clicked from the empty state | `{ employeeId: string }` |\n * | `employee/management/compensation/card/addAnotherRequested` | Fired when the \"Add another job\" CTA is clicked | `{ employeeId: string }` |\n * | `employee/management/compensation/card/jobDeleted` | Fired after a non-primary job is deleted via the card's confirm dialog | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/changeCancelled` | Fired after a scheduled future-dated change is cancelled from the card | `{ employeeId: string, compensationId: string }` |\n *\n * @param props - See {@link CompensationCardProps}.\n * @returns The rendered compensation card.\n * @public\n * @group Block components\n */\nexport function CompensationCard({ LoaderComponent, ...props }: CompensationCardProps) {\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.Compensation\"\n      LoaderComponent={LoaderComponent}\n    >\n      <CompensationCardContent LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction CompensationCardContent({ employeeId, onEvent, LoaderComponent }: CompensationCardProps) {\n  useI18n('Employee.Management.Compensation')\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const Components = useComponentContext()\n\n  const compensation = useCompensationManagement({ employeeId })\n\n  if (compensation.isLoading) {\n    return (\n      <BaseLayout error={compensation.errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <Components.Box header={<Components.BoxHeader title={t('card.title')} />}>\n          <Loading />\n        </Components.Box>\n      </BaseLayout>\n    )\n  }\n\n  return (\n    <CompensationCardReady\n      employeeId={employeeId}\n      onEvent={onEvent}\n      compensation={compensation}\n      LoaderComponent={LoaderComponent}\n    />\n  )\n}\n\ninterface CompensationCardReadyProps extends CompensationCardProps {\n  compensation: UseCompensationManagementReady\n}\n\nfunction CompensationCardReady({\n  employeeId,\n  onEvent,\n  compensation,\n  LoaderComponent,\n}: CompensationCardReadyProps) {\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const Components = useComponentContext()\n  const formatCompensationRate = useFormatCompensationRate()\n\n  const { jobs, primaryFlsaStatus, pendingChanges, hasMultipleJobs, employeeFirstName } =\n    compensation.data\n  const { cancellingCompensationUuid } = compensation.status\n\n  const handleCancelChange = useCallback(\n    async (pendingChange: PendingCompensationChange) => {\n      const result = await compensation.actions.cancelPendingChange(pendingChange)\n      if (result) {\n        onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_CHANGE_CANCELLED, {\n          employeeId,\n          compensationId: pendingChange.compensationUuid,\n        })\n      }\n    },\n    [compensation, onEvent, employeeId],\n  )\n\n  const [pendingDeleteJob, setPendingDeleteJob] = useState<{\n    uuid: string\n    title: string\n  } | null>(null)\n\n  const { mutateAsync: deleteEmployeeJob, isPending: isDeletingJob } =\n    useJobsAndCompensationsDeleteMutation()\n\n  const handleConfirmDeleteJob = async () => {\n    if (!pendingDeleteJob) return\n    const jobId = pendingDeleteJob.uuid\n    await deleteEmployeeJob({ request: { jobId } })\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_JOB_DELETED, {\n      employeeId,\n      jobId,\n    })\n    setPendingDeleteJob(null)\n  }\n\n  const singleJob = jobs.length === 1 ? jobs[0]! : undefined\n  // Block adding a secondary if the primary already has a future-dated\n  // compensation that isn't Nonexempt — that comp will delete secondary jobs\n  // at its effective date, matching the gws-flows guard on the new-job action.\n  const localTodayISO = formatDateToStringDate(new Date()) ?? ''\n  const primaryJob = jobs.find(j => j.primary)\n  const hasFutureNonNonexemptComp =\n    primaryJob?.compensations?.some(\n      c =>\n        c.effectiveDate !== undefined &&\n        c.effectiveDate > localTodayISO &&\n        c.flsaStatus !== FlsaStatus.NONEXEMPT,\n    ) ?? false\n  const canAddAnotherJob =\n    jobs.length >= 1 && primaryFlsaStatus === FlsaStatus.NONEXEMPT && !hasFutureNonNonexemptComp\n  const singleJobNumericRate = singleJob ? parseJobRate(singleJob.rate) : null\n  const singleJobCurrentComp = singleJob?.compensations?.find(\n    c => c.uuid === singleJob.currentCompensationUuid,\n  )\n  const emptyPlaceholder = <span aria-label={t('card.listEmptyPlaceholder')}>–</span>\n  const singleJobPaymentTypeLabel = singleJob?.paymentUnit\n    ? singleJob.paymentUnit === 'Hour'\n      ? t('card.types.hourly')\n      : singleJob.paymentUnit === 'Salary' || singleJob.paymentUnit === 'Year'\n        ? t('card.types.salary')\n        : singleJob.paymentUnit\n    : null\n\n  const [isReviewOpen, setIsReviewOpen] = useState(false)\n  const renderDetail = usePendingChangeDetailRenderer(employeeFirstName)\n\n  // Split pending changes: \"new job\" (job hasn't started yet, no current comp)\n  // vs \"update\" (existing comp with a scheduled future change).\n  const newJobPendingChanges = pendingChanges.filter(c => c.isNewJob)\n  const updatePendingChanges = pendingChanges.filter(c => !c.isNewJob)\n\n  useEffect(() => {\n    if (updatePendingChanges.length === 0) {\n      setIsReviewOpen(false)\n    }\n  }, [updatePendingChanges.length])\n\n  const pendingNewJobUuids = new Set(newJobPendingChanges.map(c => c.jobUuid))\n  const singleJobIsPendingNew = singleJob ? pendingNewJobUuids.has(singleJob.uuid) : false\n  const hasAnyPendingNewJobs = pendingNewJobUuids.size > 0\n\n  // Jobs with a future-dated comp stacked on a current comp (\"pending update\").\n  // Editing while one is queued would stack another future comp on top —\n  // hide Edit until the existing pending change is cancelled or goes into effect.\n  const pendingUpdateJobUuids = new Set(updatePendingChanges.map(c => c.jobUuid))\n  const singleJobHasPendingUpdate = singleJob ? pendingUpdateJobUuids.has(singleJob.uuid) : false\n\n  const hasPendingUpdates = updatePendingChanges.length > 0\n  const showSummaryAlert = hasMultipleJobs && updatePendingChanges.length > 1\n  const showInlineAlert = hasPendingUpdates && !showSummaryAlert\n  const nextChange = updatePendingChanges[0]\n\n  const handleEdit = (job: Job) => {\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_EDIT_REQUESTED, {\n      employeeId,\n      jobId: job.uuid,\n    })\n  }\n  const handleAddJob = () => {\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_ADD_REQUESTED, { employeeId })\n  }\n  const handleAddAnotherJob = () => {\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_ADD_ANOTHER_REQUESTED, {\n      employeeId,\n    })\n  }\n\n  const jobsColumns = [\n    {\n      key: 'jobTitle',\n      title: t('card.columns.jobTitle'),\n      render: (job: Job) => {\n        // Title lives on compensation in the API — `job.title` is a\n        // denormalized snapshot that can lag behind comp-level edits on\n        // pending jobs, so read from the comp pointed to by\n        // `currentCompensationUuid`.\n        const currentComp = job.compensations?.find(c => c.uuid === job.currentCompensationUuid)\n        const numericRate = parseJobRate(job.rate)\n        return (\n          <>\n            {currentComp?.title || '-'}\n            {numericRate !== null && job.paymentUnit ? (\n              <Components.Text variant=\"supporting\" size=\"sm\">\n                {formatCompensationRate(numericRate, job.paymentUnit)}\n              </Components.Text>\n            ) : null}\n          </>\n        )\n      },\n    },\n    {\n      key: 'payType',\n      title: t('card.columns.payType'),\n      render: (job: Job) => {\n        const flsaStatus = job.compensations?.find(\n          comp => comp.uuid === job.currentCompensationUuid,\n        )?.flsaStatus\n        return flsaStatus !== undefined ? t(`flsaStatusLabels.${flsaStatus}`) : '-'\n      },\n    },\n    {\n      key: 'effectiveDate',\n      title: t('card.columns.effectiveDate'),\n      render: (job: Job) => {\n        const currentComp = job.compensations?.find(c => c.uuid === job.currentCompensationUuid)\n        return currentComp?.effectiveDate ? formatDateLongWithYear(currentComp.effectiveDate) : '-'\n      },\n    },\n    ...(hasAnyPendingNewJobs\n      ? [\n          {\n            key: 'status',\n            title: <VisuallyHidden>{t('card.columns.status')}</VisuallyHidden>,\n            render: (job: Job) =>\n              pendingNewJobUuids.has(job.uuid) ? (\n                <Components.Badge status=\"warning\">{t('card.pendingStatus')}</Components.Badge>\n              ) : null,\n          },\n        ]\n      : []),\n  ]\n\n  const jobsDataView = useDataView({\n    data: jobs,\n    columns: jobsColumns,\n    itemMenu: (job: Job) => {\n      const jobHasPendingUpdate = pendingUpdateJobUuids.has(job.uuid)\n      const items = [\n        ...(jobHasPendingUpdate\n          ? []\n          : [\n              {\n                label: t('card.editJobCta'),\n                icon: <PencilSvg aria-hidden />,\n                onClick: () => {\n                  handleEdit(job)\n                },\n              },\n            ]),\n        ...(!job.primary\n          ? [\n              {\n                label: t('card.deleteJobCta'),\n                icon: <TrashCanSvg aria-hidden />,\n                onClick: () => {\n                  const currentComp = job.compensations?.find(\n                    c => c.uuid === job.currentCompensationUuid,\n                  )\n                  setPendingDeleteJob({ uuid: job.uuid, title: currentComp?.title ?? '' })\n                },\n              },\n            ]\n          : []),\n      ]\n      if (items.length === 0) return null\n      return (\n        <HamburgerMenu\n          triggerLabel={t('card.hamburgerTitle')}\n          isLoading={isDeletingJob}\n          items={items}\n        />\n      )\n    },\n  })\n\n  return (\n    <BaseLayout error={compensation.errorHandling.errors} LoaderComponent={LoaderComponent}>\n      <Components.Box\n        withPadding={!hasMultipleJobs}\n        header={\n          <Components.BoxHeader\n            title={t('card.title')}\n            action={\n              hasMultipleJobs ? null : singleJob ? (\n                singleJobHasPendingUpdate ? null : (\n                  <Components.Button\n                    variant=\"secondary\"\n                    onClick={() => {\n                      handleEdit(singleJob)\n                    }}\n                  >\n                    {t('card.editCta')}\n                  </Components.Button>\n                )\n              ) : (\n                <Components.Button\n                  variant=\"secondary\"\n                  onClick={handleAddJob}\n                  icon={<PlusCircleIcon />}\n                >\n                  {t('card.addJobCta')}\n                </Components.Button>\n              )\n            }\n          />\n        }\n        footer={\n          canAddAnotherJob ? (\n            <Components.Button\n              variant=\"secondary\"\n              onClick={handleAddAnotherJob}\n              icon={<PlusCircleIcon />}\n            >\n              {t('card.addAnotherJobCta')}\n            </Components.Button>\n          ) : undefined\n        }\n      >\n        <Flex flexDirection=\"column\" gap={16}>\n          {hasPendingUpdates && (\n            <div\n              className={[styles.alertWrapper, hasMultipleJobs && styles.alertWrapperPadded]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              <Flex flexDirection=\"column\" gap={16}>\n                {showInlineAlert && nextChange && (\n                  <Components.Alert\n                    status=\"warning\"\n                    disableScrollIntoView\n                    label={\n                      hasMultipleJobs\n                        ? t('card.pendingChange.alertLabelWithJob', {\n                            jobTitle: nextChange.jobTitle,\n                            date: formatDateLongWithYear(nextChange.effectiveDate),\n                          })\n                        : t('card.pendingChange.alertLabel', {\n                            date: formatDateLongWithYear(nextChange.effectiveDate),\n                          })\n                    }\n                  >\n                    <Flex flexDirection=\"column\" gap={12}>\n                      <Components.UnorderedList\n                        items={nextChange.details.map(detail => renderDetail(detail))}\n                      />\n                      <div>\n                        <Components.Button\n                          variant=\"secondary\"\n                          isLoading={cancellingCompensationUuid === nextChange.compensationUuid}\n                          onClick={() => {\n                            void handleCancelChange(nextChange)\n                          }}\n                        >\n                          {t('card.pendingChange.cancelCta')}\n                        </Components.Button>\n                      </div>\n                    </Flex>\n                  </Components.Alert>\n                )}\n                {showSummaryAlert && (\n                  <Components.Alert\n                    status=\"warning\"\n                    disableScrollIntoView\n                    label={t('card.pendingChange.summaryLabel', {\n                      name: employeeFirstName ?? '',\n                    })}\n                    action={\n                      <Components.Button\n                        variant=\"secondary\"\n                        onClick={() => {\n                          setIsReviewOpen(true)\n                        }}\n                      >\n                        {t('card.pendingChange.reviewCta')}\n                      </Components.Button>\n                    }\n                  />\n                )}\n              </Flex>\n            </div>\n          )}\n          {hasMultipleJobs ? (\n            <DataView label={t('card.tableLabel')} isWithinBox {...jobsDataView} />\n          ) : singleJob ? (\n            <Components.DescriptionList\n              items={[\n                {\n                  term: t('card.jobTitle'),\n                  description: singleJob.title || emptyPlaceholder,\n                },\n                {\n                  term: t('card.type'),\n                  description: singleJobPaymentTypeLabel || emptyPlaceholder,\n                },\n                {\n                  term: t('card.wage'),\n                  description:\n                    singleJobNumericRate !== null && singleJob.paymentUnit\n                      ? formatCompensationRate(singleJobNumericRate, singleJob.paymentUnit)\n                      : emptyPlaceholder,\n                },\n                {\n                  term: t('card.effectiveDate'),\n                  description: singleJobCurrentComp?.effectiveDate\n                    ? formatDateLongWithYear(singleJobCurrentComp.effectiveDate)\n                    : emptyPlaceholder,\n                },\n                ...(singleJobIsPendingNew\n                  ? [\n                      {\n                        term: t('card.columns.status'),\n                        description: (\n                          <Components.Badge status=\"warning\">\n                            {t('card.pendingStatus')}\n                          </Components.Badge>\n                        ),\n                      },\n                    ]\n                  : []),\n              ]}\n            />\n          ) : (\n            <EmptyData\n              title={t('card.emptyState.title')}\n              description={t('card.emptyState.description')}\n            />\n          )}\n        </Flex>\n      </Components.Box>\n\n      <PendingChangesReviewModal\n        isOpen={isReviewOpen}\n        pendingChanges={updatePendingChanges}\n        employeeFirstName={employeeFirstName}\n        cancellingCompensationUuid={cancellingCompensationUuid}\n        onClose={() => {\n          setIsReviewOpen(false)\n        }}\n        onCancelChange={change => {\n          void handleCancelChange(change)\n        }}\n      />\n\n      <Components.Dialog\n        isOpen={pendingDeleteJob !== null}\n        onClose={() => {\n          setPendingDeleteJob(null)\n        }}\n        onPrimaryActionClick={() => {\n          void handleConfirmDeleteJob()\n        }}\n        isPrimaryActionLoading={isDeletingJob}\n        isDestructive\n        title={t('card.deleteJobDialog.title')}\n        primaryActionLabel={t('card.deleteJobDialog.confirmCta')}\n        closeActionLabel={t('card.deleteJobDialog.cancelCta')}\n      >\n        {pendingDeleteJob\n          ? t('card.deleteJobDialog.description', {\n              jobTitle: pendingDeleteJob.title,\n            })\n          : null}\n      </Components.Dialog>\n    </BaseLayout>\n  )\n}\n"],"names":["parseJobRate","rate","numericRate","CompensationCard","LoaderComponent","props","jsx","BaseBoundaries","CompensationCardContent","employeeId","onEvent","useI18n","t","useTranslation","Components","useComponentContext","compensation","useCompensationManagement","BaseLayout","Loading","CompensationCardReady","formatCompensationRate","useFormatCompensationRate","jobs","primaryFlsaStatus","pendingChanges","hasMultipleJobs","employeeFirstName","cancellingCompensationUuid","handleCancelChange","useCallback","pendingChange","componentEvents","pendingDeleteJob","setPendingDeleteJob","useState","deleteEmployeeJob","isDeletingJob","useJobsAndCompensationsDeleteMutation","handleConfirmDeleteJob","jobId","singleJob","localTodayISO","formatDateToStringDate","hasFutureNonNonexemptComp","j","c","FlsaStatus","canAddAnotherJob","singleJobNumericRate","singleJobCurrentComp","emptyPlaceholder","singleJobPaymentTypeLabel","isReviewOpen","setIsReviewOpen","renderDetail","usePendingChangeDetailRenderer","newJobPendingChanges","updatePendingChanges","useEffect","pendingNewJobUuids","singleJobIsPendingNew","hasAnyPendingNewJobs","pendingUpdateJobUuids","singleJobHasPendingUpdate","hasPendingUpdates","showSummaryAlert","showInlineAlert","nextChange","handleEdit","job","handleAddJob","handleAddAnotherJob","jobsColumns","currentComp","jsxs","Fragment","flsaStatus","comp","formatDateLongWithYear","VisuallyHidden","jobsDataView","useDataView","items","PencilSvg","TrashCanSvg","HamburgerMenu","PlusCircleIcon","Flex","styles","detail","DataView","EmptyData","PendingChangesReviewModal","change"],"mappings":"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"}
+{"version":3,"file":"CompensationCard.js","sources":["../../../../../../src/components/Employee/Compensation/management/CompensationCard/CompensationCard.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useJobsAndCompensationsDeleteMutation } from '@gusto/embedded-api/react-query/jobsAndCompensationsDelete'\nimport type { Job } from '@gusto/embedded-api/models/components/job'\nimport {\n  useCompensationManagement,\n  type UseCompensationManagementReady,\n} from '../../shared/useCompensationManagement'\nimport type { PendingCompensationChange } from '../../shared/getPendingCompensationChanges'\nimport { usePendingChangeDetailRenderer } from '../../shared/usePendingChangeDetailRenderer'\nimport { PendingChangesReviewModal } from '../../shared/PendingChangesReviewModal'\nimport styles from './CompensationCard.module.scss'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { DataView, useDataView, EmptyData, Loading, VisuallyHidden } from '@/components/Common'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base/Base'\nimport { formatDateLongWithYear, formatDateToStringDate } from '@/helpers/dateFormatting'\nimport { useFormatCompensationRate } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, FlsaStatus, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport PlusCircleIcon from '@/assets/icons/plus-circle.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\n\nfunction parseJobRate(rate: Job['rate']): number | null {\n  if (rate === undefined) return null\n  const numericRate = parseFloat(rate)\n  return Number.isFinite(numericRate) ? numericRate : null\n}\n\n/**\n * Props for {@link CompensationCard}.\n *\n * @public\n */\nexport interface CompensationCardProps {\n  /** The associated employee identifier. */\n  employeeId: string\n  /** Callback invoked when the card emits an event. See the events table on {@link CompensationCard} for the available event types and payloads. */\n  onEvent: OnEventType<EventType, unknown>\n  /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */\n  LoaderComponent?: LoaderComponentType\n}\n\n/**\n * Standalone \"Compensation\" management card that displays an employee's current jobs and compensation, surfaces pending future-dated changes, and exposes edit, add, and delete affordances.\n *\n * @remarks\n * The card owns its own data fetch, the pending-change alerts and review modal, and the delete-job confirm dialog. It does not render the compensation edit or add-job forms — instead, it emits a distinct request event for each action, and the consumer routes those to {@link CompensationEditForm}, {@link CompensationAddJobForm}, or {@link CompensationAddAnotherJobForm} and renders any post-save success alerts. {@link Compensation} bundles the card, the three form surfaces, and the swap and alert wiring as a single drop-in; reach for the card directly only when that orchestration is the wrong fit (for example, when a form needs to render in a modal or drawer, or when the swap is driven by a router).\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/compensation/card/editRequested` | Fired when an \"Edit\" CTA is clicked for a job | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/addRequested` | Fired when the \"Add job\" CTA is clicked from the empty state | `{ employeeId: string }` |\n * | `employee/management/compensation/card/addAnotherRequested` | Fired when the \"Add another job\" CTA is clicked | `{ employeeId: string }` |\n * | `employee/management/compensation/card/jobDeleted` | Fired after a non-primary job is deleted via the card's confirm dialog | `{ employeeId: string, jobId: string }` |\n * | `employee/management/compensation/card/changeCancelled` | Fired after a scheduled future-dated change is cancelled from the card | `{ employeeId: string, compensationId: string }` |\n *\n * @param props - See {@link CompensationCardProps}.\n * @returns The rendered compensation card.\n * @public\n * @group Block components\n */\nexport function CompensationCard({ LoaderComponent, ...props }: CompensationCardProps) {\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.Compensation\"\n      LoaderComponent={LoaderComponent}\n    >\n      <CompensationCardContent LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n\nfunction CompensationCardContent({ employeeId, onEvent, LoaderComponent }: CompensationCardProps) {\n  useI18n('Employee.Management.Compensation')\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const Components = useComponentContext()\n\n  const compensation = useCompensationManagement({ employeeId })\n\n  if (compensation.isLoading) {\n    return (\n      <BaseLayout error={compensation.errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <Components.Box header={<Components.BoxHeader title={t('card.title')} />}>\n          <Loading />\n        </Components.Box>\n      </BaseLayout>\n    )\n  }\n\n  return (\n    <CompensationCardReady\n      employeeId={employeeId}\n      onEvent={onEvent}\n      compensation={compensation}\n      LoaderComponent={LoaderComponent}\n    />\n  )\n}\n\ninterface CompensationCardReadyProps extends CompensationCardProps {\n  compensation: UseCompensationManagementReady\n}\n\nfunction CompensationCardReady({\n  employeeId,\n  onEvent,\n  compensation,\n  LoaderComponent,\n}: CompensationCardReadyProps) {\n  const { t } = useTranslation('Employee.Management.Compensation')\n  const Components = useComponentContext()\n  const formatCompensationRate = useFormatCompensationRate()\n\n  const { jobs, primaryFlsaStatus, pendingChanges, hasMultipleJobs, employeeFirstName } =\n    compensation.data\n  const { cancellingCompensationUuid } = compensation.status\n\n  const handleCancelChange = useCallback(\n    async (pendingChange: PendingCompensationChange) => {\n      const result = await compensation.actions.cancelPendingChange(pendingChange)\n      if (result) {\n        onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_CHANGE_CANCELLED, {\n          employeeId,\n          compensationId: pendingChange.compensationUuid,\n        })\n      }\n    },\n    [compensation, onEvent, employeeId],\n  )\n\n  const [pendingDeleteJob, setPendingDeleteJob] = useState<{\n    uuid: string\n    title: string\n  } | null>(null)\n\n  const { mutateAsync: deleteEmployeeJob, isPending: isDeletingJob } =\n    useJobsAndCompensationsDeleteMutation()\n\n  const handleConfirmDeleteJob = async () => {\n    if (!pendingDeleteJob) return\n    const jobId = pendingDeleteJob.uuid\n    await deleteEmployeeJob({ request: { jobId } })\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_JOB_DELETED, {\n      employeeId,\n      jobId,\n    })\n    setPendingDeleteJob(null)\n  }\n\n  const singleJob = jobs.length === 1 ? jobs[0]! : undefined\n  // Block adding a secondary if the primary already has a future-dated\n  // compensation that isn't Nonexempt — that comp will delete secondary jobs\n  // at its effective date, matching the gws-flows guard on the new-job action.\n  const localTodayISO = formatDateToStringDate(new Date()) ?? ''\n  const primaryJob = jobs.find(j => j.primary)\n  const hasFutureNonNonexemptComp =\n    primaryJob?.compensations?.some(\n      c =>\n        c.effectiveDate !== undefined &&\n        c.effectiveDate > localTodayISO &&\n        c.flsaStatus !== FlsaStatus.NONEXEMPT,\n    ) ?? false\n  const canAddAnotherJob =\n    jobs.length >= 1 && primaryFlsaStatus === FlsaStatus.NONEXEMPT && !hasFutureNonNonexemptComp\n  const singleJobNumericRate = singleJob ? parseJobRate(singleJob.rate) : null\n  const singleJobCurrentComp = singleJob?.compensations?.find(\n    c => c.uuid === singleJob.currentCompensationUuid,\n  )\n  const emptyPlaceholder = <span aria-label={t('card.listEmptyPlaceholder')}>–</span>\n  const singleJobPaymentTypeLabel = singleJobCurrentComp?.flsaStatus\n    ? t(`flsaStatusLabels.${singleJobCurrentComp.flsaStatus}`)\n    : null\n\n  const [isReviewOpen, setIsReviewOpen] = useState(false)\n  const renderDetail = usePendingChangeDetailRenderer(employeeFirstName)\n\n  // Split pending changes: \"new job\" (job hasn't started yet, no current comp)\n  // vs \"update\" (existing comp with a scheduled future change).\n  const newJobPendingChanges = pendingChanges.filter(c => c.isNewJob)\n  const updatePendingChanges = pendingChanges.filter(c => !c.isNewJob)\n\n  useEffect(() => {\n    if (updatePendingChanges.length === 0) {\n      setIsReviewOpen(false)\n    }\n  }, [updatePendingChanges.length])\n\n  const pendingNewJobUuids = new Set(newJobPendingChanges.map(c => c.jobUuid))\n  const singleJobIsPendingNew = singleJob ? pendingNewJobUuids.has(singleJob.uuid) : false\n  const hasAnyPendingNewJobs = pendingNewJobUuids.size > 0\n\n  // Jobs with a future-dated comp stacked on a current comp (\"pending update\").\n  // Editing while one is queued would stack another future comp on top —\n  // hide Edit until the existing pending change is cancelled or goes into effect.\n  const pendingUpdateJobUuids = new Set(updatePendingChanges.map(c => c.jobUuid))\n  const singleJobHasPendingUpdate = singleJob ? pendingUpdateJobUuids.has(singleJob.uuid) : false\n\n  const hasPendingUpdates = updatePendingChanges.length > 0\n  const showSummaryAlert = hasMultipleJobs && updatePendingChanges.length > 1\n  const showInlineAlert = hasPendingUpdates && !showSummaryAlert\n  const nextChange = updatePendingChanges[0]\n\n  const handleEdit = (job: Job) => {\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_EDIT_REQUESTED, {\n      employeeId,\n      jobId: job.uuid,\n    })\n  }\n  const handleAddJob = () => {\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_ADD_REQUESTED, { employeeId })\n  }\n  const handleAddAnotherJob = () => {\n    onEvent(componentEvents.EMPLOYEE_MANAGEMENT_COMPENSATION_CARD_ADD_ANOTHER_REQUESTED, {\n      employeeId,\n    })\n  }\n\n  const jobsColumns = [\n    {\n      key: 'jobTitle',\n      title: t('card.columns.jobTitle'),\n      render: (job: Job) => {\n        // Title lives on compensation in the API — `job.title` is a\n        // denormalized snapshot that can lag behind comp-level edits on\n        // pending jobs, so read from the comp pointed to by\n        // `currentCompensationUuid`.\n        const currentComp = job.compensations?.find(c => c.uuid === job.currentCompensationUuid)\n        const numericRate = parseJobRate(job.rate)\n        return (\n          <>\n            {currentComp?.title || '-'}\n            {numericRate !== null && job.paymentUnit ? (\n              <Components.Text variant=\"supporting\" size=\"sm\">\n                {formatCompensationRate(numericRate, job.paymentUnit)}\n              </Components.Text>\n            ) : null}\n          </>\n        )\n      },\n    },\n    {\n      key: 'payType',\n      title: t('card.columns.payType'),\n      render: (job: Job) => {\n        const flsaStatus = job.compensations?.find(\n          comp => comp.uuid === job.currentCompensationUuid,\n        )?.flsaStatus\n        return flsaStatus !== undefined ? t(`flsaStatusLabels.${flsaStatus}`) : '-'\n      },\n    },\n    {\n      key: 'effectiveDate',\n      title: t('card.columns.effectiveDate'),\n      render: (job: Job) => {\n        const currentComp = job.compensations?.find(c => c.uuid === job.currentCompensationUuid)\n        return currentComp?.effectiveDate ? formatDateLongWithYear(currentComp.effectiveDate) : '-'\n      },\n    },\n    ...(hasAnyPendingNewJobs\n      ? [\n          {\n            key: 'status',\n            title: <VisuallyHidden>{t('card.columns.status')}</VisuallyHidden>,\n            render: (job: Job) =>\n              pendingNewJobUuids.has(job.uuid) ? (\n                <Components.Badge status=\"warning\">{t('card.pendingStatus')}</Components.Badge>\n              ) : null,\n          },\n        ]\n      : []),\n  ]\n\n  const jobsDataView = useDataView({\n    data: jobs,\n    columns: jobsColumns,\n    itemMenu: (job: Job) => {\n      const jobHasPendingUpdate = pendingUpdateJobUuids.has(job.uuid)\n      const items = [\n        ...(jobHasPendingUpdate\n          ? []\n          : [\n              {\n                label: t('card.editJobCta'),\n                icon: <PencilSvg aria-hidden />,\n                onClick: () => {\n                  handleEdit(job)\n                },\n              },\n            ]),\n        ...(!job.primary\n          ? [\n              {\n                label: t('card.deleteJobCta'),\n                icon: <TrashCanSvg aria-hidden />,\n                onClick: () => {\n                  const currentComp = job.compensations?.find(\n                    c => c.uuid === job.currentCompensationUuid,\n                  )\n                  setPendingDeleteJob({ uuid: job.uuid, title: currentComp?.title ?? '' })\n                },\n              },\n            ]\n          : []),\n      ]\n      if (items.length === 0) return null\n      return (\n        <HamburgerMenu\n          triggerLabel={t('card.hamburgerTitle')}\n          isLoading={isDeletingJob}\n          items={items}\n        />\n      )\n    },\n  })\n\n  return (\n    <BaseLayout error={compensation.errorHandling.errors} LoaderComponent={LoaderComponent}>\n      <Components.Box\n        withPadding={!hasMultipleJobs}\n        header={\n          <Components.BoxHeader\n            title={t('card.title')}\n            action={\n              hasMultipleJobs ? null : singleJob ? (\n                singleJobHasPendingUpdate ? null : (\n                  <Components.Button\n                    variant=\"secondary\"\n                    onClick={() => {\n                      handleEdit(singleJob)\n                    }}\n                  >\n                    {t('card.editCta')}\n                  </Components.Button>\n                )\n              ) : (\n                <Components.Button\n                  variant=\"secondary\"\n                  onClick={handleAddJob}\n                  icon={<PlusCircleIcon />}\n                >\n                  {t('card.addJobCta')}\n                </Components.Button>\n              )\n            }\n          />\n        }\n        footer={\n          canAddAnotherJob ? (\n            <Components.Button\n              variant=\"secondary\"\n              onClick={handleAddAnotherJob}\n              icon={<PlusCircleIcon />}\n            >\n              {t('card.addAnotherJobCta')}\n            </Components.Button>\n          ) : undefined\n        }\n      >\n        <Flex flexDirection=\"column\" gap={16}>\n          {hasPendingUpdates && (\n            <div\n              className={[styles.alertWrapper, hasMultipleJobs && styles.alertWrapperPadded]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              <Flex flexDirection=\"column\" gap={16}>\n                {showInlineAlert && nextChange && (\n                  <Components.Alert\n                    status=\"warning\"\n                    disableScrollIntoView\n                    label={\n                      hasMultipleJobs\n                        ? t('card.pendingChange.alertLabelWithJob', {\n                            jobTitle: nextChange.jobTitle,\n                            date: formatDateLongWithYear(nextChange.effectiveDate),\n                          })\n                        : t('card.pendingChange.alertLabel', {\n                            date: formatDateLongWithYear(nextChange.effectiveDate),\n                          })\n                    }\n                  >\n                    <Flex flexDirection=\"column\" gap={12}>\n                      <Components.UnorderedList\n                        items={nextChange.details.map(detail => renderDetail(detail))}\n                      />\n                      <div>\n                        <Components.Button\n                          variant=\"secondary\"\n                          isLoading={cancellingCompensationUuid === nextChange.compensationUuid}\n                          onClick={() => {\n                            void handleCancelChange(nextChange)\n                          }}\n                        >\n                          {t('card.pendingChange.cancelCta')}\n                        </Components.Button>\n                      </div>\n                    </Flex>\n                  </Components.Alert>\n                )}\n                {showSummaryAlert && (\n                  <Components.Alert\n                    status=\"warning\"\n                    disableScrollIntoView\n                    label={t('card.pendingChange.summaryLabel', {\n                      name: employeeFirstName ?? '',\n                    })}\n                    action={\n                      <Components.Button\n                        variant=\"secondary\"\n                        onClick={() => {\n                          setIsReviewOpen(true)\n                        }}\n                      >\n                        {t('card.pendingChange.reviewCta')}\n                      </Components.Button>\n                    }\n                  />\n                )}\n              </Flex>\n            </div>\n          )}\n          {hasMultipleJobs ? (\n            <DataView label={t('card.tableLabel')} isWithinBox {...jobsDataView} />\n          ) : singleJob ? (\n            <Components.DescriptionList\n              items={[\n                {\n                  term: t('card.jobTitle'),\n                  description: singleJob.title || emptyPlaceholder,\n                },\n                {\n                  term: t('card.type'),\n                  description: singleJobPaymentTypeLabel || emptyPlaceholder,\n                },\n                {\n                  term: t('card.wage'),\n                  description:\n                    singleJobNumericRate !== null && singleJob.paymentUnit\n                      ? formatCompensationRate(singleJobNumericRate, singleJob.paymentUnit)\n                      : emptyPlaceholder,\n                },\n                {\n                  term: t('card.effectiveDate'),\n                  description: singleJobCurrentComp?.effectiveDate\n                    ? formatDateLongWithYear(singleJobCurrentComp.effectiveDate)\n                    : emptyPlaceholder,\n                },\n                ...(singleJobIsPendingNew\n                  ? [\n                      {\n                        term: t('card.columns.status'),\n                        description: (\n                          <Components.Badge status=\"warning\">\n                            {t('card.pendingStatus')}\n                          </Components.Badge>\n                        ),\n                      },\n                    ]\n                  : []),\n              ]}\n            />\n          ) : (\n            <EmptyData\n              title={t('card.emptyState.title')}\n              description={t('card.emptyState.description')}\n            />\n          )}\n        </Flex>\n      </Components.Box>\n\n      <PendingChangesReviewModal\n        isOpen={isReviewOpen}\n        pendingChanges={updatePendingChanges}\n        employeeFirstName={employeeFirstName}\n        cancellingCompensationUuid={cancellingCompensationUuid}\n        onClose={() => {\n          setIsReviewOpen(false)\n        }}\n        onCancelChange={change => {\n          void handleCancelChange(change)\n        }}\n      />\n\n      <Components.Dialog\n        isOpen={pendingDeleteJob !== null}\n        onClose={() => {\n          setPendingDeleteJob(null)\n        }}\n        onPrimaryActionClick={() => {\n          void handleConfirmDeleteJob()\n        }}\n        isPrimaryActionLoading={isDeletingJob}\n        isDestructive\n        title={t('card.deleteJobDialog.title')}\n        primaryActionLabel={t('card.deleteJobDialog.confirmCta')}\n        closeActionLabel={t('card.deleteJobDialog.cancelCta')}\n      >\n        {pendingDeleteJob\n          ? t('card.deleteJobDialog.description', {\n              jobTitle: pendingDeleteJob.title,\n            })\n          : null}\n      </Components.Dialog>\n    </BaseLayout>\n  )\n}\n"],"names":["parseJobRate","rate","numericRate","CompensationCard","LoaderComponent","props","jsx","BaseBoundaries","CompensationCardContent","employeeId","onEvent","useI18n","t","useTranslation","Components","useComponentContext","compensation","useCompensationManagement","BaseLayout","Loading","CompensationCardReady","formatCompensationRate","useFormatCompensationRate","jobs","primaryFlsaStatus","pendingChanges","hasMultipleJobs","employeeFirstName","cancellingCompensationUuid","handleCancelChange","useCallback","pendingChange","componentEvents","pendingDeleteJob","setPendingDeleteJob","useState","deleteEmployeeJob","isDeletingJob","useJobsAndCompensationsDeleteMutation","handleConfirmDeleteJob","jobId","singleJob","localTodayISO","formatDateToStringDate","hasFutureNonNonexemptComp","j","c","FlsaStatus","canAddAnotherJob","singleJobNumericRate","singleJobCurrentComp","emptyPlaceholder","singleJobPaymentTypeLabel","isReviewOpen","setIsReviewOpen","renderDetail","usePendingChangeDetailRenderer","newJobPendingChanges","updatePendingChanges","useEffect","pendingNewJobUuids","singleJobIsPendingNew","hasAnyPendingNewJobs","pendingUpdateJobUuids","singleJobHasPendingUpdate","hasPendingUpdates","showSummaryAlert","showInlineAlert","nextChange","handleEdit","job","handleAddJob","handleAddAnotherJob","jobsColumns","currentComp","jsxs","Fragment","flsaStatus","comp","formatDateLongWithYear","VisuallyHidden","jobsDataView","useDataView","items","PencilSvg","TrashCanSvg","HamburgerMenu","PlusCircleIcon","Flex","styles","detail","DataView","EmptyData","PendingChangesReviewModal","change"],"mappings":"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"}

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.js

@@ -11,11 +11,10 @@ import "@gusto/embedded-api/models/errors/unprocessableentityerror";
 import "@gusto/embedded-api/models/errors/httpclienterrors";
 import "../../../../../../shared/constants.js";
 import "../../../../../../contexts/ComponentAdapter/useComponentContext.js";
-import "../../../../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { createCompoundContext as t } from "../../../../../Base/createCompoundContext.js";
-const [a, f] = t("DocumentListContext");
+const [d, a] = t("DocumentListContext");
 export {
-  f as DocumentListProvider,
-  a as useDocumentList
+  a as DocumentListProvider,
+  d as useDocumentList
 };
 //# sourceMappingURL=useDocumentList.js.map

package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDocumentList.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.ts"],"sourcesContent":["import type { Form } from '@gusto/embedded-api/models/components/form'\nimport { createCompoundContext } from '@/components/Base'\n\ntype DocumentListContextType = {\n  employeeForms: Form[]\n  hasSignedAllForms: boolean\n  handleContinue: () => void\n  handleRequestFormToSign: (form: Form) => void\n  documentListError: Error | null\n  formToSign?: Form\n}\n\nconst [useDocumentList, DocumentListProvider] =\n  createCompoundContext<DocumentListContextType>('DocumentListContext')\nexport { useDocumentList, DocumentListProvider }\n"],"names":["useDocumentList","DocumentListProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;;AAYA,MAAM,CAACA,GAAiBC,CAAoB,IAC1CC,EAA+C,qBAAqB;"}
+{"version":3,"file":"useDocumentList.js","sources":["../../../../../../../src/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.ts"],"sourcesContent":["import type { Form } from '@gusto/embedded-api/models/components/form'\nimport { createCompoundContext } from '@/components/Base'\n\ntype DocumentListContextType = {\n  employeeForms: Form[]\n  hasSignedAllForms: boolean\n  handleContinue: () => void\n  handleRequestFormToSign: (form: Form) => void\n  documentListError: Error | null\n  formToSign?: Form\n}\n\nconst [useDocumentList, DocumentListProvider] =\n  createCompoundContext<DocumentListContextType>('DocumentListContext')\nexport { useDocumentList, DocumentListProvider }\n"],"names":["useDocumentList","DocumentListProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;AAYA,MAAM,CAACA,GAAiBC,CAAoB,IAC1CC,EAA+C,qBAAqB;"}

package/dist/components/Employee/PaymentMethod/onboarding/ListView.js

@@ -1,64 +1,64 @@
-import { jsx as e, jsxs as p, Fragment as v } from "react/jsx-runtime";
+import { jsx as e, jsxs as p, Fragment as H } from "react/jsx-runtime";
 import { useTranslation as V } from "react-i18next";
-import { useWatch as R } from "react-hook-form";
+import { useWatch as v } from "react-hook-form";
 import { usePaymentMethodList as U } from "../shared/usePaymentMethodList.js";
 import { usePaymentMethodForm as K } from "../shared/usePaymentMethodForm/usePaymentMethodForm.js";
-import { useDeleteBankAccount as j } from "../shared/useDeleteBankAccount.js";
-import { DeleteBankAccountDialog as I } from "../shared/DeleteBankAccountDialog.js";
-import { useOnboardingBankFormDictionary as W } from "./useFormDictionary.js";
+import { useDeleteBankAccount as R } from "../shared/useDeleteBankAccount.js";
+import { DeleteBankAccountDialog as j } from "../shared/DeleteBankAccountDialog.js";
+import { useOnboardingBankFormDictionary as I } from "./useFormDictionary.js";
 import y from "./ListView.module.scss.js";
-import { Flex as G } from "../../../Common/Flex/Flex.js";
-import { ActionsLayout as b } from "../../../Common/ActionsLayout/ActionsLayout.js";
+import { Flex as W } from "../../../Common/Flex/Flex.js";
+import { ActionsLayout as C } from "../../../Common/ActionsLayout/ActionsLayout.js";
 import { HamburgerMenu as q } from "../../../Common/HamburgerMenu/HamburgerMenu.js";
 import { BaseLayout as k } from "../../../Base/Base.js";
 import { SDKFormProvider as z } from "../../../../partner-hook-utils/form/SDKFormProvider.js";
-import { composeErrorHandler as J } from "../../../../partner-hook-utils/composeErrorHandler.js";
-import { useComponentContext as Q } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { centsToDollars as X } from "../../../../helpers/currencyHelpers.js";
-import Z from "../../../../hooks/useNumberFormatter.js";
-import { componentEvents as l, SPLIT_BY as $, PAYMENT_METHODS as u } from "../../../../shared/constants.js";
-import tt from "../../../../assets/icons/trashcan.svg.js";
-import { BankFormBody as et } from "../shared/BankFormBody/BankFormBody.js";
-import { useDataView as ot } from "../../../Common/DataView/useDataView.js";
-import { DataView as nt } from "../../../Common/DataView/DataView.js";
-function Nt({ employeeId: m, isAdmin: f, onEvent: i, LoaderComponent: s }) {
-  const n = U({ employeeId: m }), d = K({ employeeId: m }), D = J([n, d]);
-  return n.isLoading || d.isLoading ? /* @__PURE__ */ e(k, { isLoading: !0, error: D.errors, LoaderComponent: s }) : /* @__PURE__ */ e(
-    it,
+import { composeErrorHandler as G } from "../../../../partner-hook-utils/composeErrorHandler.js";
+import { useComponentContext as J } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { centsToDollars as Q } from "../../../../helpers/currencyHelpers.js";
+import X from "../../../../hooks/useNumberFormatter.js";
+import { componentEvents as a, SPLIT_BY as Z, PAYMENT_METHODS as l } from "../../../../shared/constants.js";
+import $ from "../../../../assets/icons/trashcan.svg.js";
+import { BankFormBody as tt } from "../shared/BankFormBody/BankFormBody.js";
+import { useDataView as et } from "../../../Common/DataView/useDataView.js";
+import { DataView as ot } from "../../../Common/DataView/DataView.js";
+function Pt({ employeeId: u, isAdmin: f, onEvent: i, LoaderComponent: r }) {
+  const n = U({ employeeId: u }), m = K({ employeeId: u }), D = G([n, m]);
+  return n.isLoading || m.isLoading ? /* @__PURE__ */ e(k, { isLoading: !0, error: D.errors, LoaderComponent: r }) : /* @__PURE__ */ e(
+    nt,
     {
-      employeeId: m,
+      employeeId: u,
       isAdmin: f,
       onEvent: i,
       paymentMethodList: n,
-      paymentMethodForm: d,
+      paymentMethodForm: m,
       errorHandling: D,
-      LoaderComponent: s
+      LoaderComponent: r
     }
   );
 }
-function it({
-  employeeId: m,
+function nt({
+  employeeId: u,
   isAdmin: f,
   onEvent: i,
-  paymentMethodList: s,
+  paymentMethodList: r,
   paymentMethodForm: n,
-  errorHandling: d,
+  errorHandling: m,
   LoaderComponent: D
 }) {
-  const { paymentMethod: A, bankAccounts: a } = s.data, { deletePendingBankAccountUuid: B } = s.status, { t } = V("Employee.PaymentMethod"), c = Q(), L = Z(A.splitBy === "Amount" ? "currency" : "percent"), T = W(), { Fields: P } = n.form, h = R({
+  const { paymentMethod: A, bankAccounts: c } = r.data, { deletePendingBankAccountUuid: B } = r.status, { t } = V("Employee.PaymentMethod"), s = J(), L = X(A.splitBy === "Amount" ? "currency" : "percent"), T = I(), { Fields: P } = n.form, h = v({
     control: n.form.hookFormInternals.formMethods.control,
     name: "type"
   }), {
     pendingDeleteAccount: g,
     setPendingDeleteAccount: E,
-    deletedAccountNumber: C,
+    deletedAccountNumber: b,
     setDeletedAccountNumber: N,
     handleConfirmDelete: _
-  } = j(async (o) => {
-    const r = await s.actions.onDelete(o);
-    r && i(l.EMPLOYEE_BANK_ACCOUNT_DELETED, r.data);
-  }), { ...M } = ot({
-    data: a,
+  } = R(async (o) => {
+    const d = await r.actions.onDelete(o);
+    d && i(a.EMPLOYEE_BANK_ACCOUNT_DELETED, d.data);
+  }), { ...M } = et({
+    data: c,
     columns: [
       { key: "name", title: t("nicknameColumn") },
       { key: "routingNumber", title: t("routingNumberColumn") },
@@ -68,8 +68,8 @@ function it({
         title: t("allocationColumn"),
         justify: "end",
         render: (o) => {
-          const r = A.splits?.find((H) => H.uuid === o.uuid)?.splitAmount ?? 0, x = A.splitBy === $.amount ? X(r) ?? 0 : r;
-          return L(x);
+          const d = A.splits?.find((x) => x.uuid === o.uuid)?.splitAmount ?? 0, F = A.splitBy === Z.amount ? Q(d) ?? 0 : d;
+          return L(F);
         }
       }
     ],
@@ -85,66 +85,57 @@ function it({
                 hiddenAccountNumber: o.hiddenAccountNumber
               });
             },
-            icon: /* @__PURE__ */ e(tt, { "aria-hidden": !0 })
+            icon: /* @__PURE__ */ e($, { "aria-hidden": !0 })
           }
         ],
         triggerLabel: t("hamburgerTitle")
       }
     )
-  }), O = (o) => /* @__PURE__ */ e(
-    c.RadioGroup,
-    {
-      ...o,
-      options: o.options.map((r) => ({
-        ...r,
-        description: r.value === u.directDeposit ? t(f ? "directDepositDescription" : "directDepositDescriptionSelf") : t(f ? "checkDescription" : "checkDescriptionSelf")
-      }))
-    }
-  ), w = async () => {
+  }), O = async () => {
     const o = await n.actions.onSubmit();
-    o && (i(l.EMPLOYEE_PAYMENT_METHOD_UPDATED, o.data), i(l.EMPLOYEE_PAYMENT_METHOD_DONE));
-  }, F = h === u.directDeposit && a.length === 0, S = h === u.check || a.length > 0, Y = h === u.directDeposit && a.length > 0 ? /* @__PURE__ */ p(b, { children: [
-    a.length > 1 && /* @__PURE__ */ e(
-      c.Button,
+    o && (i(a.EMPLOYEE_PAYMENT_METHOD_UPDATED, o.data), i(a.EMPLOYEE_PAYMENT_METHOD_DONE));
+  }, w = h === l.directDeposit && c.length === 0, S = h === l.check || c.length > 0, Y = h === l.directDeposit && c.length > 0 ? /* @__PURE__ */ p(C, { children: [
+    c.length > 1 && /* @__PURE__ */ e(
+      s.Button,
       {
         variant: "secondary",
         type: "button",
         onClick: () => {
-          i(l.EMPLOYEE_SPLIT_PAYMENT);
+          i(a.EMPLOYEE_SPLIT_PAYMENT);
         },
         children: t("splitCta")
       }
     ),
     /* @__PURE__ */ e(
-      c.Button,
+      s.Button,
       {
         variant: "secondary",
         type: "button",
         onClick: () => {
-          i(l.EMPLOYEE_BANK_ACCOUNT_CREATE);
+          i(a.EMPLOYEE_BANK_ACCOUNT_CREATE);
         },
         children: t("addAnotherCta")
       }
     )
   ] }) : void 0;
-  return /* @__PURE__ */ p(v, { children: [
-    /* @__PURE__ */ e(k, { error: d.errors, LoaderComponent: D, children: /* @__PURE__ */ p(z, { formHookResult: n, children: [
-      C !== null && /* @__PURE__ */ e(
-        c.Alert,
+  return /* @__PURE__ */ p(H, { children: [
+    /* @__PURE__ */ e(k, { error: m.errors, LoaderComponent: D, children: /* @__PURE__ */ p(z, { formHookResult: n, children: [
+      b !== null && /* @__PURE__ */ e(
+        s.Alert,
         {
           status: "success",
-          label: t("deleteBankAccountSuccessAlert", { account: C }),
+          label: t("deleteBankAccountSuccessAlert", { account: b }),
           onDismiss: () => {
             N(null);
           },
           disableScrollIntoView: !0
         }
       ),
-      /* @__PURE__ */ p(G, { flexDirection: "column", gap: 20, children: [
+      /* @__PURE__ */ p(W, { flexDirection: "column", gap: 20, children: [
         /* @__PURE__ */ p(
-          c.FormBox,
+          s.FormBox,
           {
-            header: /* @__PURE__ */ e(c.FormBoxHeader, { title: t("title") }),
+            header: /* @__PURE__ */ e(s.FormBoxHeader, { title: t("title") }),
             withPadding: !1,
             footer: Y,
             children: [
@@ -152,31 +143,31 @@ function it({
                 P.Type,
                 {
                   label: t("paymentFieldsetLegend"),
-                  getOptionLabel: (o) => o === u.directDeposit ? t("directDepositLabel") : t("checkLabel"),
-                  FieldComponent: O
+                  getOptionLabel: (o) => o === l.directDeposit ? t("directDepositLabel") : t("checkLabel"),
+                  getOptionDescription: (o) => o === l.directDeposit ? t(f ? "directDepositDescription" : "directDepositDescriptionSelf") : t(f ? "checkDescription" : "checkDescriptionSelf")
                 }
               ) }),
-              h === u.directDeposit && a.length > 0 && /* @__PURE__ */ e(nt, { isWithinBox: !0, label: t("bankAccountsListLabel"), ...M }),
-              F && /* @__PURE__ */ e("div", { className: y.section, children: /* @__PURE__ */ e(
-                et,
+              h === l.directDeposit && c.length > 0 && /* @__PURE__ */ e(ot, { isWithinBox: !0, label: t("bankAccountsListLabel"), ...M }),
+              w && /* @__PURE__ */ e("div", { className: y.section, children: /* @__PURE__ */ e(
+                tt,
                 {
-                  employeeId: m,
+                  employeeId: u,
                   dictionary: T,
                   onSaved: (o) => {
-                    i(l.EMPLOYEE_BANK_ACCOUNT_CREATED, o);
+                    i(a.EMPLOYEE_BANK_ACCOUNT_CREATED, o);
                   }
                 }
               ) })
             ]
           }
         ),
-        S && /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e(
-          c.Button,
+        S && /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(
+          s.Button,
           {
             type: "button",
             isLoading: n.status.isPending,
             onClick: () => {
-              w();
+              O();
             },
             children: t("submitCta")
           }
@@ -184,7 +175,7 @@ function it({
       ] })
     ] }) }),
     /* @__PURE__ */ e(
-      I,
+      j,
       {
         pendingDeleteAccount: g,
         isPrimaryActionLoading: B === g?.uuid,
@@ -205,6 +196,6 @@ function it({
   ] });
 }
 export {
-  Nt as ListView
+  Pt as ListView
 };
 //# sourceMappingURL=ListView.js.map

package/dist/components/Employee/PaymentMethod/onboarding/ListView.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListView.js","sources":["../../../../../src/components/Employee/PaymentMethod/onboarding/ListView.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useWatch } from 'react-hook-form'\nimport {\n  usePaymentMethodList,\n  type UsePaymentMethodListReady,\n} from '../shared/usePaymentMethodList'\nimport {\n  usePaymentMethodForm,\n  type PaymentMethodType,\n  type UsePaymentMethodFormReady,\n} from '../shared/usePaymentMethodForm'\nimport { useDeleteBankAccount } from '../shared/useDeleteBankAccount'\nimport { DeleteBankAccountDialog } from '../shared/DeleteBankAccountDialog'\nimport { BankFormBody } from '../shared/BankFormBody'\nimport { useOnboardingBankFormDictionary } from './useFormDictionary'\nimport styles from './ListView.module.scss'\nimport { ActionsLayout, DataView, useDataView } from '@/components/Common'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { BaseLayout } from '@/components/Base/Base'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { centsToDollars } from '@/helpers/currencyHelpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { componentEvents, PAYMENT_METHODS, SPLIT_BY, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport type { RadioGroupProps } from '@/components/Common/UI/RadioGroup/RadioGroupTypes'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport { Flex } from '@/components/Common/Flex/Flex'\n\ninterface ListViewProps {\n  employeeId: string\n  isAdmin: boolean\n  onEvent: OnEventType<EventType, unknown>\n  LoaderComponent?: LoaderComponentType\n}\n\n/** @internal */\nexport function ListView({ employeeId, isAdmin, onEvent, LoaderComponent }: ListViewProps) {\n  const paymentMethodList = usePaymentMethodList({ employeeId })\n  const paymentMethodForm = usePaymentMethodForm({ employeeId })\n\n  const errorHandling = composeErrorHandler([paymentMethodList, paymentMethodForm])\n\n  if (paymentMethodList.isLoading || paymentMethodForm.isLoading) {\n    return <BaseLayout isLoading error={errorHandling.errors} LoaderComponent={LoaderComponent} />\n  }\n\n  return (\n    <ListViewReady\n      employeeId={employeeId}\n      isAdmin={isAdmin}\n      onEvent={onEvent}\n      paymentMethodList={paymentMethodList}\n      paymentMethodForm={paymentMethodForm}\n      errorHandling={errorHandling}\n      LoaderComponent={LoaderComponent}\n    />\n  )\n}\n\ninterface ListViewReadyProps extends ListViewProps {\n  paymentMethodList: UsePaymentMethodListReady\n  paymentMethodForm: UsePaymentMethodFormReady\n  errorHandling: ReturnType<typeof composeErrorHandler>\n}\n\nfunction ListViewReady({\n  employeeId,\n  isAdmin,\n  onEvent,\n  paymentMethodList,\n  paymentMethodForm,\n  errorHandling,\n  LoaderComponent,\n}: ListViewReadyProps) {\n  const { paymentMethod, bankAccounts } = paymentMethodList.data\n  const { deletePendingBankAccountUuid } = paymentMethodList.status\n  const { t } = useTranslation('Employee.PaymentMethod')\n  const Components = useComponentContext()\n  const format = useNumberFormatter(paymentMethod.splitBy === 'Amount' ? 'currency' : 'percent')\n  const dictionary = useOnboardingBankFormDictionary()\n\n  const { Fields } = paymentMethodForm.form\n  const watchedType = useWatch({\n    control: paymentMethodForm.form.hookFormInternals.formMethods.control,\n    name: 'type',\n  })\n\n  const {\n    pendingDeleteAccount,\n    setPendingDeleteAccount,\n    deletedAccountNumber,\n    setDeletedAccountNumber,\n    handleConfirmDelete,\n  } = useDeleteBankAccount(async uuid => {\n    const result = await paymentMethodList.actions.onDelete(uuid)\n    if (result) {\n      onEvent(componentEvents.EMPLOYEE_BANK_ACCOUNT_DELETED, result.data)\n    }\n  })\n\n  const { ...dataViewProps } = useDataView({\n    data: bankAccounts,\n    columns: [\n      { key: 'name', title: t('nicknameColumn') },\n      { key: 'routingNumber', title: t('routingNumberColumn') },\n      { key: 'accountType', title: t('accountTypeColumn') },\n      {\n        key: 'splitAmount',\n        title: t('allocationColumn'),\n        justify: 'end',\n        render: bankAccount => {\n          const splitAmount =\n            paymentMethod.splits?.find(split => split.uuid === bankAccount.uuid)?.splitAmount ?? 0\n          const displayValue =\n            paymentMethod.splitBy === SPLIT_BY.amount\n              ? (centsToDollars(splitAmount) ?? 0)\n              : splitAmount\n          return format(displayValue)\n        },\n      },\n    ],\n    itemMenu: bankAccount => (\n      <HamburgerMenu\n        items={[\n          {\n            label: t('deleteBankAccountCta'),\n            onClick: () => {\n              setPendingDeleteAccount({\n                uuid: bankAccount.uuid,\n                hiddenAccountNumber: bankAccount.hiddenAccountNumber,\n              })\n            },\n            icon: <TrashCanSvg aria-hidden />,\n          },\n        ]}\n        triggerLabel={t('hamburgerTitle')}\n      />\n    ),\n  })\n\n  const TypeFieldComponent = (props: RadioGroupProps) => (\n    <Components.RadioGroup\n      {...props}\n      options={props.options.map(option => ({\n        ...option,\n        description:\n          option.value === PAYMENT_METHODS.directDeposit\n            ? isAdmin\n              ? t('directDepositDescription')\n              : t('directDepositDescriptionSelf')\n            : isAdmin\n              ? t('checkDescription')\n              : t('checkDescriptionSelf'),\n      }))}\n    />\n  )\n\n  const handleContinue = async () => {\n    const result = await paymentMethodForm.actions.onSubmit()\n    if (result) {\n      onEvent(componentEvents.EMPLOYEE_PAYMENT_METHOD_UPDATED, result.data)\n      onEvent(componentEvents.EMPLOYEE_PAYMENT_METHOD_DONE)\n    }\n  }\n\n  const showInlineBankForm =\n    watchedType === PAYMENT_METHODS.directDeposit && bankAccounts.length === 0\n  const showContinue = watchedType === PAYMENT_METHODS.check || bankAccounts.length > 0\n\n  const footer =\n    watchedType === PAYMENT_METHODS.directDeposit && bankAccounts.length > 0 ? (\n      <ActionsLayout>\n        {bankAccounts.length > 1 && (\n          <Components.Button\n            variant=\"secondary\"\n            type=\"button\"\n            onClick={() => {\n              onEvent(componentEvents.EMPLOYEE_SPLIT_PAYMENT)\n            }}\n          >\n            {t('splitCta')}\n          </Components.Button>\n        )}\n        <Components.Button\n          variant=\"secondary\"\n          type=\"button\"\n          onClick={() => {\n            onEvent(componentEvents.EMPLOYEE_BANK_ACCOUNT_CREATE)\n          }}\n        >\n          {t('addAnotherCta')}\n        </Components.Button>\n      </ActionsLayout>\n    ) : undefined\n\n  return (\n    <>\n      <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <SDKFormProvider formHookResult={paymentMethodForm}>\n          {deletedAccountNumber !== null && (\n            <Components.Alert\n              status=\"success\"\n              label={t('deleteBankAccountSuccessAlert', { account: deletedAccountNumber })}\n              onDismiss={() => {\n                setDeletedAccountNumber(null)\n              }}\n              disableScrollIntoView\n            />\n          )}\n          <Flex flexDirection=\"column\" gap={20}>\n            <Components.FormBox\n              header={<Components.FormBoxHeader title={t('title')} />}\n              withPadding={false}\n              footer={footer}\n            >\n              <div className={styles.section}>\n                <Fields.Type\n                  label={t('paymentFieldsetLegend')}\n                  getOptionLabel={(value: PaymentMethodType) =>\n                    value === PAYMENT_METHODS.directDeposit\n                      ? t('directDepositLabel')\n                      : t('checkLabel')\n                  }\n                  FieldComponent={TypeFieldComponent}\n                />\n              </div>\n              {watchedType === PAYMENT_METHODS.directDeposit && bankAccounts.length > 0 && (\n                <DataView isWithinBox label={t('bankAccountsListLabel')} {...dataViewProps} />\n              )}\n              {showInlineBankForm && (\n                <div className={styles.section}>\n                  <BankFormBody\n                    employeeId={employeeId}\n                    dictionary={dictionary}\n                    onSaved={data => {\n                      onEvent(componentEvents.EMPLOYEE_BANK_ACCOUNT_CREATED, data)\n                    }}\n                  />\n                </div>\n              )}\n            </Components.FormBox>\n            {showContinue && (\n              <ActionsLayout>\n                <Components.Button\n                  type=\"button\"\n                  isLoading={paymentMethodForm.status.isPending}\n                  onClick={() => {\n                    void handleContinue()\n                  }}\n                >\n                  {t('submitCta')}\n                </Components.Button>\n              </ActionsLayout>\n            )}\n          </Flex>\n        </SDKFormProvider>\n      </BaseLayout>\n      <DeleteBankAccountDialog\n        pendingDeleteAccount={pendingDeleteAccount}\n        isPrimaryActionLoading={deletePendingBankAccountUuid === pendingDeleteAccount?.uuid}\n        onClose={() => {\n          setPendingDeleteAccount(null)\n        }}\n        onConfirm={() => {\n          void handleConfirmDelete()\n        }}\n        title={t('deleteBankAccountDialog.title')}\n        description={t('deleteBankAccountDialog.description', {\n          account: pendingDeleteAccount?.hiddenAccountNumber ?? '',\n        })}\n        confirmLabel={t('deleteBankAccountDialog.confirmCta')}\n        cancelLabel={t('deleteBankAccountDialog.cancelCta')}\n      />\n    </>\n  )\n}\n"],"names":["ListView","employeeId","isAdmin","onEvent","LoaderComponent","paymentMethodList","usePaymentMethodList","paymentMethodForm","usePaymentMethodForm","errorHandling","composeErrorHandler","BaseLayout","jsx","ListViewReady","paymentMethod","bankAccounts","deletePendingBankAccountUuid","useTranslation","Components","useComponentContext","format","useNumberFormatter","dictionary","useOnboardingBankFormDictionary","Fields","watchedType","useWatch","pendingDeleteAccount","setPendingDeleteAccount","deletedAccountNumber","setDeletedAccountNumber","handleConfirmDelete","useDeleteBankAccount","uuid","result","componentEvents","dataViewProps","useDataView","bankAccount","splitAmount","split","displayValue","SPLIT_BY","centsToDollars","HamburgerMenu","TrashCanSvg","TypeFieldComponent","props","option","PAYMENT_METHODS","handleContinue","showInlineBankForm","showContinue","footer","ActionsLayout","jsxs","Fragment","SDKFormProvider","Flex","styles","value","DataView","BankFormBody","data","DeleteBankAccountDialog"],"mappings":"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"}
+{"version":3,"file":"ListView.js","sources":["../../../../../src/components/Employee/PaymentMethod/onboarding/ListView.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useWatch } from 'react-hook-form'\nimport {\n  usePaymentMethodList,\n  type UsePaymentMethodListReady,\n} from '../shared/usePaymentMethodList'\nimport {\n  usePaymentMethodForm,\n  type PaymentMethodType,\n  type UsePaymentMethodFormReady,\n} from '../shared/usePaymentMethodForm'\nimport { useDeleteBankAccount } from '../shared/useDeleteBankAccount'\nimport { DeleteBankAccountDialog } from '../shared/DeleteBankAccountDialog'\nimport { BankFormBody } from '../shared/BankFormBody'\nimport { useOnboardingBankFormDictionary } from './useFormDictionary'\nimport styles from './ListView.module.scss'\nimport { ActionsLayout, DataView, useDataView } from '@/components/Common'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { BaseLayout } from '@/components/Base/Base'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { centsToDollars } from '@/helpers/currencyHelpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { componentEvents, PAYMENT_METHODS, SPLIT_BY, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport { Flex } from '@/components/Common/Flex/Flex'\n\ninterface ListViewProps {\n  employeeId: string\n  isAdmin: boolean\n  onEvent: OnEventType<EventType, unknown>\n  LoaderComponent?: LoaderComponentType\n}\n\n/** @internal */\nexport function ListView({ employeeId, isAdmin, onEvent, LoaderComponent }: ListViewProps) {\n  const paymentMethodList = usePaymentMethodList({ employeeId })\n  const paymentMethodForm = usePaymentMethodForm({ employeeId })\n\n  const errorHandling = composeErrorHandler([paymentMethodList, paymentMethodForm])\n\n  if (paymentMethodList.isLoading || paymentMethodForm.isLoading) {\n    return <BaseLayout isLoading error={errorHandling.errors} LoaderComponent={LoaderComponent} />\n  }\n\n  return (\n    <ListViewReady\n      employeeId={employeeId}\n      isAdmin={isAdmin}\n      onEvent={onEvent}\n      paymentMethodList={paymentMethodList}\n      paymentMethodForm={paymentMethodForm}\n      errorHandling={errorHandling}\n      LoaderComponent={LoaderComponent}\n    />\n  )\n}\n\ninterface ListViewReadyProps extends ListViewProps {\n  paymentMethodList: UsePaymentMethodListReady\n  paymentMethodForm: UsePaymentMethodFormReady\n  errorHandling: ReturnType<typeof composeErrorHandler>\n}\n\nfunction ListViewReady({\n  employeeId,\n  isAdmin,\n  onEvent,\n  paymentMethodList,\n  paymentMethodForm,\n  errorHandling,\n  LoaderComponent,\n}: ListViewReadyProps) {\n  const { paymentMethod, bankAccounts } = paymentMethodList.data\n  const { deletePendingBankAccountUuid } = paymentMethodList.status\n  const { t } = useTranslation('Employee.PaymentMethod')\n  const Components = useComponentContext()\n  const format = useNumberFormatter(paymentMethod.splitBy === 'Amount' ? 'currency' : 'percent')\n  const dictionary = useOnboardingBankFormDictionary()\n\n  const { Fields } = paymentMethodForm.form\n  const watchedType = useWatch({\n    control: paymentMethodForm.form.hookFormInternals.formMethods.control,\n    name: 'type',\n  })\n\n  const {\n    pendingDeleteAccount,\n    setPendingDeleteAccount,\n    deletedAccountNumber,\n    setDeletedAccountNumber,\n    handleConfirmDelete,\n  } = useDeleteBankAccount(async uuid => {\n    const result = await paymentMethodList.actions.onDelete(uuid)\n    if (result) {\n      onEvent(componentEvents.EMPLOYEE_BANK_ACCOUNT_DELETED, result.data)\n    }\n  })\n\n  const { ...dataViewProps } = useDataView({\n    data: bankAccounts,\n    columns: [\n      { key: 'name', title: t('nicknameColumn') },\n      { key: 'routingNumber', title: t('routingNumberColumn') },\n      { key: 'accountType', title: t('accountTypeColumn') },\n      {\n        key: 'splitAmount',\n        title: t('allocationColumn'),\n        justify: 'end',\n        render: bankAccount => {\n          const splitAmount =\n            paymentMethod.splits?.find(split => split.uuid === bankAccount.uuid)?.splitAmount ?? 0\n          const displayValue =\n            paymentMethod.splitBy === SPLIT_BY.amount\n              ? (centsToDollars(splitAmount) ?? 0)\n              : splitAmount\n          return format(displayValue)\n        },\n      },\n    ],\n    itemMenu: bankAccount => (\n      <HamburgerMenu\n        items={[\n          {\n            label: t('deleteBankAccountCta'),\n            onClick: () => {\n              setPendingDeleteAccount({\n                uuid: bankAccount.uuid,\n                hiddenAccountNumber: bankAccount.hiddenAccountNumber,\n              })\n            },\n            icon: <TrashCanSvg aria-hidden />,\n          },\n        ]}\n        triggerLabel={t('hamburgerTitle')}\n      />\n    ),\n  })\n\n  const handleContinue = async () => {\n    const result = await paymentMethodForm.actions.onSubmit()\n    if (result) {\n      onEvent(componentEvents.EMPLOYEE_PAYMENT_METHOD_UPDATED, result.data)\n      onEvent(componentEvents.EMPLOYEE_PAYMENT_METHOD_DONE)\n    }\n  }\n\n  const showInlineBankForm =\n    watchedType === PAYMENT_METHODS.directDeposit && bankAccounts.length === 0\n  const showContinue = watchedType === PAYMENT_METHODS.check || bankAccounts.length > 0\n\n  const footer =\n    watchedType === PAYMENT_METHODS.directDeposit && bankAccounts.length > 0 ? (\n      <ActionsLayout>\n        {bankAccounts.length > 1 && (\n          <Components.Button\n            variant=\"secondary\"\n            type=\"button\"\n            onClick={() => {\n              onEvent(componentEvents.EMPLOYEE_SPLIT_PAYMENT)\n            }}\n          >\n            {t('splitCta')}\n          </Components.Button>\n        )}\n        <Components.Button\n          variant=\"secondary\"\n          type=\"button\"\n          onClick={() => {\n            onEvent(componentEvents.EMPLOYEE_BANK_ACCOUNT_CREATE)\n          }}\n        >\n          {t('addAnotherCta')}\n        </Components.Button>\n      </ActionsLayout>\n    ) : undefined\n\n  return (\n    <>\n      <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n        <SDKFormProvider formHookResult={paymentMethodForm}>\n          {deletedAccountNumber !== null && (\n            <Components.Alert\n              status=\"success\"\n              label={t('deleteBankAccountSuccessAlert', { account: deletedAccountNumber })}\n              onDismiss={() => {\n                setDeletedAccountNumber(null)\n              }}\n              disableScrollIntoView\n            />\n          )}\n          <Flex flexDirection=\"column\" gap={20}>\n            <Components.FormBox\n              header={<Components.FormBoxHeader title={t('title')} />}\n              withPadding={false}\n              footer={footer}\n            >\n              <div className={styles.section}>\n                <Fields.Type\n                  label={t('paymentFieldsetLegend')}\n                  getOptionLabel={(value: PaymentMethodType) =>\n                    value === PAYMENT_METHODS.directDeposit\n                      ? t('directDepositLabel')\n                      : t('checkLabel')\n                  }\n                  getOptionDescription={(value: PaymentMethodType) =>\n                    value === PAYMENT_METHODS.directDeposit\n                      ? isAdmin\n                        ? t('directDepositDescription')\n                        : t('directDepositDescriptionSelf')\n                      : isAdmin\n                        ? t('checkDescription')\n                        : t('checkDescriptionSelf')\n                  }\n                />\n              </div>\n              {watchedType === PAYMENT_METHODS.directDeposit && bankAccounts.length > 0 && (\n                <DataView isWithinBox label={t('bankAccountsListLabel')} {...dataViewProps} />\n              )}\n              {showInlineBankForm && (\n                <div className={styles.section}>\n                  <BankFormBody\n                    employeeId={employeeId}\n                    dictionary={dictionary}\n                    onSaved={data => {\n                      onEvent(componentEvents.EMPLOYEE_BANK_ACCOUNT_CREATED, data)\n                    }}\n                  />\n                </div>\n              )}\n            </Components.FormBox>\n            {showContinue && (\n              <ActionsLayout>\n                <Components.Button\n                  type=\"button\"\n                  isLoading={paymentMethodForm.status.isPending}\n                  onClick={() => {\n                    void handleContinue()\n                  }}\n                >\n                  {t('submitCta')}\n                </Components.Button>\n              </ActionsLayout>\n            )}\n          </Flex>\n        </SDKFormProvider>\n      </BaseLayout>\n      <DeleteBankAccountDialog\n        pendingDeleteAccount={pendingDeleteAccount}\n        isPrimaryActionLoading={deletePendingBankAccountUuid === pendingDeleteAccount?.uuid}\n        onClose={() => {\n          setPendingDeleteAccount(null)\n        }}\n        onConfirm={() => {\n          void handleConfirmDelete()\n        }}\n        title={t('deleteBankAccountDialog.title')}\n        description={t('deleteBankAccountDialog.description', {\n          account: pendingDeleteAccount?.hiddenAccountNumber ?? '',\n        })}\n        confirmLabel={t('deleteBankAccountDialog.confirmCta')}\n        cancelLabel={t('deleteBankAccountDialog.cancelCta')}\n      />\n    </>\n  )\n}\n"],"names":["ListView","employeeId","isAdmin","onEvent","LoaderComponent","paymentMethodList","usePaymentMethodList","paymentMethodForm","usePaymentMethodForm","errorHandling","composeErrorHandler","BaseLayout","jsx","ListViewReady","paymentMethod","bankAccounts","deletePendingBankAccountUuid","useTranslation","Components","useComponentContext","format","useNumberFormatter","dictionary","useOnboardingBankFormDictionary","Fields","watchedType","useWatch","pendingDeleteAccount","setPendingDeleteAccount","deletedAccountNumber","setDeletedAccountNumber","handleConfirmDelete","useDeleteBankAccount","uuid","result","componentEvents","dataViewProps","useDataView","bankAccount","splitAmount","split","displayValue","SPLIT_BY","centsToDollars","HamburgerMenu","TrashCanSvg","handleContinue","showInlineBankForm","PAYMENT_METHODS","showContinue","footer","ActionsLayout","jsxs","Fragment","SDKFormProvider","Flex","styles","value","DataView","BankFormBody","data","DeleteBankAccountDialog"],"mappings":"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"}

package/dist/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelection.js

@@ -2,20 +2,20 @@ import { jsx as d } from "react/jsx-runtime";
 import { useEffect as O, useMemo as y, useState as b } from "react";
 import { usePaySchedulesGetUnprocessedTerminationPeriodsSuspense as g } from "@gusto/embedded-api/react-query/paySchedulesGetUnprocessedTerminationPeriods";
 import { usePayrollsCreateOffCycleMutation as T } from "@gusto/embedded-api/react-query/payrollsCreateOffCycle";
-import { OffCycleReason as K } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
+import { OffCycleReason as $ } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
 import { RFCDate as D } from "@gusto/embedded-api/types/rfcdate";
-import { useTranslation as L } from "react-i18next";
-import { DismissalPayPeriodSelectionPresentation as M } from "./DismissalPayPeriodSelectionPresentation.js";
-import { BaseComponent as $ } from "../../../Base/Base.js";
+import { useTranslation as K } from "react-i18next";
+import { DismissalPayPeriodSelectionPresentation as L } from "./DismissalPayPeriodSelectionPresentation.js";
+import { BaseComponent as M } from "../../../Base/Base.js";
 import { useBase as q } from "../../../Base/useBase.js";
 import { componentEvents as p } from "../../../../shared/constants.js";
 import { SDKInternalError as u } from "../../../../types/sdkError.js";
 import { useComponentDictionary as x, useI18n as N } from "../../../../i18n/I18n.js";
 import { formatPayPeriodRange as Y } from "../../../../helpers/dateFormatting.js";
 function te(t) {
-  return /* @__PURE__ */ d($, { ...t, children: /* @__PURE__ */ d(j, { ...t }) });
+  return /* @__PURE__ */ d(M, { ...t, children: /* @__PURE__ */ d(j, { ...t }) });
 }
-const S = (t) => `${t.startDate}__${t.endDate}`;
+const S = (t) => `${t.employeeUuid}__${t.startDate}__${t.endDate}`;
 function j({
   companyId: t,
   employeeId: r,
@@ -24,7 +24,7 @@ function j({
   className: C
 }) {
   x("Payroll.Dismissal", E), N("Payroll.Dismissal");
-  const { t: i } = L("Payroll.Dismissal"), { onEvent: l, baseSubmitHandler: w } = q(), { data: f } = g({ companyId: t }), { mutateAsync: U, isPending: v } = T(), h = !!n && !!r;
+  const { t: i } = K("Payroll.Dismissal"), { onEvent: l, baseSubmitHandler: U } = q(), { data: f } = g({ companyId: t }), { mutateAsync: w, isPending: _ } = T(), v = !!n && !!r;
   O(() => {
     n && r && l(p.DISMISSAL_PAY_PERIOD_SELECTED, { payrollUuid: n });
   }, [n, r, l]);
@@ -36,19 +36,19 @@ function j({
       value: S(e),
       label: a
     };
-  }), [m]), B = c.length === 1 ? c[0].value : void 0, [s, R] = b(B), _ = async () => {
-    await w({ selectedPeriodKey: s }, async () => {
+  }), [m]), h = c.length === 1 ? c[0].value : void 0, [s, B] = b(h), R = async () => {
+    await U({ selectedPeriodKey: s }, async () => {
       if (s === void 0)
         throw new u(i("errors.noPayPeriodSelected"));
       const e = m.find((A) => S(A) === s);
       if (!e)
         throw new u(i("errors.invalidPayPeriod"));
-      const o = r ?? e.employeeUuid, a = await U({
+      const o = r ?? e.employeeUuid, a = await w({
         request: {
           companyId: t,
           requestBody: {
             offCycle: !0,
-            offCycleReason: K.DismissedEmployee,
+            offCycleReason: $.DismissedEmployee,
             startDate: new D(e.startDate),
             endDate: new D(e.endDate),
             employeeUuids: [o]
@@ -60,14 +60,14 @@ function j({
       l(p.DISMISSAL_PAY_PERIOD_SELECTED, { payrollUuid: P });
     });
   };
-  return h ? null : /* @__PURE__ */ d(
-    M,
+  return v ? null : /* @__PURE__ */ d(
+    L,
     {
       payPeriodOptions: c,
       selectedPeriodKey: s,
-      onSelectPeriod: R,
-      onSubmit: _,
-      isPending: v,
+      onSelectPeriod: B,
+      onSubmit: R,
+      isPending: _,
       className: C
     }
   );