@gusto/embedded-react-sdk 0.55.7 → 0.56.0

package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayrollOverviewPresentation.js","sources":["../../../../src/components/Payroll/PayrollOverview/PayrollOverviewPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport type {\n  EmployeeCompensations,\n  PayrollShow,\n} from '@gusto/embedded-api/models/components/payrollshow'\nimport type { PayrollPayPeriodType } from '@gusto/embedded-api/models/components/payrollpayperiodtype'\nimport type { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount'\nimport { useState, useRef } from 'react'\nimport type {\n  PayrollSubmissionBlockerType,\n  UnblockOptions,\n} from '@gusto/embedded-api/models/components/payrollsubmissionblockertype'\nimport type { PaymentSpeed } from '@gusto/embedded-api/models/components/paymentconfigs'\nimport type { PayrollFlowAlert } from '../PayrollFlow/PayrollFlowComponents'\nimport {\n  calculateTotalPayroll,\n  getPayrollTypeLabel,\n  getReimbursements,\n  isDismissalPayroll,\n} from '../helpers'\nimport { PayrollOverviewStatus } from './PayrollOverviewTypes'\nimport { FastAchSubmissionBlockerBanner, GenericBlocker } from './SubmissionBlockers'\nimport styles from './PayrollOverviewPresentation.module.scss'\nimport { DataView, Flex, Grid, PayrollLoading } from '@/components/Common'\nimport { useContainerBreakpoints } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { firstLastName } from '@/helpers/formattedStrings'\nimport {\n  compensationTypeLabels,\n  FlsaStatus,\n  PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES,\n} from '@/shared/constants'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\nimport DownloadIcon from '@/assets/icons/download-cloud.svg?react'\n\ninterface PayrollOverviewProps {\n  payrollData: PayrollShow\n  employeeFlsaStatusByUuid?: Record<string, string | undefined>\n  bankAccount?: CompanyBankAccount\n  taxes: Record<string, { employee: number; employer: number }>\n  status?: PayrollOverviewStatus\n  isProcessed: boolean\n  canCancel?: boolean\n  canEdit?: boolean\n  alerts?: PayrollFlowAlert[]\n  submissionBlockers?: PayrollSubmissionBlockerType[]\n  selectedUnblockOptions?: Record<string, string>\n  wireInConfirmationRequest?: React.ReactNode\n  printChecksBanner?: React.ReactNode\n  pagination?: PaginationControlProps\n  onEdit: () => void\n  onSubmit: () => void\n  onCancel: () => void\n  onPayrollReceipt: () => void\n  onPaystubDownload: (employeeId: string) => void\n  onUnblockOptionChange?: (blockerType: string, value: string) => void\n  withReimbursements?: boolean\n  paymentSpeed?: PaymentSpeed\n  downloadingEmployeeIds?: ReadonlySet<string>\n}\n\nconst getPayrollOverviewTitle = (\n  payPeriod: PayrollPayPeriodType | undefined,\n  dateFormatter: ReturnType<typeof useDateFormatter>,\n) => {\n  if (payPeriod?.startDate && payPeriod.endDate) {\n    return dateFormatter.formatPayPeriod(payPeriod.startDate, payPeriod.endDate)\n  }\n  return { startDate: '', endDate: '' }\n}\n\n/** @internal */\nexport const PayrollOverviewPresentation = ({\n  onEdit,\n  onSubmit,\n  onCancel,\n  onPayrollReceipt,\n  onPaystubDownload,\n  payrollData,\n  employeeFlsaStatusByUuid = {},\n  bankAccount,\n  taxes,\n  status = PayrollOverviewStatus.Viewing,\n  isProcessed,\n  canCancel = false,\n  canEdit = true,\n  alerts = [],\n  submissionBlockers = [],\n  selectedUnblockOptions = {},\n  onUnblockOptionChange,\n  wireInConfirmationRequest,\n  printChecksBanner,\n  withReimbursements = true,\n  paymentSpeed,\n  pagination,\n  downloadingEmployeeIds = new Set<string>(),\n}: PayrollOverviewProps) => {\n  const { Alert, Badge, Button, ButtonIcon, Dialog, Heading, Text, Tabs } = useComponentContext()\n  useI18n('Payroll.PayrollOverview')\n  const dateFormatter = useDateFormatter()\n  const { t } = useTranslation('Payroll.PayrollOverview')\n  const formatCurrency = useNumberFormatter('currency')\n  const [selectedTab, setSelectedTab] = useState('companyPays')\n  const [isCancelDialogOpen, setIsCancelDialogOpen] = useState(false)\n  const containerRef = useRef<HTMLDivElement>(null)\n  const breakpoints = useContainerBreakpoints({ ref: containerRef })\n  const isDesktop = breakpoints.includes('small')\n\n  const isLoading =\n    status === PayrollOverviewStatus.Submitting || status === PayrollOverviewStatus.Cancelling\n\n  const pageHeading = (\n    <Heading as=\"h1\">{isProcessed ? t('summaryTitle') : t('overviewTitle')}</Heading>\n  )\n  const isDismissal = isDismissalPayroll(payrollData.offCycleReason)\n\n  // formatWithTime returns { time, date }, and the cancel dialog used to interpolate only\n  // `time` -- so it read \"Run this payroll by 4:00 PM PDT\" with no date at all (SDK-1286).\n  // Rendered as \"<time> on <date>\" to match how PayrollHistory shows the same deadline.\n  const cancelDeadline = (() => {\n    const { time, date } = dateFormatter.formatWithTime(payrollData.payrollDeadline)\n    return date ? `${time} on ${date}` : time\n  })()\n\n  const pageSubtitle = (\n    <Text>\n      <Trans\n        i18nKey={isDismissal ? 'pageSubtitleDismissal' : 'pageSubtitle'}\n        t={t}\n        components={{ dateWrapper: <Text weight=\"bold\" as=\"span\" /> }}\n        values={{\n          ...getPayrollOverviewTitle(payrollData.payPeriod, dateFormatter),\n          payrollType: getPayrollTypeLabel(payrollData),\n        }}\n      />\n    </Text>\n  )\n\n  if (status === PayrollOverviewStatus.Cancelled) {\n    return (\n      <div ref={containerRef} className={styles.container}>\n        <Flex flexDirection=\"column\" alignItems=\"stretch\">\n          <Flex justifyContent=\"space-between\" alignItems=\"flex-start\" gap={16}>\n            <Flex flexDirection=\"column\" gap={4}>\n              {pageHeading}\n              {pageSubtitle}\n            </Flex>\n          </Flex>\n          <Alert status=\"info\" label={t('cancelledEmptyState')} />\n        </Flex>\n      </div>\n    )\n  }\n\n  const totalPayroll = calculateTotalPayroll(payrollData)\n\n  const expectedDebitDate =\n    payrollData.payrollStatusMeta?.expectedDebitTime ?? payrollData.payrollDeadline\n\n  const getCompanyTaxes = (employeeCompensation: EmployeeCompensations) => {\n    return (\n      employeeCompensation.taxes?.reduce(\n        (acc, tax) => (tax.employer ? acc + Number(tax.amount) : acc),\n        0,\n      ) ?? 0\n    )\n  }\n  const getCompanyBenefits = (employeeCompensation: EmployeeCompensations) => {\n    return (\n      employeeCompensation.benefits?.reduce(\n        (acc, benefit) =>\n          benefit.companyContribution ? acc + Number(benefit.companyContribution) : acc,\n        0,\n      ) ?? 0\n    )\n  }\n  const getCompanyCost = (employeeCompensation: EmployeeCompensations) => {\n    return (\n      Number(employeeCompensation.grossPay!) +\n      getReimbursements(employeeCompensation) +\n      getCompanyTaxes(employeeCompensation) +\n      getCompanyBenefits(employeeCompensation)\n    )\n  }\n\n  const fastAchBlocker = submissionBlockers.find(\n    blocker =>\n      blocker.blockerType === 'fast_ach_threshold_exceeded' ||\n      blocker.blockerType === 'needs_earned_access_for_fast_ach',\n  )\n  const selectedUnblockType = fastAchBlocker\n    ? selectedUnblockOptions[fastAchBlocker.blockerType || '']\n    : undefined\n  const selectedUnblockOption = fastAchBlocker?.unblockOptions?.find(\n    (option: UnblockOptions) => option.unblockType === selectedUnblockType,\n  )\n\n  const isWireFunds = selectedUnblockType === 'wire_in'\n  const isFourDayDirectDeposit = selectedUnblockType === 'move_to_four_day'\n\n  const getEmployeeHours = (\n    employeeCompensations: EmployeeCompensations,\n  ): Record<string, number> => {\n    return (\n      employeeCompensations.hourlyCompensations?.reduce(\n        (acc, hourlyCompensation) => {\n          if (typeof hourlyCompensation.name === 'undefined') {\n            return acc\n          }\n          const name = hourlyCompensation.name.toLowerCase()\n          const currentHours = acc[name] ?? 0\n          acc[name] = currentHours + Number(hourlyCompensation.hours || 0)\n          return acc\n        },\n        {} as Record<string, number>,\n      ) || {}\n    )\n  }\n  const getEmployeePtoHours = (employeeCompensations: EmployeeCompensations) => {\n    return (\n      employeeCompensations.paidTimeOff?.reduce((acc, paidTimeOff) => {\n        return acc + Number(paidTimeOff.hours || 0)\n      }, 0) ?? 0\n    )\n  }\n\n  const companyPaysColumns: Array<{\n    key: string\n    title: string\n    justify?: 'start' | 'end'\n    render: (item: EmployeeCompensations) => React.ReactNode\n  }> = [\n    {\n      key: 'employeeName',\n      title: t('tableHeaders.employees'),\n      render: (employeeCompensations: EmployeeCompensations) => (\n        <Flex flexDirection=\"column\" gap={0}>\n          {firstLastName({\n            first_name: employeeCompensations.firstName,\n            last_name: employeeCompensations.lastName,\n          })}\n          {employeeCompensations.excluded && <Badge status=\"warning\">{t('skippedBadge')}</Badge>}\n        </Flex>\n      ),\n    },\n    {\n      key: 'grossPay',\n      title: t('tableHeaders.grossPay'),\n      justify: 'end',\n      render: (employeeCompensations: EmployeeCompensations) =>\n        formatCurrency(Number(employeeCompensations.grossPay!)),\n    },\n    ...(withReimbursements\n      ? [\n          {\n            key: 'reimbursements',\n            title: t('tableHeaders.reimbursements'),\n            justify: 'end' as const,\n            render: (employeeCompensation: EmployeeCompensations) =>\n              formatCurrency(getReimbursements(employeeCompensation)),\n          },\n        ]\n      : []),\n    {\n      key: 'companyTaxes',\n      title: t('tableHeaders.companyTaxes'),\n      justify: 'end',\n      render: (employeeCompensation: EmployeeCompensations) =>\n        formatCurrency(getCompanyTaxes(employeeCompensation)),\n    },\n    {\n      key: 'companyBenefits',\n      title: t('tableHeaders.companyBenefits'),\n      justify: 'end',\n      render: (employeeCompensation: EmployeeCompensations) =>\n        formatCurrency(getCompanyBenefits(employeeCompensation)),\n    },\n    {\n      key: 'companyPays',\n      title: t('tableHeaders.companyPays'),\n      justify: 'end',\n      render: (employeeCompensation: EmployeeCompensations) =>\n        formatCurrency(getCompanyCost(employeeCompensation)),\n    },\n  ]\n  if (isProcessed && isDesktop) {\n    companyPaysColumns.push({\n      key: 'paystubs',\n      title: t('tableHeaders.paystub'),\n      render: (employeeCompensations: EmployeeCompensations) => {\n        const isDownloading =\n          !!employeeCompensations.employeeUuid &&\n          downloadingEmployeeIds.has(employeeCompensations.employeeUuid)\n        return (\n          <Flex justifyContent=\"flex-end\">\n            <ButtonIcon\n              aria-label={t('downloadPaystubLabel')}\n              variant=\"tertiary\"\n              isLoading={isDownloading}\n              onClick={() => {\n                if (employeeCompensations.employeeUuid) {\n                  onPaystubDownload(employeeCompensations.employeeUuid)\n                }\n              }}\n            >\n              <DownloadIcon />\n            </ButtonIcon>\n          </Flex>\n        )\n      },\n    })\n  }\n  const tabs = [\n    {\n      id: 'companyPays',\n      label: t('dataViews.companyPaysTab'),\n      content: (\n        <DataView\n          label={t('dataViews.companyPaysTable')}\n          columns={companyPaysColumns}\n          data={payrollData.employeeCompensations!}\n          pagination={pagination}\n          itemMenu={\n            isProcessed && !isDesktop\n              ? (employeeCompensations: EmployeeCompensations) => {\n                  const isDownloading =\n                    !!employeeCompensations.employeeUuid &&\n                    downloadingEmployeeIds.has(employeeCompensations.employeeUuid)\n                  return (\n                    <ButtonIcon\n                      aria-label={t('downloadPaystubLabel')}\n                      variant=\"tertiary\"\n                      isLoading={isDownloading}\n                      onClick={() => {\n                        if (employeeCompensations.employeeUuid) {\n                          onPaystubDownload(employeeCompensations.employeeUuid)\n                        }\n                      }}\n                    >\n                      <DownloadIcon />\n                    </ButtonIcon>\n                  )\n                }\n              : undefined\n          }\n          footer={() => ({\n            employeeName: (\n              <>\n                {t('tableHeaders.footerTotalsLabel')}\n                <Text variant=\"supporting\" size=\"sm\">\n                  {t('tableHeaders.footerTotalsDescription')}\n                </Text>\n              </>\n            ),\n            grossPay: formatCurrency(Number(payrollData.totals?.grossPay ?? 0)),\n            ...(withReimbursements\n              ? {\n                  reimbursements: formatCurrency(Number(payrollData.totals?.reimbursements ?? 0)),\n                }\n              : {}),\n            companyTaxes: formatCurrency(Number(payrollData.totals?.employerTaxes ?? 0)),\n            companyBenefits: formatCurrency(Number(payrollData.totals?.benefits ?? 0)),\n            companyPays: formatCurrency(totalPayroll),\n          })}\n        />\n      ),\n    },\n    {\n      id: 'hoursWorked',\n      label: t('dataViews.hoursWorkedTab'),\n      content: (\n        <DataView\n          label={t('dataViews.hoursWorkedTable')}\n          columns={[\n            {\n              title: t('tableHeaders.employees'),\n              render: (employeeCompensations: EmployeeCompensations) => (\n                <Flex flexDirection=\"column\" gap={0}>\n                  {firstLastName({\n                    first_name: employeeCompensations.firstName,\n                    last_name: employeeCompensations.lastName,\n                  })}\n                  {employeeCompensations.excluded && (\n                    <Badge status=\"warning\">{t('skippedBadge')}</Badge>\n                  )}\n                </Flex>\n              ),\n            },\n            {\n              title: t('tableHeaders.compensationType'),\n              render: (employeeCompensations: EmployeeCompensations) => {\n                const flsaStatus = employeeCompensations.employeeUuid\n                  ? employeeFlsaStatusByUuid[employeeCompensations.employeeUuid]\n                  : undefined\n\n                switch (flsaStatus) {\n                  case FlsaStatus.EXEMPT:\n                    return t('compensationTypeLabels.exempt')\n                  case FlsaStatus.NONEXEMPT:\n                    return t('compensationTypeLabels.nonexempt')\n                  default:\n                    return flsaStatus ?? ''\n                }\n              },\n            },\n            {\n              title: t('tableHeaders.regular'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeeHours(employeeCompensations)[\n                  compensationTypeLabels.REGULAR_HOURS_NAME\n                ] || 0,\n            },\n            {\n              title: t('tableHeaders.overtime'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeeHours(employeeCompensations)[compensationTypeLabels.OVERTIME_NAME] || 0,\n            },\n            {\n              title: t('tableHeaders.doubleOT'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeeHours(employeeCompensations)[\n                  compensationTypeLabels.DOUBLE_OVERTIME_NAME\n                ] || 0,\n            },\n            {\n              title: t('tableHeaders.timeOff'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeePtoHours(employeeCompensations),\n            },\n            {\n              title: t('tableHeaders.totalHours'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                Object.values(getEmployeeHours(employeeCompensations)).reduce(\n                  (acc, hours) => acc + hours,\n                  0,\n                ) + getEmployeePtoHours(employeeCompensations),\n            },\n          ]}\n          data={payrollData.employeeCompensations!}\n          pagination={pagination}\n        />\n      ),\n    },\n    {\n      id: 'employeeTakeHome',\n      label: t('dataViews.employeeTakeHomeTab'),\n      content: (\n        <DataView\n          label={t('dataViews.employeeTakeHomeTable')}\n          columns={[\n            {\n              title: t('tableHeaders.employees'),\n              render: (employeeCompensations: EmployeeCompensations) => (\n                <Flex flexDirection=\"column\" gap={0}>\n                  {firstLastName({\n                    first_name: employeeCompensations.firstName,\n                    last_name: employeeCompensations.lastName,\n                  })}\n                  {employeeCompensations.excluded && (\n                    <Badge status=\"warning\">{t('skippedBadge')}</Badge>\n                  )}\n                </Flex>\n              ),\n            },\n            {\n              title: t('tableHeaders.paymentType'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                employeeCompensations.paymentMethod ?? '',\n            },\n            {\n              title: t('tableHeaders.grossPay'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(Number(employeeCompensations.grossPay ?? 0)),\n            },\n            {\n              title: t('tableHeaders.deductions'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  employeeCompensations.deductions?.reduce(\n                    (acc, deduction) => acc + Number(deduction.amount),\n                    0,\n                  ) ?? 0,\n                ),\n            },\n            ...(withReimbursements\n              ? [\n                  {\n                    title: t('tableHeaders.reimbursements'),\n                    render: (employeeCompensations: EmployeeCompensations) =>\n                      formatCurrency(getReimbursements(employeeCompensations)),\n                  },\n                ]\n              : []),\n            {\n              title: t('tableHeaders.employeeTaxes'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  employeeCompensations.taxes?.reduce(\n                    (acc, tax) => (tax.employer ? acc : acc + Number(tax.amount)),\n                    0,\n                  ) ?? 0,\n                ),\n            },\n            {\n              title: t('tableHeaders.employeeBenefits'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  employeeCompensations.benefits?.reduce(\n                    (acc, benefit) => acc + Number(benefit.employeeDeduction ?? 0),\n                    0,\n                  ) ?? 0,\n                ),\n            },\n            {\n              title: t('tableHeaders.payment'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  Number(employeeCompensations.netPay ?? 0) +\n                    getReimbursements(employeeCompensations),\n                ),\n            },\n          ]}\n          data={payrollData.employeeCompensations!}\n          pagination={pagination}\n        />\n      ),\n    },\n    {\n      id: 'taxes',\n      label: t('dataViews.taxesTab'),\n      content: (\n        <Flex flexDirection=\"column\" gap={32}>\n          <DataView\n            label={t('dataViews.taxesTable')}\n            columns={[\n              {\n                key: 'taxDescription',\n                title: t('tableHeaders.taxDescription'),\n                render: taxKey => taxKey,\n              },\n              {\n                key: 'byYourEmployees',\n                title: t('tableHeaders.byYourEmployees'),\n                render: taxKey => formatCurrency(taxes[taxKey]?.employee ?? 0),\n              },\n              {\n                key: 'byYourCompany',\n                title: t('tableHeaders.byYourCompany'),\n                render: taxKey => formatCurrency(taxes[taxKey]?.employer ?? 0),\n              },\n            ]}\n            footer={() => ({\n              taxDescription: (\n                <Text weight=\"semibold\" size=\"sm\">\n                  {t('totalsLabel')}\n                </Text>\n              ),\n              byYourEmployees: formatCurrency(Number(payrollData.totals?.employeeTaxes ?? 0)),\n              byYourCompany: formatCurrency(Number(payrollData.totals?.employerTaxes ?? 0)),\n            })}\n            data={Object.keys(taxes)}\n          />\n\n          <DataView\n            label={t('dataViews.debitedTable')}\n            columns={[\n              {\n                title: t('tableHeaders.debitedByGusto'),\n                render: ({ label }) => label,\n              },\n              {\n                title: t('tableHeaders.taxesTotal'),\n                render: ({ value }) => formatCurrency(Number(value)),\n              },\n            ]}\n            data={[\n              { label: t('directDepositLabel'), value: payrollData.totals?.netPayDebit || '0' },\n              ...(withReimbursements\n                ? [\n                    {\n                      label: t('reimbursementLabel'),\n                      value: payrollData.totals?.reimbursementDebit || '0',\n                    },\n                  ]\n                : []),\n              {\n                label: t('garnishmentsLabel'),\n                value: payrollData.totals?.childSupportDebit || '0',\n              },\n              { label: t('taxesLabel'), value: payrollData.totals?.taxDebit || '0' },\n            ]}\n          />\n        </Flex>\n      ),\n    },\n  ]\n\n  const actions = isProcessed ? (\n    <>\n      <Button onClick={onPayrollReceipt} variant=\"secondary\" isDisabled={isLoading}>\n        {t('payrollReceiptCta')}\n      </Button>\n      {canCancel && (\n        <Button\n          onClick={() => {\n            setIsCancelDialogOpen(true)\n          }}\n          variant=\"error\"\n          isDisabled={isLoading}\n        >\n          {t('cancelCta')}\n        </Button>\n      )}\n    </>\n  ) : (\n    <>\n      {canEdit && (\n        <Button onClick={onEdit} variant=\"secondary\" isDisabled={isLoading}>\n          {t('editCta')}\n        </Button>\n      )}\n      <Button\n        onClick={onSubmit}\n        isDisabled={\n          isLoading ||\n          (submissionBlockers.length > 0 &&\n            (submissionBlockers.some(\n              blocker =>\n                !PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blocker.blockerType || ''),\n            ) ||\n              submissionBlockers.some(\n                blocker => !selectedUnblockOptions[blocker.blockerType || ''],\n              )))\n        }\n      >\n        {t('submitCta')}\n      </Button>\n    </>\n  )\n\n  return (\n    <div ref={containerRef} className={styles.container}>\n      <Flex flexDirection=\"column\" alignItems=\"stretch\">\n        <Flex justifyContent=\"space-between\" alignItems=\"flex-start\" gap={16}>\n          <Flex flexDirection=\"column\" gap={4}>\n            {pageHeading}\n            {pageSubtitle}\n          </Flex>\n          {isDesktop && (\n            <Flex gap={8} justifyContent=\"flex-end\">\n              {actions}\n            </Flex>\n          )}\n        </Flex>\n        {!isDesktop && (\n          <Grid gridTemplateColumns=\"1fr\" gap={8}>\n            {actions}\n          </Grid>\n        )}\n        {status === PayrollOverviewStatus.Cancelling ? (\n          <PayrollLoading title={t('cancellingTitle')} />\n        ) : status === PayrollOverviewStatus.Submitting ? (\n          <PayrollLoading title={t('loadingTitle')} description={t('loadingDescription')} />\n        ) : (\n          <>\n            {wireInConfirmationRequest}\n            {alerts.length > 0 && (\n              <Flex flexDirection={'column'} gap={16}>\n                {alerts.map((alert, index) => (\n                  <Alert\n                    key={`${alert.type}-${alert.title}`}\n                    label={alert.title}\n                    status={alert.type}\n                    onDismiss={alert.onDismiss}\n                  >\n                    {alert.content ?? null}\n                  </Alert>\n                ))}\n              </Flex>\n            )}\n            {submissionBlockers.length > 0 &&\n              onUnblockOptionChange &&\n              submissionBlockers.map(blocker => {\n                const blockerType = blocker.blockerType || ''\n\n                if (PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blockerType)) {\n                  return (\n                    <FastAchSubmissionBlockerBanner\n                      key={blockerType}\n                      blocker={blocker}\n                      selectedValue={selectedUnblockOptions[blockerType]}\n                      onUnblockOptionChange={onUnblockOptionChange}\n                      paymentSpeed={paymentSpeed}\n                    />\n                  )\n                }\n\n                return <GenericBlocker key={blockerType} blocker={blocker} />\n              })}\n            <Heading as=\"h2\" styledAs=\"h3\">\n              {isWireFunds\n                ? t('payrollSummaryTitleWire')\n                : isFourDayDirectDeposit\n                  ? t('payrollSummaryTitleFourDay')\n                  : t('payrollSummaryTitle')}\n            </Heading>\n\n            {isWireFunds ? (\n              <DataView\n                label={t('payrollSummaryLabel')}\n                columns={[\n                  {\n                    title: t('tableHeaders.totalPayroll'),\n                    render: () => formatCurrency(totalPayroll),\n                  },\n                  {\n                    title: t('tableHeaders.wireAmount'),\n                    render: () => {\n                      const metadata = selectedUnblockOption?.metadata as\n                        { wire_in_amount?: string } | undefined\n                      const wireAmount = metadata?.wire_in_amount\n                      return wireAmount ? formatCurrency(Number(wireAmount)) : '-'\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.wireTransferDeadline'),\n                    render: () => {\n                      const metadata = selectedUnblockOption?.metadata as\n                        { wire_in_deadline?: string } | undefined\n                      const wireDeadline = metadata?.wire_in_deadline\n                      const formattedTime = dateFormatter.formatWithTime(wireDeadline)\n                      const formattedDate = dateFormatter.formatShortWithYear(wireDeadline)\n                      return wireDeadline ? `${formattedTime.time} on ${formattedDate}` : '-'\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.employeePayDate'),\n                    render: () =>\n                      selectedUnblockOption?.checkDate\n                        ? dateFormatter.formatShortWithYear(selectedUnblockOption.checkDate)\n                        : '-',\n                  },\n                ]}\n                data={[{}]}\n              />\n            ) : isFourDayDirectDeposit ? (\n              <DataView\n                label={t('payrollSummaryLabel')}\n                columns={[\n                  {\n                    title: t('tableHeaders.totalPayroll'),\n                    render: () => formatCurrency(totalPayroll),\n                  },\n                  {\n                    title: t('tableHeaders.debitAmount'),\n                    render: () => {\n                      const debitAmount = payrollData.totals?.companyDebit\n                      return formatCurrency(Number(debitAmount ?? 0))\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.debitAccount'),\n                    render: () => bankAccount?.hiddenAccountNumber ?? '',\n                  },\n                  {\n                    title: t('tableHeaders.debitDate'),\n                    render: () => {\n                      const metadata = selectedUnblockOption?.metadata as\n                        { debit_date?: string } | undefined\n                      const debitDate = metadata?.debit_date\n                      return dateFormatter.formatShortWithYear(debitDate)\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.employeePayDate'),\n                    render: () =>\n                      selectedUnblockOption?.checkDate\n                        ? dateFormatter.formatShortWithYear(selectedUnblockOption.checkDate)\n                        : '-',\n                  },\n                ]}\n                data={[{}]}\n              />\n            ) : (\n              <DataView\n                label={t('payrollSummaryLabel')}\n                columns={[\n                  {\n                    title: t('tableHeaders.totalPayroll'),\n                    render: () => formatCurrency(totalPayroll),\n                  },\n                  {\n                    title: t('tableHeaders.debitAmount'),\n                    render: () => formatCurrency(Number(payrollData.totals?.companyDebit ?? 0)),\n                  },\n                  {\n                    title: t('tableHeaders.debitAccount'),\n                    render: () => bankAccount?.hiddenAccountNumber ?? '',\n                  },\n                  {\n                    title: t('tableHeaders.debitDate'),\n                    render: () => dateFormatter.formatShortWithYear(expectedDebitDate),\n                  },\n                  {\n                    title: t('tableHeaders.employeePayDate'),\n                    render: () => dateFormatter.formatShortWithYear(payrollData.checkDate),\n                  },\n                ]}\n                data={[{}]}\n              />\n            )}\n            {printChecksBanner}\n            <Tabs\n              onSelectionChange={setSelectedTab}\n              selectedId={selectedTab}\n              aria-label={t('dataViews.label')}\n              tabs={tabs}\n            />\n            {isCancelDialogOpen && (\n              <Dialog\n                isOpen={isCancelDialogOpen}\n                onClose={() => {\n                  setIsCancelDialogOpen(false)\n                }}\n                onPrimaryActionClick={onCancel}\n                shouldCloseOnBackdropClick={true}\n                primaryActionLabel={t('confirmCancelCta')}\n                isDestructive={true}\n                closeActionLabel={t('declineCancelCta')}\n                title={t(isDismissal ? 'cancelDialogTitleDismissal' : 'cancelDialogTitle', {\n                  startDate: dateFormatter.formatLong(payrollData.payPeriod?.startDate),\n                  endDate: dateFormatter.formatLongWithYear(payrollData.payPeriod?.endDate),\n                })}\n              >\n                <Flex gap={14} flexDirection=\"column\">\n                  <Text>{t('cancelDialogDescription')}</Text>\n                  {Number(payrollData.totals?.netPayDebit ?? 0) > 0 && (\n                    <Text>\n                      {t('cancelDialogDescriptionDeadline', {\n                        deadline: cancelDeadline,\n                      })}\n                    </Text>\n                  )}\n                </Flex>\n              </Dialog>\n            )}\n          </>\n        )}\n      </Flex>\n    </div>\n  )\n}\n"],"names":["getPayrollOverviewTitle","payPeriod","dateFormatter","PayrollOverviewPresentation","onEdit","onSubmit","onCancel","onPayrollReceipt","onPaystubDownload","payrollData","employeeFlsaStatusByUuid","bankAccount","taxes","status","PayrollOverviewStatus","isProcessed","canCancel","canEdit","alerts","submissionBlockers","selectedUnblockOptions","onUnblockOptionChange","wireInConfirmationRequest","printChecksBanner","withReimbursements","paymentSpeed","pagination","downloadingEmployeeIds","Alert","Badge","Button","ButtonIcon","Dialog","Heading","Text","Tabs","useComponentContext","useI18n","useDateFormatter","useTranslation","formatCurrency","useNumberFormatter","selectedTab","setSelectedTab","useState","isCancelDialogOpen","setIsCancelDialogOpen","containerRef","useRef","isDesktop","useContainerBreakpoints","isLoading","pageHeading","jsx","isDismissal","isDismissalPayroll","cancelDeadline","time","date","pageSubtitle","Trans","getPayrollTypeLabel","styles","jsxs","Flex","totalPayroll","calculateTotalPayroll","expectedDebitDate","getCompanyTaxes","employeeCompensation","acc","tax","getCompanyBenefits","benefit","getCompanyCost","getReimbursements","fastAchBlocker","blocker","selectedUnblockType","selectedUnblockOption","option","isWireFunds","isFourDayDirectDeposit","getEmployeeHours","employeeCompensations","hourlyCompensation","name","currentHours","getEmployeePtoHours","paidTimeOff","companyPaysColumns","firstLastName","isDownloading","DownloadIcon","tabs","DataView","Fragment","flsaStatus","FlsaStatus","compensationTypeLabels","hours","deduction","taxKey","label","value","actions","PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES","Grid","PayrollLoading","alert","index","blockerType","FastAchSubmissionBlockerBanner","GenericBlocker","wireAmount","wireDeadline","formattedTime","formattedDate","debitAmount","debitDate"],"mappings":"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"}
+{"version":3,"file":"PayrollOverviewPresentation.js","sources":["../../../../src/components/Payroll/PayrollOverview/PayrollOverviewPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport type {\n  EmployeeCompensations,\n  PayrollShow,\n} from '@gusto/embedded-api/models/components/payrollshow'\nimport type { PayrollPayPeriodType } from '@gusto/embedded-api/models/components/payrollpayperiodtype'\nimport type { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount'\nimport { useState, useRef } from 'react'\nimport type {\n  PayrollSubmissionBlockerType,\n  UnblockOptions,\n} from '@gusto/embedded-api/models/components/payrollsubmissionblockertype'\nimport type { PaymentSpeed } from '@gusto/embedded-api/models/components/paymentconfigs'\nimport type { PayrollFlowAlert } from '../PayrollFlow/PayrollFlowComponents'\nimport {\n  calculateTotalPayroll,\n  getPayrollTypeLabel,\n  getReimbursements,\n  isDismissalPayroll,\n} from '../helpers'\nimport { PayrollOverviewStatus } from './PayrollOverviewTypes'\nimport { FastAchSubmissionBlockerBanner, GenericBlocker } from './SubmissionBlockers'\nimport styles from './PayrollOverviewPresentation.module.scss'\nimport { DataView, Flex, Grid, PayrollLoading } from '@/components/Common'\nimport { useContainerBreakpoints } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { firstLastName } from '@/helpers/formattedStrings'\nimport {\n  compensationTypeLabels,\n  FlsaStatus,\n  PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES,\n} from '@/shared/constants'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\nimport DownloadIcon from '@/assets/icons/download-cloud.svg?react'\n\ninterface PayrollOverviewProps {\n  className?: string\n  payrollData: PayrollShow\n  employeeFlsaStatusByUuid?: Record<string, string | undefined>\n  bankAccount?: CompanyBankAccount\n  taxes: Record<string, { employee: number; employer: number }>\n  status?: PayrollOverviewStatus\n  isProcessed: boolean\n  canCancel?: boolean\n  canEdit?: boolean\n  alerts?: PayrollFlowAlert[]\n  submissionBlockers?: PayrollSubmissionBlockerType[]\n  selectedUnblockOptions?: Record<string, string>\n  wireInConfirmationRequest?: React.ReactNode\n  printChecksBanner?: React.ReactNode\n  pagination?: PaginationControlProps\n  onEdit: () => void\n  onSubmit: () => void\n  onCancel: () => void\n  onPayrollReceipt: () => void\n  onPaystubDownload: (employeeId: string) => void\n  onUnblockOptionChange?: (blockerType: string, value: string) => void\n  withReimbursements?: boolean\n  paymentSpeed?: PaymentSpeed\n  downloadingEmployeeIds?: ReadonlySet<string>\n}\n\nconst getPayrollOverviewTitle = (\n  payPeriod: PayrollPayPeriodType | undefined,\n  dateFormatter: ReturnType<typeof useDateFormatter>,\n) => {\n  if (payPeriod?.startDate && payPeriod.endDate) {\n    return dateFormatter.formatPayPeriod(payPeriod.startDate, payPeriod.endDate)\n  }\n  return { startDate: '', endDate: '' }\n}\n\n/** @internal */\nexport const PayrollOverviewPresentation = ({\n  className,\n  onEdit,\n  onSubmit,\n  onCancel,\n  onPayrollReceipt,\n  onPaystubDownload,\n  payrollData,\n  employeeFlsaStatusByUuid = {},\n  bankAccount,\n  taxes,\n  status = PayrollOverviewStatus.Viewing,\n  isProcessed,\n  canCancel = false,\n  canEdit = true,\n  alerts = [],\n  submissionBlockers = [],\n  selectedUnblockOptions = {},\n  onUnblockOptionChange,\n  wireInConfirmationRequest,\n  printChecksBanner,\n  withReimbursements = true,\n  paymentSpeed,\n  pagination,\n  downloadingEmployeeIds = new Set<string>(),\n}: PayrollOverviewProps) => {\n  const { Alert, Badge, Button, ButtonIcon, Dialog, Heading, Text, Tabs } = useComponentContext()\n  useI18n('Payroll.PayrollOverview')\n  const dateFormatter = useDateFormatter()\n  const { t } = useTranslation('Payroll.PayrollOverview')\n  const formatCurrency = useNumberFormatter('currency')\n  const [selectedTab, setSelectedTab] = useState('companyPays')\n  const [isCancelDialogOpen, setIsCancelDialogOpen] = useState(false)\n  const containerRef = useRef<HTMLDivElement>(null)\n  const breakpoints = useContainerBreakpoints({ ref: containerRef })\n  const isDesktop = breakpoints.includes('small')\n\n  const isLoading =\n    status === PayrollOverviewStatus.Submitting || status === PayrollOverviewStatus.Cancelling\n\n  const pageHeading = (\n    <Heading as=\"h1\">{isProcessed ? t('summaryTitle') : t('overviewTitle')}</Heading>\n  )\n  const isDismissal = isDismissalPayroll(payrollData.offCycleReason)\n\n  // formatWithTime returns { time, date }, and the cancel dialog used to interpolate only\n  // `time` -- so it read \"Run this payroll by 4:00 PM PDT\" with no date at all (SDK-1286).\n  // Rendered as \"<time> on <date>\" to match how PayrollHistory shows the same deadline.\n  const cancelDeadline = (() => {\n    const { time, date } = dateFormatter.formatWithTime(payrollData.payrollDeadline)\n    return date ? `${time} on ${date}` : time\n  })()\n\n  const pageSubtitle = (\n    <Text>\n      <Trans\n        i18nKey={isDismissal ? 'pageSubtitleDismissal' : 'pageSubtitle'}\n        t={t}\n        components={{ dateWrapper: <Text weight=\"bold\" as=\"span\" /> }}\n        values={{\n          ...getPayrollOverviewTitle(payrollData.payPeriod, dateFormatter),\n          payrollType: getPayrollTypeLabel(payrollData),\n        }}\n      />\n    </Text>\n  )\n\n  if (status === PayrollOverviewStatus.Cancelled) {\n    return (\n      <div ref={containerRef} className={classNames(styles.container, className)}>\n        <Flex flexDirection=\"column\" alignItems=\"stretch\">\n          <Flex justifyContent=\"space-between\" alignItems=\"flex-start\" gap={16}>\n            <Flex flexDirection=\"column\" gap={4}>\n              {pageHeading}\n              {pageSubtitle}\n            </Flex>\n          </Flex>\n          <Alert status=\"info\" label={t('cancelledEmptyState')} />\n        </Flex>\n      </div>\n    )\n  }\n\n  const totalPayroll = calculateTotalPayroll(payrollData)\n\n  const expectedDebitDate =\n    payrollData.payrollStatusMeta?.expectedDebitTime ?? payrollData.payrollDeadline\n\n  const getCompanyTaxes = (employeeCompensation: EmployeeCompensations) => {\n    return (\n      employeeCompensation.taxes?.reduce(\n        (acc, tax) => (tax.employer ? acc + Number(tax.amount) : acc),\n        0,\n      ) ?? 0\n    )\n  }\n  const getCompanyBenefits = (employeeCompensation: EmployeeCompensations) => {\n    return (\n      employeeCompensation.benefits?.reduce(\n        (acc, benefit) =>\n          benefit.companyContribution ? acc + Number(benefit.companyContribution) : acc,\n        0,\n      ) ?? 0\n    )\n  }\n  const getCompanyCost = (employeeCompensation: EmployeeCompensations) => {\n    return (\n      Number(employeeCompensation.grossPay!) +\n      getReimbursements(employeeCompensation) +\n      getCompanyTaxes(employeeCompensation) +\n      getCompanyBenefits(employeeCompensation)\n    )\n  }\n\n  const fastAchBlocker = submissionBlockers.find(\n    blocker =>\n      blocker.blockerType === 'fast_ach_threshold_exceeded' ||\n      blocker.blockerType === 'needs_earned_access_for_fast_ach',\n  )\n  const selectedUnblockType = fastAchBlocker\n    ? selectedUnblockOptions[fastAchBlocker.blockerType || '']\n    : undefined\n  const selectedUnblockOption = fastAchBlocker?.unblockOptions?.find(\n    (option: UnblockOptions) => option.unblockType === selectedUnblockType,\n  )\n\n  const isWireFunds = selectedUnblockType === 'wire_in'\n  const isFourDayDirectDeposit = selectedUnblockType === 'move_to_four_day'\n\n  const getEmployeeHours = (\n    employeeCompensations: EmployeeCompensations,\n  ): Record<string, number> => {\n    return (\n      employeeCompensations.hourlyCompensations?.reduce(\n        (acc, hourlyCompensation) => {\n          if (typeof hourlyCompensation.name === 'undefined') {\n            return acc\n          }\n          const name = hourlyCompensation.name.toLowerCase()\n          const currentHours = acc[name] ?? 0\n          acc[name] = currentHours + Number(hourlyCompensation.hours || 0)\n          return acc\n        },\n        {} as Record<string, number>,\n      ) || {}\n    )\n  }\n  const getEmployeePtoHours = (employeeCompensations: EmployeeCompensations) => {\n    return (\n      employeeCompensations.paidTimeOff?.reduce((acc, paidTimeOff) => {\n        return acc + Number(paidTimeOff.hours || 0)\n      }, 0) ?? 0\n    )\n  }\n\n  const companyPaysColumns: Array<{\n    key: string\n    title: string\n    justify?: 'start' | 'end'\n    render: (item: EmployeeCompensations) => React.ReactNode\n  }> = [\n    {\n      key: 'employeeName',\n      title: t('tableHeaders.employees'),\n      render: (employeeCompensations: EmployeeCompensations) => (\n        <Flex flexDirection=\"column\" gap={0}>\n          {firstLastName({\n            first_name: employeeCompensations.firstName,\n            last_name: employeeCompensations.lastName,\n          })}\n          {employeeCompensations.excluded && <Badge status=\"warning\">{t('skippedBadge')}</Badge>}\n        </Flex>\n      ),\n    },\n    {\n      key: 'grossPay',\n      title: t('tableHeaders.grossPay'),\n      justify: 'end',\n      render: (employeeCompensations: EmployeeCompensations) =>\n        formatCurrency(Number(employeeCompensations.grossPay!)),\n    },\n    ...(withReimbursements\n      ? [\n          {\n            key: 'reimbursements',\n            title: t('tableHeaders.reimbursements'),\n            justify: 'end' as const,\n            render: (employeeCompensation: EmployeeCompensations) =>\n              formatCurrency(getReimbursements(employeeCompensation)),\n          },\n        ]\n      : []),\n    {\n      key: 'companyTaxes',\n      title: t('tableHeaders.companyTaxes'),\n      justify: 'end',\n      render: (employeeCompensation: EmployeeCompensations) =>\n        formatCurrency(getCompanyTaxes(employeeCompensation)),\n    },\n    {\n      key: 'companyBenefits',\n      title: t('tableHeaders.companyBenefits'),\n      justify: 'end',\n      render: (employeeCompensation: EmployeeCompensations) =>\n        formatCurrency(getCompanyBenefits(employeeCompensation)),\n    },\n    {\n      key: 'companyPays',\n      title: t('tableHeaders.companyPays'),\n      justify: 'end',\n      render: (employeeCompensation: EmployeeCompensations) =>\n        formatCurrency(getCompanyCost(employeeCompensation)),\n    },\n  ]\n  if (isProcessed && isDesktop) {\n    companyPaysColumns.push({\n      key: 'paystubs',\n      title: t('tableHeaders.paystub'),\n      justify: 'end',\n      render: (employeeCompensations: EmployeeCompensations) => {\n        const isDownloading =\n          !!employeeCompensations.employeeUuid &&\n          downloadingEmployeeIds.has(employeeCompensations.employeeUuid)\n        return (\n          <Flex justifyContent=\"flex-end\">\n            <ButtonIcon\n              aria-label={t('downloadPaystubLabel')}\n              variant=\"tertiary\"\n              isLoading={isDownloading}\n              onClick={() => {\n                if (employeeCompensations.employeeUuid) {\n                  onPaystubDownload(employeeCompensations.employeeUuid)\n                }\n              }}\n            >\n              <DownloadIcon />\n            </ButtonIcon>\n          </Flex>\n        )\n      },\n    })\n  }\n  const tabs = [\n    {\n      id: 'companyPays',\n      label: t('dataViews.companyPaysTab'),\n      content: (\n        <DataView\n          label={t('dataViews.companyPaysTable')}\n          columns={companyPaysColumns}\n          data={payrollData.employeeCompensations!}\n          pagination={pagination}\n          itemMenu={\n            isProcessed && !isDesktop\n              ? (employeeCompensations: EmployeeCompensations) => {\n                  const isDownloading =\n                    !!employeeCompensations.employeeUuid &&\n                    downloadingEmployeeIds.has(employeeCompensations.employeeUuid)\n                  return (\n                    <ButtonIcon\n                      aria-label={t('downloadPaystubLabel')}\n                      variant=\"tertiary\"\n                      isLoading={isDownloading}\n                      onClick={() => {\n                        if (employeeCompensations.employeeUuid) {\n                          onPaystubDownload(employeeCompensations.employeeUuid)\n                        }\n                      }}\n                    >\n                      <DownloadIcon />\n                    </ButtonIcon>\n                  )\n                }\n              : undefined\n          }\n          footer={() => ({\n            employeeName: (\n              <>\n                {t('tableHeaders.footerTotalsLabel')}\n                <Text variant=\"supporting\" size=\"sm\">\n                  {t('tableHeaders.footerTotalsDescription')}\n                </Text>\n              </>\n            ),\n            grossPay: formatCurrency(Number(payrollData.totals?.grossPay ?? 0)),\n            ...(withReimbursements\n              ? {\n                  reimbursements: formatCurrency(Number(payrollData.totals?.reimbursements ?? 0)),\n                }\n              : {}),\n            companyTaxes: formatCurrency(Number(payrollData.totals?.employerTaxes ?? 0)),\n            companyBenefits: formatCurrency(Number(payrollData.totals?.benefits ?? 0)),\n            companyPays: formatCurrency(totalPayroll),\n          })}\n        />\n      ),\n    },\n    {\n      id: 'hoursWorked',\n      label: t('dataViews.hoursWorkedTab'),\n      content: (\n        <DataView\n          label={t('dataViews.hoursWorkedTable')}\n          columns={[\n            {\n              title: t('tableHeaders.employees'),\n              render: (employeeCompensations: EmployeeCompensations) => (\n                <Flex flexDirection=\"column\" gap={0}>\n                  {firstLastName({\n                    first_name: employeeCompensations.firstName,\n                    last_name: employeeCompensations.lastName,\n                  })}\n                  {employeeCompensations.excluded && (\n                    <Badge status=\"warning\">{t('skippedBadge')}</Badge>\n                  )}\n                </Flex>\n              ),\n            },\n            {\n              title: t('tableHeaders.compensationType'),\n              render: (employeeCompensations: EmployeeCompensations) => {\n                const flsaStatus = employeeCompensations.employeeUuid\n                  ? employeeFlsaStatusByUuid[employeeCompensations.employeeUuid]\n                  : undefined\n\n                switch (flsaStatus) {\n                  case FlsaStatus.EXEMPT:\n                    return t('compensationTypeLabels.exempt')\n                  case FlsaStatus.NONEXEMPT:\n                    return t('compensationTypeLabels.nonexempt')\n                  default:\n                    return flsaStatus ?? ''\n                }\n              },\n            },\n            {\n              title: t('tableHeaders.regular'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeeHours(employeeCompensations)[\n                  compensationTypeLabels.REGULAR_HOURS_NAME\n                ] || 0,\n            },\n            {\n              title: t('tableHeaders.overtime'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeeHours(employeeCompensations)[compensationTypeLabels.OVERTIME_NAME] || 0,\n            },\n            {\n              title: t('tableHeaders.doubleOT'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeeHours(employeeCompensations)[\n                  compensationTypeLabels.DOUBLE_OVERTIME_NAME\n                ] || 0,\n            },\n            {\n              title: t('tableHeaders.timeOff'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                getEmployeePtoHours(employeeCompensations),\n            },\n            {\n              title: t('tableHeaders.totalHours'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                Object.values(getEmployeeHours(employeeCompensations)).reduce(\n                  (acc, hours) => acc + hours,\n                  0,\n                ) + getEmployeePtoHours(employeeCompensations),\n            },\n          ]}\n          data={payrollData.employeeCompensations!}\n          pagination={pagination}\n        />\n      ),\n    },\n    {\n      id: 'employeeTakeHome',\n      label: t('dataViews.employeeTakeHomeTab'),\n      content: (\n        <DataView\n          label={t('dataViews.employeeTakeHomeTable')}\n          columns={[\n            {\n              title: t('tableHeaders.employees'),\n              render: (employeeCompensations: EmployeeCompensations) => (\n                <Flex flexDirection=\"column\" gap={0}>\n                  {firstLastName({\n                    first_name: employeeCompensations.firstName,\n                    last_name: employeeCompensations.lastName,\n                  })}\n                  {employeeCompensations.excluded && (\n                    <Badge status=\"warning\">{t('skippedBadge')}</Badge>\n                  )}\n                </Flex>\n              ),\n            },\n            {\n              title: t('tableHeaders.paymentType'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                employeeCompensations.paymentMethod ?? '',\n            },\n            {\n              title: t('tableHeaders.grossPay'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(Number(employeeCompensations.grossPay ?? 0)),\n            },\n            {\n              title: t('tableHeaders.deductions'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  employeeCompensations.deductions?.reduce(\n                    (acc, deduction) => acc + Number(deduction.amount),\n                    0,\n                  ) ?? 0,\n                ),\n            },\n            ...(withReimbursements\n              ? [\n                  {\n                    title: t('tableHeaders.reimbursements'),\n                    render: (employeeCompensations: EmployeeCompensations) =>\n                      formatCurrency(getReimbursements(employeeCompensations)),\n                  },\n                ]\n              : []),\n            {\n              title: t('tableHeaders.employeeTaxes'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  employeeCompensations.taxes?.reduce(\n                    (acc, tax) => (tax.employer ? acc : acc + Number(tax.amount)),\n                    0,\n                  ) ?? 0,\n                ),\n            },\n            {\n              title: t('tableHeaders.employeeBenefits'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  employeeCompensations.benefits?.reduce(\n                    (acc, benefit) => acc + Number(benefit.employeeDeduction ?? 0),\n                    0,\n                  ) ?? 0,\n                ),\n            },\n            {\n              title: t('tableHeaders.payment'),\n              render: (employeeCompensations: EmployeeCompensations) =>\n                formatCurrency(\n                  Number(employeeCompensations.netPay ?? 0) +\n                    getReimbursements(employeeCompensations),\n                ),\n            },\n          ]}\n          data={payrollData.employeeCompensations!}\n          pagination={pagination}\n        />\n      ),\n    },\n    {\n      id: 'taxes',\n      label: t('dataViews.taxesTab'),\n      content: (\n        <Flex flexDirection=\"column\" gap={32}>\n          <DataView\n            label={t('dataViews.taxesTable')}\n            columns={[\n              {\n                key: 'taxDescription',\n                title: t('tableHeaders.taxDescription'),\n                render: taxKey => taxKey,\n              },\n              {\n                key: 'byYourEmployees',\n                title: t('tableHeaders.byYourEmployees'),\n                render: taxKey => formatCurrency(taxes[taxKey]?.employee ?? 0),\n              },\n              {\n                key: 'byYourCompany',\n                title: t('tableHeaders.byYourCompany'),\n                render: taxKey => formatCurrency(taxes[taxKey]?.employer ?? 0),\n              },\n            ]}\n            footer={() => ({\n              taxDescription: (\n                <Text weight=\"semibold\" size=\"sm\">\n                  {t('totalsLabel')}\n                </Text>\n              ),\n              byYourEmployees: formatCurrency(Number(payrollData.totals?.employeeTaxes ?? 0)),\n              byYourCompany: formatCurrency(Number(payrollData.totals?.employerTaxes ?? 0)),\n            })}\n            data={Object.keys(taxes)}\n          />\n\n          <DataView\n            label={t('dataViews.debitedTable')}\n            columns={[\n              {\n                title: t('tableHeaders.debitedByGusto'),\n                render: ({ label }) => label,\n              },\n              {\n                title: t('tableHeaders.taxesTotal'),\n                render: ({ value }) => formatCurrency(Number(value)),\n              },\n            ]}\n            data={[\n              { label: t('directDepositLabel'), value: payrollData.totals?.netPayDebit || '0' },\n              ...(withReimbursements\n                ? [\n                    {\n                      label: t('reimbursementLabel'),\n                      value: payrollData.totals?.reimbursementDebit || '0',\n                    },\n                  ]\n                : []),\n              {\n                label: t('garnishmentsLabel'),\n                value: payrollData.totals?.childSupportDebit || '0',\n              },\n              { label: t('taxesLabel'), value: payrollData.totals?.taxDebit || '0' },\n            ]}\n          />\n        </Flex>\n      ),\n    },\n  ]\n\n  const actions = isProcessed ? (\n    <>\n      <Button onClick={onPayrollReceipt} variant=\"secondary\" isDisabled={isLoading}>\n        {t('payrollReceiptCta')}\n      </Button>\n      {canCancel && (\n        <Button\n          onClick={() => {\n            setIsCancelDialogOpen(true)\n          }}\n          variant=\"error\"\n          isDisabled={isLoading}\n        >\n          {t('cancelCta')}\n        </Button>\n      )}\n    </>\n  ) : (\n    <>\n      {canEdit && (\n        <Button onClick={onEdit} variant=\"secondary\" isDisabled={isLoading}>\n          {t('editCta')}\n        </Button>\n      )}\n      <Button\n        onClick={onSubmit}\n        isDisabled={\n          isLoading ||\n          (submissionBlockers.length > 0 &&\n            (submissionBlockers.some(\n              blocker =>\n                !PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blocker.blockerType || ''),\n            ) ||\n              submissionBlockers.some(\n                blocker => !selectedUnblockOptions[blocker.blockerType || ''],\n              )))\n        }\n      >\n        {t('submitCta')}\n      </Button>\n    </>\n  )\n\n  return (\n    <div ref={containerRef} className={classNames(styles.container, className)}>\n      <Flex flexDirection=\"column\" alignItems=\"stretch\">\n        <Flex justifyContent=\"space-between\" alignItems=\"flex-start\" gap={16}>\n          <Flex flexDirection=\"column\" gap={4}>\n            {pageHeading}\n            {pageSubtitle}\n          </Flex>\n          {isDesktop && (\n            <Flex gap={8} justifyContent=\"flex-end\">\n              {actions}\n            </Flex>\n          )}\n        </Flex>\n        {!isDesktop && (\n          <Grid\n            gridTemplateColumns={\n              !isProcessed && canEdit ? ['minmax(0, 1fr)', 'minmax(0, 1fr)'] : '1fr'\n            }\n            gap={8}\n          >\n            {actions}\n          </Grid>\n        )}\n        {status === PayrollOverviewStatus.Cancelling ? (\n          <PayrollLoading title={t('cancellingTitle')} />\n        ) : status === PayrollOverviewStatus.Submitting ? (\n          <PayrollLoading title={t('loadingTitle')} description={t('loadingDescription')} />\n        ) : (\n          <>\n            {wireInConfirmationRequest}\n            {alerts.length > 0 && (\n              <Flex flexDirection={'column'} gap={16}>\n                {alerts.map((alert, index) => (\n                  <Alert\n                    key={`${alert.type}-${alert.title}`}\n                    label={alert.title}\n                    status={alert.type}\n                    onDismiss={alert.onDismiss}\n                  >\n                    {alert.content ?? null}\n                  </Alert>\n                ))}\n              </Flex>\n            )}\n            {submissionBlockers.length > 0 &&\n              onUnblockOptionChange &&\n              submissionBlockers.map(blocker => {\n                const blockerType = blocker.blockerType || ''\n\n                if (PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blockerType)) {\n                  return (\n                    <FastAchSubmissionBlockerBanner\n                      key={blockerType}\n                      blocker={blocker}\n                      selectedValue={selectedUnblockOptions[blockerType]}\n                      onUnblockOptionChange={onUnblockOptionChange}\n                      paymentSpeed={paymentSpeed}\n                    />\n                  )\n                }\n\n                return <GenericBlocker key={blockerType} blocker={blocker} />\n              })}\n            <Heading as=\"h2\" styledAs=\"h3\">\n              {isWireFunds\n                ? t('payrollSummaryTitleWire')\n                : isFourDayDirectDeposit\n                  ? t('payrollSummaryTitleFourDay')\n                  : t('payrollSummaryTitle')}\n            </Heading>\n\n            {isWireFunds ? (\n              <DataView\n                label={t('payrollSummaryLabel')}\n                columns={[\n                  {\n                    title: t('tableHeaders.totalPayroll'),\n                    render: () => formatCurrency(totalPayroll),\n                  },\n                  {\n                    title: t('tableHeaders.wireAmount'),\n                    render: () => {\n                      const metadata = selectedUnblockOption?.metadata as\n                        { wire_in_amount?: string } | undefined\n                      const wireAmount = metadata?.wire_in_amount\n                      return wireAmount ? formatCurrency(Number(wireAmount)) : '-'\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.wireTransferDeadline'),\n                    render: () => {\n                      const metadata = selectedUnblockOption?.metadata as\n                        { wire_in_deadline?: string } | undefined\n                      const wireDeadline = metadata?.wire_in_deadline\n                      const formattedTime = dateFormatter.formatWithTime(wireDeadline)\n                      const formattedDate = dateFormatter.formatShortWithYear(wireDeadline)\n                      return wireDeadline ? `${formattedTime.time} on ${formattedDate}` : '-'\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.employeePayDate'),\n                    render: () =>\n                      selectedUnblockOption?.checkDate\n                        ? dateFormatter.formatShortWithYear(selectedUnblockOption.checkDate)\n                        : '-',\n                  },\n                ]}\n                data={[{}]}\n              />\n            ) : isFourDayDirectDeposit ? (\n              <DataView\n                label={t('payrollSummaryLabel')}\n                columns={[\n                  {\n                    title: t('tableHeaders.totalPayroll'),\n                    render: () => formatCurrency(totalPayroll),\n                  },\n                  {\n                    title: t('tableHeaders.debitAmount'),\n                    render: () => {\n                      const debitAmount = payrollData.totals?.companyDebit\n                      return formatCurrency(Number(debitAmount ?? 0))\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.debitAccount'),\n                    render: () => bankAccount?.hiddenAccountNumber ?? '',\n                  },\n                  {\n                    title: t('tableHeaders.debitDate'),\n                    render: () => {\n                      const metadata = selectedUnblockOption?.metadata as\n                        { debit_date?: string } | undefined\n                      const debitDate = metadata?.debit_date\n                      return dateFormatter.formatShortWithYear(debitDate)\n                    },\n                  },\n                  {\n                    title: t('tableHeaders.employeePayDate'),\n                    render: () =>\n                      selectedUnblockOption?.checkDate\n                        ? dateFormatter.formatShortWithYear(selectedUnblockOption.checkDate)\n                        : '-',\n                  },\n                ]}\n                data={[{}]}\n              />\n            ) : (\n              <DataView\n                label={t('payrollSummaryLabel')}\n                columns={[\n                  {\n                    title: t('tableHeaders.totalPayroll'),\n                    render: () => formatCurrency(totalPayroll),\n                  },\n                  {\n                    title: t('tableHeaders.debitAmount'),\n                    render: () => formatCurrency(Number(payrollData.totals?.companyDebit ?? 0)),\n                  },\n                  {\n                    title: t('tableHeaders.debitAccount'),\n                    render: () => bankAccount?.hiddenAccountNumber ?? '',\n                  },\n                  {\n                    title: t('tableHeaders.debitDate'),\n                    render: () => dateFormatter.formatShortWithYear(expectedDebitDate),\n                  },\n                  {\n                    title: t('tableHeaders.employeePayDate'),\n                    render: () => dateFormatter.formatShortWithYear(payrollData.checkDate),\n                  },\n                ]}\n                data={[{}]}\n              />\n            )}\n            {printChecksBanner}\n            <Tabs\n              onSelectionChange={setSelectedTab}\n              selectedId={selectedTab}\n              aria-label={t('dataViews.label')}\n              tabs={tabs}\n            />\n            {isCancelDialogOpen && (\n              <Dialog\n                isOpen={isCancelDialogOpen}\n                onClose={() => {\n                  setIsCancelDialogOpen(false)\n                }}\n                onPrimaryActionClick={onCancel}\n                shouldCloseOnBackdropClick={true}\n                primaryActionLabel={t('confirmCancelCta')}\n                isDestructive={true}\n                closeActionLabel={t('declineCancelCta')}\n                title={t(isDismissal ? 'cancelDialogTitleDismissal' : 'cancelDialogTitle', {\n                  startDate: dateFormatter.formatLong(payrollData.payPeriod?.startDate),\n                  endDate: dateFormatter.formatLongWithYear(payrollData.payPeriod?.endDate),\n                })}\n              >\n                <Flex gap={14} flexDirection=\"column\">\n                  <Text>{t('cancelDialogDescription')}</Text>\n                  {Number(payrollData.totals?.netPayDebit ?? 0) > 0 && (\n                    <Text>\n                      {t('cancelDialogDescriptionDeadline', {\n                        deadline: cancelDeadline,\n                      })}\n                    </Text>\n                  )}\n                </Flex>\n              </Dialog>\n            )}\n          </>\n        )}\n      </Flex>\n    </div>\n  )\n}\n"],"names":["getPayrollOverviewTitle","payPeriod","dateFormatter","PayrollOverviewPresentation","className","onEdit","onSubmit","onCancel","onPayrollReceipt","onPaystubDownload","payrollData","employeeFlsaStatusByUuid","bankAccount","taxes","status","PayrollOverviewStatus","isProcessed","canCancel","canEdit","alerts","submissionBlockers","selectedUnblockOptions","onUnblockOptionChange","wireInConfirmationRequest","printChecksBanner","withReimbursements","paymentSpeed","pagination","downloadingEmployeeIds","Alert","Badge","Button","ButtonIcon","Dialog","Heading","Text","Tabs","useComponentContext","useI18n","useDateFormatter","useTranslation","formatCurrency","useNumberFormatter","selectedTab","setSelectedTab","useState","isCancelDialogOpen","setIsCancelDialogOpen","containerRef","useRef","isDesktop","useContainerBreakpoints","isLoading","pageHeading","jsx","isDismissal","isDismissalPayroll","cancelDeadline","time","date","pageSubtitle","Trans","getPayrollTypeLabel","classNames","styles","jsxs","Flex","totalPayroll","calculateTotalPayroll","expectedDebitDate","getCompanyTaxes","employeeCompensation","acc","tax","getCompanyBenefits","benefit","getCompanyCost","getReimbursements","fastAchBlocker","blocker","selectedUnblockType","selectedUnblockOption","option","isWireFunds","isFourDayDirectDeposit","getEmployeeHours","employeeCompensations","hourlyCompensation","name","currentHours","getEmployeePtoHours","paidTimeOff","companyPaysColumns","firstLastName","isDownloading","DownloadIcon","tabs","DataView","Fragment","flsaStatus","FlsaStatus","compensationTypeLabels","hours","deduction","taxKey","label","value","actions","PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES","Grid","PayrollLoading","alert","index","blockerType","FastAchSubmissionBlockerBanner","GenericBlocker","wireAmount","wireDeadline","formattedTime","formattedDate","debitAmount","debitDate"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkEA,MAAMA,KAA0B,CAC9BC,GACAC,MAEID,GAAW,aAAaA,EAAU,UAC7BC,EAAc,gBAAgBD,EAAU,WAAWA,EAAU,OAAO,IAEtE,EAAE,WAAW,IAAI,SAAS,GAAA,GAItBE,KAA8B,CAAC;AAAA,EAC1C,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,0BAAAC,KAA2B,CAAA;AAAA,EAC3B,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAASC,EAAsB;AAAA,EAC/B,aAAAC;AAAA,EACA,WAAAC,KAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,QAAAC,IAAS,CAAA;AAAA,EACT,oBAAAC,IAAqB,CAAA;AAAA,EACrB,wBAAAC,IAAyB,CAAA;AAAA,EACzB,uBAAAC;AAAA,EACA,2BAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,oBAAAC,IAAqB;AAAA,EACrB,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,wBAAAC,wBAA6B,IAAA;AAC/B,MAA4B;AAC1B,QAAM,EAAE,OAAAC,GAAO,OAAAC,GAAO,QAAAC,GAAQ,YAAAC,GAAY,QAAAC,IAAQ,SAAAC,GAAS,MAAAC,GAAM,MAAAC,GAAA,IAASC,GAAA;AAC1E,EAAAC,GAAQ,yBAAyB;AACjC,QAAMpC,IAAgBqC,GAAA,GAChB,EAAE,EAAA,IAAMC,GAAe,yBAAyB,GAChDC,IAAiBC,GAAmB,UAAU,GAC9C,CAACC,IAAaC,EAAc,IAAIC,GAAS,aAAa,GACtD,CAACC,GAAoBC,CAAqB,IAAIF,GAAS,EAAK,GAC5DG,IAAeC,GAAuB,IAAI,GAE1CC,IADcC,GAAwB,EAAE,KAAKH,GAAc,EACnC,SAAS,OAAO,GAExCI,IACJtC,MAAWC,EAAsB,cAAcD,MAAWC,EAAsB,YAE5EsC,IACJ,gBAAAC,EAACpB,GAAA,EAAQ,IAAG,MAAM,UAAc,EAAdlB,IAAgB,iBAAoB,eAAN,EAAqB,CAAE,GAEnEuC,IAAcC,GAAmB9C,EAAY,cAAc,GAK3D+C,MAAkB,MAAM;AAC5B,UAAM,EAAE,MAAAC,GAAM,MAAAC,EAAA,IAASzD,EAAc,eAAeQ,EAAY,eAAe;AAC/E,WAAOiD,IAAO,GAAGD,CAAI,OAAOC,CAAI,KAAKD;AAAA,EACvC,GAAA,GAEME,sBACHzB,GAAA,EACC,UAAA,gBAAAmB;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAASN,IAAc,0BAA0B;AAAA,MACjD;AAAA,MACA,YAAY,EAAE,aAAa,gBAAAD,EAACnB,KAAK,QAAO,QAAO,IAAG,OAAA,CAAO,EAAA;AAAA,MACzD,QAAQ;AAAA,QACN,GAAGnC,GAAwBU,EAAY,WAAWR,CAAa;AAAA,QAC/D,aAAa4D,GAAoBpD,CAAW;AAAA,MAAA;AAAA,IAC9C;AAAA,EAAA,GAEJ;AAGF,MAAII,MAAWC,EAAsB;AACnC,WACE,gBAAAuC,EAAC,OAAA,EAAI,KAAKN,GAAc,WAAWe,GAAWC,GAAO,WAAW5D,CAAS,GACvE,UAAA,gBAAA6D,EAACC,GAAA,EAAK,eAAc,UAAS,YAAW,WACtC,UAAA;AAAA,MAAA,gBAAAZ,EAACY,GAAA,EAAK,gBAAe,iBAAgB,YAAW,cAAa,KAAK,IAChE,UAAA,gBAAAD,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAC/B,UAAA;AAAA,QAAAb;AAAA,QACAO;AAAA,MAAA,EAAA,CACH,EAAA,CACF;AAAA,wBACC/B,GAAA,EAAM,QAAO,QAAO,OAAO,EAAE,qBAAqB,EAAA,CAAG;AAAA,IAAA,EAAA,CACxD,EAAA,CACF;AAIJ,QAAMsC,IAAeC,GAAsB1D,CAAW,GAEhD2D,KACJ3D,EAAY,mBAAmB,qBAAqBA,EAAY,iBAE5D4D,IAAkB,CAACC,MAErBA,EAAqB,OAAO;AAAA,IAC1B,CAACC,GAAKC,MAASA,EAAI,WAAWD,IAAM,OAAOC,EAAI,MAAM,IAAID;AAAA,IACzD;AAAA,EAAA,KACG,GAGHE,IAAqB,CAACH,MAExBA,EAAqB,UAAU;AAAA,IAC7B,CAACC,GAAKG,MACJA,EAAQ,sBAAsBH,IAAM,OAAOG,EAAQ,mBAAmB,IAAIH;AAAA,IAC5E;AAAA,EAAA,KACG,GAGHI,KAAiB,CAACL,MAEpB,OAAOA,EAAqB,QAAS,IACrCM,EAAkBN,CAAoB,IACtCD,EAAgBC,CAAoB,IACpCG,EAAmBH,CAAoB,GAIrCO,IAAiB1D,EAAmB;AAAA,IACxC,CAAA2D,MACEA,EAAQ,gBAAgB,iCACxBA,EAAQ,gBAAgB;AAAA,EAAA,GAEtBC,IAAsBF,IACxBzD,EAAuByD,EAAe,eAAe,EAAE,IACvD,QACEG,IAAwBH,GAAgB,gBAAgB;AAAA,IAC5D,CAACI,MAA2BA,EAAO,gBAAgBF;AAAA,EAAA,GAG/CG,IAAcH,MAAwB,WACtCI,KAAyBJ,MAAwB,oBAEjDK,IAAmB,CACvBC,MAGEA,EAAsB,qBAAqB;AAAA,IACzC,CAACd,GAAKe,MAAuB;AAC3B,UAAI,OAAOA,EAAmB,OAAS;AACrC,eAAOf;AAET,YAAMgB,IAAOD,EAAmB,KAAK,YAAA,GAC/BE,KAAejB,EAAIgB,CAAI,KAAK;AAClC,aAAAhB,EAAIgB,CAAI,IAAIC,KAAe,OAAOF,EAAmB,SAAS,CAAC,GACxDf;AAAA,IACT;AAAA,IACA,CAAA;AAAA,EAAC,KACE,CAAA,GAGHkB,KAAsB,CAACJ,MAEzBA,EAAsB,aAAa,OAAO,CAACd,GAAKmB,MACvCnB,IAAM,OAAOmB,EAAY,SAAS,CAAC,GACzC,CAAC,KAAK,GAIPC,KAKD;AAAA,IACH;AAAA,MACE,KAAK;AAAA,MACL,OAAO,EAAE,wBAAwB;AAAA,MACjC,QAAQ,CAACN,MACP,gBAAArB,EAACC,KAAK,eAAc,UAAS,KAAK,GAC/B,UAAA;AAAA,QAAA2B,EAAc;AAAA,UACb,YAAYP,EAAsB;AAAA,UAClC,WAAWA,EAAsB;AAAA,QAAA,CAClC;AAAA,QACAA,EAAsB,YAAY,gBAAAhC,EAACxB,GAAA,EAAM,QAAO,WAAW,UAAA,EAAE,cAAc,EAAA,CAAE;AAAA,MAAA,EAAA,CAChF;AAAA,IAAA;AAAA,IAGJ;AAAA,MACE,KAAK;AAAA,MACL,OAAO,EAAE,uBAAuB;AAAA,MAChC,SAAS;AAAA,MACT,QAAQ,CAACwD,MACP7C,EAAe,OAAO6C,EAAsB,QAAS,CAAC;AAAA,IAAA;AAAA,IAE1D,GAAI7D,IACA;AAAA,MACE;AAAA,QACE,KAAK;AAAA,QACL,OAAO,EAAE,6BAA6B;AAAA,QACtC,SAAS;AAAA,QACT,QAAQ,CAAC8C,MACP9B,EAAeoC,EAAkBN,CAAoB,CAAC;AAAA,MAAA;AAAA,IAC1D,IAEF,CAAA;AAAA,IACJ;AAAA,MACE,KAAK;AAAA,MACL,OAAO,EAAE,2BAA2B;AAAA,MACpC,SAAS;AAAA,MACT,QAAQ,CAACA,MACP9B,EAAe6B,EAAgBC,CAAoB,CAAC;AAAA,IAAA;AAAA,IAExD;AAAA,MACE,KAAK;AAAA,MACL,OAAO,EAAE,8BAA8B;AAAA,MACvC,SAAS;AAAA,MACT,QAAQ,CAACA,MACP9B,EAAeiC,EAAmBH,CAAoB,CAAC;AAAA,IAAA;AAAA,IAE3D;AAAA,MACE,KAAK;AAAA,MACL,OAAO,EAAE,0BAA0B;AAAA,MACnC,SAAS;AAAA,MACT,QAAQ,CAACA,MACP9B,EAAemC,GAAeL,CAAoB,CAAC;AAAA,IAAA;AAAA,EACvD;AAEF,EAAIvD,KAAekC,KACjB0C,GAAmB,KAAK;AAAA,IACtB,KAAK;AAAA,IACL,OAAO,EAAE,sBAAsB;AAAA,IAC/B,SAAS;AAAA,IACT,QAAQ,CAACN,MAAiD;AACxD,YAAMQ,IACJ,CAAC,CAACR,EAAsB,gBACxB1D,EAAuB,IAAI0D,EAAsB,YAAY;AAC/D,aACE,gBAAAhC,EAACY,GAAA,EAAK,gBAAe,YACnB,UAAA,gBAAAZ;AAAA,QAACtB;AAAA,QAAA;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,SAAQ;AAAA,UACR,WAAW8D;AAAA,UACX,SAAS,MAAM;AACb,YAAIR,EAAsB,gBACxB7E,EAAkB6E,EAAsB,YAAY;AAAA,UAExD;AAAA,UAEA,4BAACS,IAAA,CAAA,CAAa;AAAA,QAAA;AAAA,MAAA,GAElB;AAAA,IAEJ;AAAA,EAAA,CACD;AAEH,QAAMC,KAAO;AAAA,IACX;AAAA,MACE,IAAI;AAAA,MACJ,OAAO,EAAE,0BAA0B;AAAA,MACnC,SACE,gBAAA1C;AAAA,QAAC2C;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,4BAA4B;AAAA,UACrC,SAASL;AAAA,UACT,MAAMlF,EAAY;AAAA,UAClB,YAAAiB;AAAA,UACA,UACEX,KAAe,CAACkC,IACZ,CAACoC,MAAiD;AAChD,kBAAMQ,IACJ,CAAC,CAACR,EAAsB,gBACxB1D,EAAuB,IAAI0D,EAAsB,YAAY;AAC/D,mBACE,gBAAAhC;AAAA,cAACtB;AAAA,cAAA;AAAA,gBACC,cAAY,EAAE,sBAAsB;AAAA,gBACpC,SAAQ;AAAA,gBACR,WAAW8D;AAAA,gBACX,SAAS,MAAM;AACb,kBAAIR,EAAsB,gBACxB7E,EAAkB6E,EAAsB,YAAY;AAAA,gBAExD;AAAA,gBAEA,4BAACS,IAAA,CAAA,CAAa;AAAA,cAAA;AAAA,YAAA;AAAA,UAGpB,IACA;AAAA,UAEN,QAAQ,OAAO;AAAA,YACb,cACE,gBAAA9B,EAAAiC,GAAA,EACG,UAAA;AAAA,cAAA,EAAE,gCAAgC;AAAA,cACnC,gBAAA5C,EAACnB,KAAK,SAAQ,cAAa,MAAK,MAC7B,UAAA,EAAE,sCAAsC,EAAA,CAC3C;AAAA,YAAA,GACF;AAAA,YAEF,UAAUM,EAAe,OAAO/B,EAAY,QAAQ,YAAY,CAAC,CAAC;AAAA,YAClE,GAAIe,IACA;AAAA,cACE,gBAAgBgB,EAAe,OAAO/B,EAAY,QAAQ,kBAAkB,CAAC,CAAC;AAAA,YAAA,IAEhF,CAAA;AAAA,YACJ,cAAc+B,EAAe,OAAO/B,EAAY,QAAQ,iBAAiB,CAAC,CAAC;AAAA,YAC3E,iBAAiB+B,EAAe,OAAO/B,EAAY,QAAQ,YAAY,CAAC,CAAC;AAAA,YACzE,aAAa+B,EAAe0B,CAAY;AAAA,UAAA;AAAA,QAC1C;AAAA,MAAA;AAAA,IACF;AAAA,IAGJ;AAAA,MACE,IAAI;AAAA,MACJ,OAAO,EAAE,0BAA0B;AAAA,MACnC,SACE,gBAAAb;AAAA,QAAC2C;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,4BAA4B;AAAA,UACrC,SAAS;AAAA,YACP;AAAA,cACE,OAAO,EAAE,wBAAwB;AAAA,cACjC,QAAQ,CAACX,MACP,gBAAArB,EAACC,KAAK,eAAc,UAAS,KAAK,GAC/B,UAAA;AAAA,gBAAA2B,EAAc;AAAA,kBACb,YAAYP,EAAsB;AAAA,kBAClC,WAAWA,EAAsB;AAAA,gBAAA,CAClC;AAAA,gBACAA,EAAsB,YACrB,gBAAAhC,EAACxB,GAAA,EAAM,QAAO,WAAW,UAAA,EAAE,cAAc,EAAA,CAAE;AAAA,cAAA,EAAA,CAE/C;AAAA,YAAA;AAAA,YAGJ;AAAA,cACE,OAAO,EAAE,+BAA+B;AAAA,cACxC,QAAQ,CAACwD,MAAiD;AACxD,sBAAMa,IAAab,EAAsB,eACrC3E,GAAyB2E,EAAsB,YAAY,IAC3D;AAEJ,wBAAQa,GAAA;AAAA,kBACN,KAAKC,GAAW;AACd,2BAAO,EAAE,+BAA+B;AAAA,kBAC1C,KAAKA,GAAW;AACd,2BAAO,EAAE,kCAAkC;AAAA,kBAC7C;AACE,2BAAOD,KAAc;AAAA,gBAAA;AAAA,cAE3B;AAAA,YAAA;AAAA,YAEF;AAAA,cACE,OAAO,EAAE,sBAAsB;AAAA,cAC/B,QAAQ,CAACb,MACPD,EAAiBC,CAAqB,EACpCe,EAAuB,kBACzB,KAAK;AAAA,YAAA;AAAA,YAET;AAAA,cACE,OAAO,EAAE,uBAAuB;AAAA,cAChC,QAAQ,CAACf,MACPD,EAAiBC,CAAqB,EAAEe,EAAuB,aAAa,KAAK;AAAA,YAAA;AAAA,YAErF;AAAA,cACE,OAAO,EAAE,uBAAuB;AAAA,cAChC,QAAQ,CAACf,MACPD,EAAiBC,CAAqB,EACpCe,EAAuB,oBACzB,KAAK;AAAA,YAAA;AAAA,YAET;AAAA,cACE,OAAO,EAAE,sBAAsB;AAAA,cAC/B,QAAQ,CAACf,MACPI,GAAoBJ,CAAqB;AAAA,YAAA;AAAA,YAE7C;AAAA,cACE,OAAO,EAAE,yBAAyB;AAAA,cAClC,QAAQ,CAACA,MACP,OAAO,OAAOD,EAAiBC,CAAqB,CAAC,EAAE;AAAA,gBACrD,CAACd,GAAK8B,MAAU9B,IAAM8B;AAAA,gBACtB;AAAA,cAAA,IACEZ,GAAoBJ,CAAqB;AAAA,YAAA;AAAA,UACjD;AAAA,UAEF,MAAM5E,EAAY;AAAA,UAClB,YAAAiB;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,IAGJ;AAAA,MACE,IAAI;AAAA,MACJ,OAAO,EAAE,+BAA+B;AAAA,MACxC,SACE,gBAAA2B;AAAA,QAAC2C;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,iCAAiC;AAAA,UAC1C,SAAS;AAAA,YACP;AAAA,cACE,OAAO,EAAE,wBAAwB;AAAA,cACjC,QAAQ,CAACX,MACP,gBAAArB,EAACC,KAAK,eAAc,UAAS,KAAK,GAC/B,UAAA;AAAA,gBAAA2B,EAAc;AAAA,kBACb,YAAYP,EAAsB;AAAA,kBAClC,WAAWA,EAAsB;AAAA,gBAAA,CAClC;AAAA,gBACAA,EAAsB,YACrB,gBAAAhC,EAACxB,GAAA,EAAM,QAAO,WAAW,UAAA,EAAE,cAAc,EAAA,CAAE;AAAA,cAAA,EAAA,CAE/C;AAAA,YAAA;AAAA,YAGJ;AAAA,cACE,OAAO,EAAE,0BAA0B;AAAA,cACnC,QAAQ,CAACwD,MACPA,EAAsB,iBAAiB;AAAA,YAAA;AAAA,YAE3C;AAAA,cACE,OAAO,EAAE,uBAAuB;AAAA,cAChC,QAAQ,CAACA,MACP7C,EAAe,OAAO6C,EAAsB,YAAY,CAAC,CAAC;AAAA,YAAA;AAAA,YAE9D;AAAA,cACE,OAAO,EAAE,yBAAyB;AAAA,cAClC,QAAQ,CAACA,MACP7C;AAAA,gBACE6C,EAAsB,YAAY;AAAA,kBAChC,CAACd,GAAK+B,MAAc/B,IAAM,OAAO+B,EAAU,MAAM;AAAA,kBACjD;AAAA,gBAAA,KACG;AAAA,cAAA;AAAA,YACP;AAAA,YAEJ,GAAI9E,IACA;AAAA,cACE;AAAA,gBACE,OAAO,EAAE,6BAA6B;AAAA,gBACtC,QAAQ,CAAC6D,MACP7C,EAAeoC,EAAkBS,CAAqB,CAAC;AAAA,cAAA;AAAA,YAC3D,IAEF,CAAA;AAAA,YACJ;AAAA,cACE,OAAO,EAAE,4BAA4B;AAAA,cACrC,QAAQ,CAACA,MACP7C;AAAA,gBACE6C,EAAsB,OAAO;AAAA,kBAC3B,CAACd,GAAKC,MAASA,EAAI,WAAWD,IAAMA,IAAM,OAAOC,EAAI,MAAM;AAAA,kBAC3D;AAAA,gBAAA,KACG;AAAA,cAAA;AAAA,YACP;AAAA,YAEJ;AAAA,cACE,OAAO,EAAE,+BAA+B;AAAA,cACxC,QAAQ,CAACa,MACP7C;AAAA,gBACE6C,EAAsB,UAAU;AAAA,kBAC9B,CAACd,GAAKG,MAAYH,IAAM,OAAOG,EAAQ,qBAAqB,CAAC;AAAA,kBAC7D;AAAA,gBAAA,KACG;AAAA,cAAA;AAAA,YACP;AAAA,YAEJ;AAAA,cACE,OAAO,EAAE,sBAAsB;AAAA,cAC/B,QAAQ,CAACW,MACP7C;AAAA,gBACE,OAAO6C,EAAsB,UAAU,CAAC,IACtCT,EAAkBS,CAAqB;AAAA,cAAA;AAAA,YAC3C;AAAA,UACJ;AAAA,UAEF,MAAM5E,EAAY;AAAA,UAClB,YAAAiB;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,IAGJ;AAAA,MACE,IAAI;AAAA,MACJ,OAAO,EAAE,oBAAoB;AAAA,MAC7B,SACE,gBAAAsC,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,QAAA,gBAAAZ;AAAA,UAAC2C;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,sBAAsB;AAAA,YAC/B,SAAS;AAAA,cACP;AAAA,gBACE,KAAK;AAAA,gBACL,OAAO,EAAE,6BAA6B;AAAA,gBACtC,QAAQ,CAAAO,MAAUA;AAAA,cAAA;AAAA,cAEpB;AAAA,gBACE,KAAK;AAAA,gBACL,OAAO,EAAE,8BAA8B;AAAA,gBACvC,QAAQ,CAAAA,MAAU/D,EAAe5B,EAAM2F,CAAM,GAAG,YAAY,CAAC;AAAA,cAAA;AAAA,cAE/D;AAAA,gBACE,KAAK;AAAA,gBACL,OAAO,EAAE,4BAA4B;AAAA,gBACrC,QAAQ,CAAAA,MAAU/D,EAAe5B,EAAM2F,CAAM,GAAG,YAAY,CAAC;AAAA,cAAA;AAAA,YAC/D;AAAA,YAEF,QAAQ,OAAO;AAAA,cACb,kCACGrE,GAAA,EAAK,QAAO,YAAW,MAAK,MAC1B,UAAA,EAAE,aAAa,EAAA,CAClB;AAAA,cAEF,iBAAiBM,EAAe,OAAO/B,EAAY,QAAQ,iBAAiB,CAAC,CAAC;AAAA,cAC9E,eAAe+B,EAAe,OAAO/B,EAAY,QAAQ,iBAAiB,CAAC,CAAC;AAAA,YAAA;AAAA,YAE9E,MAAM,OAAO,KAAKG,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAGzB,gBAAAyC;AAAA,UAAC2C;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,wBAAwB;AAAA,YACjC,SAAS;AAAA,cACP;AAAA,gBACE,OAAO,EAAE,6BAA6B;AAAA,gBACtC,QAAQ,CAAC,EAAE,OAAAQ,QAAYA;AAAA,cAAA;AAAA,cAEzB;AAAA,gBACE,OAAO,EAAE,yBAAyB;AAAA,gBAClC,QAAQ,CAAC,EAAE,OAAAC,EAAA,MAAYjE,EAAe,OAAOiE,CAAK,CAAC;AAAA,cAAA;AAAA,YACrD;AAAA,YAEF,MAAM;AAAA,cACJ,EAAE,OAAO,EAAE,oBAAoB,GAAG,OAAOhG,EAAY,QAAQ,eAAe,IAAA;AAAA,cAC5E,GAAIe,IACA;AAAA,gBACE;AAAA,kBACE,OAAO,EAAE,oBAAoB;AAAA,kBAC7B,OAAOf,EAAY,QAAQ,sBAAsB;AAAA,gBAAA;AAAA,cACnD,IAEF,CAAA;AAAA,cACJ;AAAA,gBACE,OAAO,EAAE,mBAAmB;AAAA,gBAC5B,OAAOA,EAAY,QAAQ,qBAAqB;AAAA,cAAA;AAAA,cAElD,EAAE,OAAO,EAAE,YAAY,GAAG,OAAOA,EAAY,QAAQ,YAAY,IAAA;AAAA,YAAI;AAAA,UACvE;AAAA,QAAA;AAAA,MACF,EAAA,CACF;AAAA,IAAA;AAAA,EAEJ,GAGIiG,KAAU3F,IACd,gBAAAiD,EAAAiC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAA5C,EAACvB,GAAA,EAAO,SAASvB,IAAkB,SAAQ,aAAY,YAAY4C,GAChE,UAAA,EAAE,mBAAmB,EAAA,CACxB;AAAA,IACCnC,MACC,gBAAAqC;AAAA,MAACvB;AAAA,MAAA;AAAA,QACC,SAAS,MAAM;AACb,UAAAgB,EAAsB,EAAI;AAAA,QAC5B;AAAA,QACA,SAAQ;AAAA,QACR,YAAYK;AAAA,QAEX,YAAE,WAAW;AAAA,MAAA;AAAA,IAAA;AAAA,EAChB,EAAA,CAEJ,IAEA,gBAAAa,EAAAiC,GAAA,EACG,UAAA;AAAA,IAAAhF,KACC,gBAAAoC,EAACvB,GAAA,EAAO,SAAS1B,GAAQ,SAAQ,aAAY,YAAY+C,GACtD,UAAA,EAAE,SAAS,EAAA,CACd;AAAA,IAEF,gBAAAE;AAAA,MAACvB;AAAA,MAAA;AAAA,QACC,SAASzB;AAAA,QACT,YACE8C,KACChC,EAAmB,SAAS,MAC1BA,EAAmB;AAAA,UAClB,OACE,CAACwF,GAA4C,SAAS7B,EAAQ,eAAe,EAAE;AAAA,QAAA,KAEjF3D,EAAmB;AAAA,UACjB,CAAA2D,MAAW,CAAC1D,EAAuB0D,EAAQ,eAAe,EAAE;AAAA,QAAA;AAAA,QAInE,YAAE,WAAW;AAAA,MAAA;AAAA,IAAA;AAAA,EAChB,GACF;AAGF,SACE,gBAAAzB,EAAC,OAAA,EAAI,KAAKN,GAAc,WAAWe,GAAWC,GAAO,WAAW5D,CAAS,GACvE,UAAA,gBAAA6D,EAACC,GAAA,EAAK,eAAc,UAAS,YAAW,WACtC,UAAA;AAAA,IAAA,gBAAAD,EAACC,KAAK,gBAAe,iBAAgB,YAAW,cAAa,KAAK,IAChE,UAAA;AAAA,MAAA,gBAAAD,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAC/B,UAAA;AAAA,QAAAb;AAAA,QACAO;AAAA,MAAA,GACH;AAAA,MACCV,KACC,gBAAAI,EAACY,GAAA,EAAK,KAAK,GAAG,gBAAe,YAC1B,UAAAyC,GAAA,CACH;AAAA,IAAA,GAEJ;AAAA,IACC,CAACzD,KACA,gBAAAI;AAAA,MAACuD;AAAA,MAAA;AAAA,QACC,qBACE,CAAC7F,KAAeE,IAAU,CAAC,kBAAkB,gBAAgB,IAAI;AAAA,QAEnE,KAAK;AAAA,QAEJ,UAAAyF;AAAA,MAAA;AAAA,IAAA;AAAA,IAGJ7F,MAAWC,EAAsB,aAChC,gBAAAuC,EAACwD,IAAA,EAAe,OAAO,EAAE,iBAAiB,EAAA,CAAG,IAC3ChG,MAAWC,EAAsB,aACnC,gBAAAuC,EAACwD,IAAA,EAAe,OAAO,EAAE,cAAc,GAAG,aAAa,EAAE,oBAAoB,EAAA,CAAG,IAEhF,gBAAA7C,EAAAiC,GAAA,EACG,UAAA;AAAA,MAAA3E;AAAA,MACAJ,EAAO,SAAS,KACf,gBAAAmC,EAACY,GAAA,EAAK,eAAe,UAAU,KAAK,IACjC,UAAA/C,EAAO,IAAI,CAAC4F,GAAOC,MAClB,gBAAA1D;AAAA,QAACzB;AAAA,QAAA;AAAA,UAEC,OAAOkF,EAAM;AAAA,UACb,QAAQA,EAAM;AAAA,UACd,WAAWA,EAAM;AAAA,UAEhB,YAAM,WAAW;AAAA,QAAA;AAAA,QALb,GAAGA,EAAM,IAAI,IAAIA,EAAM,KAAK;AAAA,MAAA,CAOpC,GACH;AAAA,MAED3F,EAAmB,SAAS,KAC3BE,KACAF,EAAmB,IAAI,CAAA2D,MAAW;AAChC,cAAMkC,IAAclC,EAAQ,eAAe;AAE3C,eAAI6B,GAA4C,SAASK,CAAW,IAEhE,gBAAA3D;AAAA,UAAC4D;AAAA,UAAA;AAAA,YAEC,SAAAnC;AAAA,YACA,eAAe1D,EAAuB4F,CAAW;AAAA,YACjD,uBAAA3F;AAAA,YACA,cAAAI;AAAA,UAAA;AAAA,UAJKuF;AAAA,QAAA,IASJ,gBAAA3D,EAAC6D,IAAA,EAAiC,SAAApC,EAAA,GAAbkC,CAA+B;AAAA,MAC7D,CAAC;AAAA,wBACF/E,GAAA,EAAQ,IAAG,MAAK,UAAS,MACvB,UACG,EADHiD,IACK,4BACFC,KACI,+BACA,qBAHuB,GAIjC;AAAA,MAECD,IACC,gBAAA7B;AAAA,QAAC2C;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,qBAAqB;AAAA,UAC9B,SAAS;AAAA,YACP;AAAA,cACE,OAAO,EAAE,2BAA2B;AAAA,cACpC,QAAQ,MAAMxD,EAAe0B,CAAY;AAAA,YAAA;AAAA,YAE3C;AAAA,cACE,OAAO,EAAE,yBAAyB;AAAA,cAClC,QAAQ,MAAM;AAGZ,sBAAMiD,IAFWnC,GAAuB,UAEX;AAC7B,uBAAOmC,IAAa3E,EAAe,OAAO2E,CAAU,CAAC,IAAI;AAAA,cAC3D;AAAA,YAAA;AAAA,YAEF;AAAA,cACE,OAAO,EAAE,mCAAmC;AAAA,cAC5C,QAAQ,MAAM;AAGZ,sBAAMC,IAFWpC,GAAuB,UAET,kBACzBqC,IAAgBpH,EAAc,eAAemH,CAAY,GACzDE,IAAgBrH,EAAc,oBAAoBmH,CAAY;AACpE,uBAAOA,IAAe,GAAGC,EAAc,IAAI,OAAOC,CAAa,KAAK;AAAA,cACtE;AAAA,YAAA;AAAA,YAEF;AAAA,cACE,OAAO,EAAE,8BAA8B;AAAA,cACvC,QAAQ,MACNtC,GAAuB,YACnB/E,EAAc,oBAAoB+E,EAAsB,SAAS,IACjE;AAAA,YAAA;AAAA,UACR;AAAA,UAEF,MAAM,CAAC,CAAA,CAAE;AAAA,QAAA;AAAA,MAAA,IAETG,KACF,gBAAA9B;AAAA,QAAC2C;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,qBAAqB;AAAA,UAC9B,SAAS;AAAA,YACP;AAAA,cACE,OAAO,EAAE,2BAA2B;AAAA,cACpC,QAAQ,MAAMxD,EAAe0B,CAAY;AAAA,YAAA;AAAA,YAE3C;AAAA,cACE,OAAO,EAAE,0BAA0B;AAAA,cACnC,QAAQ,MAAM;AACZ,sBAAMqD,IAAc9G,EAAY,QAAQ;AACxC,uBAAO+B,EAAe,OAAO+E,KAAe,CAAC,CAAC;AAAA,cAChD;AAAA,YAAA;AAAA,YAEF;AAAA,cACE,OAAO,EAAE,2BAA2B;AAAA,cACpC,QAAQ,MAAM5G,GAAa,uBAAuB;AAAA,YAAA;AAAA,YAEpD;AAAA,cACE,OAAO,EAAE,wBAAwB;AAAA,cACjC,QAAQ,MAAM;AAGZ,sBAAM6G,IAFWxC,GAAuB,UAEZ;AAC5B,uBAAO/E,EAAc,oBAAoBuH,CAAS;AAAA,cACpD;AAAA,YAAA;AAAA,YAEF;AAAA,cACE,OAAO,EAAE,8BAA8B;AAAA,cACvC,QAAQ,MACNxC,GAAuB,YACnB/E,EAAc,oBAAoB+E,EAAsB,SAAS,IACjE;AAAA,YAAA;AAAA,UACR;AAAA,UAEF,MAAM,CAAC,CAAA,CAAE;AAAA,QAAA;AAAA,MAAA,IAGX,gBAAA3B;AAAA,QAAC2C;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,qBAAqB;AAAA,UAC9B,SAAS;AAAA,YACP;AAAA,cACE,OAAO,EAAE,2BAA2B;AAAA,cACpC,QAAQ,MAAMxD,EAAe0B,CAAY;AAAA,YAAA;AAAA,YAE3C;AAAA,cACE,OAAO,EAAE,0BAA0B;AAAA,cACnC,QAAQ,MAAM1B,EAAe,OAAO/B,EAAY,QAAQ,gBAAgB,CAAC,CAAC;AAAA,YAAA;AAAA,YAE5E;AAAA,cACE,OAAO,EAAE,2BAA2B;AAAA,cACpC,QAAQ,MAAME,GAAa,uBAAuB;AAAA,YAAA;AAAA,YAEpD;AAAA,cACE,OAAO,EAAE,wBAAwB;AAAA,cACjC,QAAQ,MAAMV,EAAc,oBAAoBmE,EAAiB;AAAA,YAAA;AAAA,YAEnE;AAAA,cACE,OAAO,EAAE,8BAA8B;AAAA,cACvC,QAAQ,MAAMnE,EAAc,oBAAoBQ,EAAY,SAAS;AAAA,YAAA;AAAA,UACvE;AAAA,UAEF,MAAM,CAAC,CAAA,CAAE;AAAA,QAAA;AAAA,MAAA;AAAA,MAGZc;AAAA,MACD,gBAAA8B;AAAA,QAAClB;AAAA,QAAA;AAAA,UACC,mBAAmBQ;AAAA,UACnB,YAAYD;AAAA,UACZ,cAAY,EAAE,iBAAiB;AAAA,UAC/B,MAAAqD;AAAA,QAAA;AAAA,MAAA;AAAA,MAEDlD,KACC,gBAAAQ;AAAA,QAACrB;AAAA,QAAA;AAAA,UACC,QAAQa;AAAA,UACR,SAAS,MAAM;AACb,YAAAC,EAAsB,EAAK;AAAA,UAC7B;AAAA,UACA,sBAAsBxC;AAAA,UACtB,4BAA4B;AAAA,UAC5B,oBAAoB,EAAE,kBAAkB;AAAA,UACxC,eAAe;AAAA,UACf,kBAAkB,EAAE,kBAAkB;AAAA,UACtC,OAAO,EAAEgD,IAAc,+BAA+B,qBAAqB;AAAA,YACzE,WAAWrD,EAAc,WAAWQ,EAAY,WAAW,SAAS;AAAA,YACpE,SAASR,EAAc,mBAAmBQ,EAAY,WAAW,OAAO;AAAA,UAAA,CACzE;AAAA,UAED,UAAA,gBAAAuD,EAACC,GAAA,EAAK,KAAK,IAAI,eAAc,UAC3B,UAAA;AAAA,YAAA,gBAAAZ,EAACnB,GAAA,EAAM,UAAA,EAAE,yBAAyB,EAAA,CAAE;AAAA,YACnC,OAAOzB,EAAY,QAAQ,eAAe,CAAC,IAAI,KAC9C,gBAAA4C,EAACnB,GAAA,EACE,UAAA,EAAE,mCAAmC;AAAA,cACpC,UAAUsB;AAAA,YAAA,CACX,EAAA,CACH;AAAA,UAAA,EAAA,CAEJ;AAAA,QAAA;AAAA,MAAA;AAAA,IACF,EAAA,CAEJ;AAAA,EAAA,EAAA,CAEJ,EAAA,CACF;AAEJ;"}

package/dist/components/Payroll/PayrollOverview/useSubmissionPoll.js

@@ -1,46 +1,57 @@
-import { useRef as d, useCallback as S } from "react";
-import { PAYROLL_PROCESSING_STATUS as a } from "../../../shared/constants.js";
-import { usePollingTask as y } from "../../../hooks/usePollingTask/usePollingTask.js";
-const b = (r) => r === a.submitting, c = (r, t) => r === !0 || t === a.submit_success, m = (r, t) => {
-  const s = r.payrollShow, n = s?.processingRequest?.status, o = b(n);
-  return o && t && (t.sawSubmitting = !0), n === a.processing_failed ? { done: !0, value: { type: "failed", payroll: s } } : (t?.sawSubmitting === !0 || t?.baseline != null && (s?.processed !== t.baseline.processed || n !== t.baseline.status)) && c(s?.processed, n) ? { done: !0, value: { type: "processed", payroll: s } } : o ? { done: !1 } : { done: !0, value: { type: "loaded" } };
+import { useRef as m, useCallback as y } from "react";
+import { PAYROLL_PROCESSING_STATUS as n } from "../../../shared/constants.js";
+import { usePollingTask as S, isNonRetryablePollError as g } from "../../../hooks/usePollingTask/usePollingTask.js";
+import { useObservability as P } from "../../../contexts/ObservabilityProvider/useObservability.js";
+import { normalizeToSDKError as w } from "../../../types/sdkError.js";
+const v = "Payroll.PayrollOverview", E = (e) => e === n.submitting, h = (e) => e?.baseline != null || e?.sawSubmitting === !0, c = (e, s) => e === !0 || s === n.submit_success, N = (e) => {
+  const s = e?.payrollShow;
+  return c(s?.processed, s?.processingRequest?.status) ? { type: "processed", payroll: s } : { type: "failed", payroll: s };
+}, O = (e, s) => {
+  if (!e.success)
+    return g(e.error) ? { status: "error", error: e.error } : { status: "polling" };
+  const r = e.data.payrollShow, o = r?.processingRequest?.status, i = E(o);
+  return i && s && (s.sawSubmitting = !0), o === n.processing_failed ? { status: "done", value: { type: "failed", payroll: r } } : (s?.sawSubmitting === !0 || s?.baseline != null && (r?.processed !== s.baseline.processed || o !== s.baseline.status)) && c(r?.processed, o) ? { status: "done", value: { type: "processed", payroll: r } } : i ? { status: "polling" } : s?.baseline != null ? { status: "polling" } : { status: "done", value: { type: "loaded" } };
 };
-function R({
-  refetch: r,
-  onProcessed: t,
-  onProcessingFailed: s
+function C({
+  refetch: e,
+  onProcessed: s,
+  onProcessingFailed: r,
+  onError: o
 }) {
-  const n = d(null), o = async () => {
-    const e = await r();
-    if (e.status !== "success") throw e.error ?? new Error("Payroll refetch failed");
-    return e.data;
-  }, l = (e) => {
-    if (e.type === "failed") {
-      s(e.payroll);
+  const i = m(null), { observability: a } = P(), p = async () => {
+    const t = await e();
+    if (t.status !== "success") throw t.error ?? new Error("Payroll refetch failed");
+    return t.data;
+  }, l = (t) => {
+    if (t.type === "failed") {
+      r(t.payroll);
       return;
     }
-    e.type === "processed" && t(e.payroll);
-  }, p = (e) => {
-    const i = e?.payrollShow;
-    if (c(i?.processed, i?.processingRequest?.status)) {
-      t(i);
-      return;
-    }
-    s(i);
-  }, { start: u, isPolling: f } = y({
-    fetch: o,
-    evaluate: (e) => m(e, n.current),
+    t.type === "processed" && s(t.payroll);
+  }, f = (t) => {
+    l(N(t));
+  }, { start: u, isPolling: d } = S({
+    fetch: p,
+    evaluate: (t) => O(t, i.current),
     onDone: l,
-    onDeadline: p
+    onError: (t) => {
+      const b = w(t);
+      a?.onError?.({
+        ...b,
+        timestamp: Date.now(),
+        componentName: v
+      }), h(i.current) && o();
+    },
+    onDeadline: f
   });
-  return { start: S(
-    (e) => {
-      n.current = e, u();
+  return { start: y(
+    (t) => {
+      i.current = t, u();
     },
     [u]
-  ), isPolling: f };
+  ), isPolling: d };
 }
 export {
-  R as useSubmissionPoll
+  C as useSubmissionPoll
 };
 //# sourceMappingURL=useSubmissionPoll.js.map

package/dist/components/Payroll/PayrollOverview/useSubmissionPoll.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSubmissionPoll.js","sources":["../../../../src/components/Payroll/PayrollOverview/useSubmissionPoll.ts"],"sourcesContent":["import { useCallback, useRef } from 'react'\nimport type {\n  PayrollsGetQueryData,\n  PayrollsGetQueryError,\n} from '@gusto/embedded-api/react-query/payrollsGet'\nimport type { QueryObserverResult } from '@tanstack/react-query'\nimport { PAYROLL_PROCESSING_STATUS } from '@/shared/constants'\nimport { usePollingTask, type PollTickResult } from '@/hooks/usePollingTask/usePollingTask'\n\n/** @internal */\nexport type PayrollShow = NonNullable<PayrollsGetQueryData['payrollShow']>\n\ntype SubmissionOutcome =\n  | { type: 'processed'; payroll: PayrollShow | undefined }\n  | { type: 'failed'; payroll: PayrollShow | undefined }\n  | { type: 'loaded' }\n\n/**\n * Per-run state for the submission poll. `baseline` is only known when the run starts from a\n * click on Submit, where the pre-submit render already has data to snapshot. A run started\n * without one (e.g. to guard the initial read on mount) relies on `sawSubmitting` alone.\n *\n * @internal\n */\nexport interface SubmissionPollRun {\n  baseline: { processed: boolean; status: string | undefined } | null\n  sawSubmitting: boolean\n}\n\nconst isSubmittingStatus = (status: string | undefined) =>\n  status === PAYROLL_PROCESSING_STATUS.submitting\n\nconst isProcessedStatus = (processed: boolean | undefined, status: string | undefined) =>\n  processed === true || status === PAYROLL_PROCESSING_STATUS.submit_success\n\nconst evaluateSubmissionOutcome = (\n  queryData: PayrollsGetQueryData,\n  run: SubmissionPollRun | null,\n): PollTickResult<SubmissionOutcome> => {\n  const payroll = queryData.payrollShow\n  const submissionStatus = payroll?.processingRequest?.status\n  const isSubmitting = isSubmittingStatus(submissionStatus)\n\n  if (isSubmitting && run) run.sawSubmitting = true\n\n  if (submissionStatus === PAYROLL_PROCESSING_STATUS.processing_failed) {\n    return { done: true, value: { type: 'failed', payroll } }\n  }\n\n  // Checked ahead of the `isSubmitting` re-poll below: `processed` can flip true while\n  // `processingRequest.status` still reads `submitting` (a real API race), so a transition must\n  // be detected on `processed` alone, not gated on status having already moved on.\n  const isNewTransition =\n    run?.sawSubmitting === true ||\n    (run?.baseline != null &&\n      (payroll?.processed !== run.baseline.processed || submissionStatus !== run.baseline.status))\n\n  if (isNewTransition && isProcessedStatus(payroll?.processed, submissionStatus)) {\n    return { done: true, value: { type: 'processed', payroll } }\n  }\n\n  if (isSubmitting) return { done: false }\n\n  return { done: true, value: { type: 'loaded' } }\n}\n\n/** @internal */\nexport interface UseSubmissionPollOptions {\n  /**\n   * The render-driving payroll query's own `refetch`, reused so the poll's reads land on the\n   * same query the component observes rather than racing a second, independently-built one.\n   */\n  refetch: () => Promise<QueryObserverResult<PayrollsGetQueryData, PayrollsGetQueryError>>\n  onProcessed: (payroll: PayrollShow | undefined) => void\n  onProcessingFailed: (payroll: PayrollShow | undefined) => void\n}\n\n/** @internal */\nexport interface SubmissionPoll {\n  start: (run: SubmissionPollRun) => void\n  isPolling: boolean\n}\n\n/**\n * Polls a payroll until its submission reaches a terminal state, via {@link usePollingTask}.\n *\n * @internal\n */\nexport function useSubmissionPoll({\n  refetch,\n  onProcessed,\n  onProcessingFailed,\n}: UseSubmissionPollOptions): SubmissionPoll {\n  const pollRunRef = useRef<SubmissionPollRun | null>(null)\n\n  const fetchPayroll = async (): Promise<PayrollsGetQueryData> => {\n    const result = await refetch()\n    if (result.status !== 'success') throw result.error ?? new Error('Payroll refetch failed')\n    return result.data\n  }\n\n  const handleDone = (outcome: SubmissionOutcome) => {\n    if (outcome.type === 'failed') {\n      onProcessingFailed(outcome.payroll)\n      return\n    }\n    if (outcome.type === 'processed') {\n      onProcessed(outcome.payroll)\n    }\n  }\n\n  // Verify against the server before reporting failure, same rationale as\n  // PayrollConfiguration's calculation poll: a success that arrived while we were waiting must\n  // never be reported as a failure.\n  const handleDeadline = (lastData: PayrollsGetQueryData | null) => {\n    const payroll = lastData?.payrollShow\n    if (isProcessedStatus(payroll?.processed, payroll?.processingRequest?.status)) {\n      onProcessed(payroll)\n      return\n    }\n    onProcessingFailed(payroll)\n  }\n\n  const { start: startPoll, isPolling } = usePollingTask<PayrollsGetQueryData, SubmissionOutcome>({\n    fetch: fetchPayroll,\n    evaluate: queryData => evaluateSubmissionOutcome(queryData, pollRunRef.current),\n    onDone: handleDone,\n    onDeadline: handleDeadline,\n  })\n\n  const start = useCallback(\n    (run: SubmissionPollRun) => {\n      pollRunRef.current = run\n      startPoll()\n    },\n    [startPoll],\n  )\n\n  return { start, isPolling }\n}\n"],"names":["isSubmittingStatus","status","PAYROLL_PROCESSING_STATUS","isProcessedStatus","processed","evaluateSubmissionOutcome","queryData","run","payroll","submissionStatus","isSubmitting","useSubmissionPoll","refetch","onProcessed","onProcessingFailed","pollRunRef","useRef","fetchPayroll","result","handleDone","outcome","handleDeadline","lastData","startPoll","isPolling","usePollingTask","useCallback"],"mappings":";;;AA6BA,MAAMA,IAAqB,CAACC,MAC1BA,MAAWC,EAA0B,YAEjCC,IAAoB,CAACC,GAAgCH,MACzDG,MAAc,MAAQH,MAAWC,EAA0B,gBAEvDG,IAA4B,CAChCC,GACAC,MACsC;AACtC,QAAMC,IAAUF,EAAU,aACpBG,IAAmBD,GAAS,mBAAmB,QAC/CE,IAAeV,EAAmBS,CAAgB;AAIxD,SAFIC,KAAgBH,MAAKA,EAAI,gBAAgB,KAEzCE,MAAqBP,EAA0B,oBAC1C,EAAE,MAAM,IAAM,OAAO,EAAE,MAAM,UAAU,SAAAM,IAAQ,KAOtDD,GAAK,kBAAkB,MACtBA,GAAK,YAAY,SACfC,GAAS,cAAcD,EAAI,SAAS,aAAaE,MAAqBF,EAAI,SAAS,YAEjEJ,EAAkBK,GAAS,WAAWC,CAAgB,IACpE,EAAE,MAAM,IAAM,OAAO,EAAE,MAAM,aAAa,SAAAD,IAAQ,IAGvDE,IAAqB,EAAE,MAAM,GAAA,IAE1B,EAAE,MAAM,IAAM,OAAO,EAAE,MAAM,WAAS;AAC/C;AAwBO,SAASC,EAAkB;AAAA,EAChC,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,oBAAAC;AACF,GAA6C;AAC3C,QAAMC,IAAaC,EAAiC,IAAI,GAElDC,IAAe,YAA2C;AAC9D,UAAMC,IAAS,MAAMN,EAAA;AACrB,QAAIM,EAAO,WAAW,UAAW,OAAMA,EAAO,SAAS,IAAI,MAAM,wBAAwB;AACzF,WAAOA,EAAO;AAAA,EAChB,GAEMC,IAAa,CAACC,MAA+B;AACjD,QAAIA,EAAQ,SAAS,UAAU;AAC7B,MAAAN,EAAmBM,EAAQ,OAAO;AAClC;AAAA,IACF;AACA,IAAIA,EAAQ,SAAS,eACnBP,EAAYO,EAAQ,OAAO;AAAA,EAE/B,GAKMC,IAAiB,CAACC,MAA0C;AAChE,UAAMd,IAAUc,GAAU;AAC1B,QAAInB,EAAkBK,GAAS,WAAWA,GAAS,mBAAmB,MAAM,GAAG;AAC7E,MAAAK,EAAYL,CAAO;AACnB;AAAA,IACF;AACA,IAAAM,EAAmBN,CAAO;AAAA,EAC5B,GAEM,EAAE,OAAOe,GAAW,WAAAC,EAAA,IAAcC,EAAwD;AAAA,IAC9F,OAAOR;AAAA,IACP,UAAU,CAAAX,MAAaD,EAA0BC,GAAWS,EAAW,OAAO;AAAA,IAC9E,QAAQI;AAAA,IACR,YAAYE;AAAA,EAAA,CACb;AAUD,SAAO,EAAE,OARKK;AAAA,IACZ,CAACnB,MAA2B;AAC1B,MAAAQ,EAAW,UAAUR,GACrBgB,EAAA;AAAA,IACF;AAAA,IACA,CAACA,CAAS;AAAA,EAAA,GAGI,WAAAC,EAAA;AAClB;"}
+{"version":3,"file":"useSubmissionPoll.js","sources":["../../../../src/components/Payroll/PayrollOverview/useSubmissionPoll.ts"],"sourcesContent":["import { useCallback, useRef } from 'react'\nimport type {\n  PayrollsGetQueryData,\n  PayrollsGetQueryError,\n} from '@gusto/embedded-api/react-query/payrollsGet'\nimport type { QueryObserverResult } from '@tanstack/react-query'\nimport { PAYROLL_PROCESSING_STATUS } from '@/shared/constants'\nimport {\n  usePollingTask,\n  isNonRetryablePollError,\n  type PollReadOutcome,\n  type PollTickResult,\n} from '@/hooks/usePollingTask/usePollingTask'\nimport { useObservability } from '@/contexts/ObservabilityProvider/useObservability'\nimport { normalizeToSDKError } from '@/types/sdkError'\n\nconst COMPONENT_NAME = 'Payroll.PayrollOverview'\n\n/** @internal */\nexport type PayrollShow = NonNullable<PayrollsGetQueryData['payrollShow']>\n\ntype SubmissionOutcome =\n  | { type: 'processed'; payroll: PayrollShow | undefined }\n  | { type: 'failed'; payroll: PayrollShow | undefined }\n  | { type: 'loaded' }\n\n/**\n * Per-run state for the submission poll. `baseline` is only known when the run starts from a\n * click on Submit, where the pre-submit render already has data to snapshot. A run started\n * without one (e.g. to guard the initial read on mount) relies on `sawSubmitting` alone.\n *\n * @internal\n */\nexport interface SubmissionPollRun {\n  baseline: { processed: boolean; status: string | undefined } | null\n  sawSubmitting: boolean\n}\n\nconst isSubmittingStatus = (status: string | undefined) =>\n  status === PAYROLL_PROCESSING_STATUS.submitting\n\n// A run only counts as tracking a real submission if it started from a Submit click (baseline\n// set) or has observed a `submitting` status mid-run -- the baseline-less mount poll that never\n// saw either is just guarding the initial render, not watching a submission.\nconst isTrackedSubmission = (run: SubmissionPollRun | null) =>\n  run?.baseline != null || run?.sawSubmitting === true\n\nconst isProcessedStatus = (processed: boolean | undefined, status: string | undefined) =>\n  processed === true || status === PAYROLL_PROCESSING_STATUS.submit_success\n\n// Verify against the last-known data before reporting failure: a success that already landed\n// on the server must never be reported as a failure just because the deadline hit first.\nconst verifiedSubmissionOutcome = (lastData: PayrollsGetQueryData | null): SubmissionOutcome => {\n  const payroll = lastData?.payrollShow\n  if (isProcessedStatus(payroll?.processed, payroll?.processingRequest?.status)) {\n    return { type: 'processed', payroll }\n  }\n  return { type: 'failed', payroll }\n}\n\nconst evaluateSubmissionOutcome = (\n  outcome: PollReadOutcome<PayrollsGetQueryData>,\n  run: SubmissionPollRun | null,\n): PollTickResult<SubmissionOutcome> => {\n  if (!outcome.success) {\n    return isNonRetryablePollError(outcome.error)\n      ? { status: 'error', error: outcome.error }\n      : { status: 'polling' }\n  }\n\n  const payroll = outcome.data.payrollShow\n  const submissionStatus = payroll?.processingRequest?.status\n  const isSubmitting = isSubmittingStatus(submissionStatus)\n\n  if (isSubmitting && run) run.sawSubmitting = true\n\n  if (submissionStatus === PAYROLL_PROCESSING_STATUS.processing_failed) {\n    return { status: 'done', value: { type: 'failed', payroll } }\n  }\n\n  // Checked ahead of the `isSubmitting` re-poll below: `processed` can flip true while\n  // `processingRequest.status` still reads `submitting` (a real API race), so a transition must\n  // be detected on `processed` alone, not gated on status having already moved on.\n  const isNewTransition =\n    run?.sawSubmitting === true ||\n    (run?.baseline != null &&\n      (payroll?.processed !== run.baseline.processed || submissionStatus !== run.baseline.status))\n\n  if (isNewTransition && isProcessedStatus(payroll?.processed, submissionStatus)) {\n    return { status: 'done', value: { type: 'processed', payroll } }\n  }\n\n  if (isSubmitting) return { status: 'polling' }\n\n  // A baseline means Submit was just clicked, so an inconclusive read likely means the async\n  // job hasn't started yet -- keep polling. The baseline-less mount poll is exempt on purpose:\n  // it must not treat an already-settled payroll as a fresh transition.\n  if (run?.baseline != null) return { status: 'polling' }\n\n  return { status: 'done', value: { type: 'loaded' } }\n}\n\n/** @internal */\nexport interface UseSubmissionPollOptions {\n  /**\n   * The render-driving payroll query's own `refetch`, reused so the poll's reads land on the\n   * same query the component observes rather than racing a second, independently-built one.\n   */\n  refetch: () => Promise<QueryObserverResult<PayrollsGetQueryData, PayrollsGetQueryError>>\n  onProcessed: (payroll: PayrollShow | undefined) => void\n  onProcessingFailed: (payroll: PayrollShow | undefined) => void\n  /**\n   * Called when the poll gives up on a non-retryable read error, but only for a run that was\n   * actually tracking a submission (`baseline` set, or a `submitting` status observed mid-run).\n   * A baseline-less mount poll that never saw `submitting` swallows the error here -- it was only\n   * guarding the initial render, not watching a real submission, so surfacing it as a processing\n   * failure would be a false failure. The raw error is reported to observability by this hook\n   * either way.\n   */\n  onError: () => void\n}\n\n/** @internal */\nexport interface SubmissionPoll {\n  start: (run: SubmissionPollRun) => void\n  isPolling: boolean\n}\n\n/**\n * Polls a payroll until its submission reaches a terminal state, via {@link usePollingTask}.\n *\n * @internal\n */\nexport function useSubmissionPoll({\n  refetch,\n  onProcessed,\n  onProcessingFailed,\n  onError,\n}: UseSubmissionPollOptions): SubmissionPoll {\n  const pollRunRef = useRef<SubmissionPollRun | null>(null)\n  const { observability } = useObservability()\n\n  const fetchPayroll = async (): Promise<PayrollsGetQueryData> => {\n    const result = await refetch()\n    if (result.status !== 'success') throw result.error ?? new Error('Payroll refetch failed')\n    return result.data\n  }\n\n  const handleDone = (outcome: SubmissionOutcome) => {\n    if (outcome.type === 'failed') {\n      onProcessingFailed(outcome.payroll)\n      return\n    }\n    if (outcome.type === 'processed') {\n      onProcessed(outcome.payroll)\n    }\n  }\n\n  const handleDeadline = (lastData: PayrollsGetQueryData | null) => {\n    handleDone(verifiedSubmissionOutcome(lastData))\n  }\n\n  const { start: startPoll, isPolling } = usePollingTask<PayrollsGetQueryData, SubmissionOutcome>({\n    fetch: fetchPayroll,\n    evaluate: outcome => evaluateSubmissionOutcome(outcome, pollRunRef.current),\n    onDone: handleDone,\n    onError: error => {\n      const sdkError = normalizeToSDKError(error)\n      observability?.onError?.({\n        ...sdkError,\n        timestamp: Date.now(),\n        componentName: COMPONENT_NAME,\n      })\n      // Don't emit a processing failed error if we never observed this payroll\n      // be submitted; this could just be a load issue\n      if (isTrackedSubmission(pollRunRef.current)) {\n        onError()\n      }\n    },\n    onDeadline: handleDeadline,\n  })\n\n  const start = useCallback(\n    (run: SubmissionPollRun) => {\n      pollRunRef.current = run\n      startPoll()\n    },\n    [startPoll],\n  )\n\n  return { start, isPolling }\n}\n"],"names":["COMPONENT_NAME","isSubmittingStatus","status","PAYROLL_PROCESSING_STATUS","isTrackedSubmission","run","isProcessedStatus","processed","verifiedSubmissionOutcome","lastData","payroll","evaluateSubmissionOutcome","outcome","isNonRetryablePollError","submissionStatus","isSubmitting","useSubmissionPoll","refetch","onProcessed","onProcessingFailed","onError","pollRunRef","useRef","observability","useObservability","fetchPayroll","result","handleDone","handleDeadline","startPoll","isPolling","usePollingTask","error","sdkError","normalizeToSDKError","useCallback"],"mappings":";;;;;AAgBA,MAAMA,IAAiB,2BAsBjBC,IAAqB,CAACC,MAC1BA,MAAWC,EAA0B,YAKjCC,IAAsB,CAACC,MAC3BA,GAAK,YAAY,QAAQA,GAAK,kBAAkB,IAE5CC,IAAoB,CAACC,GAAgCL,MACzDK,MAAc,MAAQL,MAAWC,EAA0B,gBAIvDK,IAA4B,CAACC,MAA6D;AAC9F,QAAMC,IAAUD,GAAU;AAC1B,SAAIH,EAAkBI,GAAS,WAAWA,GAAS,mBAAmB,MAAM,IACnE,EAAE,MAAM,aAAa,SAAAA,EAAA,IAEvB,EAAE,MAAM,UAAU,SAAAA,EAAA;AAC3B,GAEMC,IAA4B,CAChCC,GACAP,MACsC;AACtC,MAAI,CAACO,EAAQ;AACX,WAAOC,EAAwBD,EAAQ,KAAK,IACxC,EAAE,QAAQ,SAAS,OAAOA,EAAQ,MAAA,IAClC,EAAE,QAAQ,UAAA;AAGhB,QAAMF,IAAUE,EAAQ,KAAK,aACvBE,IAAmBJ,GAAS,mBAAmB,QAC/CK,IAAed,EAAmBa,CAAgB;AAIxD,SAFIC,KAAgBV,MAAKA,EAAI,gBAAgB,KAEzCS,MAAqBX,EAA0B,oBAC1C,EAAE,QAAQ,QAAQ,OAAO,EAAE,MAAM,UAAU,SAAAO,IAAQ,KAO1DL,GAAK,kBAAkB,MACtBA,GAAK,YAAY,SACfK,GAAS,cAAcL,EAAI,SAAS,aAAaS,MAAqBT,EAAI,SAAS,YAEjEC,EAAkBI,GAAS,WAAWI,CAAgB,IACpE,EAAE,QAAQ,QAAQ,OAAO,EAAE,MAAM,aAAa,SAAAJ,IAAQ,IAG3DK,IAAqB,EAAE,QAAQ,UAAA,IAK/BV,GAAK,YAAY,OAAa,EAAE,QAAQ,UAAA,IAErC,EAAE,QAAQ,QAAQ,OAAO,EAAE,MAAM,WAAS;AACnD;AAiCO,SAASW,EAAkB;AAAA,EAChC,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,SAAAC;AACF,GAA6C;AAC3C,QAAMC,IAAaC,EAAiC,IAAI,GAClD,EAAE,eAAAC,EAAA,IAAkBC,EAAA,GAEpBC,IAAe,YAA2C;AAC9D,UAAMC,IAAS,MAAMT,EAAA;AACrB,QAAIS,EAAO,WAAW,UAAW,OAAMA,EAAO,SAAS,IAAI,MAAM,wBAAwB;AACzF,WAAOA,EAAO;AAAA,EAChB,GAEMC,IAAa,CAACf,MAA+B;AACjD,QAAIA,EAAQ,SAAS,UAAU;AAC7B,MAAAO,EAAmBP,EAAQ,OAAO;AAClC;AAAA,IACF;AACA,IAAIA,EAAQ,SAAS,eACnBM,EAAYN,EAAQ,OAAO;AAAA,EAE/B,GAEMgB,IAAiB,CAACnB,MAA0C;AAChE,IAAAkB,EAAWnB,EAA0BC,CAAQ,CAAC;AAAA,EAChD,GAEM,EAAE,OAAOoB,GAAW,WAAAC,EAAA,IAAcC,EAAwD;AAAA,IAC9F,OAAON;AAAA,IACP,UAAU,CAAAb,MAAWD,EAA0BC,GAASS,EAAW,OAAO;AAAA,IAC1E,QAAQM;AAAA,IACR,SAAS,CAAAK,MAAS;AAChB,YAAMC,IAAWC,EAAoBF,CAAK;AAC1C,MAAAT,GAAe,UAAU;AAAA,QACvB,GAAGU;AAAA,QACH,WAAW,KAAK,IAAA;AAAA,QAChB,eAAejC;AAAA,MAAA,CAChB,GAGGI,EAAoBiB,EAAW,OAAO,KACxCD,EAAA;AAAA,IAEJ;AAAA,IACA,YAAYQ;AAAA,EAAA,CACb;AAUD,SAAO,EAAE,OARKO;AAAA,IACZ,CAAC9B,MAA2B;AAC1B,MAAAgB,EAAW,UAAUhB,GACrBwB,EAAA;AAAA,IACF;AAAA,IACA,CAACA,CAAS;AAAA,EAAA,GAGI,WAAAC,EAAA;AAClB;"}

package/dist/components/Payroll/PayrollReceipts/PayrollReceipts.js

@@ -1,32 +1,38 @@
 import { jsx as t } from "react/jsx-runtime";
-import { usePayrollsGetReceiptSuspense as i } from "@gusto/embedded-api/react-query/payrollsGetReceipt";
-import { PayrollReceiptsPresentation as c } from "./PayrollReceiptsPresentation.js";
-import { BaseComponent as y } from "../../Base/Base.js";
+import { usePayrollsGetReceiptSuspense as c } from "@gusto/embedded-api/react-query/payrollsGetReceipt";
+import { PayrollReceiptsPresentation as y } from "./PayrollReceiptsPresentation.js";
+import { BaseComponent as u } from "../../Base/Base.js";
 import "../../Base/useBase.js";
-import { useComponentDictionary as u, useI18n as C } from "../../../i18n/I18n.js";
-function x(e) {
-  return /* @__PURE__ */ t(y, { ...e, children: /* @__PURE__ */ t(f, { ...e, children: e.children }) });
+import { useComponentDictionary as C, useI18n as f } from "../../../i18n/I18n.js";
+function F(e) {
+  return /* @__PURE__ */ t(u, { ...e, children: /* @__PURE__ */ t(P, { ...e, children: e.children }) });
 }
-const f = ({ payrollId: e, dictionary: m, withReimbursements: n = !0 }) => {
-  u("Payroll.PayrollReceipts", m), C("Payroll.PayrollReceipts");
-  const { data: p } = i({
+const P = ({
+  payrollId: e,
+  dictionary: m,
+  withReimbursements: n = !0,
+  className: p
+}) => {
+  C("Payroll.PayrollReceipts", m), f("Payroll.PayrollReceipts");
+  const { data: s } = c({
     payrollUuid: e
-  }), o = p.payrollReceipt;
+  }), o = s.payrollReceipt;
   if (!o)
     return null;
-  const s = o.employeeCompensations ? [...o.employeeCompensations].sort((r, l) => {
+  const i = o.employeeCompensations ? [...o.employeeCompensations].sort((r, l) => {
     const a = (r.employeeLastName ?? "").localeCompare(l.employeeLastName ?? "");
     return a !== 0 ? a : (r.employeeFirstName ?? "").localeCompare(l.employeeFirstName ?? "");
   }) : void 0;
   return /* @__PURE__ */ t(
-    c,
+    y,
     {
-      receiptData: { ...o, employeeCompensations: s },
+      className: p,
+      receiptData: { ...o, employeeCompensations: i },
       withReimbursements: n
     }
   );
 };
 export {
-  x as PayrollReceipts
+  F as PayrollReceipts
 };
 //# sourceMappingURL=PayrollReceipts.js.map

package/dist/components/Payroll/PayrollReceipts/PayrollReceipts.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayrollReceipts.js","sources":["../../../../src/components/Payroll/PayrollReceipts/PayrollReceipts.tsx"],"sourcesContent":["import { usePayrollsGetReceiptSuspense } from '@gusto/embedded-api/react-query/payrollsGetReceipt'\nimport { PayrollReceiptsPresentation } from './PayrollReceiptsPresentation'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary, useI18n } from '@/i18n'\n\n/**\n * Props for {@link PayrollReceipts}.\n *\n * @public\n */\nexport interface PayrollReceiptsProps extends BaseComponentInterface<'Payroll.PayrollReceipts'> {\n  /** Identifier of the payroll whose receipt should be displayed. */\n  payrollId: string\n  /** Whether to include reimbursement amounts in the breakdown and employee tables. Defaults to `true`. */\n  withReimbursements?: boolean\n}\n\n/**\n * Displays a detailed receipt for a completed payroll, including the debited total, per-category\n * breakdown, tax breakdown, and a per-employee summary of payment method, garnishments,\n * reimbursements, taxes, and net pay.\n *\n * @param props - See {@link PayrollReceiptsProps}.\n * @returns The rendered payroll receipt.\n * @public\n *\n * @example\n * ```tsx\n * import { Payroll } from '@gusto/embedded-react-sdk'\n *\n * function MyComponent() {\n *   return <Payroll.PayrollReceipts payrollId=\"your-payroll-id\" onEvent={() => {}} />\n * }\n * ```\n */\nexport function PayrollReceipts(props: PayrollReceiptsProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ payrollId, dictionary, withReimbursements = true }: PayrollReceiptsProps) => {\n  useComponentDictionary('Payroll.PayrollReceipts', dictionary)\n  useI18n('Payroll.PayrollReceipts')\n\n  const { data } = usePayrollsGetReceiptSuspense({\n    payrollUuid: payrollId,\n  })\n  const payrollData = data.payrollReceipt\n\n  if (!payrollData) {\n    return null\n  }\n\n  const sortedEmployeeCompensations = payrollData.employeeCompensations\n    ? [...payrollData.employeeCompensations].sort((a, b) => {\n        const lastNameCmp = (a.employeeLastName ?? '').localeCompare(b.employeeLastName ?? '')\n        if (lastNameCmp !== 0) return lastNameCmp\n        return (a.employeeFirstName ?? '').localeCompare(b.employeeFirstName ?? '')\n      })\n    : undefined\n\n  return (\n    <PayrollReceiptsPresentation\n      receiptData={{ ...payrollData, employeeCompensations: sortedEmployeeCompensations }}\n      withReimbursements={withReimbursements}\n    />\n  )\n}\n"],"names":["PayrollReceipts","props","jsx","BaseComponent","Root","payrollId","dictionary","withReimbursements","useComponentDictionary","useI18n","data","usePayrollsGetReceiptSuspense","payrollData","sortedEmployeeCompensations","a","b","lastNameCmp","PayrollReceiptsPresentation"],"mappings":";;;;;;AAmCO,SAASA,EAAgBC,GAA6B;AAC3D,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GACjB,UAAA,gBAAAC,EAACE,KAAM,GAAGH,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,MAAMG,IAAO,CAAC,EAAE,WAAAC,GAAW,YAAAC,GAAY,oBAAAC,IAAqB,SAAiC;AAC3F,EAAAC,EAAuB,2BAA2BF,CAAU,GAC5DG,EAAQ,yBAAyB;AAEjC,QAAM,EAAE,MAAAC,EAAA,IAASC,EAA8B;AAAA,IAC7C,aAAaN;AAAA,EAAA,CACd,GACKO,IAAcF,EAAK;AAEzB,MAAI,CAACE;AACH,WAAO;AAGT,QAAMC,IAA8BD,EAAY,wBAC5C,CAAC,GAAGA,EAAY,qBAAqB,EAAE,KAAK,CAACE,GAAGC,MAAM;AACpD,UAAMC,KAAeF,EAAE,oBAAoB,IAAI,cAAcC,EAAE,oBAAoB,EAAE;AACrF,WAAIC,MAAgB,IAAUA,KACtBF,EAAE,qBAAqB,IAAI,cAAcC,EAAE,qBAAqB,EAAE;AAAA,EAC5E,CAAC,IACD;AAEJ,SACE,gBAAAb;AAAA,IAACe;AAAA,IAAA;AAAA,MACC,aAAa,EAAE,GAAGL,GAAa,uBAAuBC,EAAA;AAAA,MACtD,oBAAAN;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"PayrollReceipts.js","sources":["../../../../src/components/Payroll/PayrollReceipts/PayrollReceipts.tsx"],"sourcesContent":["import { usePayrollsGetReceiptSuspense } from '@gusto/embedded-api/react-query/payrollsGetReceipt'\nimport { PayrollReceiptsPresentation } from './PayrollReceiptsPresentation'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary, useI18n } from '@/i18n'\n\n/**\n * Props for {@link PayrollReceipts}.\n *\n * @public\n */\nexport interface PayrollReceiptsProps extends BaseComponentInterface<'Payroll.PayrollReceipts'> {\n  /** Identifier of the payroll whose receipt should be displayed. */\n  payrollId: string\n  /** Whether to include reimbursement amounts in the breakdown and employee tables. Defaults to `true`. */\n  withReimbursements?: boolean\n}\n\n/**\n * Displays a detailed receipt for a completed payroll, including the debited total, per-category\n * breakdown, tax breakdown, and a per-employee summary of payment method, garnishments,\n * reimbursements, taxes, and net pay.\n *\n * @param props - See {@link PayrollReceiptsProps}.\n * @returns The rendered payroll receipt.\n * @public\n *\n * @example\n * ```tsx\n * import { Payroll } from '@gusto/embedded-react-sdk'\n *\n * function MyComponent() {\n *   return <Payroll.PayrollReceipts payrollId=\"your-payroll-id\" onEvent={() => {}} />\n * }\n * ```\n */\nexport function PayrollReceipts(props: PayrollReceiptsProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst Root = ({\n  payrollId,\n  dictionary,\n  withReimbursements = true,\n  className,\n}: PayrollReceiptsProps) => {\n  useComponentDictionary('Payroll.PayrollReceipts', dictionary)\n  useI18n('Payroll.PayrollReceipts')\n\n  const { data } = usePayrollsGetReceiptSuspense({\n    payrollUuid: payrollId,\n  })\n  const payrollData = data.payrollReceipt\n\n  if (!payrollData) {\n    return null\n  }\n\n  const sortedEmployeeCompensations = payrollData.employeeCompensations\n    ? [...payrollData.employeeCompensations].sort((a, b) => {\n        const lastNameCmp = (a.employeeLastName ?? '').localeCompare(b.employeeLastName ?? '')\n        if (lastNameCmp !== 0) return lastNameCmp\n        return (a.employeeFirstName ?? '').localeCompare(b.employeeFirstName ?? '')\n      })\n    : undefined\n\n  return (\n    <PayrollReceiptsPresentation\n      className={className}\n      receiptData={{ ...payrollData, employeeCompensations: sortedEmployeeCompensations }}\n      withReimbursements={withReimbursements}\n    />\n  )\n}\n"],"names":["PayrollReceipts","props","jsx","BaseComponent","Root","payrollId","dictionary","withReimbursements","className","useComponentDictionary","useI18n","data","usePayrollsGetReceiptSuspense","payrollData","sortedEmployeeCompensations","a","b","lastNameCmp","PayrollReceiptsPresentation"],"mappings":";;;;;;AAmCO,SAASA,EAAgBC,GAA6B;AAC3D,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GACjB,UAAA,gBAAAC,EAACE,KAAM,GAAGH,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,MAAMG,IAAO,CAAC;AAAA,EACZ,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,oBAAAC,IAAqB;AAAA,EACrB,WAAAC;AACF,MAA4B;AAC1B,EAAAC,EAAuB,2BAA2BH,CAAU,GAC5DI,EAAQ,yBAAyB;AAEjC,QAAM,EAAE,MAAAC,EAAA,IAASC,EAA8B;AAAA,IAC7C,aAAaP;AAAA,EAAA,CACd,GACKQ,IAAcF,EAAK;AAEzB,MAAI,CAACE;AACH,WAAO;AAGT,QAAMC,IAA8BD,EAAY,wBAC5C,CAAC,GAAGA,EAAY,qBAAqB,EAAE,KAAK,CAACE,GAAGC,MAAM;AACpD,UAAMC,KAAeF,EAAE,oBAAoB,IAAI,cAAcC,EAAE,oBAAoB,EAAE;AACrF,WAAIC,MAAgB,IAAUA,KACtBF,EAAE,qBAAqB,IAAI,cAAcC,EAAE,qBAAqB,EAAE;AAAA,EAC5E,CAAC,IACD;AAEJ,SACE,gBAAAd;AAAA,IAACgB;AAAA,IAAA;AAAA,MACC,WAAAV;AAAA,MACA,aAAa,EAAE,GAAGK,GAAa,uBAAuBC,EAAA;AAAA,MACtD,oBAAAP;AAAA,IAAA;AAAA,EAAA;AAGN;"}