@gusto/embedded-react-sdk 0.55.0 → 0.55.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +36 -0
- package/dist/components/Common/TaxInputs/TaxInputs.js +65 -64
- package/dist/components/Common/TaxInputs/TaxInputs.js.map +1 -1
- package/dist/components/Common/UI/Select/Select.module.scss.js +5 -5
- package/dist/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.d.ts +4 -2
- package/dist/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.js +148 -117
- package/dist/components/Contractor/Payments/CreateHistoricalPayment/CreateHistoricalPayment.js.map +1 -1
- package/dist/components/Contractor/Payments/CreatePayment/PreviewPresentation.js +56 -55
- package/dist/components/Contractor/Payments/CreatePayment/PreviewPresentation.js.map +1 -1
- package/dist/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.d.ts +1 -1
- package/dist/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.js +15 -12
- package/dist/components/Contractor/Payments/CreatePaymentFlow/CreatePaymentFlow.js.map +1 -1
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/HistoricalPaymentFlow.d.ts +69 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/HistoricalPaymentFlow.js +48 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/HistoricalPaymentFlow.js.map +1 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/HistoricalPaymentFlowComponents.d.ts +20 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/HistoricalPaymentFlowComponents.js +25 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/HistoricalPaymentFlowComponents.js.map +1 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/historicalPaymentMachine.d.ts +20 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/historicalPaymentMachine.js +24 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/historicalPaymentMachine.js.map +1 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentFlow/index.d.ts +2 -0
- package/dist/components/Contractor/Payments/HistoricalPaymentSummary/HistoricalPaymentSummary.js +16 -15
- package/dist/components/Contractor/Payments/HistoricalPaymentSummary/HistoricalPaymentSummary.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentFlow/PaymentFlowComponents.d.ts +2 -0
- package/dist/components/Contractor/Payments/PaymentFlow/PaymentFlowComponents.js +36 -23
- package/dist/components/Contractor/Payments/PaymentFlow/PaymentFlowComponents.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentFlow/paymentStateMachine.d.ts +10 -8
- package/dist/components/Contractor/Payments/PaymentFlow/paymentStateMachine.js +46 -25
- package/dist/components/Contractor/Payments/PaymentFlow/paymentStateMachine.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentHistory/PaymentHistoryPresentation.js +53 -52
- package/dist/components/Contractor/Payments/PaymentHistory/PaymentHistoryPresentation.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentStatement/PaymentStatementPresentation.js +37 -47
- package/dist/components/Contractor/Payments/PaymentStatement/PaymentStatementPresentation.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js +47 -44
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.d.ts +2 -1
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.js +65 -53
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.js.map +1 -1
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.module.scss.js +6 -4
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.module.scss.js.map +1 -1
- package/dist/components/Contractor/Payments/ViewPaymentFlow/ViewPaymentFlow.d.ts +1 -1
- package/dist/components/Contractor/Payments/ViewPaymentFlow/ViewPaymentFlow.js +22 -19
- package/dist/components/Contractor/Payments/ViewPaymentFlow/ViewPaymentFlow.js.map +1 -1
- package/dist/components/Contractor/Payments/shared/PaymentSummaryBlock/PaymentSummaryBlock.d.ts +2 -8
- package/dist/components/Contractor/Payments/shared/PaymentSummaryBlock/PaymentSummaryBlock.js +43 -42
- package/dist/components/Contractor/Payments/shared/PaymentSummaryBlock/PaymentSummaryBlock.js.map +1 -1
- package/dist/components/Contractor/Payments/shared/paymentAmounts.d.ts +32 -0
- package/dist/components/Contractor/Payments/shared/paymentAmounts.js +11 -0
- package/dist/components/Contractor/Payments/shared/paymentAmounts.js.map +1 -0
- package/dist/components/Contractor/Payments/shared/paymentAmounts.test.d.ts +1 -0
- package/dist/components/Contractor/Payments/shared/usePaymentAmountsEditor.d.ts +13 -4
- package/dist/components/Contractor/Payments/shared/usePaymentAmountsEditor.js +43 -38
- package/dist/components/Contractor/Payments/shared/usePaymentAmountsEditor.js.map +1 -1
- package/dist/components/Contractor/exports/contractorManagement.d.ts +1 -0
- package/dist/components/Contractor/exports/contractorManagement.js +34 -32
- package/dist/components/Contractor/exports/contractorManagement.js.map +1 -1
- package/dist/components/Contractor/shared/SelectContractors/SelectContractors.d.ts +6 -1
- package/dist/components/Contractor/shared/SelectContractors/SelectContractors.js +13 -12
- package/dist/components/Contractor/shared/SelectContractors/SelectContractors.js.map +1 -1
- package/dist/components/Contractor/shared/SelectContractors/useSelectContractors.d.ts +5 -1
- package/dist/components/Contractor/shared/SelectContractors/useSelectContractors.js +34 -32
- package/dist/components/Contractor/shared/SelectContractors/useSelectContractors.js.map +1 -1
- package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.d.ts +7 -0
- package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.js +191 -153
- package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.js.map +1 -1
- package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.d.ts +1 -0
- package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.js +87 -81
- package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.js.map +1 -1
- package/dist/components/Payroll/PayrollExecutionFlow/PayrollExecutionFlow.d.ts +1 -0
- package/dist/components/Payroll/PayrollExecutionFlow/PayrollExecutionFlow.js.map +1 -1
- package/dist/components/Payroll/PayrollExecutionFlow/payrollExecutionMachine.js +73 -48
- package/dist/components/Payroll/PayrollExecutionFlow/payrollExecutionMachine.js.map +1 -1
- package/dist/components/Payroll/PayrollFlow/PayrollFlow.d.ts +1 -1
- package/dist/components/Payroll/PayrollFlow/PayrollFlow.js +22 -20
- package/dist/components/Payroll/PayrollFlow/PayrollFlow.js.map +1 -1
- package/dist/components/Payroll/PayrollFlow/PayrollFlowComponents.d.ts +3 -0
- package/dist/components/Payroll/PayrollFlow/PayrollFlowComponents.js +22 -20
- package/dist/components/Payroll/PayrollFlow/PayrollFlowComponents.js.map +1 -1
- package/dist/components/Payroll/PayrollLanding/PayrollLanding.d.ts +2 -0
- package/dist/components/Payroll/PayrollLanding/PayrollLanding.js +34 -26
- package/dist/components/Payroll/PayrollLanding/PayrollLanding.js.map +1 -1
- package/dist/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.d.ts +4 -0
- package/dist/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.js +51 -43
- package/dist/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.js.map +1 -1
- package/dist/components/Payroll/PayrollList/PayrollList.d.ts +2 -0
- package/dist/components/Payroll/PayrollList/PayrollList.js +48 -47
- package/dist/components/Payroll/PayrollList/PayrollList.js.map +1 -1
- package/dist/components/Payroll/PayrollList/PayrollListPresentation.d.ts +2 -1
- package/dist/components/Payroll/PayrollList/PayrollListPresentation.js +44 -43
- package/dist/components/Payroll/PayrollList/PayrollListPresentation.js.map +1 -1
- package/dist/components/Payroll/PayrollOverview/PayrollOverview.d.ts +7 -0
- package/dist/components/Payroll/PayrollOverview/PayrollOverview.js +115 -112
- package/dist/components/Payroll/PayrollOverview/PayrollOverview.js.map +1 -1
- package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.d.ts +2 -1
- package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.js +94 -103
- package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.js.map +1 -1
- package/dist/components/Payroll/PayrollReceipts/PayrollReceipts.js +22 -16
- package/dist/components/Payroll/PayrollReceipts/PayrollReceipts.js.map +1 -1
- package/dist/components/Payroll/PayrollReceipts/PayrollReceiptsPresentation.js +58 -49
- package/dist/components/Payroll/PayrollReceipts/PayrollReceiptsPresentation.js.map +1 -1
- package/dist/components/Payroll/PrintChecks/PrintChecks.d.ts +21 -0
- package/dist/components/Payroll/PrintChecks/PrintChecks.js +68 -0
- package/dist/components/Payroll/PrintChecks/PrintChecks.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksBanner/PrintChecksBanner.d.ts +9 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksBanner/PrintChecksBanner.js +34 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksBanner/PrintChecksBanner.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksBanner/index.d.ts +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksComponents.d.ts +48 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksComponents.js +26 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksComponents.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksFailure/PrintChecksFailure.d.ts +14 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksFailure/PrintChecksFailure.js +47 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksFailure/PrintChecksFailure.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksFailure/index.d.ts +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksForm/PrintChecksForm.d.ts +16 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksForm/PrintChecksForm.js +144 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksForm/PrintChecksForm.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksForm/index.d.ts +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksSummary/PrintChecksSummary.d.ts +14 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksSummary/PrintChecksSummary.js +39 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksSummary/PrintChecksSummary.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/PrintChecksSummary/index.d.ts +1 -0
- package/dist/components/Payroll/PrintChecks/index.d.ts +2 -0
- package/dist/components/Payroll/PrintChecks/printChecksStateMachine.d.ts +33 -0
- package/dist/components/Payroll/PrintChecks/printChecksStateMachine.js +93 -0
- package/dist/components/Payroll/PrintChecks/printChecksStateMachine.js.map +1 -0
- package/dist/components/Payroll/PrintChecks/types.d.ts +14 -0
- package/dist/components/Payroll/index.d.ts +2 -0
- package/dist/components/Payroll/index.js +26 -24
- package/dist/components/Payroll/index.js.map +1 -1
- package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.d.ts +6 -0
- package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.js +36 -34
- package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.js.map +1 -1
- package/dist/contexts/UnstableFeaturesProvider/UnstableFeaturesProvider.d.ts +22 -0
- package/dist/contexts/UnstableFeaturesProvider/UnstableFeaturesProvider.js +14 -0
- package/dist/contexts/UnstableFeaturesProvider/UnstableFeaturesProvider.js.map +1 -0
- package/dist/contexts/UnstableFeaturesProvider/WithUnstableFeature.d.ts +19 -0
- package/dist/contexts/UnstableFeaturesProvider/WithUnstableFeature.js +8 -0
- package/dist/contexts/UnstableFeaturesProvider/WithUnstableFeature.js.map +1 -0
- package/dist/contexts/UnstableFeaturesProvider/useUnstableFeature.d.ts +41 -0
- package/dist/contexts/UnstableFeaturesProvider/useUnstableFeature.js +14 -0
- package/dist/contexts/UnstableFeaturesProvider/useUnstableFeature.js.map +1 -0
- package/dist/contexts/index.d.ts +1 -0
- package/dist/i18n/I18n.js +4 -0
- package/dist/i18n/I18n.js.map +1 -1
- package/dist/i18n/en/Contractor.Payments.CreateHistoricalPayment.json.js +34 -32
- package/dist/i18n/en/Contractor.Payments.CreateHistoricalPayment.json.js.map +1 -1
- package/dist/i18n/en/Contractor.Payments.PaymentsList.json.js +20 -18
- package/dist/i18n/en/Contractor.Payments.PaymentsList.json.js.map +1 -1
- package/dist/i18n/en/Payroll.PayrollConfiguration.json.js +9 -9
- package/dist/i18n/en/Payroll.PayrollOverview.json.js +38 -38
- package/dist/i18n/en/Payroll.PayrollReceipts.json.js +2 -2
- package/dist/i18n/en/Payroll.PrintChecksBanner.json.js +14 -0
- package/dist/i18n/en/Payroll.PrintChecksBanner.json.js.map +1 -0
- package/dist/i18n/en/Payroll.PrintChecksFailure.json.js +12 -0
- package/dist/i18n/en/Payroll.PrintChecksFailure.json.js.map +1 -0
- package/dist/i18n/en/Payroll.PrintChecksForm.json.js +28 -0
- package/dist/i18n/en/Payroll.PrintChecksForm.json.js.map +1 -0
- package/dist/i18n/en/Payroll.PrintChecksSummary.json.js +14 -0
- package/dist/i18n/en/Payroll.PrintChecksSummary.json.js.map +1 -0
- package/dist/i18n/en/common.json.d.ts +0 -21
- package/dist/i18n/types.d.ts +75 -9
- package/dist/models/external.d.ts +3 -0
- package/dist/partner-hook-utils/form/buildFormSchema.js +60 -54
- package/dist/partner-hook-utils/form/buildFormSchema.js.map +1 -1
- package/dist/shared/constants.d.ts +30 -0
- package/dist/shared/constants.js +62 -50
- package/dist/shared/constants.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/test-utils/renderWithProviders.d.ts +4 -1
- package/dist/test-utils/tableQueries.d.ts +9 -0
- package/docs/guides/endpoint-inventory.json +33 -0
- package/package.json +18 -18
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PayrollReceiptsPresentation.js","sources":["../../../../src/components/Payroll/PayrollReceipts/PayrollReceiptsPresentation.tsx"],"sourcesContent":["import { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport type {\n PayrollReceipt,\n Taxes as TaxBreakdownItem,\n PayrollReceiptEmployeeCompensations as EmployeeBreakdownItem,\n} from '@gusto/embedded-api/models/components/payrollreceipt'\nimport styles from './PayrollReceiptsPresentation.module.scss'\nimport { DataView, DataTable, Flex } from '@/components/Common'\nimport type { DescriptionListItem } from '@/components/Common/UI/DescriptionList/DescriptionListTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { formatNumberAsCurrency, formatPhoneNumber } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { useContainerBreakpoints } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport ReceiptCheck from '@/assets/icons/receipt-check.svg?react'\n\ninterface PayrollReceiptsPresentationProps {\n receiptData: PayrollReceipt\n withReimbursements?: boolean\n}\n\n/** @internal */\nexport const PayrollReceiptsPresentation = ({\n receiptData,\n withReimbursements = true,\n}: PayrollReceiptsPresentationProps) => {\n const Components = useComponentContext()\n const { Heading, Text } = Components\n useI18n('Payroll.PayrollReceipts')\n const { t } = useTranslation('Payroll.PayrollReceipts')\n\n const containerRef = useRef<HTMLDivElement>(null)\n const breakpoints = useContainerBreakpoints({ ref: containerRef })\n const isMobile = !breakpoints.includes('small')\n\n // Helper to get employee full name\n const getEmployeeFullName = (emp: EmployeeBreakdownItem) =>\n `${emp.employeeFirstName || ''} ${emp.employeeLastName || ''}`.trim()\n\n const getTotalChildSupport = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.childSupportGarnishment || '0'),\n 0,\n )\n\n const getTotalReimbursements = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.totalReimbursement || '0'),\n 0,\n )\n\n const getTotalNetPay = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.netPay || '0'),\n 0,\n )\n\n const getTotalTaxes = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.totalTax || '0'),\n 0,\n )\n\n const breakdownData = [\n {\n label: t('breakdown.directDeposits'),\n amount: parseFloat(receiptData.totals?.netPayDebit || '0'),\n },\n ...(withReimbursements\n ? [\n {\n label: t('breakdown.reimbursements'),\n amount: parseFloat(receiptData.totals?.reimbursementDebit || '0'),\n },\n ]\n : []),\n {\n label: t('breakdown.garnishments'),\n amount: parseFloat(receiptData.totals?.childSupportDebit || '0'),\n },\n { label: t('breakdown.taxes'), amount: parseFloat(receiptData.totals?.taxDebit || '0') },\n ]\n\n const receiptDetailsConfig = [\n {\n label: t('receipt.receiptId'),\n value: receiptData.payrollUuid || '',\n },\n {\n label: t('receipt.from'),\n value: receiptData.nameOfSender || '',\n },\n {\n label: t('receipt.to'),\n value: receiptData.nameOfRecipient || 'Payroll Recipients',\n },\n {\n label: t('receipt.debitDate'),\n value: receiptData.debitDate || '',\n },\n ]\n\n const renderReceiptHeader = () => (\n <div className={classNames(styles.receiptHeader, isMobile && styles.receiptHeaderMobile)}>\n <Flex flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={16}>\n <div className={styles.receiptIcon}>\n <ReceiptCheck className={styles.checkmarkIcon} />\n </div>\n\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={8}>\n <Text size=\"sm\" variant=\"supporting\">\n {t('receipt.totalLabel')}\n </Text>\n <Heading as=\"h1\" styledAs=\"h2\" className={styles.totalAmount}>\n {formatNumberAsCurrency(parseFloat(receiptData.totals?.companyDebit || '0'))}\n </Heading>\n </Flex>\n </Flex>\n\n <Components.DescriptionList\n layout=\"horizontal\"\n showSeparators={false}\n items={receiptDetailsConfig.map(({ label, value }): DescriptionListItem => ({\n term: (\n <Text size=\"sm\" variant=\"supporting\">\n {label}\n </Text>\n ),\n description: <Text size=\"sm\">{value}</Text>,\n }))}\n />\n\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={12}>\n <Text\n size=\"sm\"\n variant=\"supporting\"\n className={classNames(styles.disclaimer, isMobile && styles.textMobile)}\n >\n {receiptData.recipientNotice}\n </Text>\n\n <Text\n size=\"sm\"\n variant=\"supporting\"\n className={classNames(styles.companyInfo, isMobile && styles.textMobile)}\n >\n {receiptData.license}\n </Text>\n\n <Text\n size=\"sm\"\n variant=\"supporting\"\n className={classNames(styles.address, isMobile && styles.textMobile)}\n >\n {receiptData.licensee &&\n `${receiptData.licensee.address || ''}, ${receiptData.licensee.city || ''}, ${receiptData.licensee.state || ''} ${receiptData.licensee.postalCode || ''}`}{' '}\n | {formatPhoneNumber(receiptData.licensee?.phoneNumber)}\n </Text>\n </Flex>\n </Flex>\n </div>\n )\n\n const renderBreakdownSection = () => (\n <Flex flexDirection=\"column\" gap={16}>\n <DataTable\n label={t('sections.debitedLabel')}\n columns={[\n {\n title: t('sections.debitedLabel'),\n render: (item: { label: string; amount: number }) => item.label,\n },\n {\n title: t('breakdown.amount'),\n render: (item: { label: string; amount: number }) =>\n formatNumberAsCurrency(item.amount),\n },\n ]}\n data={breakdownData}\n footer={() => ({\n 'column-0': t('breakdown.totals'),\n 'column-1': formatNumberAsCurrency(parseFloat(receiptData.totals?.companyDebit || '0')),\n })}\n />\n </Flex>\n )\n\n const renderTaxBreakdown = () => (\n <Flex flexDirection=\"column\" gap={16}>\n <DataTable\n label={t('sections.taxLabel')}\n columns={[\n {\n title: t('sections.taxLabel'),\n render: (tax: TaxBreakdownItem) => tax.name,\n },\n {\n title: t('tax.amount'),\n render: (tax: TaxBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(tax.amount || '0')),\n },\n ]}\n data={receiptData.taxes || []}\n footer={() => ({\n 'column-0': t('breakdown.totals'),\n 'column-1': formatNumberAsCurrency(parseFloat(receiptData.totals?.taxDebit || '0')),\n })}\n />\n </Flex>\n )\n\n const renderEmployeeBreakdown = () => {\n const footerValues = [\n <Flex flexDirection=\"column\" gap={4} key=\"totals\">\n {t('breakdown.totals')}\n <Text size=\"sm\" variant=\"supporting\">\n {t('employee.totalEmployees', {\n count: receiptData.employeeCompensations?.length || 0,\n })}\n </Text>\n </Flex>,\n '\\u00A0',\n\n formatNumberAsCurrency(getTotalChildSupport()),\n ...(withReimbursements ? [formatNumberAsCurrency(getTotalReimbursements())] : []),\n formatNumberAsCurrency(getTotalTaxes()),\n formatNumberAsCurrency(getTotalNetPay()),\n ]\n\n const footerContent = footerValues.reduce<Record<string, React.ReactNode>>(\n (acc, value, index) => {\n acc[`column-${index}`] = value\n return acc\n },\n {},\n )\n\n return (\n <Flex flexDirection=\"column\" gap={16}>\n {isMobile && <Heading as=\"h2\">{t('sections.employeesLabel')}</Heading>}\n <DataView\n label={t('sections.employeesLabel')}\n columns={[\n {\n title: t('employee.name'),\n render: (employee: EmployeeBreakdownItem) => getEmployeeFullName(employee),\n },\n {\n title: t('employee.paymentMethod'),\n render: (employee: EmployeeBreakdownItem) => employee.paymentMethod || 'N/A',\n },\n {\n title: t('employee.childSupport'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.childSupportGarnishment || '0')),\n },\n ...(withReimbursements\n ? [\n {\n title: t('employee.reimbursement'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.totalReimbursement || '0')),\n },\n ]\n : []),\n {\n title: t('employee.totalTaxes'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.totalTax || '0')),\n },\n {\n title: t('employee.netPay'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.netPay || '0')),\n },\n ]}\n data={receiptData.employeeCompensations || []}\n footer={() => footerContent}\n />\n </Flex>\n )\n }\n\n return (\n <div className={styles.container} ref={containerRef}>\n <Flex flexDirection=\"column\" gap={24}>\n {renderReceiptHeader()}\n {renderBreakdownSection()}\n {renderTaxBreakdown()}\n {renderEmployeeBreakdown()}\n </Flex>\n </div>\n )\n}\n"],"names":["PayrollReceiptsPresentation","receiptData","withReimbursements","Components","useComponentContext","Heading","Text","useI18n","t","useTranslation","containerRef","useRef","isMobile","useContainerBreakpoints","getEmployeeFullName","emp","getTotalChildSupport","sum","getTotalReimbursements","getTotalNetPay","getTotalTaxes","breakdownData","receiptDetailsConfig","renderReceiptHeader","jsx","classNames","styles","jsxs","Flex","ReceiptCheck","formatNumberAsCurrency","label","value","formatPhoneNumber","renderBreakdownSection","DataTable","item","renderTaxBreakdown","tax","renderEmployeeBreakdown","footerContent","acc","index","DataView","employee"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PayrollReceiptsPresentation.js","sources":["../../../../src/components/Payroll/PayrollReceipts/PayrollReceiptsPresentation.tsx"],"sourcesContent":["import { useRef } from 'react'\nimport { Trans, useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport type {\n PayrollReceipt,\n Taxes as TaxBreakdownItem,\n PayrollReceiptEmployeeCompensations as EmployeeBreakdownItem,\n} from '@gusto/embedded-api/models/components/payrollreceipt'\nimport styles from './PayrollReceiptsPresentation.module.scss'\nimport { DataView, DataTable, Flex } from '@/components/Common'\nimport type { DescriptionListItem } from '@/components/Common/UI/DescriptionList/DescriptionListTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { formatNumberAsCurrency, formatPhoneNumber } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { useContainerBreakpoints } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport ReceiptCheck from '@/assets/icons/receipt-check.svg?react'\n\ninterface PayrollReceiptsPresentationProps {\n receiptData: PayrollReceipt\n withReimbursements?: boolean\n}\n\n/** @internal */\nexport const PayrollReceiptsPresentation = ({\n receiptData,\n withReimbursements = true,\n}: PayrollReceiptsPresentationProps) => {\n const Components = useComponentContext()\n const { Heading, Text, Link } = Components\n useI18n('Payroll.PayrollReceipts')\n const { t } = useTranslation('Payroll.PayrollReceipts')\n\n const containerRef = useRef<HTMLDivElement>(null)\n const breakpoints = useContainerBreakpoints({ ref: containerRef })\n const isMobile = !breakpoints.includes('small')\n\n // Helper to get employee full name\n const getEmployeeFullName = (emp: EmployeeBreakdownItem) =>\n `${emp.employeeFirstName || ''} ${emp.employeeLastName || ''}`.trim()\n\n const getTotalChildSupport = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.childSupportGarnishment || '0'),\n 0,\n )\n\n const getTotalReimbursements = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.totalReimbursement || '0'),\n 0,\n )\n\n const getTotalNetPay = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.netPay || '0'),\n 0,\n )\n\n const getTotalTaxes = () =>\n (receiptData.employeeCompensations || []).reduce(\n (sum, emp) => sum + parseFloat(emp.totalTax || '0'),\n 0,\n )\n\n const breakdownData = [\n {\n label: t('breakdown.directDeposits'),\n amount: parseFloat(receiptData.totals?.netPayDebit || '0'),\n },\n ...(withReimbursements\n ? [\n {\n label: t('breakdown.reimbursements'),\n amount: parseFloat(receiptData.totals?.reimbursementDebit || '0'),\n },\n ]\n : []),\n {\n label: t('breakdown.garnishments'),\n amount: parseFloat(receiptData.totals?.childSupportDebit || '0'),\n },\n { label: t('breakdown.taxes'), amount: parseFloat(receiptData.totals?.taxDebit || '0') },\n ]\n\n const receiptDetailsConfig = [\n {\n label: t('receipt.receiptId'),\n value: receiptData.payrollUuid || '',\n },\n {\n label: t('receipt.from'),\n value: receiptData.nameOfSender || '',\n },\n {\n label: t('receipt.to'),\n value: receiptData.nameOfRecipient || 'Payroll Recipients',\n },\n {\n label: t('receipt.debitDate'),\n value: receiptData.debitDate || '',\n },\n ]\n\n const renderReceiptHeader = () => (\n <div className={classNames(styles.receiptHeader, isMobile && styles.receiptHeaderMobile)}>\n <Flex flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={16}>\n <div className={styles.receiptIcon}>\n <ReceiptCheck className={styles.checkmarkIcon} />\n </div>\n\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={8}>\n <Text size=\"sm\" variant=\"supporting\">\n {t('receipt.totalLabel')}\n </Text>\n <Heading as=\"h1\" styledAs=\"h2\" className={styles.totalAmount}>\n {formatNumberAsCurrency(parseFloat(receiptData.totals?.companyDebit || '0'))}\n </Heading>\n </Flex>\n </Flex>\n\n <Components.DescriptionList\n layout=\"horizontal\"\n showSeparators={false}\n items={receiptDetailsConfig.map(({ label, value }): DescriptionListItem => ({\n term: (\n <Text size=\"sm\" variant=\"supporting\">\n {label}\n </Text>\n ),\n description: <Text size=\"sm\">{value}</Text>,\n }))}\n />\n\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={12}>\n <Text\n size=\"sm\"\n variant=\"supporting\"\n className={classNames(styles.disclaimer, isMobile && styles.textMobile)}\n >\n {receiptData.recipientNotice}\n </Text>\n\n <Text\n size=\"sm\"\n variant=\"supporting\"\n className={classNames(styles.companyInfo, isMobile && styles.textMobile)}\n >\n <Trans\n i18nKey=\"receipt.companyInfo\"\n t={t}\n components={{\n licensesLink: <Link href={receiptData.licenseUri || ''} target=\"_blank\" />,\n }}\n />\n </Text>\n\n <Text\n size=\"sm\"\n variant=\"supporting\"\n className={classNames(styles.address, isMobile && styles.textMobile)}\n >\n {receiptData.licensee &&\n `${receiptData.licensee.address || ''}, ${receiptData.licensee.city || ''}, ${receiptData.licensee.state || ''} ${receiptData.licensee.postalCode || ''}`}{' '}\n | {formatPhoneNumber(receiptData.licensee?.phoneNumber)}\n </Text>\n </Flex>\n </Flex>\n </div>\n )\n\n const renderBreakdownSection = () => (\n <Flex flexDirection=\"column\" gap={16}>\n <DataTable\n label={t('sections.debitedLabel')}\n columns={[\n {\n title: t('sections.debitedLabel'),\n render: (item: { label: string; amount: number }) => item.label,\n },\n {\n title: t('breakdown.amount'),\n render: (item: { label: string; amount: number }) =>\n formatNumberAsCurrency(item.amount),\n },\n ]}\n data={breakdownData}\n footer={() => ({\n 'column-0': t('breakdown.totals'),\n 'column-1': formatNumberAsCurrency(parseFloat(receiptData.totals?.companyDebit || '0')),\n })}\n />\n </Flex>\n )\n\n const renderTaxBreakdown = () => (\n <Flex flexDirection=\"column\" gap={16}>\n <DataTable\n label={t('sections.taxLabel')}\n columns={[\n {\n title: t('sections.taxLabel'),\n render: (tax: TaxBreakdownItem) => tax.name,\n },\n {\n title: t('tax.amount'),\n render: (tax: TaxBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(tax.amount || '0')),\n },\n ]}\n data={receiptData.taxes || []}\n footer={() => ({\n 'column-0': t('breakdown.totals'),\n 'column-1': formatNumberAsCurrency(parseFloat(receiptData.totals?.taxDebit || '0')),\n })}\n />\n </Flex>\n )\n\n const renderEmployeeBreakdown = () => {\n const footerValues = [\n <Flex flexDirection=\"column\" gap={4} key=\"totals\">\n {t('breakdown.totals')}\n <Text size=\"sm\" variant=\"supporting\">\n {t('employee.totalEmployees', {\n count: receiptData.employeeCompensations?.length || 0,\n })}\n </Text>\n </Flex>,\n '\\u00A0',\n\n formatNumberAsCurrency(getTotalChildSupport()),\n ...(withReimbursements ? [formatNumberAsCurrency(getTotalReimbursements())] : []),\n formatNumberAsCurrency(getTotalTaxes()),\n formatNumberAsCurrency(getTotalNetPay()),\n ]\n\n const footerContent = footerValues.reduce<Record<string, React.ReactNode>>(\n (acc, value, index) => {\n acc[`column-${index}`] = value\n return acc\n },\n {},\n )\n\n return (\n <Flex flexDirection=\"column\" gap={16}>\n {isMobile && <Heading as=\"h2\">{t('sections.employeesLabel')}</Heading>}\n <DataView\n label={t('sections.employeesLabel')}\n columns={[\n {\n title: t('employee.name'),\n render: (employee: EmployeeBreakdownItem) => getEmployeeFullName(employee),\n },\n {\n title: t('employee.paymentMethod'),\n render: (employee: EmployeeBreakdownItem) => employee.paymentMethod || 'N/A',\n },\n {\n title: t('employee.childSupport'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.childSupportGarnishment || '0')),\n },\n ...(withReimbursements\n ? [\n {\n title: t('employee.reimbursement'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.totalReimbursement || '0')),\n },\n ]\n : []),\n {\n title: t('employee.totalTaxes'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.totalTax || '0')),\n },\n {\n title: t('employee.netPay'),\n render: (employee: EmployeeBreakdownItem) =>\n formatNumberAsCurrency(parseFloat(employee.netPay || '0')),\n },\n ]}\n data={receiptData.employeeCompensations || []}\n footer={() => footerContent}\n />\n </Flex>\n )\n }\n\n return (\n <div className={styles.container} ref={containerRef}>\n <Flex flexDirection=\"column\" gap={24}>\n {renderReceiptHeader()}\n {renderBreakdownSection()}\n {renderTaxBreakdown()}\n {renderEmployeeBreakdown()}\n </Flex>\n </div>\n )\n}\n"],"names":["PayrollReceiptsPresentation","receiptData","withReimbursements","Components","useComponentContext","Heading","Text","Link","useI18n","t","useTranslation","containerRef","useRef","isMobile","useContainerBreakpoints","getEmployeeFullName","emp","getTotalChildSupport","sum","getTotalReimbursements","getTotalNetPay","getTotalTaxes","breakdownData","receiptDetailsConfig","renderReceiptHeader","jsx","classNames","styles","jsxs","Flex","ReceiptCheck","formatNumberAsCurrency","label","value","Trans","formatPhoneNumber","renderBreakdownSection","DataTable","item","renderTaxBreakdown","tax","renderEmployeeBreakdown","footerContent","acc","index","DataView","employee"],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { PrintChecksProps } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Displays a banner prompting the user to print checks for employees paid by check on a
|
|
4
|
+
* processed payroll, and walks them through choosing check stock and generating the check PDF.
|
|
5
|
+
*
|
|
6
|
+
* @events
|
|
7
|
+
* | Event | Description | Data |
|
|
8
|
+
* | ----- | ----------- | ---- |
|
|
9
|
+
* | `payroll/printChecks/start` | User opened the print-checks modal from the banner | — |
|
|
10
|
+
* | `payroll/printChecks/generate/start` | User submitted the print-checks form | — |
|
|
11
|
+
* | `payroll/printChecks/generate/succeeded` | Printable checks finished generating | `{ documentUrl }` |
|
|
12
|
+
* | `payroll/printChecks/generate/failed` | The print-checks request was rejected or generation failed | `{ errorMessage }` |
|
|
13
|
+
* | `payroll/printChecks/retry` | User retried after a failed generation | — |
|
|
14
|
+
* | `payroll/printChecks/cancel` | User cancelled the print-checks form | — |
|
|
15
|
+
* | `payroll/printChecks/close` | User closed the failure or summary screen | — |
|
|
16
|
+
*
|
|
17
|
+
* @param props - {@link PrintChecksProps}
|
|
18
|
+
* @returns The print-checks banner and modal flow.
|
|
19
|
+
* @public
|
|
20
|
+
*/
|
|
21
|
+
export declare function PrintChecks({ onEvent, ...props }: PrintChecksProps): import("react").JSX.Element;
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { jsx as t, jsxs as E } from "react/jsx-runtime";
|
|
2
|
+
import { createMachine as M } from "robot3";
|
|
3
|
+
import { useMachine as P } from "react-robot";
|
|
4
|
+
import { useState as T, useMemo as _ } from "react";
|
|
5
|
+
import { printChecksMachine as k } from "./printChecksStateMachine.js";
|
|
6
|
+
import { BaseComponent as x } from "../../Base/Base.js";
|
|
7
|
+
import "../../Base/useBase.js";
|
|
8
|
+
import { useComponentContext as R } from "../../../contexts/ComponentAdapter/useComponentContext.js";
|
|
9
|
+
import { FlowContext as v } from "../../Flow/useFlow.js";
|
|
10
|
+
import { printChecksEvents as i } from "../../../shared/constants.js";
|
|
11
|
+
import { PrintChecksBanner as N } from "./PrintChecksBanner/PrintChecksBanner.js";
|
|
12
|
+
function q({ onEvent: n = () => {
|
|
13
|
+
}, ...o }) {
|
|
14
|
+
return /* @__PURE__ */ t(x, { ...o, onEvent: n, children: /* @__PURE__ */ t(H, { ...o, onEvent: n }) });
|
|
15
|
+
}
|
|
16
|
+
function H({ companyId: n, payrollId: o, onEvent: C = () => {
|
|
17
|
+
} }) {
|
|
18
|
+
const { Modal: h } = R(), [l, s] = T(!1), p = _(
|
|
19
|
+
() => M("banner", k, () => ({
|
|
20
|
+
component: null,
|
|
21
|
+
companyId: n,
|
|
22
|
+
payrollId: o,
|
|
23
|
+
onEvent: r
|
|
24
|
+
})),
|
|
25
|
+
[n, o]
|
|
26
|
+
), [m, u] = P(p);
|
|
27
|
+
function r(e, f) {
|
|
28
|
+
u({ type: e, payload: f }), e === i.PRINT_CHECKS_START && s(!0), (e === i.PRINT_CHECKS_CANCEL || e === i.PRINT_CHECKS_CLOSE) && s(!1), C(e, f);
|
|
29
|
+
}
|
|
30
|
+
const S = () => {
|
|
31
|
+
r(i.PRINT_CHECKS_START);
|
|
32
|
+
}, d = () => {
|
|
33
|
+
s(!1);
|
|
34
|
+
}, c = m.context.component, a = c?.Footer || void 0;
|
|
35
|
+
return /* @__PURE__ */ E(
|
|
36
|
+
v.Provider,
|
|
37
|
+
{
|
|
38
|
+
value: {
|
|
39
|
+
...m.context,
|
|
40
|
+
onEvent: r
|
|
41
|
+
},
|
|
42
|
+
children: [
|
|
43
|
+
/* @__PURE__ */ t(
|
|
44
|
+
N,
|
|
45
|
+
{
|
|
46
|
+
companyId: n,
|
|
47
|
+
payrollId: o,
|
|
48
|
+
onStartPrintChecks: S,
|
|
49
|
+
onEvent: C
|
|
50
|
+
}
|
|
51
|
+
),
|
|
52
|
+
/* @__PURE__ */ t(
|
|
53
|
+
h,
|
|
54
|
+
{
|
|
55
|
+
isOpen: l,
|
|
56
|
+
onClose: d,
|
|
57
|
+
footer: a && /* @__PURE__ */ t(a, { onEvent: r }),
|
|
58
|
+
children: c && /* @__PURE__ */ t(c, {})
|
|
59
|
+
}
|
|
60
|
+
)
|
|
61
|
+
]
|
|
62
|
+
}
|
|
63
|
+
);
|
|
64
|
+
}
|
|
65
|
+
export {
|
|
66
|
+
q as PrintChecks
|
|
67
|
+
};
|
|
68
|
+
//# sourceMappingURL=PrintChecks.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PrintChecks.js","sources":["../../../../src/components/Payroll/PrintChecks/PrintChecks.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMachine } from 'react-robot'\nimport { useMemo, useState } from 'react'\nimport { PrintChecksBanner } from './PrintChecksBanner'\nimport { printChecksMachine } from './printChecksStateMachine'\nimport { type PrintChecksContextInterface } from './PrintChecksComponents'\nimport type { PrintChecksProps } from './types'\nimport { BaseComponent } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { FlowContext } from '@/components/Flow/useFlow'\nimport { printChecksEvents, type EventType } from '@/shared/constants'\n\n/**\n * Displays a banner prompting the user to print checks for employees paid by check on a\n * processed payroll, and walks them through choosing check stock and generating the check PDF.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `payroll/printChecks/start` | User opened the print-checks modal from the banner | — |\n * | `payroll/printChecks/generate/start` | User submitted the print-checks form | — |\n * | `payroll/printChecks/generate/succeeded` | Printable checks finished generating | `{ documentUrl }` |\n * | `payroll/printChecks/generate/failed` | The print-checks request was rejected or generation failed | `{ errorMessage }` |\n * | `payroll/printChecks/retry` | User retried after a failed generation | — |\n * | `payroll/printChecks/cancel` | User cancelled the print-checks form | — |\n * | `payroll/printChecks/close` | User closed the failure or summary screen | — |\n *\n * @param props - {@link PrintChecksProps}\n * @returns The print-checks banner and modal flow.\n * @public\n */\nexport function PrintChecks({ onEvent = () => {}, ...props }: PrintChecksProps) {\n return (\n <BaseComponent {...props} onEvent={onEvent}>\n <Root {...props} onEvent={onEvent} />\n </BaseComponent>\n )\n}\n\nfunction Root({ companyId, payrollId, onEvent = () => {} }: PrintChecksProps) {\n const { Modal } = useComponentContext()\n const [isModalOpen, setIsModalOpen] = useState(false)\n\n const printChecksMachineInstance = useMemo(\n () =>\n createMachine('banner', printChecksMachine, (): PrintChecksContextInterface => ({\n component: null,\n companyId,\n payrollId,\n onEvent: handleEvent,\n })),\n [companyId, payrollId],\n )\n const [current, send] = useMachine(printChecksMachineInstance)\n\n function handleEvent(type: EventType, data?: unknown): void {\n send({ type, payload: data })\n\n if (type === printChecksEvents.PRINT_CHECKS_START) {\n setIsModalOpen(true)\n }\n\n if (\n type === printChecksEvents.PRINT_CHECKS_CANCEL ||\n type === printChecksEvents.PRINT_CHECKS_CLOSE\n ) {\n setIsModalOpen(false)\n }\n\n onEvent(type, data)\n }\n\n const handleStartPrintChecks = () => {\n handleEvent(printChecksEvents.PRINT_CHECKS_START)\n }\n\n const handleCloseModal = () => {\n setIsModalOpen(false)\n }\n\n const CurrentComponent = current.context.component\n const Footer = CurrentComponent?.Footer || undefined\n\n return (\n <FlowContext.Provider\n value={{\n ...current.context,\n onEvent: handleEvent,\n }}\n >\n <PrintChecksBanner\n companyId={companyId}\n payrollId={payrollId}\n onStartPrintChecks={handleStartPrintChecks}\n onEvent={onEvent}\n />\n <Modal\n isOpen={isModalOpen}\n onClose={handleCloseModal}\n footer={Footer && <Footer onEvent={handleEvent} />}\n >\n {CurrentComponent && <CurrentComponent />}\n </Modal>\n </FlowContext.Provider>\n )\n}\n"],"names":["PrintChecks","onEvent","props","jsx","BaseComponent","Root","companyId","payrollId","Modal","useComponentContext","isModalOpen","setIsModalOpen","useState","printChecksMachineInstance","useMemo","createMachine","printChecksMachine","handleEvent","current","send","useMachine","type","data","printChecksEvents","handleStartPrintChecks","handleCloseModal","CurrentComponent","Footer","jsxs","FlowContext","PrintChecksBanner"],"mappings":";;;;;;;;;;;AA+BO,SAASA,EAAY,EAAE,SAAAC,IAAU,MAAM;AAAC,GAAG,GAAGC,KAA2B;AAC9E,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GAAO,SAAAD,GACxB,4BAACI,GAAA,EAAM,GAAGH,GAAO,SAAAD,EAAA,CAAkB,EAAA,CACrC;AAEJ;AAEA,SAASI,EAAK,EAAE,WAAAC,GAAW,WAAAC,GAAW,SAAAN,IAAU,MAAM;AAAC,KAAuB;AAC5E,QAAM,EAAE,OAAAO,EAAA,IAAUC,EAAA,GACZ,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAE9CC,IAA6BC;AAAA,IACjC,MACEC,EAAc,UAAUC,GAAoB,OAAoC;AAAA,MAC9E,WAAW;AAAA,MACX,WAAAV;AAAA,MACA,WAAAC;AAAA,MACA,SAASU;AAAA,IAAA,EACT;AAAA,IACJ,CAACX,GAAWC,CAAS;AAAA,EAAA,GAEjB,CAACW,GAASC,CAAI,IAAIC,EAAWP,CAA0B;AAE7D,WAASI,EAAYI,GAAiBC,GAAsB;AAC1D,IAAAH,EAAK,EAAE,MAAAE,GAAM,SAASC,EAAA,CAAM,GAExBD,MAASE,EAAkB,sBAC7BZ,EAAe,EAAI,IAInBU,MAASE,EAAkB,uBAC3BF,MAASE,EAAkB,uBAE3BZ,EAAe,EAAK,GAGtBV,EAAQoB,GAAMC,CAAI;AAAA,EACpB;AAEA,QAAME,IAAyB,MAAM;AACnC,IAAAP,EAAYM,EAAkB,kBAAkB;AAAA,EAClD,GAEME,IAAmB,MAAM;AAC7B,IAAAd,EAAe,EAAK;AAAA,EACtB,GAEMe,IAAmBR,EAAQ,QAAQ,WACnCS,IAASD,GAAkB,UAAU;AAE3C,SACE,gBAAAE;AAAA,IAACC,EAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAGX,EAAQ;AAAA,QACX,SAASD;AAAA,MAAA;AAAA,MAGX,UAAA;AAAA,QAAA,gBAAAd;AAAA,UAAC2B;AAAA,UAAA;AAAA,YACC,WAAAxB;AAAA,YACA,WAAAC;AAAA,YACA,oBAAoBiB;AAAA,YACpB,SAAAvB;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAE;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,QAAQE;AAAA,YACR,SAASe;AAAA,YACT,QAAQE,KAAU,gBAAAxB,EAACwB,GAAA,EAAO,SAASV,GAAa;AAAA,YAE/C,UAAAS,uBAAqBA,GAAA,CAAA,CAAiB;AAAA,UAAA;AAAA,QAAA;AAAA,MACzC;AAAA,IAAA;AAAA,EAAA;AAGN;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { BaseComponentInterface } from '../../../Base';
|
|
2
|
+
interface PrintChecksBannerProps extends BaseComponentInterface<'Payroll.PrintChecksBanner'> {
|
|
3
|
+
companyId: string;
|
|
4
|
+
payrollId: string;
|
|
5
|
+
onStartPrintChecks: () => void;
|
|
6
|
+
}
|
|
7
|
+
/** @internal */
|
|
8
|
+
export declare function PrintChecksBanner(props: PrintChecksBannerProps): import("react").JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { useTranslation as h } from "react-i18next";
|
|
3
|
+
import { usePayrollsGet as P } from "@gusto/embedded-api/react-query/payrollsGet";
|
|
4
|
+
import { BaseComponent as C } from "../../../Base/Base.js";
|
|
5
|
+
import "../../../Base/useBase.js";
|
|
6
|
+
import { useComponentContext as y } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
|
|
7
|
+
import { useComponentDictionary as f, useI18n as k } from "../../../../i18n/I18n.js";
|
|
8
|
+
import { PAYMENT_METHODS as B, PAYROLL_PROCESSING_STATUS as S } from "../../../../shared/constants.js";
|
|
9
|
+
function b(t) {
|
|
10
|
+
return /* @__PURE__ */ e(C, { ...t, children: /* @__PURE__ */ e(T, { ...t, children: t.children }) });
|
|
11
|
+
}
|
|
12
|
+
const T = ({ companyId: t, payrollId: c, dictionary: a, onStartPrintChecks: l }) => {
|
|
13
|
+
f("Payroll.PrintChecksBanner", a), k("Payroll.PrintChecksBanner");
|
|
14
|
+
const { t: n } = h("Payroll.PrintChecksBanner"), { Alert: m, Button: u } = y(), { data: p } = P({
|
|
15
|
+
companyId: t,
|
|
16
|
+
payrollId: c
|
|
17
|
+
}), o = p?.payrollShow, r = o?.employeeCompensations?.reduce(
|
|
18
|
+
(s, i) => !i.excluded && i.paymentMethod === B.check ? s + 1 : s,
|
|
19
|
+
0
|
|
20
|
+
) ?? 0, d = o?.processed === !0 || o?.processingRequest?.status === S.submit_success;
|
|
21
|
+
return r === 0 ? null : /* @__PURE__ */ e(
|
|
22
|
+
m,
|
|
23
|
+
{
|
|
24
|
+
status: "info",
|
|
25
|
+
label: n("title", { count: r }),
|
|
26
|
+
action: d && /* @__PURE__ */ e(u, { variant: "secondary", onClick: l, children: n("cta") }),
|
|
27
|
+
children: n("description")
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
};
|
|
31
|
+
export {
|
|
32
|
+
b as PrintChecksBanner
|
|
33
|
+
};
|
|
34
|
+
//# sourceMappingURL=PrintChecksBanner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PrintChecksBanner.js","sources":["../../../../../src/components/Payroll/PrintChecks/PrintChecksBanner/PrintChecksBanner.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { usePayrollsGet } from '@gusto/embedded-api/react-query/payrollsGet'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { PAYMENT_METHODS, PAYROLL_PROCESSING_STATUS } from '@/shared/constants'\n\ninterface PrintChecksBannerProps extends BaseComponentInterface<'Payroll.PrintChecksBanner'> {\n companyId: string\n payrollId: string\n onStartPrintChecks: () => void\n}\n\n/** @internal */\nexport function PrintChecksBanner(props: PrintChecksBannerProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({ companyId, payrollId, dictionary, onStartPrintChecks }: PrintChecksBannerProps) => {\n useComponentDictionary('Payroll.PrintChecksBanner', dictionary)\n useI18n('Payroll.PrintChecksBanner')\n const { t } = useTranslation('Payroll.PrintChecksBanner')\n const { Alert, Button } = useComponentContext()\n\n const { data } = usePayrollsGet({\n companyId,\n payrollId,\n })\n const payrollData = data?.payrollShow\n\n const checkPaymentsCount =\n payrollData?.employeeCompensations?.reduce(\n (acc, comp) =>\n !comp.excluded && comp.paymentMethod === PAYMENT_METHODS.check ? acc + 1 : acc,\n 0,\n ) ?? 0\n\n const isProcessed =\n payrollData?.processed === true ||\n payrollData?.processingRequest?.status === PAYROLL_PROCESSING_STATUS.submit_success\n\n if (checkPaymentsCount === 0) {\n return null\n }\n\n return (\n <Alert\n status=\"info\"\n label={t('title', { count: checkPaymentsCount })}\n action={\n isProcessed && (\n <Button variant=\"secondary\" onClick={onStartPrintChecks}>\n {t('cta')}\n </Button>\n )\n }\n >\n {t('description')}\n </Alert>\n )\n}\n"],"names":["PrintChecksBanner","props","jsx","BaseComponent","Root","companyId","payrollId","dictionary","onStartPrintChecks","useComponentDictionary","useI18n","t","useTranslation","Alert","Button","useComponentContext","data","usePayrollsGet","payrollData","checkPaymentsCount","acc","comp","PAYMENT_METHODS","isProcessed","PAYROLL_PROCESSING_STATUS"],"mappings":";;;;;;;;AAcO,SAASA,EAAkBC,GAA+B;AAC/D,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,WAAAC,GAAW,YAAAC,GAAY,oBAAAC,QAAiD;AACjG,EAAAC,EAAuB,6BAA6BF,CAAU,GAC9DG,EAAQ,2BAA2B;AACnC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,2BAA2B,GAClD,EAAE,OAAAC,GAAO,QAAAC,EAAA,IAAWC,EAAA,GAEpB,EAAE,MAAAC,EAAA,IAASC,EAAe;AAAA,IAC9B,WAAAZ;AAAA,IACA,WAAAC;AAAA,EAAA,CACD,GACKY,IAAcF,GAAM,aAEpBG,IACJD,GAAa,uBAAuB;AAAA,IAClC,CAACE,GAAKC,MACJ,CAACA,EAAK,YAAYA,EAAK,kBAAkBC,EAAgB,QAAQF,IAAM,IAAIA;AAAA,IAC7E;AAAA,EAAA,KACG,GAEDG,IACJL,GAAa,cAAc,MAC3BA,GAAa,mBAAmB,WAAWM,EAA0B;AAEvE,SAAIL,MAAuB,IAClB,OAIP,gBAAAjB;AAAA,IAACW;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,OAAOF,EAAE,SAAS,EAAE,OAAOQ,GAAoB;AAAA,MAC/C,QACEI,KACE,gBAAArB,EAACY,GAAA,EAAO,SAAQ,aAAY,SAASN,GAClC,UAAAG,EAAE,KAAK,EAAA,CACV;AAAA,MAIH,YAAE,aAAa;AAAA,IAAA;AAAA,EAAA;AAGtB;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PrintChecksBanner } from './PrintChecksBanner';
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { FlowContextInterface } from '../../Flow/useFlow';
|
|
2
|
+
import { CommonComponentInterface } from '../../Base';
|
|
3
|
+
import { EventType } from '../../../types/Helpers';
|
|
4
|
+
import { OnEventType } from '../../Base/useBase';
|
|
5
|
+
/**
|
|
6
|
+
* Flow-machine context shared across the print-checks states.
|
|
7
|
+
*
|
|
8
|
+
* @internal
|
|
9
|
+
*/
|
|
10
|
+
export interface PrintChecksContextInterface extends FlowContextInterface {
|
|
11
|
+
/** Company identifier. */
|
|
12
|
+
companyId: string;
|
|
13
|
+
/** Payroll being printed. */
|
|
14
|
+
payrollId: string;
|
|
15
|
+
/** URL of the generated checks PDF, once generation succeeds. */
|
|
16
|
+
documentUrl?: string;
|
|
17
|
+
/** Error message surfaced on the failure screen. */
|
|
18
|
+
errorMessage?: string;
|
|
19
|
+
/** Whether a generate-and-poll cycle is in flight, shared between the form body and its footer. */
|
|
20
|
+
isGenerating?: boolean;
|
|
21
|
+
/** Component to render inside the modal for the current state, with an optional footer slot. */
|
|
22
|
+
component: (React.ComponentType<CommonComponentInterface> & {
|
|
23
|
+
Footer?: React.ComponentType<{
|
|
24
|
+
onEvent: OnEventType<EventType, unknown>;
|
|
25
|
+
}>;
|
|
26
|
+
}) | null;
|
|
27
|
+
}
|
|
28
|
+
/** @internal */
|
|
29
|
+
export declare function PrintChecksFormContextual(): import("react").JSX.Element;
|
|
30
|
+
export declare namespace PrintChecksFormContextual {
|
|
31
|
+
var Footer: ({ onEvent }: {
|
|
32
|
+
onEvent: OnEventType<EventType, unknown>;
|
|
33
|
+
}) => import("react").JSX.Element;
|
|
34
|
+
}
|
|
35
|
+
/** @internal */
|
|
36
|
+
export declare function PrintChecksFailureContextual(): import("react").JSX.Element;
|
|
37
|
+
export declare namespace PrintChecksFailureContextual {
|
|
38
|
+
var Footer: ({ onEvent }: {
|
|
39
|
+
onEvent: OnEventType<EventType, unknown>;
|
|
40
|
+
}) => import("react").JSX.Element;
|
|
41
|
+
}
|
|
42
|
+
/** @internal */
|
|
43
|
+
export declare function PrintChecksSummaryContextual(): import("react").JSX.Element;
|
|
44
|
+
export declare namespace PrintChecksSummaryContextual {
|
|
45
|
+
var Footer: ({ onEvent }: {
|
|
46
|
+
onEvent: OnEventType<EventType, unknown>;
|
|
47
|
+
}) => import("react").JSX.Element;
|
|
48
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { useFlow as e } from "../../Flow/useFlow.js";
|
|
3
|
+
import { PrintChecksForm as n } from "./PrintChecksForm/PrintChecksForm.js";
|
|
4
|
+
import { PrintChecksSummary as i } from "./PrintChecksSummary/PrintChecksSummary.js";
|
|
5
|
+
import { PrintChecksFailure as m } from "./PrintChecksFailure/PrintChecksFailure.js";
|
|
6
|
+
function s() {
|
|
7
|
+
const { payrollId: o, isGenerating: r, onEvent: u } = e();
|
|
8
|
+
return /* @__PURE__ */ t(n, { payrollId: o, isGenerating: r, onEvent: u });
|
|
9
|
+
}
|
|
10
|
+
s.Footer = n.Footer;
|
|
11
|
+
function c() {
|
|
12
|
+
const { errorMessage: o, onEvent: r } = e();
|
|
13
|
+
return /* @__PURE__ */ t(m, { errorMessage: o, onEvent: r });
|
|
14
|
+
}
|
|
15
|
+
c.Footer = m.Footer;
|
|
16
|
+
function F() {
|
|
17
|
+
const { documentUrl: o, onEvent: r } = e();
|
|
18
|
+
return /* @__PURE__ */ t(i, { documentUrl: o, onEvent: r });
|
|
19
|
+
}
|
|
20
|
+
F.Footer = i.Footer;
|
|
21
|
+
export {
|
|
22
|
+
c as PrintChecksFailureContextual,
|
|
23
|
+
s as PrintChecksFormContextual,
|
|
24
|
+
F as PrintChecksSummaryContextual
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=PrintChecksComponents.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PrintChecksComponents.js","sources":["../../../../src/components/Payroll/PrintChecks/PrintChecksComponents.tsx"],"sourcesContent":["import { PrintChecksForm } from './PrintChecksForm'\nimport { PrintChecksFailure } from './PrintChecksFailure'\nimport { PrintChecksSummary } from './PrintChecksSummary'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport type { FlowContextInterface } from '@/components/Flow/useFlow'\nimport type { CommonComponentInterface } from '@/components/Base'\nimport type { EventType } from '@/types/Helpers'\nimport type { OnEventType } from '@/components/Base/useBase'\n\n/**\n * Flow-machine context shared across the print-checks states.\n *\n * @internal\n */\nexport interface PrintChecksContextInterface extends FlowContextInterface {\n /** Company identifier. */\n companyId: string\n /** Payroll being printed. */\n payrollId: string\n /** URL of the generated checks PDF, once generation succeeds. */\n documentUrl?: string\n /** Error message surfaced on the failure screen. */\n errorMessage?: string\n /** Whether a generate-and-poll cycle is in flight, shared between the form body and its footer. */\n isGenerating?: boolean\n /** Component to render inside the modal for the current state, with an optional footer slot. */\n component:\n | (React.ComponentType<CommonComponentInterface> & {\n Footer?: React.ComponentType<{\n onEvent: OnEventType<EventType, unknown>\n }>\n })\n | null\n}\n\n/** @internal */\nexport function PrintChecksFormContextual() {\n const { payrollId, isGenerating, onEvent } = useFlow<PrintChecksContextInterface>()\n\n return <PrintChecksForm payrollId={payrollId} isGenerating={isGenerating} onEvent={onEvent} />\n}\n\nPrintChecksFormContextual.Footer = PrintChecksForm.Footer\n\n/** @internal */\nexport function PrintChecksFailureContextual() {\n const { errorMessage, onEvent } = useFlow<PrintChecksContextInterface>()\n\n return <PrintChecksFailure errorMessage={errorMessage} onEvent={onEvent} />\n}\n\nPrintChecksFailureContextual.Footer = PrintChecksFailure.Footer\n\n/** @internal */\nexport function PrintChecksSummaryContextual() {\n const { documentUrl, onEvent } = useFlow<PrintChecksContextInterface>()\n\n return <PrintChecksSummary documentUrl={documentUrl} onEvent={onEvent} />\n}\n\nPrintChecksSummaryContextual.Footer = PrintChecksSummary.Footer\n"],"names":["PrintChecksFormContextual","payrollId","isGenerating","onEvent","useFlow","jsx","PrintChecksForm","PrintChecksFailureContextual","errorMessage","PrintChecksFailure","PrintChecksSummaryContextual","documentUrl","PrintChecksSummary"],"mappings":";;;;;AAoCO,SAASA,IAA4B;AAC1C,QAAM,EAAE,WAAAC,GAAW,cAAAC,GAAc,SAAAC,EAAA,IAAYC,EAAA;AAE7C,SAAO,gBAAAC,EAACC,GAAA,EAAgB,WAAAL,GAAsB,cAAAC,GAA4B,SAAAC,EAAA,CAAkB;AAC9F;AAEAH,EAA0B,SAASM,EAAgB;AAG5C,SAASC,IAA+B;AAC7C,QAAM,EAAE,cAAAC,GAAc,SAAAL,EAAA,IAAYC,EAAA;AAElC,SAAO,gBAAAC,EAACI,GAAA,EAAmB,cAAAD,GAA4B,SAAAL,EAAA,CAAkB;AAC3E;AAEAI,EAA6B,SAASE,EAAmB;AAGlD,SAASC,IAA+B;AAC7C,QAAM,EAAE,aAAAC,GAAa,SAAAR,EAAA,IAAYC,EAAA;AAEjC,SAAO,gBAAAC,EAACO,GAAA,EAAmB,aAAAD,GAA0B,SAAAR,EAAA,CAAkB;AACzE;AAEAO,EAA6B,SAASE,EAAmB;"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { BaseComponentInterface } from '../../../Base';
|
|
2
|
+
import { OnEventType } from '../../../Base/useBase';
|
|
3
|
+
import { EventType } from '../../../../shared/constants';
|
|
4
|
+
interface PrintChecksFailureProps extends BaseComponentInterface<'Payroll.PrintChecksFailure'> {
|
|
5
|
+
errorMessage?: string;
|
|
6
|
+
}
|
|
7
|
+
/** @internal */
|
|
8
|
+
export declare function PrintChecksFailure(props: PrintChecksFailureProps): import("react").JSX.Element;
|
|
9
|
+
export declare namespace PrintChecksFailure {
|
|
10
|
+
var Footer: ({ onEvent }: {
|
|
11
|
+
onEvent: OnEventType<EventType, unknown>;
|
|
12
|
+
}) => import("react").JSX.Element;
|
|
13
|
+
}
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { jsx as t, jsxs as u } from "react/jsx-runtime";
|
|
2
|
+
import { useTranslation as i } from "react-i18next";
|
|
3
|
+
import { BaseComponent as C } from "../../../Base/Base.js";
|
|
4
|
+
import "../../../Base/useBase.js";
|
|
5
|
+
import { useComponentContext as l } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
|
|
6
|
+
import { useComponentDictionary as h, useI18n as c } from "../../../../i18n/I18n.js";
|
|
7
|
+
import { Flex as P } from "../../../Common/Flex/Flex.js";
|
|
8
|
+
import { ActionsLayout as d } from "../../../Common/ActionsLayout/ActionsLayout.js";
|
|
9
|
+
import { printChecksEvents as a } from "../../../../shared/constants.js";
|
|
10
|
+
function f(r) {
|
|
11
|
+
return /* @__PURE__ */ t(C, { ...r, children: /* @__PURE__ */ t(p, { ...r, children: r.children }) });
|
|
12
|
+
}
|
|
13
|
+
const p = ({ dictionary: r, errorMessage: o, onEvent: e }) => {
|
|
14
|
+
h("Payroll.PrintChecksFailure", r), c("Payroll.PrintChecksFailure");
|
|
15
|
+
const { t: n } = i("Payroll.PrintChecksFailure"), { Alert: s, Button: m } = l();
|
|
16
|
+
return /* @__PURE__ */ u(P, { flexDirection: "column", gap: 16, children: [
|
|
17
|
+
/* @__PURE__ */ t(s, { status: "error", disableScrollIntoView: !0, label: n("failedTitle"), children: o }),
|
|
18
|
+
/* @__PURE__ */ t(
|
|
19
|
+
m,
|
|
20
|
+
{
|
|
21
|
+
variant: "secondary",
|
|
22
|
+
onClick: () => {
|
|
23
|
+
e(a.PRINT_CHECKS_RETRY);
|
|
24
|
+
},
|
|
25
|
+
children: n("retryCta")
|
|
26
|
+
}
|
|
27
|
+
)
|
|
28
|
+
] });
|
|
29
|
+
}, y = ({ onEvent: r }) => {
|
|
30
|
+
c("Payroll.PrintChecksFailure");
|
|
31
|
+
const { t: o } = i("Payroll.PrintChecksFailure"), { Button: e } = l();
|
|
32
|
+
return /* @__PURE__ */ t(d, { children: /* @__PURE__ */ t(
|
|
33
|
+
e,
|
|
34
|
+
{
|
|
35
|
+
variant: "secondary",
|
|
36
|
+
onClick: () => {
|
|
37
|
+
r(a.PRINT_CHECKS_CLOSE);
|
|
38
|
+
},
|
|
39
|
+
children: o("closeCta")
|
|
40
|
+
}
|
|
41
|
+
) });
|
|
42
|
+
};
|
|
43
|
+
f.Footer = y;
|
|
44
|
+
export {
|
|
45
|
+
f as PrintChecksFailure
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=PrintChecksFailure.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PrintChecksFailure.js","sources":["../../../../../src/components/Payroll/PrintChecks/PrintChecksFailure/PrintChecksFailure.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { ActionsLayout, Flex } from '@/components/Common'\nimport { printChecksEvents, type EventType } from '@/shared/constants'\n\ninterface PrintChecksFailureProps extends BaseComponentInterface<'Payroll.PrintChecksFailure'> {\n errorMessage?: string\n}\n\n/** @internal */\nexport function PrintChecksFailure(props: PrintChecksFailureProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({ dictionary, errorMessage, onEvent }: PrintChecksFailureProps) => {\n useComponentDictionary('Payroll.PrintChecksFailure', dictionary)\n useI18n('Payroll.PrintChecksFailure')\n const { t } = useTranslation('Payroll.PrintChecksFailure')\n const { Alert, Button } = useComponentContext()\n\n return (\n <Flex flexDirection=\"column\" gap={16}>\n <Alert status=\"error\" disableScrollIntoView label={t('failedTitle')}>\n {errorMessage}\n </Alert>\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(printChecksEvents.PRINT_CHECKS_RETRY)\n }}\n >\n {t('retryCta')}\n </Button>\n </Flex>\n )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n useI18n('Payroll.PrintChecksFailure')\n const { t } = useTranslation('Payroll.PrintChecksFailure')\n const { Button } = useComponentContext()\n\n return (\n <ActionsLayout>\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(printChecksEvents.PRINT_CHECKS_CLOSE)\n }}\n >\n {t('closeCta')}\n </Button>\n </ActionsLayout>\n )\n}\nPrintChecksFailure.Footer = Footer\n"],"names":["PrintChecksFailure","props","jsx","BaseComponent","Root","dictionary","errorMessage","onEvent","useComponentDictionary","useI18n","t","useTranslation","Alert","Button","useComponentContext","jsxs","Flex","printChecksEvents","Footer","ActionsLayout"],"mappings":";;;;;;;;;AAaO,SAASA,EAAmBC,GAAgC;AACjE,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,YAAAC,GAAY,cAAAC,GAAc,SAAAC,QAAuC;AAC/E,EAAAC,EAAuB,8BAA8BH,CAAU,GAC/DI,EAAQ,4BAA4B;AACpC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,4BAA4B,GACnD,EAAE,OAAAC,GAAO,QAAAC,EAAA,IAAWC,EAAA;AAE1B,SACE,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,IAAA,gBAAAd,EAACU,GAAA,EAAM,QAAO,SAAQ,uBAAqB,IAAC,OAAOF,EAAE,aAAa,GAC/D,UAAAJ,EAAA,CACH;AAAA,IACA,gBAAAJ;AAAA,MAACW;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,SAAS,MAAM;AACb,UAAAN,EAAQU,EAAkB,kBAAkB;AAAA,QAC9C;AAAA,QAEC,YAAE,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACf,GACF;AAEJ,GAEMC,IAAS,CAAC,EAAE,SAAAX,QAA4D;AAC5E,EAAAE,EAAQ,4BAA4B;AACpC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,4BAA4B,GACnD,EAAE,QAAAE,EAAA,IAAWC,EAAA;AAEnB,2BACGK,GAAA,EACC,UAAA,gBAAAjB;AAAA,IAACW;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,SAAS,MAAM;AACb,QAAAN,EAAQU,EAAkB,kBAAkB;AAAA,MAC9C;AAAA,MAEC,YAAE,UAAU;AAAA,IAAA;AAAA,EAAA,GAEjB;AAEJ;AACAjB,EAAmB,SAASkB;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PrintChecksFailure } from './PrintChecksFailure';
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { BaseComponentInterface } from '../../../Base';
|
|
2
|
+
import { OnEventType } from '../../../Base/useBase';
|
|
3
|
+
import { EventType } from '../../../../shared/constants';
|
|
4
|
+
interface PrintChecksFormProps extends BaseComponentInterface<'Payroll.PrintChecksForm'> {
|
|
5
|
+
payrollId: string;
|
|
6
|
+
/** Whether a generate-and-poll cycle is in flight; disables the fields while true. */
|
|
7
|
+
isGenerating?: boolean;
|
|
8
|
+
}
|
|
9
|
+
/** @internal */
|
|
10
|
+
export declare function PrintChecksForm(props: PrintChecksFormProps): import("react").JSX.Element;
|
|
11
|
+
export declare namespace PrintChecksForm {
|
|
12
|
+
var Footer: ({ onEvent }: {
|
|
13
|
+
onEvent: OnEventType<EventType, unknown>;
|
|
14
|
+
}) => import("react").JSX.Element;
|
|
15
|
+
}
|
|
16
|
+
export {};
|
|
@@ -0,0 +1,144 @@
|
|
|
1
|
+
import { jsx as o, jsxs as E } from "react/jsx-runtime";
|
|
2
|
+
import { useState as f, useEffect as I } from "react";
|
|
3
|
+
import { useForm as A, useWatch as G, FormProvider as U } from "react-hook-form";
|
|
4
|
+
import { zodResolver as q } from "@hookform/resolvers/zod";
|
|
5
|
+
import { useTranslation as F } from "react-i18next";
|
|
6
|
+
import { z as h } from "zod";
|
|
7
|
+
import { usePayrollsGeneratePrintableChecksMutation as L } from "@gusto/embedded-api/react-query/payrollsGeneratePrintableChecks";
|
|
8
|
+
import { useGeneratedDocumentsGet as M } from "@gusto/embedded-api/react-query/generatedDocumentsGet";
|
|
9
|
+
import { PrintingFormat as n } from "@gusto/embedded-api/models/components/printablepayrollchecksbody";
|
|
10
|
+
import { DocumentType as x } from "@gusto/embedded-api/models/operations/getv1generateddocumentsdocumenttyperequestuuid";
|
|
11
|
+
import { GeneratedDocumentStatus as k } from "@gusto/embedded-api/models/components/generateddocument";
|
|
12
|
+
import { BaseComponent as B } from "../../../Base/Base.js";
|
|
13
|
+
import { useBase as w } from "../../../Base/useBase.js";
|
|
14
|
+
import { useComponentContext as H } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
|
|
15
|
+
import { useComponentDictionary as K, useI18n as y } from "../../../../i18n/I18n.js";
|
|
16
|
+
import { useFlow as j } from "../../../Flow/useFlow.js";
|
|
17
|
+
import { Flex as z } from "../../../Common/Flex/Flex.js";
|
|
18
|
+
import { ActionsLayout as O } from "../../../Common/ActionsLayout/ActionsLayout.js";
|
|
19
|
+
import { Form as V } from "../../../Common/Form/Form.js";
|
|
20
|
+
import { printChecksEvents as c } from "../../../../shared/constants.js";
|
|
21
|
+
import { RadioGroupField as W } from "../../../Common/Fields/RadioGroupField/RadioGroupField.js";
|
|
22
|
+
import { NumberInputField as J } from "../../../Common/Fields/NumberInputField/NumberInputField.js";
|
|
23
|
+
const Q = h.object({
|
|
24
|
+
printingFormat: h.nativeEnum(n),
|
|
25
|
+
startingCheckNumber: h.number({ message: "invalidStartingCheckNumber" }).int({ message: "invalidStartingCheckNumber" }).nonnegative({ message: "invalidStartingCheckNumber" }).lt(1e10, { message: "invalidStartingCheckNumber" }).optional()
|
|
26
|
+
}), N = "gusto-sdk-print-checks-form", X = (e) => Array.isArray(e) && e.every((r) => typeof r == "object" && r !== null), Y = (e) => {
|
|
27
|
+
if (e && typeof e == "object" && "errors" in e && X(e.errors)) {
|
|
28
|
+
const [r] = e.errors;
|
|
29
|
+
if (r?.message) return r.message;
|
|
30
|
+
}
|
|
31
|
+
return e instanceof Error ? e.message : null;
|
|
32
|
+
}, Z = (e) => ({
|
|
33
|
+
printingFormat: e.printingFormat,
|
|
34
|
+
...e.printingFormat === n.Bottom && e.startingCheckNumber !== void 0 ? { startingCheckNumber: e.startingCheckNumber } : {}
|
|
35
|
+
}), $ = (e) => {
|
|
36
|
+
const r = document.createElement("a");
|
|
37
|
+
r.href = e, r.rel = "noopener noreferrer", document.body.appendChild(r), r.click(), document.body.removeChild(r);
|
|
38
|
+
};
|
|
39
|
+
function ee(e) {
|
|
40
|
+
return /* @__PURE__ */ o(B, { ...e, children: /* @__PURE__ */ o(re, { ...e, children: e.children }) });
|
|
41
|
+
}
|
|
42
|
+
const re = ({ dictionary: e, payrollId: r, isGenerating: i }) => {
|
|
43
|
+
K("Payroll.PrintChecksForm", e), y("Payroll.PrintChecksForm");
|
|
44
|
+
const { t } = F("Payroll.PrintChecksForm"), { onEvent: s, baseSubmitHandler: P } = w(), [b, S] = f(null), [u, d] = f(!1), l = A({
|
|
45
|
+
resolver: q(Q),
|
|
46
|
+
defaultValues: { printingFormat: n.Top, startingCheckNumber: 0 }
|
|
47
|
+
}), v = G({
|
|
48
|
+
name: "printingFormat",
|
|
49
|
+
control: l.control
|
|
50
|
+
}), { mutateAsync: D } = L(), { data: p } = M(
|
|
51
|
+
{
|
|
52
|
+
documentType: x.PrintablePayrollChecks,
|
|
53
|
+
requestUuid: b || ""
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
enabled: !!b,
|
|
57
|
+
refetchInterval: u ? 5e3 : !1
|
|
58
|
+
}
|
|
59
|
+
);
|
|
60
|
+
I(() => {
|
|
61
|
+
const a = p?.generatedDocument?.status;
|
|
62
|
+
if (!(!u || !a))
|
|
63
|
+
if (a === k.Succeeded) {
|
|
64
|
+
d(!1);
|
|
65
|
+
const m = p.generatedDocument?.documentUrls?.[0] ?? null;
|
|
66
|
+
s(c.PRINT_CHECKS_GENERATE_SUCCEEDED, { documentUrl: m }), m && $(m);
|
|
67
|
+
} else a === k.Failed && (d(!1), s(c.PRINT_CHECKS_GENERATE_FAILED, { errorMessage: null }));
|
|
68
|
+
}, [p, u, s]);
|
|
69
|
+
const R = async (a) => {
|
|
70
|
+
s(c.PRINT_CHECKS_GENERATE_START), await P(a, async (m) => {
|
|
71
|
+
try {
|
|
72
|
+
const g = (await D({
|
|
73
|
+
request: {
|
|
74
|
+
payrollUuid: r,
|
|
75
|
+
printablePayrollChecksBody: Z(m)
|
|
76
|
+
}
|
|
77
|
+
})).payrollCheck?.requestUuid;
|
|
78
|
+
if (!g)
|
|
79
|
+
throw new Error("Missing requestUuid in generate-printable-checks response");
|
|
80
|
+
S(g), d(!0);
|
|
81
|
+
} catch (C) {
|
|
82
|
+
throw s(c.PRINT_CHECKS_GENERATE_FAILED, {
|
|
83
|
+
errorMessage: Y(C)
|
|
84
|
+
}), C;
|
|
85
|
+
}
|
|
86
|
+
});
|
|
87
|
+
}, T = l.formState.errors.startingCheckNumber?.message ? t("validations.startingCheckNumber") : void 0, _ = [
|
|
88
|
+
{
|
|
89
|
+
value: n.Top,
|
|
90
|
+
label: t("customStockLabel"),
|
|
91
|
+
description: t("customStockDescription")
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
value: n.Bottom,
|
|
95
|
+
label: t("blankStockLabel"),
|
|
96
|
+
description: t("blankStockDescription")
|
|
97
|
+
}
|
|
98
|
+
];
|
|
99
|
+
return /* @__PURE__ */ o(U, { ...l, children: /* @__PURE__ */ o(V, { id: N, onSubmit: l.handleSubmit(R), children: /* @__PURE__ */ E(z, { flexDirection: "column", gap: 20, children: [
|
|
100
|
+
/* @__PURE__ */ o(
|
|
101
|
+
W,
|
|
102
|
+
{
|
|
103
|
+
name: "printingFormat",
|
|
104
|
+
label: t("modalTitle"),
|
|
105
|
+
options: _,
|
|
106
|
+
isRequired: !0,
|
|
107
|
+
isDisabled: i
|
|
108
|
+
}
|
|
109
|
+
),
|
|
110
|
+
v === n.Bottom && /* @__PURE__ */ o(
|
|
111
|
+
J,
|
|
112
|
+
{
|
|
113
|
+
name: "startingCheckNumber",
|
|
114
|
+
label: t("startingCheckNumberLabel"),
|
|
115
|
+
description: t("startingCheckNumberDescription"),
|
|
116
|
+
errorMessage: T,
|
|
117
|
+
isDisabled: i,
|
|
118
|
+
min: 0
|
|
119
|
+
}
|
|
120
|
+
)
|
|
121
|
+
] }) }) });
|
|
122
|
+
}, te = ({ onEvent: e }) => {
|
|
123
|
+
y("Payroll.PrintChecksForm");
|
|
124
|
+
const { t: r } = F("Payroll.PrintChecksForm"), { Button: i } = H(), { isGenerating: t } = j();
|
|
125
|
+
return /* @__PURE__ */ E(O, { children: [
|
|
126
|
+
/* @__PURE__ */ o(
|
|
127
|
+
i,
|
|
128
|
+
{
|
|
129
|
+
variant: "secondary",
|
|
130
|
+
onClick: () => {
|
|
131
|
+
e(c.PRINT_CHECKS_CANCEL);
|
|
132
|
+
},
|
|
133
|
+
isDisabled: t,
|
|
134
|
+
children: r("cancelCta")
|
|
135
|
+
}
|
|
136
|
+
),
|
|
137
|
+
/* @__PURE__ */ o(i, { variant: "primary", type: "submit", form: N, isDisabled: t, children: r(t ? "submitCtaLoading" : "submitCta") })
|
|
138
|
+
] });
|
|
139
|
+
};
|
|
140
|
+
ee.Footer = te;
|
|
141
|
+
export {
|
|
142
|
+
ee as PrintChecksForm
|
|
143
|
+
};
|
|
144
|
+
//# sourceMappingURL=PrintChecksForm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PrintChecksForm.js","sources":["../../../../../src/components/Payroll/PrintChecks/PrintChecksForm/PrintChecksForm.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport { FormProvider, useForm, useWatch } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useTranslation } from 'react-i18next'\nimport { z } from 'zod'\nimport { usePayrollsGeneratePrintableChecksMutation } from '@gusto/embedded-api/react-query/payrollsGeneratePrintableChecks'\nimport { useGeneratedDocumentsGet } from '@gusto/embedded-api/react-query/generatedDocumentsGet'\nimport {\n PrintingFormat,\n type PrintablePayrollChecksBody,\n} from '@gusto/embedded-api/models/components/printablepayrollchecksbody'\nimport { DocumentType } from '@gusto/embedded-api/models/operations/getv1generateddocumentsdocumenttyperequestuuid'\nimport { GeneratedDocumentStatus } from '@gusto/embedded-api/models/components/generateddocument'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport { ActionsLayout, Flex, NumberInputField, RadioGroupField } from '@/components/Common'\nimport { Form } from '@/components/Common/Form'\nimport { printChecksEvents, type EventType } from '@/shared/constants'\nimport type { RadioGroupOption } from '@/index'\n\ninterface PrintChecksFormProps extends BaseComponentInterface<'Payroll.PrintChecksForm'> {\n payrollId: string\n /** Whether a generate-and-poll cycle is in flight; disables the fields while true. */\n isGenerating?: boolean\n}\n\n// The Footer is rendered by the top-level orchestrator as a sibling of this component (not a\n// child), so it can only read shared state — like whether a generate-and-poll cycle is in\n// flight — via the machine's FlowContext rather than as a prop. This narrow interface describes\n// only the field Footer needs, rather than depending on the orchestrator's full context type.\ninterface PrintChecksFormFlowContext extends FlowContextInterface {\n isGenerating?: boolean\n}\n\nconst PrintChecksFormSchema = z.object({\n printingFormat: z.nativeEnum(PrintingFormat),\n startingCheckNumber: z\n .number({ message: 'invalidStartingCheckNumber' })\n .int({ message: 'invalidStartingCheckNumber' })\n .nonnegative({ message: 'invalidStartingCheckNumber' })\n .lt(10_000_000_000, { message: 'invalidStartingCheckNumber' })\n .optional(),\n})\n\ntype PrintChecksFormValues = z.infer<typeof PrintChecksFormSchema>\n\nconst PRINT_CHECKS_FORM_ID = 'gusto-sdk-print-checks-form'\n\nconst isErrorList = (val: unknown): val is { message?: string }[] =>\n Array.isArray(val) && val.every(entry => typeof entry === 'object' && entry !== null)\n\nconst extractErrorMessage = (err: unknown): string | null => {\n if (err && typeof err === 'object' && 'errors' in err && isErrorList(err.errors)) {\n const [firstError] = err.errors\n if (firstError?.message) return firstError.message\n }\n return err instanceof Error ? err.message : null\n}\n\nconst buildRequestBody = (data: PrintChecksFormValues): PrintablePayrollChecksBody => ({\n printingFormat: data.printingFormat,\n ...(data.printingFormat === PrintingFormat.Bottom && data.startingCheckNumber !== undefined\n ? { startingCheckNumber: data.startingCheckNumber }\n : {}),\n})\n\n// Navigates directly to `url` via a synthetic anchor click rather than `fetch`-ing it into a blob:\n// the generated-document URL is a signed, cross-origin S3 URL with `response-content-disposition:\n// attachment` baked into its query string, so a direct browser-level request downloads it via that\n// response header — but a `fetch()` from JS is subject to CORS, which the bucket doesn't allow, and\n// fails outright. A plain navigation isn't subject to CORS and never opens a new tab or navigates\n// the host page, since the browser intercepts the download instead of rendering a response.\nconst downloadGeneratedChecks = (url: string) => {\n const link = document.createElement('a')\n link.href = url\n link.rel = 'noopener noreferrer'\n document.body.appendChild(link)\n link.click()\n document.body.removeChild(link)\n}\n\n/** @internal */\nexport function PrintChecksForm(props: PrintChecksFormProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({ dictionary, payrollId, isGenerating }: PrintChecksFormProps) => {\n useComponentDictionary('Payroll.PrintChecksForm', dictionary)\n useI18n('Payroll.PrintChecksForm')\n const { t } = useTranslation('Payroll.PrintChecksForm')\n const { onEvent, baseSubmitHandler } = useBase()\n const [requestUuid, setRequestUuid] = useState<string | null>(null)\n const [isPolling, setIsPolling] = useState(false)\n\n const formMethods = useForm<PrintChecksFormValues>({\n resolver: zodResolver(PrintChecksFormSchema),\n defaultValues: { printingFormat: PrintingFormat.Top, startingCheckNumber: 0 },\n })\n\n const printingFormat = useWatch<PrintChecksFormValues, 'printingFormat'>({\n name: 'printingFormat',\n control: formMethods.control,\n })\n\n const { mutateAsync } = usePayrollsGeneratePrintableChecksMutation()\n\n const { data } = useGeneratedDocumentsGet(\n {\n documentType: DocumentType.PrintablePayrollChecks,\n requestUuid: requestUuid || '',\n },\n {\n enabled: !!requestUuid,\n refetchInterval: isPolling ? 5_000 : false,\n },\n )\n\n useEffect(() => {\n const status = data?.generatedDocument?.status\n if (!isPolling || !status) return\n\n if (status === GeneratedDocumentStatus.Succeeded) {\n setIsPolling(false)\n const url = data.generatedDocument?.documentUrls?.[0] ?? null\n onEvent(printChecksEvents.PRINT_CHECKS_GENERATE_SUCCEEDED, { documentUrl: url })\n if (url) {\n downloadGeneratedChecks(url)\n }\n } else if (status === GeneratedDocumentStatus.Failed) {\n setIsPolling(false)\n onEvent(printChecksEvents.PRINT_CHECKS_GENERATE_FAILED, { errorMessage: null })\n }\n }, [data, isPolling, onEvent])\n\n const onSubmit = async (formData: PrintChecksFormValues) => {\n onEvent(printChecksEvents.PRINT_CHECKS_GENERATE_START)\n\n await baseSubmitHandler(formData, async submittedData => {\n try {\n const result = await mutateAsync({\n request: {\n payrollUuid: payrollId,\n printablePayrollChecksBody: buildRequestBody(submittedData),\n },\n })\n\n const nextRequestUuid = result.payrollCheck?.requestUuid\n if (!nextRequestUuid) {\n throw new Error('Missing requestUuid in generate-printable-checks response')\n }\n\n setRequestUuid(nextRequestUuid)\n setIsPolling(true)\n } catch (err) {\n onEvent(printChecksEvents.PRINT_CHECKS_GENERATE_FAILED, {\n errorMessage: extractErrorMessage(err),\n })\n throw err\n }\n })\n }\n\n const startingCheckNumberErrorCode = formMethods.formState.errors.startingCheckNumber?.message\n const startingCheckNumberErrorMessage = startingCheckNumberErrorCode\n ? t('validations.startingCheckNumber')\n : undefined\n\n const printingFormatOptions: RadioGroupOption[] = [\n {\n value: PrintingFormat.Top,\n label: t('customStockLabel'),\n description: t('customStockDescription'),\n },\n {\n value: PrintingFormat.Bottom,\n label: t('blankStockLabel'),\n description: t('blankStockDescription'),\n },\n ]\n\n return (\n <FormProvider {...formMethods}>\n <Form id={PRINT_CHECKS_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n <Flex flexDirection=\"column\" gap={20}>\n <RadioGroupField\n name=\"printingFormat\"\n label={t('modalTitle')}\n options={printingFormatOptions}\n isRequired\n isDisabled={isGenerating}\n />\n {printingFormat === PrintingFormat.Bottom && (\n <NumberInputField\n name=\"startingCheckNumber\"\n label={t('startingCheckNumberLabel')}\n description={t('startingCheckNumberDescription')}\n errorMessage={startingCheckNumberErrorMessage}\n isDisabled={isGenerating}\n min={0}\n />\n )}\n </Flex>\n </Form>\n </FormProvider>\n )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n useI18n('Payroll.PrintChecksForm')\n const { t } = useTranslation('Payroll.PrintChecksForm')\n const { Button } = useComponentContext()\n const { isGenerating } = useFlow<PrintChecksFormFlowContext>()\n\n return (\n <ActionsLayout>\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(printChecksEvents.PRINT_CHECKS_CANCEL)\n }}\n isDisabled={isGenerating}\n >\n {t('cancelCta')}\n </Button>\n <Button variant=\"primary\" type=\"submit\" form={PRINT_CHECKS_FORM_ID} isDisabled={isGenerating}>\n {isGenerating ? t('submitCtaLoading') : t('submitCta')}\n </Button>\n </ActionsLayout>\n )\n}\nPrintChecksForm.Footer = Footer\n"],"names":["PrintChecksFormSchema","z","PrintingFormat","PRINT_CHECKS_FORM_ID","isErrorList","val","entry","extractErrorMessage","err","firstError","buildRequestBody","data","downloadGeneratedChecks","url","link","PrintChecksForm","props","jsx","BaseComponent","Root","dictionary","payrollId","isGenerating","useComponentDictionary","useI18n","useTranslation","onEvent","baseSubmitHandler","useBase","requestUuid","setRequestUuid","useState","isPolling","setIsPolling","formMethods","useForm","zodResolver","printingFormat","useWatch","mutateAsync","usePayrollsGeneratePrintableChecksMutation","useGeneratedDocumentsGet","DocumentType","useEffect","status","GeneratedDocumentStatus","printChecksEvents","onSubmit","formData","submittedData","nextRequestUuid","startingCheckNumberErrorMessage","printingFormatOptions","FormProvider","Form","jsxs","Flex","RadioGroupField","NumberInputField","Footer","t","Button","useComponentContext","useFlow","ActionsLayout"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PrintChecksForm } from './PrintChecksForm';
|