npm - @gusto/embedded-react-sdk - Versions diffs - 0.31.0-rc.5 → 0.31.1-rc.1 - Mend

@gusto/embedded-react-sdk 0.31.0-rc.5 → 0.31.1-rc.1

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.

Files changed (375) hide show

package/dist/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PayrollConfigurationPresentation.js","sources":["../../../../src/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useRef } from 'react'\nimport type { EmployeeCompensations } from '@gusto/embedded-api/models/components/payroll'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollPayPeriodType } from '@gusto/embedded-api/models/components/payrollpayperiodtype'\nimport type { PayScheduleObject } from '@gusto/embedded-api/models/components/payscheduleobject'\nimport { Trans, useTranslation } from 'react-i18next'\nimport type { PayrollEmployeeCompensationsType } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport {\n useFormatEmployeePayRate,\n getRegularHours,\n getOvertimeHours,\n getTotalPtoHours,\n getAdditionalEarnings,\n getReimbursements,\n formatHoursDisplay,\n calculateGrossPay,\n getPayrollTypeLabel,\n} from '../helpers'\nimport type { ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { PayrollBlockerAlerts } from '../PayrollBlocker/components/PayrollBlockerAlerts'\nimport styles from './PayrollConfigurationPresentation.module.scss'\nimport { useI18n } from '@/i18n'\nimport { DataView, Flex, FlexItem, Grid, PayrollLoading } from '@/components/Common'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\nimport XCircle from '@/assets/icons/x-circle.svg?react'\nimport PlusCircle from '@/assets/icons/plus-circle.svg?react'\nimport { firstLastName, formatNumberAsCurrency } from '@/helpers/formattedStrings'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useContainerBreakpoints from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\n\ninterface PayrollConfigurationPresentationProps {\n employeeCompensations: EmployeeCompensations[]\n employeeDetails: Employee[]\n payPeriod?: PayrollPayPeriodType\n paySchedule?: PayScheduleObject\n onCalculatePayroll: () => void\n onEdit: (employee: Employee) => void\n onToggleExclude: (employeeCompensation: PayrollEmployeeCompensationsType) => void\n onViewBlockers: () => void\n isOffCycle?: boolean\n offCycleReason?: string \| null\n alerts?: ReactNode\n payrollAlert?: {\n label: string\n content?: ReactNode\n variant: 'info' \| 'warning'\n }\n isPending?: boolean\n isCalculating?: boolean\n payrollBlockers?: ApiPayrollBlocker[]\n pagination?: PaginationControlProps\n withReimbursements?: boolean\n isCalculateDisabled?: boolean\n}\n\nconst getPayrollConfigurationTitle = (\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\nexport const PayrollConfigurationPresentation = ({\n employeeCompensations,\n employeeDetails,\n payPeriod,\n paySchedule,\n onEdit,\n onToggleExclude,\n onCalculatePayroll,\n onViewBlockers,\n isOffCycle = false,\n offCycleReason,\n alerts,\n payrollAlert,\n isPending,\n isCalculating,\n payrollBlockers = [],\n pagination,\n withReimbursements = true,\n isCalculateDisabled = false,\n}: PayrollConfigurationPresentationProps) => {\n const { Button, Heading, Text, Badge, Alert } = useComponentContext()\n useI18n('Payroll.PayrollConfiguration')\n const { t } = useTranslation('Payroll.PayrollConfiguration')\n const dateFormatter = useDateFormatter()\n const formatEmployeePayRate = useFormatEmployeePayRate()\n const containerRef = useRef<HTMLDivElement>(null)\n const breakpoints = useContainerBreakpoints({ ref: containerRef })\n const isDesktop = breakpoints.includes('small')\n\n const employeeMap = new Map(employeeDetails.map(employee => [employee.uuid, employee]))\n\n const getEmployeeName = (employeeUuid: string) => {\n const employee = employeeMap.get(employeeUuid)\n return employee\n ? firstLastName({ first_name: employee.firstName, last_name: employee.lastName })\n : null\n }\n\n return (\n <div ref={containerRef} className={styles.container}>\n <Flex flexDirection=\"column\" gap={32}>\n <Flex\n flexDirection={isDesktop ? 'row' : 'column'}\n justifyContent={isDesktop ? 'space-between' : 'normal'}\n alignItems={isDesktop ? 'center' : 'stretch'}\n gap={isDesktop ? 0 : 16}\n >\n <FlexItem>\n <Heading as=\"h1\">{t('pageTitle')}</Heading>\n {payPeriod && (\n <Text variant=\"supporting\">\n <Trans\n i18nKey=\"description\"\n t={t}\n components={{ dateWrapper: <Text weight=\"bold\" as=\"span\" /> }}\n values={{\n ...getPayrollConfigurationTitle(payPeriod, dateFormatter),\n payrollType: getPayrollTypeLabel({ offCycle: isOffCycle, offCycleReason }),\n }}\n />\n </Text>\n )}\n </FlexItem>\n <FlexItem flexGrow={isDesktop ? 0 : 0}>\n {isDesktop ? (\n <Button\n title={t('calculatePayrollTitle')}\n onClick={onCalculatePayroll}\n isDisabled={isCalculateDisabled \|\| isPending \|\| isCalculating}\n >\n {isCalculating ? t('calculatingPayroll') : t('calculatePayroll')}\n </Button>\n ) : (\n <Flex flexDirection=\"column\" justifyContent=\"normal\" alignItems=\"stretch\" gap={12}>\n <Button\n title={t('calculatePayrollTitle')}\n onClick={onCalculatePayroll}\n isDisabled={isCalculateDisabled \|\| isPending \|\| isCalculating}\n >\n {isCalculating ? t('calculatingPayroll') : t('calculatePayroll')}\n </Button>\n </Flex>\n )}\n </FlexItem>\n </Flex>\n\n {(alerts \|\| payrollAlert) && (\n <Grid gap={16} gridTemplateColumns=\"1fr\">\n {payrollAlert && (\n <Alert label={payrollAlert.label} status={payrollAlert.variant}>\n {payrollAlert.content}\n </Alert>\n )}\n {alerts}\n </Grid>\n )}\n\n {isPending ? (\n <PayrollLoading\n title={isCalculating ? t('calculatingTitle') : t('loadingTitle')}\n description={isCalculating ? t('calculatingDescription') : t('loadingDescription')}\n />\n ) : (\n <>\n {payrollBlockers.length > 0 && (\n <PayrollBlockerAlerts\n blockers={payrollBlockers}\n onMultipleViewClick={onViewBlockers}\n />\n )}\n <Flex flexDirection=\"column\" gap={20}>\n <FlexItem>\n <Heading as=\"h3\">{t('hoursAndEarningsTitle')}</Heading>\n <Text variant=\"supporting\">{t('hoursAndEarningsDescription')}</Text>\n </FlexItem>\n\n <DataView\n label={t('employeeCompensationsTitle')}\n columns={[\n {\n title: t('tableColumns.employees'),\n render: (item: EmployeeCompensations) => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n const payRateDisplay = formatEmployeePayRate(employee)\n return (\n <Flex flexDirection=\"column\" gap={0}>\n {getEmployeeName(item.employeeUuid \|\| '')}\n {payRateDisplay && (\n <Text size=\"xs\" variant=\"supporting\">\n {payRateDisplay}\n </Text>\n )}\n {item.excluded && <Badge status=\"warning\">{t('skippedBadge')}</Badge>}\n </Flex>\n )\n },\n },\n {\n title: t('tableColumns.hours'),\n render: (item: EmployeeCompensations) => {\n const hours = getRegularHours(item)\n const overtimeHours = getOvertimeHours(item)\n return formatHoursDisplay(hours + overtimeHours)\n },\n },\n {\n title: t('tableColumns.timeOff'),\n render: (item: EmployeeCompensations) => {\n const ptoHours = getTotalPtoHours(item)\n return formatHoursDisplay(ptoHours)\n },\n },\n {\n title: t('tableColumns.additionalEarnings'),\n render: (item: EmployeeCompensations) => {\n const earnings = getAdditionalEarnings(item)\n return formatNumberAsCurrency(earnings)\n },\n },\n ...(withReimbursements\n ? [\n {\n title: t('tableColumns.reimbursements'),\n render: (item: EmployeeCompensations) => {\n const reimbursements = getReimbursements(item)\n return formatNumberAsCurrency(reimbursements)\n },\n },\n ]\n : []),\n {\n title: t('tableColumns.totalPay'),\n render: (item: PayrollEmployeeCompensationsType) => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n const calculatedGrossPay = employee\n ? calculateGrossPay(\n item,\n employee,\n payPeriod?.startDate,\n paySchedule,\n isOffCycle,\n )\n : 0\n return formatNumberAsCurrency(calculatedGrossPay)\n },\n },\n ]}\n data={employeeCompensations}\n itemMenu={(item: EmployeeCompensations) => (\n <HamburgerMenu\n items={[\n {\n label: t('editMenu.edit'),\n icon: <PencilSvg aria-hidden />,\n onClick: () => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n if (employee) {\n onEdit(employee)\n }\n },\n },\n {\n label: t(item.excluded ? 'editMenu.unskip' : 'editMenu.skip'),\n icon: item.excluded ? <PlusCircle aria-hidden /> : <XCircle aria-hidden />,\n onClick: () => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n if (employee) {\n onToggleExclude(item)\n }\n },\n },\n ]}\n triggerLabel={t('editMenu.edit')}\n />\n )}\n pagination={pagination}\n />\n </Flex>\n </>\n )}\n </Flex>\n </div>\n )\n}\n"],"names":["getPayrollConfigurationTitle","payPeriod","dateFormatter","PayrollConfigurationPresentation","employeeCompensations","employeeDetails","paySchedule","onEdit","onToggleExclude","onCalculatePayroll","onViewBlockers","isOffCycle","offCycleReason","alerts","payrollAlert","isPending","isCalculating","payrollBlockers","pagination","withReimbursements","isCalculateDisabled","Button","Heading","Text","Badge","Alert","useComponentContext","useI18n","useTranslation","useDateFormatter","formatEmployeePayRate","useFormatEmployeePayRate","containerRef","useRef","isDesktop","useContainerBreakpoints","employeeMap","employee","getEmployeeName","employeeUuid","firstLastName","jsx","styles","jsxs","Flex","FlexItem","Trans","getPayrollTypeLabel","Grid","PayrollLoading","Fragment","PayrollBlockerAlerts","DataView","item","payRateDisplay","hours","getRegularHours","overtimeHours","getOvertimeHours","formatHoursDisplay","ptoHours","getTotalPtoHours","earnings","getAdditionalEarnings","formatNumberAsCurrency","reimbursements","getReimbursements","calculatedGrossPay","calculateGrossPay","HamburgerMenu","PencilSvg","PlusCircle","XCircle"],"mappings":"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"}
1	+ {"version":3,"file":"PayrollConfigurationPresentation.js","sources":["../../../../src/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useRef } from 'react'\nimport type { EmployeeCompensations } from '@gusto/embedded-api/models/components/payroll'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollPayPeriodType } from '@gusto/embedded-api/models/components/payrollpayperiodtype'\nimport type { PayScheduleObject } from '@gusto/embedded-api/models/components/payscheduleobject'\nimport { Trans, useTranslation } from 'react-i18next'\nimport type { PayrollEmployeeCompensationsType } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport {\n useFormatEmployeePayRate,\n getRegularHours,\n getOvertimeHours,\n getTotalPtoHours,\n getAdditionalEarnings,\n getReimbursements,\n formatHoursDisplay,\n calculateGrossPay,\n getPayrollTypeLabel,\n} from '../helpers'\nimport type { ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { PayrollBlockerAlerts } from '../PayrollBlocker/components/PayrollBlockerAlerts'\nimport styles from './PayrollConfigurationPresentation.module.scss'\nimport { useI18n } from '@/i18n'\nimport { DataView, Flex, FlexItem, Grid, PayrollLoading } from '@/components/Common'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\nimport XCircle from '@/assets/icons/x-circle.svg?react'\nimport PlusCircle from '@/assets/icons/plus-circle.svg?react'\nimport { firstLastName, formatNumberAsCurrency } from '@/helpers/formattedStrings'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useContainerBreakpoints from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\n\ninterface PayrollConfigurationPresentationProps {\n employeeCompensations: EmployeeCompensations[]\n employeeDetails: Employee[]\n payPeriod?: PayrollPayPeriodType\n paySchedule?: PayScheduleObject\n onCalculatePayroll: () => void\n onEdit: (employee: Employee) => void\n onToggleExclude: (employeeCompensation: PayrollEmployeeCompensationsType) => void\n onViewBlockers: () => void\n isOffCycle?: boolean\n offCycleReason?: string \| null\n alerts?: ReactNode\n payrollAlert?: {\n label: string\n content?: ReactNode\n variant: 'info' \| 'warning'\n }\n isPending?: boolean\n isCalculating?: boolean\n payrollBlockers?: ApiPayrollBlocker[]\n pagination?: PaginationControlProps\n withReimbursements?: boolean\n isCalculateDisabled?: boolean\n}\n\nconst getPayrollConfigurationTitle = (\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\nexport const PayrollConfigurationPresentation = ({\n employeeCompensations,\n employeeDetails,\n payPeriod,\n paySchedule,\n onEdit,\n onToggleExclude,\n onCalculatePayroll,\n onViewBlockers,\n isOffCycle = false,\n offCycleReason,\n alerts,\n payrollAlert,\n isPending,\n isCalculating,\n payrollBlockers = [],\n pagination,\n withReimbursements = true,\n isCalculateDisabled = false,\n}: PayrollConfigurationPresentationProps) => {\n const { Button, Heading, Text, Badge, Alert } = useComponentContext()\n useI18n('Payroll.PayrollConfiguration')\n const { t } = useTranslation('Payroll.PayrollConfiguration')\n const dateFormatter = useDateFormatter()\n const formatEmployeePayRate = useFormatEmployeePayRate()\n const containerRef = useRef<HTMLDivElement>(null)\n const breakpoints = useContainerBreakpoints({ ref: containerRef })\n const isDesktop = breakpoints.includes('small')\n\n const employeeMap = new Map(employeeDetails.map(employee => [employee.uuid, employee]))\n\n const getEmployeeName = (employeeUuid: string) => {\n const employee = employeeMap.get(employeeUuid)\n return employee\n ? firstLastName({ first_name: employee.firstName, last_name: employee.lastName })\n : null\n }\n\n return (\n <div ref={containerRef} className={styles.container}>\n <Flex flexDirection=\"column\" gap={32}>\n <Flex\n flexDirection={isDesktop ? 'row' : 'column'}\n justifyContent={isDesktop ? 'space-between' : 'normal'}\n alignItems={isDesktop ? 'center' : 'stretch'}\n gap={isDesktop ? 0 : 16}\n >\n <FlexItem>\n <Heading as=\"h1\">{t('pageTitle')}</Heading>\n {payPeriod && (\n <Text variant=\"supporting\">\n <Trans\n i18nKey=\"description\"\n t={t}\n components={{ dateWrapper: <Text weight=\"bold\" as=\"span\" /> }}\n values={{\n ...getPayrollConfigurationTitle(payPeriod, dateFormatter),\n payrollType: getPayrollTypeLabel({ offCycle: isOffCycle, offCycleReason }),\n }}\n />\n </Text>\n )}\n </FlexItem>\n <FlexItem flexGrow={isDesktop ? 0 : 0}>\n {isDesktop ? (\n <Button\n title={t('calculatePayrollTitle')}\n onClick={onCalculatePayroll}\n isDisabled={isCalculateDisabled \|\| isPending \|\| isCalculating}\n >\n {isCalculating ? t('calculatingPayroll') : t('calculatePayroll')}\n </Button>\n ) : (\n <Flex flexDirection=\"column\" justifyContent=\"normal\" alignItems=\"stretch\" gap={12}>\n <Button\n title={t('calculatePayrollTitle')}\n onClick={onCalculatePayroll}\n isDisabled={isCalculateDisabled \|\| isPending \|\| isCalculating}\n >\n {isCalculating ? t('calculatingPayroll') : t('calculatePayroll')}\n </Button>\n </Flex>\n )}\n </FlexItem>\n </Flex>\n\n {(alerts \|\| payrollAlert) && (\n <Grid gap={16} gridTemplateColumns=\"1fr\">\n {payrollAlert && (\n <Alert label={payrollAlert.label} status={payrollAlert.variant}>\n {payrollAlert.content}\n </Alert>\n )}\n {alerts}\n </Grid>\n )}\n\n {isPending ? (\n <PayrollLoading\n title={isCalculating ? t('calculatingTitle') : t('loadingTitle')}\n description={isCalculating ? t('calculatingDescription') : t('loadingDescription')}\n />\n ) : (\n <>\n {payrollBlockers.length > 0 && (\n <PayrollBlockerAlerts\n blockers={payrollBlockers}\n onViewBlockersClick={onViewBlockers}\n />\n )}\n <Flex flexDirection=\"column\" gap={20}>\n <FlexItem>\n <Heading as=\"h3\">{t('hoursAndEarningsTitle')}</Heading>\n <Text variant=\"supporting\">{t('hoursAndEarningsDescription')}</Text>\n </FlexItem>\n\n <DataView\n label={t('employeeCompensationsTitle')}\n columns={[\n {\n title: t('tableColumns.employees'),\n render: (item: EmployeeCompensations) => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n const payRateDisplay = formatEmployeePayRate(employee)\n return (\n <Flex flexDirection=\"column\" gap={0}>\n {getEmployeeName(item.employeeUuid \|\| '')}\n {payRateDisplay && (\n <Text size=\"xs\" variant=\"supporting\">\n {payRateDisplay}\n </Text>\n )}\n {item.excluded && <Badge status=\"warning\">{t('skippedBadge')}</Badge>}\n </Flex>\n )\n },\n },\n {\n title: t('tableColumns.hours'),\n render: (item: EmployeeCompensations) => {\n const hours = getRegularHours(item)\n const overtimeHours = getOvertimeHours(item)\n return formatHoursDisplay(hours + overtimeHours)\n },\n },\n {\n title: t('tableColumns.timeOff'),\n render: (item: EmployeeCompensations) => {\n const ptoHours = getTotalPtoHours(item)\n return formatHoursDisplay(ptoHours)\n },\n },\n {\n title: t('tableColumns.additionalEarnings'),\n render: (item: EmployeeCompensations) => {\n const earnings = getAdditionalEarnings(item)\n return formatNumberAsCurrency(earnings)\n },\n },\n ...(withReimbursements\n ? [\n {\n title: t('tableColumns.reimbursements'),\n render: (item: EmployeeCompensations) => {\n const reimbursements = getReimbursements(item)\n return formatNumberAsCurrency(reimbursements)\n },\n },\n ]\n : []),\n {\n title: t('tableColumns.totalPay'),\n render: (item: PayrollEmployeeCompensationsType) => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n const calculatedGrossPay = employee\n ? calculateGrossPay(\n item,\n employee,\n payPeriod?.startDate,\n paySchedule,\n isOffCycle,\n )\n : 0\n return formatNumberAsCurrency(calculatedGrossPay)\n },\n },\n ]}\n data={employeeCompensations}\n itemMenu={(item: EmployeeCompensations) => (\n <HamburgerMenu\n items={[\n {\n label: t('editMenu.edit'),\n icon: <PencilSvg aria-hidden />,\n onClick: () => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n if (employee) {\n onEdit(employee)\n }\n },\n },\n {\n label: t(item.excluded ? 'editMenu.unskip' : 'editMenu.skip'),\n icon: item.excluded ? <PlusCircle aria-hidden /> : <XCircle aria-hidden />,\n onClick: () => {\n const employee = employeeMap.get(item.employeeUuid \|\| '')\n if (employee) {\n onToggleExclude(item)\n }\n },\n },\n ]}\n triggerLabel={t('editMenu.edit')}\n />\n )}\n pagination={pagination}\n />\n </Flex>\n </>\n )}\n </Flex>\n </div>\n )\n}\n"],"names":["getPayrollConfigurationTitle","payPeriod","dateFormatter","PayrollConfigurationPresentation","employeeCompensations","employeeDetails","paySchedule","onEdit","onToggleExclude","onCalculatePayroll","onViewBlockers","isOffCycle","offCycleReason","alerts","payrollAlert","isPending","isCalculating","payrollBlockers","pagination","withReimbursements","isCalculateDisabled","Button","Heading","Text","Badge","Alert","useComponentContext","useI18n","useTranslation","useDateFormatter","formatEmployeePayRate","useFormatEmployeePayRate","containerRef","useRef","isDesktop","useContainerBreakpoints","employeeMap","employee","getEmployeeName","employeeUuid","firstLastName","jsx","styles","jsxs","Flex","FlexItem","Trans","getPayrollTypeLabel","Grid","PayrollLoading","Fragment","PayrollBlockerAlerts","DataView","item","payRateDisplay","hours","getRegularHours","overtimeHours","getOvertimeHours","formatHoursDisplay","ptoHours","getTotalPtoHours","earnings","getAdditionalEarnings","formatNumberAsCurrency","reimbursements","getReimbursements","calculatedGrossPay","calculateGrossPay","HamburgerMenu","PencilSvg","PlusCircle","XCircle"],"mappings":"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"}

package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployeePresentation.js CHANGED Viewed

@@ -15,7 +15,7 @@ import { Form as oe } from "../../Common/Form/Form.js";
 import { firstLastName as se, formatNumberAsCurrency as ae } from "../../../helpers/formattedStrings.js";
 import { getAdditionalEarningsCompensations as me, getReimbursementCompensation as le, calculateGrossPay as G } from "../helpers.js";
 import { HOURS_COMPENSATION_NAMES as k, EXCLUDED_ADDITIONAL_EARNINGS as de, COMPENSATION_NAME_DOUBLE_OVERTIME as ue, COMPENSATION_NAME_OVERTIME as ce, COMPENSATION_NAME_REGULAR_HOURS as pe, COMPENSATION_NAME_REIMBURSEMENT as fe, COMPENSATION_NAME_CASH_TIPS as he, COMPENSATION_NAME_COMMISSION as Ce, COMPENSATION_NAME_CORRECTION_PAYMENT as Ne, COMPENSATION_NAME_PAYCHECK_TIPS as Ee, COMPENSATION_NAME_BONUS as ge } from "../../../shared/constants.js";
-import { useContainerBreakpoints as be } from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
+import be from "../../../hooks/useContainerBreakpoints/useContainerBreakpoints.js";
 import { TextInputField as Me } from "../../Common/Fields/TextInputField/TextInputField.js";
 import { NumberInputField as w } from "../../Common/Fields/NumberInputField/NumberInputField.js";
 import { RadioGroupField as Oe } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";

package/dist/components/Payroll/PayrollEditEmployee/TimeOffField.js CHANGED Viewed

@@ -1,10 +1,8 @@
-import { jsxs as u, jsx as l } from "react/jsx-runtime";
-import { useId as p } from "react";
-import { useFormContext as d, useWatch as f } from "react-hook-form";
-import { useTranslation as c } from "react-i18next";
+import { jsxs as u, jsx as i } from "react/jsx-runtime";
+import { useId as d } from "react";
+import { useFormContext as p, useWatch as f } from "react-hook-form";
+import { useTranslation as m } from "react-i18next";
 import { Flex as y } from "../../Common/Flex/Flex.js";
-import "classnames";
-import "../../../shared/constants.js";
 import { useComponentContext as x } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as h } from "../../../i18n/I18n.js";
 import { TextInputField as B } from "../../Common/Fields/TextInputField/TextInputField.js";
@@ -14,23 +12,23 @@ const P = ({
   hoursUsed: r,
   id: t
 }) => {
-  const { Text: n } = x(), { t: i } = c("Payroll.PayrollEditEmployee");
+  const { Text: n } = x(), { t: l } = m("Payroll.PayrollEditEmployee");
   if (o === "unlimited")
     return null;
   const a = parseFloat(e) - r;
-  return /* @__PURE__ */ l(n, { size: "sm", variant: "supporting", "aria-live": "polite", "aria-atomic": !0, id: t, children: i("timeOffBalance.remaining", { balance: a.toFixed(1) }) });
-}, U = ({ timeOff: e, employee: o }) => {
-  const { t: r } = c("Payroll.PayrollEditEmployee");
+  return /* @__PURE__ */ i(n, { size: "sm", variant: "supporting", "aria-live": "polite", "aria-atomic": !0, id: t, children: l("timeOffBalance.remaining", { balance: a.toFixed(1) }) });
+}, j = ({ timeOff: e, employee: o }) => {
+  const { t: r } = m("Payroll.PayrollEditEmployee");
   h("Payroll.PayrollEditEmployee");
-  const { control: t } = d(), n = p(), i = f({
+  const { control: t } = p(), n = d(), l = f({
     control: t,
     name: `timeOffCompensations.${e.name}`
   });
   if (!e.name)
     return null;
-  const m = parseFloat(i || "0"), a = o.eligiblePaidTimeOff?.find((s) => s.name === e.name);
+  const c = parseFloat(l || "0"), a = o.eligiblePaidTimeOff?.find((s) => s.name === e.name);
   return /* @__PURE__ */ u(y, { flexDirection: "column", gap: 4, children: [
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ i(
       B,
       {
         name: `timeOffCompensations.${e.name}`,
@@ -43,18 +41,18 @@ const P = ({
       },
       e.name
     ),
-    a?.accrualBalance && /* @__PURE__ */ l(
+    a?.accrualBalance && /* @__PURE__ */ i(
       P,
       {
         accrualBalance: a.accrualBalance,
         accrualMethod: a.accrualMethod ?? void 0,
-        hoursUsed: m,
+        hoursUsed: c,
         id: n
       }
     )
   ] });
 };
 export {
-  U as TimeOffField
+  j as TimeOffField
 };
 //# sourceMappingURL=TimeOffField.js.map

package/dist/components/Payroll/PayrollEditEmployee/TimeOffField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeOffField.js","sources":["../../../../src/components/Payroll/PayrollEditEmployee/TimeOffField.tsx"],"sourcesContent":["import { useId } from 'react'\nimport { useWatch, useFormContext } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollEmployeeCompensationsTypePaidTimeOff } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport type { PayrollEditEmployeeFormValues } from './PayrollEditEmployeePresentation'\nimport { Flex, TextInputField } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nexport interface TimeOffFieldProps {\n timeOff: PayrollEmployeeCompensationsTypePaidTimeOff\n employee: Employee\n}\n\nconst TimeOffBalance = ({\n accrualBalance,\n accrualMethod,\n hoursUsed,\n id,\n}: {\n accrualBalance: string\n accrualMethod?: string\n hoursUsed: number\n id: string\n}) => {\n const { Text } = useComponentContext()\n const { t } = useTranslation('Payroll.PayrollEditEmployee')\n\n if (accrualMethod === 'unlimited') {\n return null\n }\n\n const currentBalance = parseFloat(accrualBalance)\n const remainingBalance = currentBalance - hoursUsed\n\n return (\n <Text size=\"sm\" variant=\"supporting\" aria-live=\"polite\" aria-atomic={true} id={id}>\n {t('timeOffBalance.remaining', { balance: remainingBalance.toFixed(1) })}\n </Text>\n )\n}\n\nexport const TimeOffField = ({ timeOff, employee }: TimeOffFieldProps) => {\n const { t } = useTranslation('Payroll.PayrollEditEmployee')\n useI18n('Payroll.PayrollEditEmployee')\n\n const { control } = useFormContext<PayrollEditEmployeeFormValues>()\n const id = useId()\n\n const watchedValue = useWatch({\n control,\n name: `timeOffCompensations.${timeOff.name}`,\n })\n\n if (!timeOff.name) {\n return null\n }\n\n const hoursUsed = parseFloat(watchedValue \|\| '0')\n const eligiblePolicy = employee.eligiblePaidTimeOff?.find(policy => policy.name === timeOff.name)\n\n return (\n <Flex flexDirection=\"column\" gap={4}>\n <TextInputField\n key={timeOff.name}\n name={`timeOffCompensations.${timeOff.name}`}\n type=\"number\"\n min={0}\n adornmentEnd={t('hoursUnit')}\n isRequired\n label={timeOff.name}\n aria-describedby={id}\n />\n {eligiblePolicy?.accrualBalance && (\n <TimeOffBalance\n accrualBalance={eligiblePolicy.accrualBalance}\n accrualMethod={eligiblePolicy.accrualMethod ?? undefined}\n hoursUsed={hoursUsed}\n id={id}\n />\n )}\n </Flex>\n )\n}\n"],"names":["TimeOffBalance","accrualBalance","accrualMethod","hoursUsed","id","Text","useComponentContext","t","useTranslation","remainingBalance","jsx","TimeOffField","timeOff","employee","useI18n","control","useFormContext","useId","watchedValue","useWatch","eligiblePolicy","policy","jsxs","Flex","TextInputField"],"mappings":"~~;;;;;;;;;;~~AAeA,MAAMA,IAAiB,CAAC;AAAA,EACtB,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AACF,MAKM;AACJ,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAA,GACX,EAAE,GAAAC,EAAA,IAAMC,EAAe,6BAA6B;AAE1D,MAAIN,MAAkB;AACpB,WAAO;AAIT,QAAMO,IADiB,WAAWR,CAAc,IACNE;AAE1C,SACE,gBAAAO,EAACL,KAAK,MAAK,MAAK,SAAQ,cAAa,aAAU,UAAS,eAAa,IAAM,IAAAD,GACxE,UAAAG,EAAE,4BAA4B,EAAE,SAASE,EAAiB,QAAQ,CAAC,EAAA,CAAG,GACzE;AAEJ,GAEaE,IAAe,CAAC,EAAE,SAAAC,GAAS,UAAAC,QAAkC;AACxE,QAAM,EAAE,GAAAN,EAAA,IAAMC,EAAe,6BAA6B;AAC1D,EAAAM,EAAQ,6BAA6B;AAErC,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdZ,IAAKa,EAAA,GAELC,IAAeC,EAAS;AAAA,IAC5B,SAAAJ;AAAA,IACA,MAAM,wBAAwBH,EAAQ,IAAI;AAAA,EAAA,CAC3C;AAED,MAAI,CAACA,EAAQ;AACX,WAAO;AAGT,QAAMT,IAAY,WAAWe,KAAgB,GAAG,GAC1CE,IAAiBP,EAAS,qBAAqB,KAAK,OAAUQ,EAAO,SAAST,EAAQ,IAAI;AAEhG,SACE,gBAAAU,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,IAAA,gBAAAb;AAAA,MAACc;AAAA,MAAA;AAAA,QAEC,MAAM,wBAAwBZ,EAAQ,IAAI;AAAA,QAC1C,MAAK;AAAA,QACL,KAAK;AAAA,QACL,cAAcL,EAAE,WAAW;AAAA,QAC3B,YAAU;AAAA,QACV,OAAOK,EAAQ;AAAA,QACf,oBAAkBR;AAAA,MAAA;AAAA,MAPbQ,EAAQ;AAAA,IAAA;AAAA,IASdQ,GAAgB,kBACf,gBAAAV;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,gBAAgBoB,EAAe;AAAA,QAC/B,eAAeA,EAAe,iBAAiB;AAAA,QAC/C,WAAAjB;AAAA,QACA,IAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}
1	+ {"version":3,"file":"TimeOffField.js","sources":["../../../../src/components/Payroll/PayrollEditEmployee/TimeOffField.tsx"],"sourcesContent":["import { useId } from 'react'\nimport { useWatch, useFormContext } from 'react-hook-form'\nimport { useTranslation } from 'react-i18next'\nimport type { Employee } from '@gusto/embedded-api/models/components/employee'\nimport type { PayrollEmployeeCompensationsTypePaidTimeOff } from '@gusto/embedded-api/models/components/payrollemployeecompensationstype'\nimport type { PayrollEditEmployeeFormValues } from './PayrollEditEmployeePresentation'\nimport { Flex, TextInputField } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nexport interface TimeOffFieldProps {\n timeOff: PayrollEmployeeCompensationsTypePaidTimeOff\n employee: Employee\n}\n\nconst TimeOffBalance = ({\n accrualBalance,\n accrualMethod,\n hoursUsed,\n id,\n}: {\n accrualBalance: string\n accrualMethod?: string\n hoursUsed: number\n id: string\n}) => {\n const { Text } = useComponentContext()\n const { t } = useTranslation('Payroll.PayrollEditEmployee')\n\n if (accrualMethod === 'unlimited') {\n return null\n }\n\n const currentBalance = parseFloat(accrualBalance)\n const remainingBalance = currentBalance - hoursUsed\n\n return (\n <Text size=\"sm\" variant=\"supporting\" aria-live=\"polite\" aria-atomic={true} id={id}>\n {t('timeOffBalance.remaining', { balance: remainingBalance.toFixed(1) })}\n </Text>\n )\n}\n\nexport const TimeOffField = ({ timeOff, employee }: TimeOffFieldProps) => {\n const { t } = useTranslation('Payroll.PayrollEditEmployee')\n useI18n('Payroll.PayrollEditEmployee')\n\n const { control } = useFormContext<PayrollEditEmployeeFormValues>()\n const id = useId()\n\n const watchedValue = useWatch({\n control,\n name: `timeOffCompensations.${timeOff.name}`,\n })\n\n if (!timeOff.name) {\n return null\n }\n\n const hoursUsed = parseFloat(watchedValue \|\| '0')\n const eligiblePolicy = employee.eligiblePaidTimeOff?.find(policy => policy.name === timeOff.name)\n\n return (\n <Flex flexDirection=\"column\" gap={4}>\n <TextInputField\n key={timeOff.name}\n name={`timeOffCompensations.${timeOff.name}`}\n type=\"number\"\n min={0}\n adornmentEnd={t('hoursUnit')}\n isRequired\n label={timeOff.name}\n aria-describedby={id}\n />\n {eligiblePolicy?.accrualBalance && (\n <TimeOffBalance\n accrualBalance={eligiblePolicy.accrualBalance}\n accrualMethod={eligiblePolicy.accrualMethod ?? undefined}\n hoursUsed={hoursUsed}\n id={id}\n />\n )}\n </Flex>\n )\n}\n"],"names":["TimeOffBalance","accrualBalance","accrualMethod","hoursUsed","id","Text","useComponentContext","t","useTranslation","remainingBalance","jsx","TimeOffField","timeOff","employee","useI18n","control","useFormContext","useId","watchedValue","useWatch","eligiblePolicy","policy","jsxs","Flex","TextInputField"],"mappings":";;;;;;;;AAeA,MAAMA,IAAiB,CAAC;AAAA,EACtB,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AACF,MAKM;AACJ,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAA,GACX,EAAE,GAAAC,EAAA,IAAMC,EAAe,6BAA6B;AAE1D,MAAIN,MAAkB;AACpB,WAAO;AAIT,QAAMO,IADiB,WAAWR,CAAc,IACNE;AAE1C,SACE,gBAAAO,EAACL,KAAK,MAAK,MAAK,SAAQ,cAAa,aAAU,UAAS,eAAa,IAAM,IAAAD,GACxE,UAAAG,EAAE,4BAA4B,EAAE,SAASE,EAAiB,QAAQ,CAAC,EAAA,CAAG,GACzE;AAEJ,GAEaE,IAAe,CAAC,EAAE,SAAAC,GAAS,UAAAC,QAAkC;AACxE,QAAM,EAAE,GAAAN,EAAA,IAAMC,EAAe,6BAA6B;AAC1D,EAAAM,EAAQ,6BAA6B;AAErC,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdZ,IAAKa,EAAA,GAELC,IAAeC,EAAS;AAAA,IAC5B,SAAAJ;AAAA,IACA,MAAM,wBAAwBH,EAAQ,IAAI;AAAA,EAAA,CAC3C;AAED,MAAI,CAACA,EAAQ;AACX,WAAO;AAGT,QAAMT,IAAY,WAAWe,KAAgB,GAAG,GAC1CE,IAAiBP,EAAS,qBAAqB,KAAK,OAAUQ,EAAO,SAAST,EAAQ,IAAI;AAEhG,SACE,gBAAAU,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,IAAA,gBAAAb;AAAA,MAACc;AAAA,MAAA;AAAA,QAEC,MAAM,wBAAwBZ,EAAQ,IAAI;AAAA,QAC1C,MAAK;AAAA,QACL,KAAK;AAAA,QACL,cAAcL,EAAE,WAAW;AAAA,QAC3B,YAAU;AAAA,QACV,OAAOK,EAAQ;AAAA,QACf,oBAAkBR;AAAA,MAAA;AAAA,MAPbQ,EAAQ;AAAA,IAAA;AAAA,IASdQ,GAAgB,kBACf,gBAAAV;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,gBAAgBoB,EAAe;AAAA,QAC/B,eAAeA,EAAe,iBAAiB;AAAA,QAC/C,WAAAjB;AAAA,QACA,IAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}

package/dist/components/Payroll/PayrollHistory/PayrollHistoryPresentation.js CHANGED Viewed

@@ -3,8 +3,6 @@ import { useTranslation as U } from "react-i18next";
 import { getPayrollType as L, calculateTotalPayroll as N, canCancelPayroll as O } from "../helpers.js";
 import j from "./PayrollHistoryPresentation.module.scss.js";
 import { Flex as n } from "../../Common/Flex/Flex.js";
-import "classnames";
-import "../../../shared/constants.js";
 import { HamburgerMenu as M } from "../../Common/HamburgerMenu/HamburgerMenu.js";
 import { useComponentContext as V } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { formatNumberAsCurrency as q } from "../../../helpers/formattedStrings.js";
@@ -15,7 +13,7 @@ import $ from "../../../assets/icons/icon-file-outline.svg.js";
 import B from "../../../assets/icons/icon-receipt-outline.svg.js";
 import { PayrollStatusBadges as W } from "../PayrollStatusBadges/PayrollStatusBadges.js";
 import { DataView as _ } from "../../Common/DataView/DataView.js";
-const de = ({
+const me = ({
   payrollHistory: c,
   wireInRequests: p,
   selectedTimeFilter: y,
@@ -35,9 +33,9 @@ const de = ({
     { value: "6months", label: t("timeFilter.options.6months") },
     { value: "year", label: t("timeFilter.options.year") }
   ], w = (e) => {
-    const i = e.payrollDeadline;
-    if (!i) return "";
-    const a = new Date(i), u = "America/New_York", T = new Intl.DateTimeFormat("en-US", {
+    const a = e.payrollDeadline;
+    if (!a) return "";
+    const i = new Date(a), u = "America/New_York", T = new Intl.DateTimeFormat("en-US", {
       weekday: "short",
       month: "short",
       day: "numeric",
@@ -47,37 +45,37 @@ const de = ({
       minute: "2-digit",
       timeZoneName: "short",
       timeZone: u
-    }), H = T.format(a);
-    return `${R.format(a)} on ${H}`;
+    }), H = T.format(i);
+    return `${R.format(i)} on ${H}`;
   }, x = (e) => {
     g(e);
   }, k = () => {
     o && D(o);
   }, A = (e) => {
-    const i = e.payrollUuid || e.uuid, a = [
+    const a = e.payrollUuid || e.uuid, i = [
       {
         label: t("menu.viewSummary"),
         icon: /* @__PURE__ */ r($, { "aria-hidden": !0 }),
         onClick: () => {
-          f(i, e.payPeriod?.startDate, e.payPeriod?.endDate);
+          f(a, e.payPeriod?.startDate, e.payPeriod?.endDate);
         }
       },
       {
         label: t("menu.viewReceipt"),
         icon: /* @__PURE__ */ r(B, { "aria-hidden": !0 }),
         onClick: () => {
-          P(i, e.payPeriod?.startDate, e.payPeriod?.endDate);
+          P(a, e.payPeriod?.startDate, e.payPeriod?.endDate);
         }
       }
     ];
-    return O(e) && a.push({
+    return O(e) && i.push({
       label: t("menu.cancelPayroll"),
       icon: /* @__PURE__ */ r(Z, { "aria-hidden": !0 }),
       onClick: () => {
         x(e);
       },
       "data-destructive": "true"
-    }), a;
+    }), i;
   };
   return c.length === 0 ? /* @__PURE__ */ l(n, { flexDirection: "column", alignItems: "center", gap: 24, children: [
     /* @__PURE__ */ r(d, { as: "h3", children: t("emptyState.title") }),
@@ -131,10 +129,10 @@ const de = ({
           {
             title: t("columns.status"),
             render: (e) => {
-              const i = p.find(
-                (a) => a.paymentUuid === e.payrollUuid
+              const a = p.find(
+                (i) => i.paymentUuid === e.payrollUuid
               );
-              return /* @__PURE__ */ r(W, { payroll: e, wireInRequest: i });
+              return /* @__PURE__ */ r(W, { payroll: e, wireInRequest: a });
             }
           },
           {
@@ -173,6 +171,6 @@ const de = ({
   ] });
 };
 export {
-  de as PayrollHistoryPresentation
+  me as PayrollHistoryPresentation
 };
 //# sourceMappingURL=PayrollHistoryPresentation.js.map

package/dist/components/Payroll/PayrollHistory/PayrollHistoryPresentation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PayrollHistoryPresentation.js","sources":["../../../../src/components/Payroll/PayrollHistory/PayrollHistoryPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { Payroll } from '@gusto/embedded-api/models/components/payroll'\nimport type { WireInRequest } from '@gusto/embedded-api/models/components/wireinrequest'\nimport { PayrollStatusBadges } from '../PayrollStatusBadges'\nimport { getPayrollType, calculateTotalPayroll, canCancelPayroll } from '../helpers'\nimport type { TimeFilterOption } from './PayrollHistory'\nimport styles from './PayrollHistoryPresentation.module.scss'\nimport type { MenuItem } from '@/components/Common/UI/Menu/MenuTypes'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport TrashcanIcon from '@/assets/icons/trashcan.svg?react'\nimport FileIcon from '@/assets/icons/icon-file-outline.svg?react'\nimport ReceiptIcon from '@/assets/icons/icon-receipt-outline.svg?react'\n\ninterface PayrollHistoryPresentationProps {\n payrollHistory: Payroll[]\n wireInRequests: WireInRequest[]\n selectedTimeFilter: TimeFilterOption\n onTimeFilterChange: (value: TimeFilterOption) => void\n onViewSummary: (payrollId: string, startDate?: string, endDate?: string) => void\n onViewReceipt: (payrollId: string, startDate?: string, endDate?: string) => void\n onCancelPayroll: (item: Payroll) => void\n cancelDialogItem: Payroll \| null\n onCancelDialogOpen: (item: Payroll) => void\n onCancelDialogClose: () => void\n isLoading?: boolean\n}\n\nexport const PayrollHistoryPresentation = ({\n payrollHistory,\n wireInRequests,\n selectedTimeFilter,\n onTimeFilterChange,\n onViewSummary,\n onViewReceipt,\n onCancelPayroll,\n cancelDialogItem,\n onCancelDialogOpen,\n onCancelDialogClose,\n isLoading = false,\n}: PayrollHistoryPresentationProps) => {\n const { Heading, Text, Select, Dialog } = useComponentContext()\n useI18n('Payroll.PayrollHistory')\n const { t } = useTranslation('Payroll.PayrollHistory')\n const dateFormatter = useDateFormatter()\n\n const timeFilterOptions = [\n { value: '3months', label: t('timeFilter.options.3months') },\n { value: '6months', label: t('timeFilter.options.6months') },\n { value: 'year', label: t('timeFilter.options.year') },\n ]\n\n const formatDeadlineForDialog = (item: Payroll): string => {\n const deadline = item.payrollDeadline\n if (!deadline) return ''\n\n const deadlineDate = new Date(deadline)\n const timeZone = 'America/New_York'\n\n const formatter = new Intl.DateTimeFormat('en-US', {\n weekday: 'short',\n month: 'short',\n day: 'numeric',\n timeZone,\n })\n\n const timeFormatter = new Intl.DateTimeFormat('en-US', {\n hour: 'numeric',\n minute: '2-digit',\n timeZoneName: 'short',\n timeZone,\n })\n\n const dateStr = formatter.format(deadlineDate)\n const timeStr = timeFormatter.format(deadlineDate)\n\n return `${timeStr} on ${dateStr}`\n }\n\n const handleCancelClick = (item: Payroll) => {\n onCancelDialogOpen(item)\n }\n\n const handleConfirmCancel = () => {\n if (cancelDialogItem) {\n onCancelPayroll(cancelDialogItem)\n }\n }\n\n const getMenuItems = (item: Payroll): MenuItem[] => {\n const payrollId = item.payrollUuid \|\| item.uuid!\n const items: MenuItem[] = [\n {\n label: t('menu.viewSummary'),\n icon: <FileIcon aria-hidden />,\n onClick: () => {\n onViewSummary(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n },\n },\n {\n label: t('menu.viewReceipt'),\n icon: <ReceiptIcon aria-hidden />,\n onClick: () => {\n onViewReceipt(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n },\n },\n ]\n\n if (canCancelPayroll(item)) {\n items.push({\n label: t('menu.cancelPayroll'),\n icon: <TrashcanIcon aria-hidden />,\n onClick: () => {\n handleCancelClick(item)\n },\n 'data-destructive': 'true',\n })\n }\n\n return items\n }\n\n if (payrollHistory.length === 0) {\n return (\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={24}>\n <Heading as=\"h3\">{t('emptyState.title')}</Heading>\n <Text>{t('emptyState.description')}</Text>\n </Flex>\n )\n }\n\n return (\n <Flex flexDirection=\"column\" gap={16}>\n <Flex\n flexDirection={{ base: 'column', medium: 'row' }}\n justifyContent=\"space-between\"\n alignItems=\"flex-start\"\n gap={{ base: 12, medium: 24 }}\n >\n <Flex>\n <Heading as=\"h2\">{t('title')}</Heading>\n </Flex>\n <div className={styles.timeFilterContainer}>\n <Select\n value={selectedTimeFilter}\n onChange={(value: string) => {\n onTimeFilterChange(value as TimeFilterOption)\n }}\n options={timeFilterOptions}\n label={t('timeFilter.placeholder')}\n shouldVisuallyHideLabel\n isRequired\n />\n </div>\n </Flex>\n\n <DataView\n label={t('dataView.label')}\n columns={[\n {\n title: t('columns.payPeriod'),\n render: (item: Payroll) =>\n dateFormatter.formatPayPeriodRange(\n item.payPeriod?.startDate,\n item.payPeriod?.endDate,\n ),\n },\n {\n title: t('columns.type'),\n render: (item: Payroll) => getPayrollType(item),\n },\n {\n title: t('columns.payDate'),\n render: (item: Payroll) => dateFormatter.formatShortWithYear(item.checkDate),\n },\n {\n title: t('columns.status'),\n render: (item: Payroll) => {\n const wireInRequest = wireInRequests.find(\n wire => wire.paymentUuid === item.payrollUuid,\n )\n return <PayrollStatusBadges payroll={item} wireInRequest={wireInRequest} />\n },\n },\n {\n title: t('columns.totalPayroll'),\n render: (item: Payroll) => formatNumberAsCurrency(calculateTotalPayroll(item)),\n },\n ]}\n data={payrollHistory}\n itemMenu={(item: Payroll) => <HamburgerMenu items={getMenuItems(item)} />}\n />\n\n <Dialog\n isOpen={!!cancelDialogItem}\n onClose={onCancelDialogClose}\n onPrimaryActionClick={handleConfirmCancel}\n isDestructive\n isPrimaryActionLoading={isLoading}\n primaryActionLabel={t('cancelDialog.primaryAction')}\n closeActionLabel={t('cancelDialog.secondaryAction')}\n title={\n cancelDialogItem\n ? t('cancelDialog.title', {\n payPeriod: dateFormatter.formatPayPeriodRange(\n cancelDialogItem.payPeriod?.startDate,\n cancelDialogItem.payPeriod?.endDate,\n ),\n })\n : ''\n }\n >\n {cancelDialogItem && (\n <Flex flexDirection=\"column\" gap={16}>\n <Text>{t('cancelDialog.body')}</Text>\n {cancelDialogItem.payrollDeadline && (\n <Text>\n {t('cancelDialog.deadline', {\n deadline: formatDeadlineForDialog(cancelDialogItem),\n })}\n </Text>\n )}\n </Flex>\n )}\n </Dialog>\n </Flex>\n )\n}\n"],"names":["PayrollHistoryPresentation","payrollHistory","wireInRequests","selectedTimeFilter","onTimeFilterChange","onViewSummary","onViewReceipt","onCancelPayroll","cancelDialogItem","onCancelDialogOpen","onCancelDialogClose","isLoading","Heading","Text","Select","Dialog","useComponentContext","useI18n","useTranslation","dateFormatter","useDateFormatter","timeFilterOptions","formatDeadlineForDialog","item","deadline","deadlineDate","timeZone","formatter","timeFormatter","dateStr","handleCancelClick","handleConfirmCancel","getMenuItems","payrollId","items","jsx","FileIcon","ReceiptIcon","canCancelPayroll","TrashcanIcon","Flex","jsxs","styles","value","DataView","getPayrollType","wireInRequest","wire","PayrollStatusBadges","formatNumberAsCurrency","calculateTotalPayroll","HamburgerMenu"],"mappings":"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"}
1	+ {"version":3,"file":"PayrollHistoryPresentation.js","sources":["../../../../src/components/Payroll/PayrollHistory/PayrollHistoryPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { Payroll } from '@gusto/embedded-api/models/components/payroll'\nimport type { WireInRequest } from '@gusto/embedded-api/models/components/wireinrequest'\nimport { PayrollStatusBadges } from '../PayrollStatusBadges'\nimport { getPayrollType, calculateTotalPayroll, canCancelPayroll } from '../helpers'\nimport type { TimeFilterOption } from './PayrollHistory'\nimport styles from './PayrollHistoryPresentation.module.scss'\nimport type { MenuItem } from '@/components/Common/UI/Menu/MenuTypes'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { formatNumberAsCurrency } from '@/helpers/formattedStrings'\nimport { useI18n } from '@/i18n'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport TrashcanIcon from '@/assets/icons/trashcan.svg?react'\nimport FileIcon from '@/assets/icons/icon-file-outline.svg?react'\nimport ReceiptIcon from '@/assets/icons/icon-receipt-outline.svg?react'\n\ninterface PayrollHistoryPresentationProps {\n payrollHistory: Payroll[]\n wireInRequests: WireInRequest[]\n selectedTimeFilter: TimeFilterOption\n onTimeFilterChange: (value: TimeFilterOption) => void\n onViewSummary: (payrollId: string, startDate?: string, endDate?: string) => void\n onViewReceipt: (payrollId: string, startDate?: string, endDate?: string) => void\n onCancelPayroll: (item: Payroll) => void\n cancelDialogItem: Payroll \| null\n onCancelDialogOpen: (item: Payroll) => void\n onCancelDialogClose: () => void\n isLoading?: boolean\n}\n\nexport const PayrollHistoryPresentation = ({\n payrollHistory,\n wireInRequests,\n selectedTimeFilter,\n onTimeFilterChange,\n onViewSummary,\n onViewReceipt,\n onCancelPayroll,\n cancelDialogItem,\n onCancelDialogOpen,\n onCancelDialogClose,\n isLoading = false,\n}: PayrollHistoryPresentationProps) => {\n const { Heading, Text, Select, Dialog } = useComponentContext()\n useI18n('Payroll.PayrollHistory')\n const { t } = useTranslation('Payroll.PayrollHistory')\n const dateFormatter = useDateFormatter()\n\n const timeFilterOptions = [\n { value: '3months', label: t('timeFilter.options.3months') },\n { value: '6months', label: t('timeFilter.options.6months') },\n { value: 'year', label: t('timeFilter.options.year') },\n ]\n\n const formatDeadlineForDialog = (item: Payroll): string => {\n const deadline = item.payrollDeadline\n if (!deadline) return ''\n\n const deadlineDate = new Date(deadline)\n const timeZone = 'America/New_York'\n\n const formatter = new Intl.DateTimeFormat('en-US', {\n weekday: 'short',\n month: 'short',\n day: 'numeric',\n timeZone,\n })\n\n const timeFormatter = new Intl.DateTimeFormat('en-US', {\n hour: 'numeric',\n minute: '2-digit',\n timeZoneName: 'short',\n timeZone,\n })\n\n const dateStr = formatter.format(deadlineDate)\n const timeStr = timeFormatter.format(deadlineDate)\n\n return `${timeStr} on ${dateStr}`\n }\n\n const handleCancelClick = (item: Payroll) => {\n onCancelDialogOpen(item)\n }\n\n const handleConfirmCancel = () => {\n if (cancelDialogItem) {\n onCancelPayroll(cancelDialogItem)\n }\n }\n\n const getMenuItems = (item: Payroll): MenuItem[] => {\n const payrollId = item.payrollUuid \|\| item.uuid!\n const items: MenuItem[] = [\n {\n label: t('menu.viewSummary'),\n icon: <FileIcon aria-hidden />,\n onClick: () => {\n onViewSummary(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n },\n },\n {\n label: t('menu.viewReceipt'),\n icon: <ReceiptIcon aria-hidden />,\n onClick: () => {\n onViewReceipt(payrollId, item.payPeriod?.startDate, item.payPeriod?.endDate)\n },\n },\n ]\n\n if (canCancelPayroll(item)) {\n items.push({\n label: t('menu.cancelPayroll'),\n icon: <TrashcanIcon aria-hidden />,\n onClick: () => {\n handleCancelClick(item)\n },\n 'data-destructive': 'true',\n })\n }\n\n return items\n }\n\n if (payrollHistory.length === 0) {\n return (\n <Flex flexDirection=\"column\" alignItems=\"center\" gap={24}>\n <Heading as=\"h3\">{t('emptyState.title')}</Heading>\n <Text>{t('emptyState.description')}</Text>\n </Flex>\n )\n }\n\n return (\n <Flex flexDirection=\"column\" gap={16}>\n <Flex\n flexDirection={{ base: 'column', medium: 'row' }}\n justifyContent=\"space-between\"\n alignItems=\"flex-start\"\n gap={{ base: 12, medium: 24 }}\n >\n <Flex>\n <Heading as=\"h2\">{t('title')}</Heading>\n </Flex>\n <div className={styles.timeFilterContainer}>\n <Select\n value={selectedTimeFilter}\n onChange={(value: string) => {\n onTimeFilterChange(value as TimeFilterOption)\n }}\n options={timeFilterOptions}\n label={t('timeFilter.placeholder')}\n shouldVisuallyHideLabel\n isRequired\n />\n </div>\n </Flex>\n\n <DataView\n label={t('dataView.label')}\n columns={[\n {\n title: t('columns.payPeriod'),\n render: (item: Payroll) =>\n dateFormatter.formatPayPeriodRange(\n item.payPeriod?.startDate,\n item.payPeriod?.endDate,\n ),\n },\n {\n title: t('columns.type'),\n render: (item: Payroll) => getPayrollType(item),\n },\n {\n title: t('columns.payDate'),\n render: (item: Payroll) => dateFormatter.formatShortWithYear(item.checkDate),\n },\n {\n title: t('columns.status'),\n render: (item: Payroll) => {\n const wireInRequest = wireInRequests.find(\n wire => wire.paymentUuid === item.payrollUuid,\n )\n return <PayrollStatusBadges payroll={item} wireInRequest={wireInRequest} />\n },\n },\n {\n title: t('columns.totalPayroll'),\n render: (item: Payroll) => formatNumberAsCurrency(calculateTotalPayroll(item)),\n },\n ]}\n data={payrollHistory}\n itemMenu={(item: Payroll) => <HamburgerMenu items={getMenuItems(item)} />}\n />\n\n <Dialog\n isOpen={!!cancelDialogItem}\n onClose={onCancelDialogClose}\n onPrimaryActionClick={handleConfirmCancel}\n isDestructive\n isPrimaryActionLoading={isLoading}\n primaryActionLabel={t('cancelDialog.primaryAction')}\n closeActionLabel={t('cancelDialog.secondaryAction')}\n title={\n cancelDialogItem\n ? t('cancelDialog.title', {\n payPeriod: dateFormatter.formatPayPeriodRange(\n cancelDialogItem.payPeriod?.startDate,\n cancelDialogItem.payPeriod?.endDate,\n ),\n })\n : ''\n }\n >\n {cancelDialogItem && (\n <Flex flexDirection=\"column\" gap={16}>\n <Text>{t('cancelDialog.body')}</Text>\n {cancelDialogItem.payrollDeadline && (\n <Text>\n {t('cancelDialog.deadline', {\n deadline: formatDeadlineForDialog(cancelDialogItem),\n })}\n </Text>\n )}\n </Flex>\n )}\n </Dialog>\n </Flex>\n )\n}\n"],"names":["PayrollHistoryPresentation","payrollHistory","wireInRequests","selectedTimeFilter","onTimeFilterChange","onViewSummary","onViewReceipt","onCancelPayroll","cancelDialogItem","onCancelDialogOpen","onCancelDialogClose","isLoading","Heading","Text","Select","Dialog","useComponentContext","useI18n","useTranslation","dateFormatter","useDateFormatter","timeFilterOptions","formatDeadlineForDialog","item","deadline","deadlineDate","timeZone","formatter","timeFormatter","dateStr","handleCancelClick","handleConfirmCancel","getMenuItems","payrollId","items","jsx","FileIcon","ReceiptIcon","canCancelPayroll","TrashcanIcon","Flex","jsxs","styles","value","DataView","getPayrollType","wireInRequest","wire","PayrollStatusBadges","formatNumberAsCurrency","calculateTotalPayroll","HamburgerMenu"],"mappings":"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"}

package/dist/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { jsx as t, jsxs as w } from "react/jsx-runtime";
-import { useState as g } from "react";
-import { useTranslation as k } from "react-i18next";
+import { jsx as r, jsxs as k } from "react/jsx-runtime";
+import { useState as w } from "react";
+import { useTranslation as g } from "react-i18next";
 import { useWireInRequestsListSuspense as D } from "@gusto/embedded-api/react-query/wireInRequestsList";
 import { usePayrollsGetBlockersSuspense as v } from "@gusto/embedded-api/react-query/payrollsGetBlockers";
 import { PayrollHistory as A } from "../PayrollHistory/PayrollHistory.js";
@@ -8,11 +8,11 @@ import { PayrollList as E } from "../PayrollList/PayrollList.js";
 import { PayrollOverview as x } from "../PayrollOverview/PayrollOverview.js";
 import { PayrollReceipts as _ } from "../PayrollReceipts/PayrollReceipts.js";
 import { ConfirmWireDetails as h } from "../ConfirmWireDetails/ConfirmWireDetails.js";
-import { PayrollBlockerAlerts as S } from "../PayrollBlocker/components/PayrollBlockerAlerts.js";
+import { PayrollBlockerAlerts as B } from "../PayrollBlocker/components/PayrollBlockerAlerts.js";
 import { useFlow as m } from "../../Flow/useFlow.js";
-import { useI18n as B } from "../../../i18n/I18n.js";
+import { useI18n as S } from "../../../i18n/I18n.js";
 import { useComponentContext as T } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { ensureRequired as r } from "../../../helpers/ensureRequired.js";
+import { ensureRequired as t } from "../../../helpers/ensureRequired.js";
 import { Flex as U } from "../../Common/Flex/Flex.js";
 import { componentEvents as c } from "../../../shared/constants.js";
 function oo() {
@@ -20,37 +20,37 @@ function oo() {
     companyId: o,
     onEvent: e,
     selectedTab: n = "run-payroll",
-    ConfirmWireDetailsComponent: s = h,
+    ConfirmWireDetailsComponent: a = h,
     showPayrollCancelledAlert: i
-  } = m(), [p, u] = g(n), { Tabs: y, Alert: d } = T();
-  B("Payroll.PayrollLanding");
-  const { t: l } = k("Payroll.PayrollLanding"), { data: f } = D({
-    companyUuid: r(o)
+  } = m(), [p, u] = w(n), { Tabs: y, Alert: d } = T();
+  S("Payroll.PayrollLanding");
+  const { t: l } = g("Payroll.PayrollLanding"), { data: f } = D({
+    companyUuid: t(o)
   }), L = (f.wireInRequestList || []).some(
-    (a) => a.status === "awaiting_funds"
+    (s) => s.status === "awaiting_funds"
   ), C = () => {
     e(c.RUN_PAYROLL_CANCELLED_ALERT_DISMISSED);
   }, { data: P } = v({
-    companyUuid: r(o)
-  }), I = (P.payrollBlockerList ?? []).map((a) => ({
-    key: a.key ?? "unknown",
-    message: a.message
+    companyUuid: t(o)
+  }), I = (P.payrollBlockerList ?? []).map((s) => ({
+    key: s.key ?? "unknown",
+    message: s.message
   })), b = () => {
     e(c.RUN_PAYROLL_BLOCKERS_VIEW_ALL);
   }, R = [
     {
       id: "run-payroll",
       label: l("tabs.runPayroll"),
-      content: /* @__PURE__ */ t(E, { companyId: r(o), onEvent: e })
+      content: /* @__PURE__ */ r(E, { companyId: t(o), onEvent: e })
     },
     {
       id: "payroll-history",
       label: l("tabs.payrollHistory"),
-      content: /* @__PURE__ */ t(A, { companyId: r(o), onEvent: e })
+      content: /* @__PURE__ */ r(A, { companyId: t(o), onEvent: e })
     }
   ];
-  return /* @__PURE__ */ w(U, { flexDirection: "column", gap: 32, children: [
-    i && /* @__PURE__ */ t(
+  return /* @__PURE__ */ k(U, { flexDirection: "column", gap: 32, children: [
+    i && /* @__PURE__ */ r(
       d,
       {
         status: "success",
@@ -58,9 +58,9 @@ function oo() {
         onDismiss: C
       }
     ),
-    L && /* @__PURE__ */ t(s, { companyId: r(o), onEvent: e }),
-    /* @__PURE__ */ t(S, { blockers: I, onMultipleViewClick: b }),
-    /* @__PURE__ */ t(
+    L && /* @__PURE__ */ r(a, { companyId: t(o), onEvent: e }),
+    /* @__PURE__ */ r(B, { blockers: I, onViewBlockersClick: b }),
+    /* @__PURE__ */ r(
       y,
       {
         tabs: R,
@@ -73,30 +73,30 @@ function oo() {
 }
 function eo() {
   const { payrollUuid: o, onEvent: e, withReimbursements: n } = m();
-  return /* @__PURE__ */ t(
+  return /* @__PURE__ */ r(
     _,
     {
       onEvent: e,
-      payrollId: r(o),
+      payrollId: t(o),
       withReimbursements: n
     }
   );
 }
-function to() {
-  const { companyId: o, payrollUuid: e, onEvent: n, withReimbursements: s, ConfirmWireDetailsComponent: i } = m();
-  return /* @__PURE__ */ t(
+function ro() {
+  const { companyId: o, payrollUuid: e, onEvent: n, withReimbursements: a, ConfirmWireDetailsComponent: i } = m();
+  return /* @__PURE__ */ r(
     x,
     {
       onEvent: n,
-      companyId: r(o),
-      payrollId: r(e),
-      withReimbursements: s,
+      companyId: t(o),
+      payrollId: t(e),
+      withReimbursements: a,
       ConfirmWireDetailsComponent: i
     }
   );
 }
 export {
-  to as PayrollLandingOverviewContextual,
+  ro as PayrollLandingOverviewContextual,
   eo as PayrollLandingReceiptsContextual,
   oo as PayrollLandingTabsContextual
 };

package/dist/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PayrollLandingFlowComponents.js","sources":["../../../../src/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useWireInRequestsListSuspense } from '@gusto/embedded-api/react-query/wireInRequestsList'\nimport { usePayrollsGetBlockersSuspense } from '@gusto/embedded-api/react-query/payrollsGetBlockers'\nimport { PayrollHistory } from '../PayrollHistory/PayrollHistory'\nimport { PayrollList } from '../PayrollList/PayrollList'\nimport { PayrollOverview } from '../PayrollOverview/PayrollOverview'\nimport { PayrollReceipts } from '../PayrollReceipts/PayrollReceipts'\nimport {\n ConfirmWireDetails,\n type ConfirmWireDetailsComponentType,\n} from '../ConfirmWireDetails/ConfirmWireDetails'\nimport type { ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { PayrollBlockerAlerts } from '../PayrollBlocker/components/PayrollBlockerAlerts'\nimport type { BaseComponentInterface } from '@/components/Base/Base'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport { useI18n } from '@/i18n'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { ensureRequired } from '@/helpers/ensureRequired'\nimport type { FlowContextInterface } from '@/components/Flow/useFlow'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { componentEvents } from '@/shared/constants'\n\nexport interface PayrollLandingFlowProps extends BaseComponentInterface<'Payroll.PayrollLanding'> {\n companyId: string\n withReimbursements?: boolean\n ConfirmWireDetailsComponent?: ConfirmWireDetailsComponentType\n showPayrollCancelledAlert?: boolean\n}\n\nexport interface PayrollLandingFlowContextInterface extends FlowContextInterface {\n component: (() => React.JSX.Element) \| null\n companyId: string\n payrollUuid?: string\n previousState?: 'tabs' \| 'overview'\n selectedTab?: string\n withReimbursements: boolean\n ConfirmWireDetailsComponent?: ConfirmWireDetailsComponentType\n startDate?: string\n endDate?: string\n showPayrollCancelledAlert?: boolean\n}\n\nexport function PayrollLandingTabsContextual() {\n const {\n companyId,\n onEvent,\n selectedTab = 'run-payroll',\n ConfirmWireDetailsComponent = ConfirmWireDetails,\n showPayrollCancelledAlert,\n } = useFlow<PayrollLandingFlowContextInterface>()\n const [currentTab, setCurrentTab] = useState(selectedTab)\n const { Tabs, Alert } = useComponentContext()\n\n useI18n('Payroll.PayrollLanding')\n const { t } = useTranslation('Payroll.PayrollLanding')\n\n const { data: wireInRequestsData } = useWireInRequestsListSuspense({\n companyUuid: ensureRequired(companyId),\n })\n\n const hasActiveWireInRequests = (wireInRequestsData.wireInRequestList \|\| []).some(\n r => r.status === 'awaiting_funds',\n )\n\n const handleDismissPayrollCancelledAlert = () => {\n onEvent(componentEvents.RUN_PAYROLL_CANCELLED_ALERT_DISMISSED)\n }\n\n const { data: blockersData } = usePayrollsGetBlockersSuspense({\n companyUuid: ensureRequired(companyId),\n })\n\n const payrollBlockerList = blockersData.payrollBlockerList ?? []\n\n const blockers: ApiPayrollBlocker[] = payrollBlockerList.map(blocker => ({\n key: blocker.key ?? 'unknown',\n message: blocker.message,\n }))\n\n const onViewBlockers = () => {\n onEvent(componentEvents.RUN_PAYROLL_BLOCKERS_VIEW_ALL)\n }\n\n const tabs = [\n {\n id: 'run-payroll',\n label: t('tabs.runPayroll'),\n content: <PayrollList companyId={ensureRequired(companyId)} onEvent={onEvent} />,\n },\n {\n id: 'payroll-history',\n label: t('tabs.payrollHistory'),\n content: <PayrollHistory companyId={ensureRequired(companyId)} onEvent={onEvent} />,\n },\n ]\n\n return (\n <Flex flexDirection=\"column\" gap={32}>\n {showPayrollCancelledAlert && (\n <Alert\n status=\"success\"\n label={t('alerts.payrollCancelled')}\n onDismiss={handleDismissPayrollCancelledAlert}\n />\n )}\n {hasActiveWireInRequests && (\n <ConfirmWireDetailsComponent companyId={ensureRequired(companyId)} onEvent={onEvent} />\n )}\n <PayrollBlockerAlerts blockers={blockers} ~~onMultipleViewClick~~={onViewBlockers} />\n <Tabs\n tabs={tabs}\n selectedId={currentTab}\n onSelectionChange={setCurrentTab}\n aria-label={t('aria.tabNavigation')}\n />\n </Flex>\n )\n}\n\nexport function PayrollLandingReceiptsContextual() {\n const { payrollUuid, onEvent, withReimbursements } = useFlow<PayrollLandingFlowContextInterface>()\n\n return (\n <PayrollReceipts\n onEvent={onEvent}\n payrollId={ensureRequired(payrollUuid)}\n withReimbursements={withReimbursements}\n />\n )\n}\n\nexport function PayrollLandingOverviewContextual() {\n const { companyId, payrollUuid, onEvent, withReimbursements, ConfirmWireDetailsComponent } =\n useFlow<PayrollLandingFlowContextInterface>()\n\n return (\n <PayrollOverview\n onEvent={onEvent}\n companyId={ensureRequired(companyId)}\n payrollId={ensureRequired(payrollUuid)}\n withReimbursements={withReimbursements}\n ConfirmWireDetailsComponent={ConfirmWireDetailsComponent}\n />\n )\n}\n"],"names":["PayrollLandingTabsContextual","companyId","onEvent","selectedTab","ConfirmWireDetailsComponent","ConfirmWireDetails","showPayrollCancelledAlert","useFlow","currentTab","setCurrentTab","useState","Tabs","Alert","useComponentContext","useI18n","t","useTranslation","wireInRequestsData","useWireInRequestsListSuspense","ensureRequired","hasActiveWireInRequests","r","handleDismissPayrollCancelledAlert","componentEvents","blockersData","usePayrollsGetBlockersSuspense","blockers","blocker","onViewBlockers","tabs","jsx","PayrollList","PayrollHistory","jsxs","Flex","PayrollBlockerAlerts","PayrollLandingReceiptsContextual","payrollUuid","withReimbursements","PayrollReceipts","PayrollLandingOverviewContextual","PayrollOverview"],"mappings":"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"}
1	+ {"version":3,"file":"PayrollLandingFlowComponents.js","sources":["../../../../src/components/Payroll/PayrollLanding/PayrollLandingFlowComponents.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useWireInRequestsListSuspense } from '@gusto/embedded-api/react-query/wireInRequestsList'\nimport { usePayrollsGetBlockersSuspense } from '@gusto/embedded-api/react-query/payrollsGetBlockers'\nimport { PayrollHistory } from '../PayrollHistory/PayrollHistory'\nimport { PayrollList } from '../PayrollList/PayrollList'\nimport { PayrollOverview } from '../PayrollOverview/PayrollOverview'\nimport { PayrollReceipts } from '../PayrollReceipts/PayrollReceipts'\nimport {\n ConfirmWireDetails,\n type ConfirmWireDetailsComponentType,\n} from '../ConfirmWireDetails/ConfirmWireDetails'\nimport type { ApiPayrollBlocker } from '../PayrollBlocker/payrollHelpers'\nimport { PayrollBlockerAlerts } from '../PayrollBlocker/components/PayrollBlockerAlerts'\nimport type { BaseComponentInterface } from '@/components/Base/Base'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport { useI18n } from '@/i18n'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { ensureRequired } from '@/helpers/ensureRequired'\nimport type { FlowContextInterface } from '@/components/Flow/useFlow'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { componentEvents } from '@/shared/constants'\n\nexport interface PayrollLandingFlowProps extends BaseComponentInterface<'Payroll.PayrollLanding'> {\n companyId: string\n withReimbursements?: boolean\n ConfirmWireDetailsComponent?: ConfirmWireDetailsComponentType\n showPayrollCancelledAlert?: boolean\n}\n\nexport interface PayrollLandingFlowContextInterface extends FlowContextInterface {\n component: (() => React.JSX.Element) \| null\n companyId: string\n payrollUuid?: string\n previousState?: 'tabs' \| 'overview'\n selectedTab?: string\n withReimbursements: boolean\n ConfirmWireDetailsComponent?: ConfirmWireDetailsComponentType\n startDate?: string\n endDate?: string\n showPayrollCancelledAlert?: boolean\n}\n\nexport function PayrollLandingTabsContextual() {\n const {\n companyId,\n onEvent,\n selectedTab = 'run-payroll',\n ConfirmWireDetailsComponent = ConfirmWireDetails,\n showPayrollCancelledAlert,\n } = useFlow<PayrollLandingFlowContextInterface>()\n const [currentTab, setCurrentTab] = useState(selectedTab)\n const { Tabs, Alert } = useComponentContext()\n\n useI18n('Payroll.PayrollLanding')\n const { t } = useTranslation('Payroll.PayrollLanding')\n\n const { data: wireInRequestsData } = useWireInRequestsListSuspense({\n companyUuid: ensureRequired(companyId),\n })\n\n const hasActiveWireInRequests = (wireInRequestsData.wireInRequestList \|\| []).some(\n r => r.status === 'awaiting_funds',\n )\n\n const handleDismissPayrollCancelledAlert = () => {\n onEvent(componentEvents.RUN_PAYROLL_CANCELLED_ALERT_DISMISSED)\n }\n\n const { data: blockersData } = usePayrollsGetBlockersSuspense({\n companyUuid: ensureRequired(companyId),\n })\n\n const payrollBlockerList = blockersData.payrollBlockerList ?? []\n\n const blockers: ApiPayrollBlocker[] = payrollBlockerList.map(blocker => ({\n key: blocker.key ?? 'unknown',\n message: blocker.message,\n }))\n\n const onViewBlockers = () => {\n onEvent(componentEvents.RUN_PAYROLL_BLOCKERS_VIEW_ALL)\n }\n\n const tabs = [\n {\n id: 'run-payroll',\n label: t('tabs.runPayroll'),\n content: <PayrollList companyId={ensureRequired(companyId)} onEvent={onEvent} />,\n },\n {\n id: 'payroll-history',\n label: t('tabs.payrollHistory'),\n content: <PayrollHistory companyId={ensureRequired(companyId)} onEvent={onEvent} />,\n },\n ]\n\n return (\n <Flex flexDirection=\"column\" gap={32}>\n {showPayrollCancelledAlert && (\n <Alert\n status=\"success\"\n label={t('alerts.payrollCancelled')}\n onDismiss={handleDismissPayrollCancelledAlert}\n />\n )}\n {hasActiveWireInRequests && (\n <ConfirmWireDetailsComponent companyId={ensureRequired(companyId)} onEvent={onEvent} />\n )}\n <PayrollBlockerAlerts blockers={blockers} onViewBlockersClick={onViewBlockers} />\n <Tabs\n tabs={tabs}\n selectedId={currentTab}\n onSelectionChange={setCurrentTab}\n aria-label={t('aria.tabNavigation')}\n />\n </Flex>\n )\n}\n\nexport function PayrollLandingReceiptsContextual() {\n const { payrollUuid, onEvent, withReimbursements } = useFlow<PayrollLandingFlowContextInterface>()\n\n return (\n <PayrollReceipts\n onEvent={onEvent}\n payrollId={ensureRequired(payrollUuid)}\n withReimbursements={withReimbursements}\n />\n )\n}\n\nexport function PayrollLandingOverviewContextual() {\n const { companyId, payrollUuid, onEvent, withReimbursements, ConfirmWireDetailsComponent } =\n useFlow<PayrollLandingFlowContextInterface>()\n\n return (\n <PayrollOverview\n onEvent={onEvent}\n companyId={ensureRequired(companyId)}\n payrollId={ensureRequired(payrollUuid)}\n withReimbursements={withReimbursements}\n ConfirmWireDetailsComponent={ConfirmWireDetailsComponent}\n />\n )\n}\n"],"names":["PayrollLandingTabsContextual","companyId","onEvent","selectedTab","ConfirmWireDetailsComponent","ConfirmWireDetails","showPayrollCancelledAlert","useFlow","currentTab","setCurrentTab","useState","Tabs","Alert","useComponentContext","useI18n","t","useTranslation","wireInRequestsData","useWireInRequestsListSuspense","ensureRequired","hasActiveWireInRequests","r","handleDismissPayrollCancelledAlert","componentEvents","blockersData","usePayrollsGetBlockersSuspense","blockers","blocker","onViewBlockers","tabs","jsx","PayrollList","PayrollHistory","jsxs","Flex","PayrollBlockerAlerts","PayrollLandingReceiptsContextual","payrollUuid","withReimbursements","PayrollReceipts","PayrollLandingOverviewContextual","PayrollOverview"],"mappings":"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"}