npm - @gusto/embedded-react-sdk - Versions diffs - 0.55.8 → 0.56.0 - Mend

@gusto/embedded-react-sdk 0.55.8 → 0.56.0

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 (115) hide show

package/dist/components/Employee/WorkAddress/management/WorkAddressView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WorkAddressView.js","sources":["../../../../../src/components/Employee/WorkAddress/management/WorkAddressView.tsx"],"sourcesContent":["import { useLayoutEffect, useMemo, useRef, useState } from 'react'\nimport { Trans, useTranslation } from 'react-i18next'\nimport type { Location } from '@gusto/embedded-api/models/components/location'\nimport type { EmployeeWorkAddress } from '@gusto/embedded-api/models/components/employeeworkaddress'\nimport {\n formatPendingWorkAddressLine,\n getPendingFutureWorkAddress,\n} from './getPendingFutureWorkAddress'\nimport ListIcon from '@/assets/icons/list.svg?react'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport {\n ActionsLayout,\n DataView,\n EmptyData,\n Grid,\n HamburgerMenu,\n useDataView,\n} from '@/components/Common'\nimport { Flex, FlexItem } from '@/components/Common/Flex/Flex'\nimport {\n LocationField,\n EffectiveDateField,\n} from '@/components/Employee/Profile/shared/useWorkAddressForm/fields'\nimport { WorkAddressErrorCodes } from '@/components/Employee/Profile/shared/useWorkAddressForm/workAddressSchema'\nimport type { UseWorkAddressFormReady } from '@/components/Employee/Profile/shared/useWorkAddressForm'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport type { HookSubmitResult } from '@/partner-hook-utils/types'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { addDays, formatDateLongWithYear, normalizeToDate } from '@/helpers/dateFormatting'\nimport { getCityStateZip, getStreet } from '@/helpers/formattedStrings'\n\n/** @internal /\nexport interface WorkAddressViewProps {\n editWorkAddressForm: UseWorkAddressFormReady\n changeWorkAddressForm: UseWorkAddressFormReady\n /* Full list for history table, pending-future alert, and delete-confirmation lookup. /\n workAddresses: EmployeeWorkAddress[] \| undefined\n editTargetUuid: string \| undefined\n onEditTargetUuidChange: (uuid: string \| undefined) => void\n employeeDisplayName: string\n onConfirmDelete: (workAddressUuid: string) => Promise<boolean>\n onWorkAddressSaved: (result: HookSubmitResult<EmployeeWorkAddress>) => void\n onBack: () => void\n isDeletePending?: boolean\n /* CSS class name applied to the root element. /\n className?: string\n}\n\nfunction resolveLocation(\n row: EmployeeWorkAddress,\n companyLocations: Location[] \| undefined,\n): Location \| undefined {\n if (!row.locationUuid \|\| !companyLocations?.length) {\n return undefined\n }\n return companyLocations.find(loc => loc.uuid === row.locationUuid)\n}\n\nfunction formatWorkAddressLines(\n row: EmployeeWorkAddress,\n companyLocations: Location[] \| undefined,\n): { primary: string; secondary: string } {\n const location = resolveLocation(row, companyLocations)\n if (location) {\n const street = getStreet(location).trim()\n const locality = getCityStateZip(location).trim()\n return { primary: street, secondary: locality }\n }\n const street = getStreet(row).trim()\n const locality = getCityStateZip(row).trim()\n return { primary: street, secondary: locality }\n}\n\n/* @internal */\nexport function WorkAddressView({\n editWorkAddressForm,\n changeWorkAddressForm,\n workAddresses,\n editTargetUuid,\n onEditTargetUuidChange,\n employeeDisplayName,\n onConfirmDelete,\n onWorkAddressSaved,\n onBack,\n isDeletePending = false,\n className,\n}: WorkAddressViewProps) {\n const { t } = useTranslation('Employee.Management.WorkAddress')\n const Components = useComponentContext()\n const [addressModal, setAddressModal] = useState<'edit' \| 'create' \| null>(null)\n const [deleteConfirmUuid, setDeleteConfirmUuid] = useState<string \| null>(null)\n const addressModalContainerRef = useRef<HTMLDivElement>(null)\n const [addressModalPortal, setAddressModalPortal] = useState<HTMLElement \| undefined>(undefined)\n\n useLayoutEffect(() => {\n if (!addressModal) {\n setAddressModalPortal(undefined)\n return\n }\n const syncPortal = () => {\n setAddressModalPortal(addressModalContainerRef.current ?? undefined)\n }\n syncPortal()\n if (addressModalContainerRef.current == null) {\n const id = requestAnimationFrame(syncPortal)\n return () => {\n cancelAnimationFrame(id)\n }\n }\n }, [addressModal])\n\n const {\n data: { workAddress, companyLocations },\n status: editStatus,\n form: { Fields: editFormFields },\n } = editWorkAddressForm\n\n const editShowsEffectiveDateField = editFormFields.EffectiveDate != null\n\n const { status: createStatus } = changeWorkAddressForm\n\n const locationValidation = {\n [WorkAddressErrorCodes.REQUIRED]: t('form.locationRequired'),\n }\n\n const startDateValidation = {\n [WorkAddressErrorCodes.REQUIRED]: t('form.startDateRequired'),\n }\n\n const pendingFutureAddress = useMemo(\n () => getPendingFutureWorkAddress(workAddresses),\n [workAddresses],\n )\n\n const addressForDeleteModal = useMemo(() => {\n if (!deleteConfirmUuid \|\| !workAddresses) {\n return undefined\n }\n return workAddresses.find(a => a.uuid === deleteConfirmUuid)\n }, [deleteConfirmUuid, workAddresses])\n\n const changePendingPossessiveLabel = useMemo(() => {\n const trimmed = employeeDisplayName.trim()\n return trimmed ? `${trimmed}'s` : t('changePendingPossessiveFallback')\n }, [employeeDisplayName, t])\n\n const chronologicalAsc = useMemo(() => {\n return [...(workAddresses ?? [])].sort((a, b) => {\n const aDate = a.effectiveDate ?? ''\n const bDate = b.effectiveDate ?? ''\n if (!aDate && !bDate) return 0\n if (!aDate) return 1\n if (!bDate) return -1\n return aDate.localeCompare(bDate)\n })\n }, [workAddresses])\n\n const historyAddresses = useMemo(\n () => chronologicalAsc.filter(address => address.active !== true),\n [chronologicalAsc],\n )\n\n const sortedHistory = useMemo(() => [...historyAddresses].reverse(), [historyAddresses])\n\n const historyEndDate = (row: EmployeeWorkAddress) => {\n const idx = chronologicalAsc.findIndex(a => a.uuid === row.uuid)\n if (idx === -1 \|\| idx >= chronologicalAsc.length - 1) return '—'\n const nextStart = chronologicalAsc[idx + 1]?.effectiveDate\n if (!nextStart) return '—'\n const nextDate = normalizeToDate(nextStart)\n if (!nextDate) return '—'\n const endDate = addDays(nextDate, -1)\n const y = endDate.getFullYear()\n const m = String(endDate.getMonth() + 1).padStart(2, '0')\n const d = String(endDate.getDate()).padStart(2, '0')\n return formatDateLongWithYear(`${y}-${m}-${d}`)\n }\n\n const historyDataView = useDataView({\n data: sortedHistory,\n columns: [\n {\n title: t('columns.location'),\n render: (row: EmployeeWorkAddress) => {\n const lines = formatWorkAddressLines(row, companyLocations)\n return (\n <Flex flexDirection=\"column\" gap={0}>\n <Components.Text weight=\"medium\">{lines.primary}</Components.Text>\n <Components.Text variant=\"supporting\">{lines.secondary}</Components.Text>\n </Flex>\n )\n },\n },\n {\n title: t('columns.startDate'),\n render: (row: EmployeeWorkAddress) =>\n row.effectiveDate ? formatDateLongWithYear(row.effectiveDate) : '—',\n },\n {\n title: t('columns.endDate'),\n render: (row: EmployeeWorkAddress) => historyEndDate(row),\n },\n ],\n itemMenu: (row: EmployeeWorkAddress) => (\n <HamburgerMenu\n triggerLabel={t('rowMenuAriaLabel')}\n items={[\n {\n label: t('rowEdit'),\n onClick: () => {\n onEditTargetUuidChange(row.uuid)\n setAddressModal('edit')\n },\n icon: <PencilSvg aria-hidden />,\n },\n {\n label: t('rowDelete'),\n onClick: () => {\n if (row.active === true) {\n return\n }\n setDeleteConfirmUuid(row.uuid)\n },\n icon: <TrashCanSvg aria-hidden />,\n },\n ]}\n />\n ),\n emptyState: () => (\n <div data-testid=\"work-address-history-empty\">\n <EmptyData\n icon={<ListIcon aria-hidden />}\n title={t('historyEmptyTitle')}\n description={t('historyEmptyDescription')}\n />\n </div>\n ),\n })\n\n const closeAddressModal = () => {\n setAddressModal(null)\n onEditTargetUuidChange(undefined)\n }\n\n const handleDeleteModalConfirm = async () => {\n if (!deleteConfirmUuid) {\n return\n }\n const deleted = await onConfirmDelete(deleteConfirmUuid)\n if (deleted) {\n setDeleteConfirmUuid(null)\n }\n }\n\n const handleSave = async () => {\n if (!addressModal) {\n return\n }\n\n if (addressModal === 'edit') {\n const result = await editWorkAddressForm.actions.onSubmit(\n undefined,\n editShowsEffectiveDateField ? undefined : { effectiveDate: workAddress?.effectiveDate },\n )\n if (result) {\n onWorkAddressSaved(result)\n closeAddressModal()\n }\n return\n }\n\n const result = await changeWorkAddressForm.actions.onSubmit()\n if (result) {\n onWorkAddressSaved(result)\n closeAddressModal()\n }\n }\n\n const modalPending = addressModal === 'edit' ? editStatus.isPending : createStatus.isPending\n\n const currentLines = workAddress ? formatWorkAddressLines(workAddress, companyLocations) : null\n const currentLocation =\n workAddress && companyLocations ? resolveLocation(workAddress, companyLocations) : undefined\n\n return (\n <section className={className}>\n <Flex flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" gap={4} alignItems=\"flex-start\">\n <Components.Heading as=\"h1\" styledAs=\"h2\">\n {t('title')}\n </Components.Heading>\n <Components.Text variant=\"supporting\">{t('description')}</Components.Text>\n </Flex>\n\n <Components.Box\n header={\n <Components.BoxHeader\n title={t('currentSectionTitle')}\n action={\n workAddress ? (\n <Components.Button\n variant=\"secondary\"\n onClick={() => {\n onEditTargetUuidChange(undefined)\n setAddressModal('edit')\n }}\n isLoading={editStatus.isPending}\n >\n {t('editCta')}\n </Components.Button>\n ) : undefined\n }\n />\n }\n footer={\n <Components.Button\n variant=\"secondary\"\n onClick={() => {\n onEditTargetUuidChange(undefined)\n setAddressModal('create')\n }}\n isLoading={createStatus.isPending}\n >\n {t('changeCta')}\n </Components.Button>\n }\n >\n <Flex flexDirection=\"column\" gap={16}>\n {workAddress && currentLines ? (\n <Flex flexDirection=\"column\" gap={4}>\n <FlexItem>\n {currentLocation ? (\n <>\n <Components.Text weight=\"medium\">\n {getStreet(currentLocation).trim()}\n </Components.Text>\n <Components.Text weight=\"medium\">\n {getCityStateZip(currentLocation)}\n </Components.Text>\n </>\n ) : (\n <>\n <Components.Text weight=\"medium\">{currentLines.primary}</Components.Text>\n <Components.Text weight=\"medium\">{currentLines.secondary}</Components.Text>\n </>\n )}\n </FlexItem>\n {workAddress.effectiveDate ? (\n <Components.Text variant=\"supporting\">\n {t('currentSince', {\n date: formatDateLongWithYear(workAddress.effectiveDate),\n })}\n </Components.Text>\n ) : null}\n </Flex>\n ) : (\n <Components.Text>{t('currentEmpty')}</Components.Text>\n )}\n {pendingFutureAddress ? (\n <Components.Alert status=\"warning\" label={t('changePendingTitle')}>\n <Components.Text variant=\"supporting\">\n {t('changePendingDescription', {\n possessiveLabel: changePendingPossessiveLabel,\n newAddress: formatPendingWorkAddressLine(\n pendingFutureAddress,\n companyLocations,\n ),\n effectiveDate: pendingFutureAddress.effectiveDate\n ? formatDateLongWithYear(pendingFutureAddress.effectiveDate)\n : '—',\n // Values are inserted into JSX text, so the browser already\n // escapes them. Telling i18next to escape too produces\n // double-encoded entities like `'` showing as text.\n interpolation: { escapeValue: false },\n })}\n </Components.Text>\n </Components.Alert>\n ) : null}\n </Flex>\n </Components.Box>\n\n <Flex flexDirection=\"column\" gap={12}>\n <Components.Heading as=\"h2\" styledAs=\"h4\">\n {t('historySectionTitle')}\n </Components.Heading>\n <DataView label={t('historySectionTitle')} {...historyDataView} />\n </Flex>\n\n <ActionsLayout>\n <Components.Button variant=\"secondary\" onClick={onBack}>\n {t('backCta')}\n </Components.Button>\n </ActionsLayout>\n\n <Components.Modal\n isOpen={addressModal !== null}\n onClose={closeAddressModal}\n shouldCloseOnBackdropClick={false}\n containerRef={addressModalContainerRef}\n footer={\n <Flex flexDirection=\"row\" gap={12} justifyContent=\"flex-end\">\n <Components.Button variant=\"secondary\" onClick={closeAddressModal}>\n {t('cancelCta')}\n </Components.Button>\n <Components.Button\n variant=\"primary\"\n onClick={() => {\n void handleSave()\n }}\n isLoading={modalPending}\n >\n {t('submitCta')}\n </Components.Button>\n </Flex>\n }\n >\n <Flex flexDirection=\"column\" gap={16}>\n <Components.Heading as=\"h2\">\n {addressModal === 'edit' ? t('editModalTitle') : t('changeModalTitle')}\n </Components.Heading>\n <Components.Text variant=\"supporting\">\n {addressModal === 'edit' ? t('editModalDescription') : t('changeModalDescription')}\n </Components.Text>\n {addressModal === 'edit' && editShowsEffectiveDateField ? (\n <Components.Alert status=\"warning\" label={t('editPastAddressAlertTitle')} />\n ) : null}\n {addressModal === 'edit' ? (\n <SDKFormProvider formHookResult={editWorkAddressForm}>\n <Grid\n gridTemplateColumns={{\n base: '1fr',\n small: '1fr',\n }}\n gap={20}\n >\n <LocationField\n label={\n editShowsEffectiveDateField\n ? t('form.editInactiveLocationLabel')\n : t('form.editLocationLabel')\n }\n description={t('form.editLocationDescription')}\n placeholder={t('form.selectPlaceholder')}\n validationMessages={locationValidation}\n portalContainer={addressModalPortal}\n />\n {editShowsEffectiveDateField ? (\n <EffectiveDateField\n label={t('form.startDateLabel')}\n description={t('form.editInactiveStartDateDescription')}\n validationMessages={startDateValidation}\n portalContainer={addressModalPortal}\n />\n ) : null}\n </Grid>\n </SDKFormProvider>\n ) : null}\n {addressModal === 'create' ? (\n <SDKFormProvider formHookResult={changeWorkAddressForm}>\n <Grid\n gridTemplateColumns={{\n base: '1fr',\n small: '1fr',\n }}\n gap={20}\n >\n <LocationField\n label={t('form.newWorkAddressLabel')}\n description={t('form.newWorkAddressDescription')}\n placeholder={t('form.selectPlaceholder')}\n validationMessages={locationValidation}\n portalContainer={addressModalPortal}\n />\n <EffectiveDateField\n label={t('form.startDateLabel')}\n description={t('form.startDateDescription')}\n validationMessages={startDateValidation}\n portalContainer={addressModalPortal}\n />\n </Grid>\n </SDKFormProvider>\n ) : null}\n </Flex>\n </Components.Modal>\n\n <Components.Modal\n isOpen={deleteConfirmUuid !== null}\n onClose={() => {\n setDeleteConfirmUuid(null)\n }}\n shouldCloseOnBackdropClick={false}\n footer={\n <Flex flexDirection=\"row\" gap={12} justifyContent=\"flex-end\">\n <Components.Button\n variant=\"secondary\"\n onClick={() => {\n setDeleteConfirmUuid(null)\n }}\n >\n {t('cancelCta')}\n </Components.Button>\n <Components.Button\n variant=\"error\"\n onClick={() => {\n void handleDeleteModalConfirm()\n }}\n isLoading={isDeletePending && deleteConfirmUuid !== null}\n >\n {t('deleteModalConfirmCta')}\n </Components.Button>\n </Flex>\n }\n >\n <Flex flexDirection=\"column\" gap={16}>\n <Components.Heading as=\"h2\">{t('deleteModalTitle')}</Components.Heading>\n <Components.Text variant=\"supporting\">\n {addressForDeleteModal ? (\n <Trans\n t={t}\n i18nKey=\"deleteModalDescription\"\n values={{\n address: formatPendingWorkAddressLine(addressForDeleteModal, companyLocations),\n }}\n components={{\n strong: <Components.Text weight=\"medium\" as=\"span\" />,\n }}\n />\n ) : null}\n </Components.Text>\n </Flex>\n </Components.Modal>\n </Flex>\n </section>\n )\n}\n"],"names":["resolveLocation","row","companyLocations","loc","formatWorkAddressLines","location","street","getStreet","locality","getCityStateZip","WorkAddressView","editWorkAddressForm","changeWorkAddressForm","workAddresses","editTargetUuid","onEditTargetUuidChange","employeeDisplayName","onConfirmDelete","onWorkAddressSaved","onBack","isDeletePending","className","useTranslation","Components","useComponentContext","addressModal","setAddressModal","useState","deleteConfirmUuid","setDeleteConfirmUuid","addressModalContainerRef","useRef","addressModalPortal","setAddressModalPortal","useLayoutEffect","syncPortal","id","workAddress","editStatus","editFormFields","editShowsEffectiveDateField","createStatus","locationValidation","WorkAddressErrorCodes","startDateValidation","pendingFutureAddress","useMemo","getPendingFutureWorkAddress","addressForDeleteModal","a","changePendingPossessiveLabel","trimmed","chronologicalAsc","b","aDate","bDate","historyAddresses","address","sortedHistory","historyEndDate","idx","nextStart","nextDate","normalizeToDate","endDate","addDays","y","m","d","formatDateLongWithYear","historyDataView","useDataView","lines","jsxs","Flex","jsx","HamburgerMenu","PencilSvg","TrashCanSvg","EmptyData","ListIcon","closeAddressModal","handleDeleteModalConfirm","handleSave","result","modalPending","currentLines","currentLocation","FlexItem","Fragment","formatPendingWorkAddressLine","DataView","ActionsLayout","SDKFormProvider","Grid","LocationField","EffectiveDateField","Trans"],"mappings":"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"}
1	+ {"version":3,"file":"WorkAddressView.js","sources":["../../../../../src/components/Employee/WorkAddress/management/WorkAddressView.tsx"],"sourcesContent":["import { useLayoutEffect, useMemo, useRef, useState } from 'react'\nimport { Trans, useTranslation } from 'react-i18next'\nimport type { Location } from '@gusto/embedded-api/models/components/location'\nimport type { EmployeeWorkAddress } from '@gusto/embedded-api/models/components/employeeworkaddress'\nimport {\n formatPendingWorkAddressLine,\n getPendingFutureWorkAddress,\n} from './getPendingFutureWorkAddress'\nimport ListIcon from '@/assets/icons/list.svg?react'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport {\n ActionsLayout,\n DataView,\n EmptyData,\n Grid,\n HamburgerMenu,\n useDataView,\n} from '@/components/Common'\nimport { Flex, FlexItem } from '@/components/Common/Flex/Flex'\nimport {\n LocationField,\n EffectiveDateField,\n} from '@/components/Employee/Profile/shared/useWorkAddressForm/fields'\nimport { WorkAddressErrorCodes } from '@/components/Employee/Profile/shared/useWorkAddressForm/workAddressSchema'\nimport type { UseWorkAddressFormReady } from '@/components/Employee/Profile/shared/useWorkAddressForm'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport type { HookSubmitResult } from '@/partner-hook-utils/types'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { addDays, formatDateLongWithYear, normalizeToDate } from '@/helpers/dateFormatting'\nimport { getCityStateZip, getStreet } from '@/helpers/formattedStrings'\n\n/** @internal /\nexport interface WorkAddressViewProps {\n editWorkAddressForm: UseWorkAddressFormReady\n changeWorkAddressForm: UseWorkAddressFormReady\n /* Full list for history table, pending-future alert, and delete-confirmation lookup. /\n workAddresses: EmployeeWorkAddress[] \| undefined\n editTargetUuid: string \| undefined\n onEditTargetUuidChange: (uuid: string \| undefined) => void\n employeeDisplayName: string\n onConfirmDelete: (workAddressUuid: string) => Promise<boolean>\n onWorkAddressSaved: (result: HookSubmitResult<EmployeeWorkAddress>) => void\n onBack: () => void\n isDeletePending?: boolean\n /* CSS class name applied to the root element. /\n className?: string\n}\n\nfunction resolveLocation(\n row: EmployeeWorkAddress,\n companyLocations: Location[] \| undefined,\n): Location \| undefined {\n if (!row.locationUuid \|\| !companyLocations?.length) {\n return undefined\n }\n return companyLocations.find(loc => loc.uuid === row.locationUuid)\n}\n\nfunction formatWorkAddressLines(\n row: EmployeeWorkAddress,\n companyLocations: Location[] \| undefined,\n): { primary: string; secondary: string } {\n const location = resolveLocation(row, companyLocations)\n if (location) {\n const street = getStreet(location).trim()\n const locality = getCityStateZip(location).trim()\n return { primary: street, secondary: locality }\n }\n const street = getStreet(row).trim()\n const locality = getCityStateZip(row).trim()\n return { primary: street, secondary: locality }\n}\n\n/* @internal */\nexport function WorkAddressView({\n editWorkAddressForm,\n changeWorkAddressForm,\n workAddresses,\n editTargetUuid,\n onEditTargetUuidChange,\n employeeDisplayName,\n onConfirmDelete,\n onWorkAddressSaved,\n onBack,\n isDeletePending = false,\n className,\n}: WorkAddressViewProps) {\n const { t } = useTranslation('Employee.Management.WorkAddress')\n const Components = useComponentContext()\n const [addressModal, setAddressModal] = useState<'edit' \| 'create' \| null>(null)\n const [deleteConfirmUuid, setDeleteConfirmUuid] = useState<string \| null>(null)\n const addressModalContainerRef = useRef<HTMLDivElement>(null)\n const [addressModalPortal, setAddressModalPortal] = useState<HTMLElement \| undefined>(undefined)\n\n useLayoutEffect(() => {\n if (!addressModal) {\n setAddressModalPortal(undefined)\n return\n }\n const syncPortal = () => {\n setAddressModalPortal(addressModalContainerRef.current ?? undefined)\n }\n syncPortal()\n if (addressModalContainerRef.current == null) {\n const id = requestAnimationFrame(syncPortal)\n return () => {\n cancelAnimationFrame(id)\n }\n }\n }, [addressModal])\n\n const {\n data: { workAddress, companyLocations },\n status: editStatus,\n form: { Fields: editFormFields },\n } = editWorkAddressForm\n\n const editShowsEffectiveDateField = editFormFields.EffectiveDate != null\n\n const { status: createStatus } = changeWorkAddressForm\n\n const locationValidation = {\n [WorkAddressErrorCodes.REQUIRED]: t('form.locationRequired'),\n }\n\n const startDateValidation = {\n [WorkAddressErrorCodes.REQUIRED]: t('form.startDateRequired'),\n }\n\n const pendingFutureAddress = useMemo(\n () => getPendingFutureWorkAddress(workAddresses),\n [workAddresses],\n )\n\n const addressForDeleteModal = useMemo(() => {\n if (!deleteConfirmUuid \|\| !workAddresses) {\n return undefined\n }\n return workAddresses.find(a => a.uuid === deleteConfirmUuid)\n }, [deleteConfirmUuid, workAddresses])\n\n const changePendingPossessiveLabel = useMemo(() => {\n const trimmed = employeeDisplayName.trim()\n return trimmed ? `${trimmed}'s` : t('changePendingPossessiveFallback')\n }, [employeeDisplayName, t])\n\n const chronologicalAsc = useMemo(() => {\n return [...(workAddresses ?? [])].sort((a, b) => {\n const aDate = a.effectiveDate ?? ''\n const bDate = b.effectiveDate ?? ''\n if (!aDate && !bDate) return 0\n if (!aDate) return 1\n if (!bDate) return -1\n return aDate.localeCompare(bDate)\n })\n }, [workAddresses])\n\n const historyAddresses = useMemo(\n () => chronologicalAsc.filter(address => address.active !== true),\n [chronologicalAsc],\n )\n\n const sortedHistory = useMemo(() => [...historyAddresses].reverse(), [historyAddresses])\n\n const historyEndDate = (row: EmployeeWorkAddress) => {\n const idx = chronologicalAsc.findIndex(a => a.uuid === row.uuid)\n if (idx === -1 \|\| idx >= chronologicalAsc.length - 1) return '—'\n const nextStart = chronologicalAsc[idx + 1]?.effectiveDate\n if (!nextStart) return '—'\n const nextDate = normalizeToDate(nextStart)\n if (!nextDate) return '—'\n const endDate = addDays(nextDate, -1)\n const y = endDate.getFullYear()\n const m = String(endDate.getMonth() + 1).padStart(2, '0')\n const d = String(endDate.getDate()).padStart(2, '0')\n return formatDateLongWithYear(`${y}-${m}-${d}`)\n }\n\n const historyDataView = useDataView({\n data: sortedHistory,\n columns: [\n {\n title: t('columns.location'),\n render: (row: EmployeeWorkAddress) => {\n const lines = formatWorkAddressLines(row, companyLocations)\n return (\n <Flex flexDirection=\"column\" gap={0}>\n <Components.Text weight=\"medium\">{lines.primary}</Components.Text>\n <Components.Text variant=\"supporting\">{lines.secondary}</Components.Text>\n </Flex>\n )\n },\n },\n {\n title: t('columns.startDate'),\n render: (row: EmployeeWorkAddress) =>\n row.effectiveDate ? formatDateLongWithYear(row.effectiveDate) : '—',\n },\n {\n title: t('columns.endDate'),\n render: (row: EmployeeWorkAddress) => historyEndDate(row),\n },\n ],\n itemMenu: (row: EmployeeWorkAddress) => (\n <HamburgerMenu\n triggerLabel={t('rowMenuAriaLabel')}\n items={[\n {\n label: t('rowEdit'),\n onClick: () => {\n onEditTargetUuidChange(row.uuid)\n setAddressModal('edit')\n },\n icon: <PencilSvg aria-hidden />,\n },\n {\n label: t('rowDelete'),\n onClick: () => {\n if (row.active === true) {\n return\n }\n setDeleteConfirmUuid(row.uuid)\n },\n icon: <TrashCanSvg aria-hidden />,\n },\n ]}\n />\n ),\n emptyState: () => (\n <div data-testid=\"work-address-history-empty\">\n <EmptyData\n icon={<ListIcon aria-hidden />}\n title={t('historyEmptyTitle')}\n description={t('historyEmptyDescription')}\n />\n </div>\n ),\n })\n\n const closeAddressModal = () => {\n setAddressModal(null)\n onEditTargetUuidChange(undefined)\n }\n\n const handleDeleteModalConfirm = async () => {\n if (!deleteConfirmUuid) {\n return\n }\n const deleted = await onConfirmDelete(deleteConfirmUuid)\n if (deleted) {\n setDeleteConfirmUuid(null)\n }\n }\n\n const handleSave = async () => {\n if (!addressModal) {\n return\n }\n\n if (addressModal === 'edit') {\n const result = await editWorkAddressForm.actions.onSubmit(\n undefined,\n editShowsEffectiveDateField ? undefined : { effectiveDate: workAddress?.effectiveDate },\n )\n if (result) {\n onWorkAddressSaved(result)\n closeAddressModal()\n }\n return\n }\n\n const result = await changeWorkAddressForm.actions.onSubmit()\n if (result) {\n onWorkAddressSaved(result)\n closeAddressModal()\n }\n }\n\n const modalPending = addressModal === 'edit' ? editStatus.isPending : createStatus.isPending\n\n const currentLines = workAddress ? formatWorkAddressLines(workAddress, companyLocations) : null\n const currentLocation =\n workAddress && companyLocations ? resolveLocation(workAddress, companyLocations) : undefined\n\n return (\n <Flex className={className} flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" gap={4} alignItems=\"flex-start\">\n <Components.Heading as=\"h1\" styledAs=\"h2\">\n {t('title')}\n </Components.Heading>\n <Components.Text variant=\"supporting\">{t('description')}</Components.Text>\n </Flex>\n\n <Components.Box\n header={\n <Components.BoxHeader\n title={t('currentSectionTitle')}\n action={\n workAddress ? (\n <Components.Button\n variant=\"secondary\"\n onClick={() => {\n onEditTargetUuidChange(undefined)\n setAddressModal('edit')\n }}\n isLoading={editStatus.isPending}\n >\n {t('editCta')}\n </Components.Button>\n ) : undefined\n }\n />\n }\n footer={\n <Components.Button\n variant=\"secondary\"\n onClick={() => {\n onEditTargetUuidChange(undefined)\n setAddressModal('create')\n }}\n isLoading={createStatus.isPending}\n >\n {t('changeCta')}\n </Components.Button>\n }\n >\n <Flex flexDirection=\"column\" gap={16}>\n {workAddress && currentLines ? (\n <Flex flexDirection=\"column\" gap={4}>\n <FlexItem>\n {currentLocation ? (\n <>\n <Components.Text weight=\"medium\">\n {getStreet(currentLocation).trim()}\n </Components.Text>\n <Components.Text weight=\"medium\">\n {getCityStateZip(currentLocation)}\n </Components.Text>\n </>\n ) : (\n <>\n <Components.Text weight=\"medium\">{currentLines.primary}</Components.Text>\n <Components.Text weight=\"medium\">{currentLines.secondary}</Components.Text>\n </>\n )}\n </FlexItem>\n {workAddress.effectiveDate ? (\n <Components.Text variant=\"supporting\">\n {t('currentSince', {\n date: formatDateLongWithYear(workAddress.effectiveDate),\n })}\n </Components.Text>\n ) : null}\n </Flex>\n ) : (\n <Components.Text>{t('currentEmpty')}</Components.Text>\n )}\n {pendingFutureAddress ? (\n <Components.Alert status=\"warning\" label={t('changePendingTitle')}>\n <Components.Text variant=\"supporting\">\n {t('changePendingDescription', {\n possessiveLabel: changePendingPossessiveLabel,\n newAddress: formatPendingWorkAddressLine(pendingFutureAddress, companyLocations),\n effectiveDate: pendingFutureAddress.effectiveDate\n ? formatDateLongWithYear(pendingFutureAddress.effectiveDate)\n : '—',\n // Values are inserted into JSX text, so the browser already\n // escapes them. Telling i18next to escape too produces\n // double-encoded entities like `'` showing as text.\n interpolation: { escapeValue: false },\n })}\n </Components.Text>\n </Components.Alert>\n ) : null}\n </Flex>\n </Components.Box>\n\n <Flex flexDirection=\"column\" gap={12}>\n <Components.Heading as=\"h2\" styledAs=\"h4\">\n {t('historySectionTitle')}\n </Components.Heading>\n <DataView label={t('historySectionTitle')} {...historyDataView} />\n </Flex>\n\n <ActionsLayout>\n <Components.Button variant=\"secondary\" onClick={onBack}>\n {t('backCta')}\n </Components.Button>\n </ActionsLayout>\n\n <Components.Modal\n isOpen={addressModal !== null}\n onClose={closeAddressModal}\n shouldCloseOnBackdropClick={false}\n containerRef={addressModalContainerRef}\n footer={\n <Flex flexDirection=\"row\" gap={12} justifyContent=\"flex-end\">\n <Components.Button variant=\"secondary\" onClick={closeAddressModal}>\n {t('cancelCta')}\n </Components.Button>\n <Components.Button\n variant=\"primary\"\n onClick={() => {\n void handleSave()\n }}\n isLoading={modalPending}\n >\n {t('submitCta')}\n </Components.Button>\n </Flex>\n }\n >\n <Flex flexDirection=\"column\" gap={16}>\n <Components.Heading as=\"h2\">\n {addressModal === 'edit' ? t('editModalTitle') : t('changeModalTitle')}\n </Components.Heading>\n <Components.Text variant=\"supporting\">\n {addressModal === 'edit' ? t('editModalDescription') : t('changeModalDescription')}\n </Components.Text>\n {addressModal === 'edit' && editShowsEffectiveDateField ? (\n <Components.Alert status=\"warning\" label={t('editPastAddressAlertTitle')} />\n ) : null}\n {addressModal === 'edit' ? (\n <SDKFormProvider formHookResult={editWorkAddressForm}>\n <Grid\n gridTemplateColumns={{\n base: '1fr',\n small: '1fr',\n }}\n gap={20}\n >\n <LocationField\n label={\n editShowsEffectiveDateField\n ? t('form.editInactiveLocationLabel')\n : t('form.editLocationLabel')\n }\n description={t('form.editLocationDescription')}\n placeholder={t('form.selectPlaceholder')}\n validationMessages={locationValidation}\n portalContainer={addressModalPortal}\n />\n {editShowsEffectiveDateField ? (\n <EffectiveDateField\n label={t('form.startDateLabel')}\n description={t('form.editInactiveStartDateDescription')}\n validationMessages={startDateValidation}\n portalContainer={addressModalPortal}\n />\n ) : null}\n </Grid>\n </SDKFormProvider>\n ) : null}\n {addressModal === 'create' ? (\n <SDKFormProvider formHookResult={changeWorkAddressForm}>\n <Grid\n gridTemplateColumns={{\n base: '1fr',\n small: '1fr',\n }}\n gap={20}\n >\n <LocationField\n label={t('form.newWorkAddressLabel')}\n description={t('form.newWorkAddressDescription')}\n placeholder={t('form.selectPlaceholder')}\n validationMessages={locationValidation}\n portalContainer={addressModalPortal}\n />\n <EffectiveDateField\n label={t('form.startDateLabel')}\n description={t('form.startDateDescription')}\n validationMessages={startDateValidation}\n portalContainer={addressModalPortal}\n />\n </Grid>\n </SDKFormProvider>\n ) : null}\n </Flex>\n </Components.Modal>\n\n <Components.Modal\n isOpen={deleteConfirmUuid !== null}\n onClose={() => {\n setDeleteConfirmUuid(null)\n }}\n shouldCloseOnBackdropClick={false}\n footer={\n <Flex flexDirection=\"row\" gap={12} justifyContent=\"flex-end\">\n <Components.Button\n variant=\"secondary\"\n onClick={() => {\n setDeleteConfirmUuid(null)\n }}\n >\n {t('cancelCta')}\n </Components.Button>\n <Components.Button\n variant=\"error\"\n onClick={() => {\n void handleDeleteModalConfirm()\n }}\n isLoading={isDeletePending && deleteConfirmUuid !== null}\n >\n {t('deleteModalConfirmCta')}\n </Components.Button>\n </Flex>\n }\n >\n <Flex flexDirection=\"column\" gap={16}>\n <Components.Heading as=\"h2\">{t('deleteModalTitle')}</Components.Heading>\n <Components.Text variant=\"supporting\">\n {addressForDeleteModal ? (\n <Trans\n t={t}\n i18nKey=\"deleteModalDescription\"\n values={{\n address: formatPendingWorkAddressLine(addressForDeleteModal, companyLocations),\n }}\n components={{\n strong: <Components.Text weight=\"medium\" as=\"span\" />,\n }}\n />\n ) : null}\n </Components.Text>\n </Flex>\n </Components.Modal>\n </Flex>\n )\n}\n"],"names":["resolveLocation","row","companyLocations","loc","formatWorkAddressLines","location","street","getStreet","locality","getCityStateZip","WorkAddressView","editWorkAddressForm","changeWorkAddressForm","workAddresses","editTargetUuid","onEditTargetUuidChange","employeeDisplayName","onConfirmDelete","onWorkAddressSaved","onBack","isDeletePending","className","t","useTranslation","Components","useComponentContext","addressModal","setAddressModal","useState","deleteConfirmUuid","setDeleteConfirmUuid","addressModalContainerRef","useRef","addressModalPortal","setAddressModalPortal","useLayoutEffect","syncPortal","id","workAddress","editStatus","editFormFields","editShowsEffectiveDateField","createStatus","locationValidation","WorkAddressErrorCodes","startDateValidation","pendingFutureAddress","useMemo","getPendingFutureWorkAddress","addressForDeleteModal","a","changePendingPossessiveLabel","trimmed","chronologicalAsc","b","aDate","bDate","historyAddresses","address","sortedHistory","historyEndDate","idx","nextStart","nextDate","normalizeToDate","endDate","addDays","y","m","d","formatDateLongWithYear","historyDataView","useDataView","lines","jsxs","Flex","jsx","HamburgerMenu","PencilSvg","TrashCanSvg","EmptyData","ListIcon","closeAddressModal","handleDeleteModalConfirm","handleSave","result","modalPending","currentLines","currentLocation","FlexItem","Fragment","formatPendingWorkAddressLine","DataView","ActionsLayout","SDKFormProvider","Grid","LocationField","EffectiveDateField","Trans"],"mappings":"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"}

package/dist/components/InformationRequests/InformationRequestList/InformationRequestList.js CHANGED Viewed

@@ -76,13 +76,13 @@ function L({ companyId: o, dictionary: d, onEvent: f, className: y }) {
       }
     ) : null
   });
-  return /* @__PURE__ */ n("section", { className: y, children: /* @__PURE__ */ a(u, { flexDirection: "column", gap: 20, children: [
+  return /* @__PURE__ */ a(u, { className: y, flexDirection: "column", gap: 20, children: [
     /* @__PURE__ */ a(u, { flexDirection: "column", gap: 2, children: [
       /* @__PURE__ */ n(R, { as: "h2", styledAs: "h4", children: t("title") }),
       c.length > 0 && /* @__PURE__ */ n(l, { children: t("description") })
     ] }),
     /* @__PURE__ */ n(k, { ...b, label: t("title") })
-  ] }) });
+  ] });
 }
 export {
   K as InformationRequestList

package/dist/components/InformationRequests/InformationRequestList/InformationRequestList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InformationRequestList.js","sources":["../../../../src/components/InformationRequests/InformationRequestList/InformationRequestList.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport type { InformationRequest } from '@gusto/embedded-api/models/components/informationrequest'\nimport {\n InformationRequestStatus,\n InformationRequestType,\n} from '@gusto/embedded-api/models/components/informationrequest'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { EmptyData, Flex, FlexItem } from '@/components/Common'\nimport { informationRequestEvents } from '@/shared/constants'\nimport type { BadgeProps } from '@/components/Common/UI/Badge/BadgeTypes'\n\n/*\n Props for {@link InformationRequestList}.\n \n @public\n /\nexport interface InformationRequestListProps extends BaseComponentInterface<'InformationRequests.InformationRequestList'> {\n /* The associated company identifier. /\n companyId: string\n /* Event callback. See the events table on {@link InformationRequestList} for emitted events. /\n onEvent: BaseComponentInterface['onEvent']\n}\n\n/\n Displays the list of outstanding information requests for a company with a \"Respond\" CTA on each open request.\n \n @remarks\n * Renders status badges for each request and an extra \"Payroll blocking\" badge when the request is currently blocking payroll. Approved requests are filtered out of the list. Used as the top-level surface of `InformationRequests.InformationRequestsFlow`, but can be rendered directly when you want to host the response form yourself (e.g. in a custom modal or page).\n \n @events\n * \| Event \| Description \| Data \|\n * \| ----- \| ----------- \| ---- \|\n * \| `informationRequest/respond` \| Fired when the user clicks \"Respond\" on an open request \| `{ requestId: string }` \|\n \n @param props - See {@link InformationRequestListProps}.\n * @returns The rendered information request list.\n * @public\n */\nexport function InformationRequestList(props: InformationRequestListProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\ntype StatusMapping = {\n label: string\n badgeStatus: BadgeProps['status']\n} \| null\n\nfunction Root({ companyId, dictionary, onEvent, className }: InformationRequestListProps) {\n useComponentDictionary('InformationRequests.InformationRequestList', dictionary)\n useI18n('InformationRequests.InformationRequestList')\n const { t } = useTranslation('InformationRequests.InformationRequestList')\n const { Heading, Text, Button, Badge } = useComponentContext()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequests = data.informationRequests ?? []\n\n const visibleRequests = informationRequests.filter(\n request => request.status !== InformationRequestStatus.Approved,\n )\n\n const getTypeLabel = (type: InformationRequest['type']): string => {\n switch (type) {\n case InformationRequestType.CompanyOnboarding:\n return t('types.companyOnboarding')\n case InformationRequestType.AccountProtection:\n return t('types.accountProtection')\n case InformationRequestType.PaymentRequest:\n return t('types.paymentRequest')\n case InformationRequestType.PaymentError:\n return t('types.paymentError')\n default:\n return t('types.unknown')\n }\n }\n\n const getStatusMapping = (status: InformationRequest['status']): StatusMapping => {\n switch (status) {\n case InformationRequestStatus.PendingResponse:\n return { label: t('status.incomplete'), badgeStatus: 'info' }\n case InformationRequestStatus.PendingReview:\n return { label: t('status.underReview'), badgeStatus: 'warning' }\n default:\n return null\n }\n }\n\n const dataViewProps = useDataView({\n data: visibleRequests,\n emptyState: () => (\n <EmptyData title={t('emptyTableTitle')} description={t('emptyTableDescription')} />\n ),\n columns: [\n {\n key: 'type',\n title: t('columns.type'),\n render: request => (\n <FlexItem flexGrow={1}>\n <Text weight=\"medium\">{getTypeLabel(request.type)}</Text>\n </FlexItem>\n ),\n },\n {\n key: 'status',\n title: t('columns.status'),\n render: request => {\n const statusMapping = getStatusMapping(request.status)\n const showPayrollBlockingBadge = request.blockingPayroll\n\n if (!statusMapping && !showPayrollBlockingBadge) {\n return null\n }\n\n return (\n <Flex gap={8} alignItems=\"center\">\n {statusMapping && (\n <Badge status={statusMapping.badgeStatus}>{statusMapping.label}</Badge>\n )}\n {showPayrollBlockingBadge && (\n <Badge status=\"error\">{t('status.payrollBlocking')}</Badge>\n )}\n </Flex>\n )\n },\n },\n ],\n itemMenu: request => {\n const isPendingResponse = request.status === InformationRequestStatus.PendingResponse\n if (!isPendingResponse) {\n return null\n }\n return (\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(informationRequestEvents.INFORMATION_REQUEST_RESPOND, {\n requestId: request.uuid,\n })\n }}\n >\n {t('cta.respond')}\n </Button>\n )\n },\n })\n\n return (\n <~~section~~ className={className}~~>\n <Flex~~ flexDirection=\"column\" gap={20}>\n <Flex flexDirection=\"column\" gap={2}>\n <Heading as=\"h2\" styledAs=\"h4\">\n {t('title')}\n </Heading>\n {visibleRequests.length > 0 && <Text>{t('description')}</Text>}\n </Flex>\n\n <DataView {...dataViewProps} label={t('title')} />\n </Flex>\n ~~</section>\n~~ )\n}\n"],"names":["InformationRequestList","props","jsx","BaseComponent","Root","companyId","dictionary","onEvent","className","useComponentDictionary","useI18n","useTranslation","Heading","Text","Button","Badge","useComponentContext","data","useInformationRequestsGetInformationRequestsSuspense","visibleRequests","request","InformationRequestStatus","getTypeLabel","type","InformationRequestType","getStatusMapping","status","dataViewProps","useDataView","EmptyData","FlexItem","statusMapping","showPayrollBlockingBadge","jsxs","Flex","informationRequestEvents","DataView"],"mappings":"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~~SACE~~,~~gBAAAlB~~,~~EAAC~~,~~aAAQ~~,~~WAAAM~~,~~GACP,UAAA,gBAAAyB,EAACC,KAAK,~~eAAc,UAAS,KAAK,~~IAChC~~,UAAA;AAAA,IAAA,~~gBAAAD~~,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAhC,EAACU,KAAQ,IAAG,MAAK,UAAS,MACvB,UAAA,EAAE,OAAO,GACZ;AAAA,MACCO,EAAgB,SAAS,uBAAMN,GAAA,EAAM,UAAA,EAAE,aAAa,EAAA,CAAE;AAAA,IAAA,GACzD;AAAA,sBAECuB,GAAA,EAAU,GAAGT,GAAe,OAAO,EAAE,OAAO,EAAA,CAAG;AAAA,EAAA,~~EAAA,CAClD,EAAA,CACF~~;AAEJ;"}
1	+ {"version":3,"file":"InformationRequestList.js","sources":["../../../../src/components/InformationRequests/InformationRequestList/InformationRequestList.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport type { InformationRequest } from '@gusto/embedded-api/models/components/informationrequest'\nimport {\n InformationRequestStatus,\n InformationRequestType,\n} from '@gusto/embedded-api/models/components/informationrequest'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { EmptyData, Flex, FlexItem } from '@/components/Common'\nimport { informationRequestEvents } from '@/shared/constants'\nimport type { BadgeProps } from '@/components/Common/UI/Badge/BadgeTypes'\n\n/*\n Props for {@link InformationRequestList}.\n \n @public\n /\nexport interface InformationRequestListProps extends BaseComponentInterface<'InformationRequests.InformationRequestList'> {\n /* The associated company identifier. /\n companyId: string\n /* Event callback. See the events table on {@link InformationRequestList} for emitted events. /\n onEvent: BaseComponentInterface['onEvent']\n}\n\n/\n Displays the list of outstanding information requests for a company with a \"Respond\" CTA on each open request.\n \n @remarks\n * Renders status badges for each request and an extra \"Payroll blocking\" badge when the request is currently blocking payroll. Approved requests are filtered out of the list. Used as the top-level surface of `InformationRequests.InformationRequestsFlow`, but can be rendered directly when you want to host the response form yourself (e.g. in a custom modal or page).\n \n @events\n * \| Event \| Description \| Data \|\n * \| ----- \| ----------- \| ---- \|\n * \| `informationRequest/respond` \| Fired when the user clicks \"Respond\" on an open request \| `{ requestId: string }` \|\n \n @param props - See {@link InformationRequestListProps}.\n * @returns The rendered information request list.\n * @public\n */\nexport function InformationRequestList(props: InformationRequestListProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\ntype StatusMapping = {\n label: string\n badgeStatus: BadgeProps['status']\n} \| null\n\nfunction Root({ companyId, dictionary, onEvent, className }: InformationRequestListProps) {\n useComponentDictionary('InformationRequests.InformationRequestList', dictionary)\n useI18n('InformationRequests.InformationRequestList')\n const { t } = useTranslation('InformationRequests.InformationRequestList')\n const { Heading, Text, Button, Badge } = useComponentContext()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequests = data.informationRequests ?? []\n\n const visibleRequests = informationRequests.filter(\n request => request.status !== InformationRequestStatus.Approved,\n )\n\n const getTypeLabel = (type: InformationRequest['type']): string => {\n switch (type) {\n case InformationRequestType.CompanyOnboarding:\n return t('types.companyOnboarding')\n case InformationRequestType.AccountProtection:\n return t('types.accountProtection')\n case InformationRequestType.PaymentRequest:\n return t('types.paymentRequest')\n case InformationRequestType.PaymentError:\n return t('types.paymentError')\n default:\n return t('types.unknown')\n }\n }\n\n const getStatusMapping = (status: InformationRequest['status']): StatusMapping => {\n switch (status) {\n case InformationRequestStatus.PendingResponse:\n return { label: t('status.incomplete'), badgeStatus: 'info' }\n case InformationRequestStatus.PendingReview:\n return { label: t('status.underReview'), badgeStatus: 'warning' }\n default:\n return null\n }\n }\n\n const dataViewProps = useDataView({\n data: visibleRequests,\n emptyState: () => (\n <EmptyData title={t('emptyTableTitle')} description={t('emptyTableDescription')} />\n ),\n columns: [\n {\n key: 'type',\n title: t('columns.type'),\n render: request => (\n <FlexItem flexGrow={1}>\n <Text weight=\"medium\">{getTypeLabel(request.type)}</Text>\n </FlexItem>\n ),\n },\n {\n key: 'status',\n title: t('columns.status'),\n render: request => {\n const statusMapping = getStatusMapping(request.status)\n const showPayrollBlockingBadge = request.blockingPayroll\n\n if (!statusMapping && !showPayrollBlockingBadge) {\n return null\n }\n\n return (\n <Flex gap={8} alignItems=\"center\">\n {statusMapping && (\n <Badge status={statusMapping.badgeStatus}>{statusMapping.label}</Badge>\n )}\n {showPayrollBlockingBadge && (\n <Badge status=\"error\">{t('status.payrollBlocking')}</Badge>\n )}\n </Flex>\n )\n },\n },\n ],\n itemMenu: request => {\n const isPendingResponse = request.status === InformationRequestStatus.PendingResponse\n if (!isPendingResponse) {\n return null\n }\n return (\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(informationRequestEvents.INFORMATION_REQUEST_RESPOND, {\n requestId: request.uuid,\n })\n }}\n >\n {t('cta.respond')}\n </Button>\n )\n },\n })\n\n return (\n <Flex className={className} flexDirection=\"column\" gap={20}>\n <Flex flexDirection=\"column\" gap={2}>\n <Heading as=\"h2\" styledAs=\"h4\">\n {t('title')}\n </Heading>\n {visibleRequests.length > 0 && <Text>{t('description')}</Text>}\n </Flex>\n\n <DataView {...dataViewProps} label={t('title')} />\n </Flex>\n )\n}\n"],"names":["InformationRequestList","props","jsx","BaseComponent","Root","companyId","dictionary","onEvent","className","useComponentDictionary","useI18n","useTranslation","Heading","Text","Button","Badge","useComponentContext","data","useInformationRequestsGetInformationRequestsSuspense","visibleRequests","request","InformationRequestStatus","getTypeLabel","type","InformationRequestType","getStatusMapping","status","dataViewProps","useDataView","EmptyData","FlexItem","statusMapping","showPayrollBlockingBadge","jsxs","Flex","informationRequestEvents","DataView"],"mappings":"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"}

package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsBanner/ConfirmWireDetailsBanner.js CHANGED Viewed

@@ -82,7 +82,7 @@ const K = ({
         }
       );
   };
-  return /* @__PURE__ */ n("section", { className: P, children: /* @__PURE__ */ h(g, { flexDirection: "column", gap: 16, children: [
+  return /* @__PURE__ */ h(g, { className: P, flexDirection: "column", gap: 16, children: [
     y && /* @__PURE__ */ n(
       L,
       {
@@ -99,7 +99,7 @@ const K = ({
       F(),
       /* @__PURE__ */ n(b, { variant: "secondary", onClick: C, children: s("cta.startWireTransfer") })
     ] }) })
-  ] }) });
+  ] });
 };
 export {
   se as ConfirmWireDetailsBanner

package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsBanner/ConfirmWireDetailsBanner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfirmWireDetailsBanner.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsBanner/ConfirmWireDetailsBanner.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useWireInRequestsListSuspense } from '@gusto/embedded-api/react-query/wireInRequestsList'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport { useState, useEffect } from 'react'\nimport type { ConfirmationAlert } from '../types'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\n\ninterface ConfirmWireDetailsBannerProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsBanner'> {\n wireInId?: string\n companyId: string\n confirmationAlert?: ConfirmationAlert\n onStartWireTransfer: () => void\n}\n\n/** @internal */\nexport function ConfirmWireDetailsBanner(props: ConfirmWireDetailsBannerProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({\n wireInId,\n companyId,\n dictionary,\n confirmationAlert,\n onStartWireTransfer,\n className,\n}: ConfirmWireDetailsBannerProps) => {\n useComponentDictionary('Payroll.ConfirmWireDetailsBanner', dictionary)\n useI18n('Payroll.ConfirmWireDetailsBanner')\n const { t } = useTranslation('Payroll.ConfirmWireDetailsBanner')\n const { Alert, Banner, Button, UnorderedList, Text } = useComponentContext()\n const dateFormatter = useDateFormatter()\n const [isConfirmationAlertDismissed, setIsConfirmationAlertDismissed] = useState(false)\n const currencyFormatter = useNumberFormatter('currency')\n\n useEffect(() => {\n if (confirmationAlert) {\n setIsConfirmationAlertDismissed(false)\n }\n }, [confirmationAlert])\n\n const { data: wireInRequestsData } = useWireInRequestsListSuspense({\n companyUuid: companyId,\n })\n\n const { data: payrollsData } = usePayrollsListSuspense({\n companyId,\n processed: true,\n })\n\n const activeWireInRequests = (wireInRequestsData.wireInRequestList \|\| []).filter(\n request => request.status === 'awaiting_funds',\n )\n const wireInRequests = wireInId\n ? activeWireInRequests.filter(request => request.uuid === wireInId)\n : activeWireInRequests\n\n const payrolls = payrollsData.payrollList \|\| []\n\n const wireInRequestsWithPayrolls = wireInRequests.map(wireInRequest => {\n const payroll = payrolls.find(p => p.payrollUuid === wireInRequest.paymentUuid)\n const payrollRange = payroll?.payPeriod\n ? dateFormatter.formatPayPeriodRange(payroll.payPeriod.startDate, payroll.payPeriod.endDate)\n : ''\n return {\n wireInRequest,\n payroll,\n payrollRange,\n paymentType: wireInRequest.paymentType,\n requestedAmount: wireInRequest.requestedAmount ?? '',\n }\n })\n\n const shouldShowBanner =\n wireInRequestsWithPayrolls.length > 0 &&\n (wireInRequestsWithPayrolls.length > 1 \|\| wireInRequestsWithPayrolls[0]?.wireInRequest)\n\n const shouldShowConfirmationAlert = !isConfirmationAlertDismissed && confirmationAlert\n\n if (!shouldShowBanner && !shouldShowConfirmationAlert) {\n return null\n }\n\n const formatDeadline = (deadline: string) => {\n const date = new Date(deadline)\n\n const timeRaw = date.toLocaleTimeString('en-US', {\n hour: 'numeric',\n minute: date.getMinutes() === 0 ? undefined : '2-digit',\n hour12: true,\n timeZone: 'America/Los_Angeles',\n timeZoneName: 'short',\n })\n\n const time = timeRaw.replace(/\\s?(AM\|PM)/i, match => match.trim().toLowerCase())\n\n const dateString = date.toLocaleDateString('en-US', {\n month: 'long',\n day: 'numeric',\n year: 'numeric',\n timeZone: 'America/Los_Angeles',\n })\n\n return { time, date: dateString }\n }\n\n const getBannerTitle = () => {\n const isSingleWireInRequest = wireInRequestsWithPayrolls.length === 1\n const { wireInRequest, payrollRange } = wireInRequestsWithPayrolls[0] \|\| {}\n\n if (isSingleWireInRequest) {\n if (wireInId && wireInRequest?.wireInDeadline) {\n const { time, date } = formatDeadline(wireInRequest.wireInDeadline)\n return t('banner.title', { time, date })\n }\n return t('banner.titleWithPayroll', { payrollRange })\n }\n return t('banner.titleMultiple', { count: wireInRequestsWithPayrolls.length })\n }\n\n const getBannerContent = () => {\n if (wireInRequestsWithPayrolls.length > 1) {\n return (\n <UnorderedList\n items={wireInRequestsWithPayrolls.map(\n ({ paymentType, payrollRange, requestedAmount }, index) =>\n paymentType === 'Payroll' ? (\n <Text key={index}>{t('banner.requestLabelPayroll', { payrollRange })}</Text>\n ) : (\n <Text key={index}>\n {t('banner.requestLabelContractorPaymentGroup', {\n requestedAmount: currencyFormatter(Number(requestedAmount)),\n })}\n </Text>\n ),\n )}\n />\n )\n }\n }\n\n return (\n <section className={className}>\n <Flex flexDirection=\"column\" gap={16}>\n {shouldShowConfirmationAlert && (\n <Alert\n status=\"success\"\n label={confirmationAlert.title}\n onDismiss={() => {\n setIsConfirmationAlertDismissed(true)\n }}\n >\n {confirmationAlert.content}\n </Alert>\n )}\n {shouldShowBanner && (\n <Banner status=\"warning\" title={getBannerTitle()}>\n <Flex flexDirection=\"column\" gap={16} alignItems=\"flex-start\">\n <div>{t('banner.description')}</div>\n {getBannerContent()}\n <Button variant=\"secondary\" onClick={onStartWireTransfer}>\n {t('cta.startWireTransfer')}\n </Button>\n </Flex>\n </Banner>\n )}\n </Flex>\n </section>\n )\n}\n"],"names":["ConfirmWireDetailsBanner","props","jsx","BaseComponent","Root","wireInId","companyId","dictionary","confirmationAlert","onStartWireTransfer","className","useComponentDictionary","useI18n","t","useTranslation","Alert","Banner","Button","UnorderedList","Text","useComponentContext","dateFormatter","useDateFormatter","isConfirmationAlertDismissed","setIsConfirmationAlertDismissed","useState","currencyFormatter","useNumberFormatter","useEffect","wireInRequestsData","useWireInRequestsListSuspense","payrollsData","usePayrollsListSuspense","activeWireInRequests","request","wireInRequests","payrolls","wireInRequestsWithPayrolls","wireInRequest","payroll","p","payrollRange","shouldShowBanner","shouldShowConfirmationAlert","formatDeadline","deadline","date","time","match","dateString","getBannerTitle","isSingleWireInRequest","getBannerContent","paymentType","requestedAmount","index","jsxs","Flex"],"mappings":"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"}
1	+ {"version":3,"file":"ConfirmWireDetailsBanner.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsBanner/ConfirmWireDetailsBanner.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useWireInRequestsListSuspense } from '@gusto/embedded-api/react-query/wireInRequestsList'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport { useState, useEffect } from 'react'\nimport type { ConfirmationAlert } from '../types'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\n\ninterface ConfirmWireDetailsBannerProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsBanner'> {\n wireInId?: string\n companyId: string\n confirmationAlert?: ConfirmationAlert\n onStartWireTransfer: () => void\n}\n\n/** @internal */\nexport function ConfirmWireDetailsBanner(props: ConfirmWireDetailsBannerProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({\n wireInId,\n companyId,\n dictionary,\n confirmationAlert,\n onStartWireTransfer,\n className,\n}: ConfirmWireDetailsBannerProps) => {\n useComponentDictionary('Payroll.ConfirmWireDetailsBanner', dictionary)\n useI18n('Payroll.ConfirmWireDetailsBanner')\n const { t } = useTranslation('Payroll.ConfirmWireDetailsBanner')\n const { Alert, Banner, Button, UnorderedList, Text } = useComponentContext()\n const dateFormatter = useDateFormatter()\n const [isConfirmationAlertDismissed, setIsConfirmationAlertDismissed] = useState(false)\n const currencyFormatter = useNumberFormatter('currency')\n\n useEffect(() => {\n if (confirmationAlert) {\n setIsConfirmationAlertDismissed(false)\n }\n }, [confirmationAlert])\n\n const { data: wireInRequestsData } = useWireInRequestsListSuspense({\n companyUuid: companyId,\n })\n\n const { data: payrollsData } = usePayrollsListSuspense({\n companyId,\n processed: true,\n })\n\n const activeWireInRequests = (wireInRequestsData.wireInRequestList \|\| []).filter(\n request => request.status === 'awaiting_funds',\n )\n const wireInRequests = wireInId\n ? activeWireInRequests.filter(request => request.uuid === wireInId)\n : activeWireInRequests\n\n const payrolls = payrollsData.payrollList \|\| []\n\n const wireInRequestsWithPayrolls = wireInRequests.map(wireInRequest => {\n const payroll = payrolls.find(p => p.payrollUuid === wireInRequest.paymentUuid)\n const payrollRange = payroll?.payPeriod\n ? dateFormatter.formatPayPeriodRange(payroll.payPeriod.startDate, payroll.payPeriod.endDate)\n : ''\n return {\n wireInRequest,\n payroll,\n payrollRange,\n paymentType: wireInRequest.paymentType,\n requestedAmount: wireInRequest.requestedAmount ?? '',\n }\n })\n\n const shouldShowBanner =\n wireInRequestsWithPayrolls.length > 0 &&\n (wireInRequestsWithPayrolls.length > 1 \|\| wireInRequestsWithPayrolls[0]?.wireInRequest)\n\n const shouldShowConfirmationAlert = !isConfirmationAlertDismissed && confirmationAlert\n\n if (!shouldShowBanner && !shouldShowConfirmationAlert) {\n return null\n }\n\n const formatDeadline = (deadline: string) => {\n const date = new Date(deadline)\n\n const timeRaw = date.toLocaleTimeString('en-US', {\n hour: 'numeric',\n minute: date.getMinutes() === 0 ? undefined : '2-digit',\n hour12: true,\n timeZone: 'America/Los_Angeles',\n timeZoneName: 'short',\n })\n\n const time = timeRaw.replace(/\\s?(AM\|PM)/i, match => match.trim().toLowerCase())\n\n const dateString = date.toLocaleDateString('en-US', {\n month: 'long',\n day: 'numeric',\n year: 'numeric',\n timeZone: 'America/Los_Angeles',\n })\n\n return { time, date: dateString }\n }\n\n const getBannerTitle = () => {\n const isSingleWireInRequest = wireInRequestsWithPayrolls.length === 1\n const { wireInRequest, payrollRange } = wireInRequestsWithPayrolls[0] \|\| {}\n\n if (isSingleWireInRequest) {\n if (wireInId && wireInRequest?.wireInDeadline) {\n const { time, date } = formatDeadline(wireInRequest.wireInDeadline)\n return t('banner.title', { time, date })\n }\n return t('banner.titleWithPayroll', { payrollRange })\n }\n return t('banner.titleMultiple', { count: wireInRequestsWithPayrolls.length })\n }\n\n const getBannerContent = () => {\n if (wireInRequestsWithPayrolls.length > 1) {\n return (\n <UnorderedList\n items={wireInRequestsWithPayrolls.map(\n ({ paymentType, payrollRange, requestedAmount }, index) =>\n paymentType === 'Payroll' ? (\n <Text key={index}>{t('banner.requestLabelPayroll', { payrollRange })}</Text>\n ) : (\n <Text key={index}>\n {t('banner.requestLabelContractorPaymentGroup', {\n requestedAmount: currencyFormatter(Number(requestedAmount)),\n })}\n </Text>\n ),\n )}\n />\n )\n }\n }\n\n return (\n <Flex className={className} flexDirection=\"column\" gap={16}>\n {shouldShowConfirmationAlert && (\n <Alert\n status=\"success\"\n label={confirmationAlert.title}\n onDismiss={() => {\n setIsConfirmationAlertDismissed(true)\n }}\n >\n {confirmationAlert.content}\n </Alert>\n )}\n {shouldShowBanner && (\n <Banner status=\"warning\" title={getBannerTitle()}>\n <Flex flexDirection=\"column\" gap={16} alignItems=\"flex-start\">\n <div>{t('banner.description')}</div>\n {getBannerContent()}\n <Button variant=\"secondary\" onClick={onStartWireTransfer}>\n {t('cta.startWireTransfer')}\n </Button>\n </Flex>\n </Banner>\n )}\n </Flex>\n )\n}\n"],"names":["ConfirmWireDetailsBanner","props","jsx","BaseComponent","Root","wireInId","companyId","dictionary","confirmationAlert","onStartWireTransfer","className","useComponentDictionary","useI18n","t","useTranslation","Alert","Banner","Button","UnorderedList","Text","useComponentContext","dateFormatter","useDateFormatter","isConfirmationAlertDismissed","setIsConfirmationAlertDismissed","useState","currencyFormatter","useNumberFormatter","useEffect","wireInRequestsData","useWireInRequestsListSuspense","payrollsData","usePayrollsListSuspense","activeWireInRequests","request","wireInRequests","payrolls","wireInRequestsWithPayrolls","wireInRequest","payroll","p","payrollRange","shouldShowBanner","shouldShowConfirmationAlert","formatDeadline","deadline","date","time","match","dateString","getBannerTitle","isSingleWireInRequest","getBannerContent","paymentType","requestedAmount","index","Flex","jsxs"],"mappings":"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"}

package/dist/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelectionPresentation.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import { useTranslation as f } from "react-i18next";
 import { Flex as o } from "../../../Common/Flex/Flex.js";
 import { ActionsLayout as g } from "../../../Common/ActionsLayout/ActionsLayout.js";
 import { useComponentContext as x } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as D } from "../../../../i18n/I18n.js";
 function S({
-  payPeriodOptions: t,
+  payPeriodOptions: n,
   selectedPeriodKey: r,
   onSelectPeriod: c,
   onSubmit: m,
@@ -13,20 +13,20 @@ function S({
   className: a
 }) {
   D("Payroll.Dismissal");
-  const { t: i } = f("Payroll.Dismissal"), { Heading: s, Text: p, Select: h, Button: u, Alert: d } = x();
-  return t.length === 0 ? /* @__PURE__ */ e("section", { className: a, children: /* @__PURE__ */ n(o, { flexDirection: "column", gap: 24, children: [
+  const { t: i } = f("Payroll.Dismissal"), { Heading: s, Text: p, Select: u, Button: h, Alert: d } = x();
+  return n.length === 0 ? /* @__PURE__ */ t(o, { className: a, flexDirection: "column", gap: 24, children: [
     /* @__PURE__ */ e(o, { flexDirection: "column", gap: 4, children: /* @__PURE__ */ e(s, { as: "h2", children: i("pageTitle") }) }),
     /* @__PURE__ */ e(d, { status: "info", label: i("emptyState") })
-  ] }) }) : /* @__PURE__ */ e("section", { className: a, children: /* @__PURE__ */ n(o, { flexDirection: "column", gap: 24, children: [
-    /* @__PURE__ */ n(o, { flexDirection: "column", gap: 4, children: [
+  ] }) : /* @__PURE__ */ t(o, { className: a, flexDirection: "column", gap: 24, children: [
+    /* @__PURE__ */ t(o, { flexDirection: "column", gap: 4, children: [
       /* @__PURE__ */ e(s, { as: "h2", children: i("pageTitle") }),
       /* @__PURE__ */ e(p, { variant: "supporting", children: i("pageDescription") })
     ] }),
     /* @__PURE__ */ e(
-      h,
+      u,
       {
         label: i("selectLabel"),
-        options: t,
+        options: n,
         value: r,
         onChange: c,
         placeholder: i("selectPlaceholder"),
@@ -34,7 +34,7 @@ function S({
       }
     ),
     /* @__PURE__ */ e(g, { children: /* @__PURE__ */ e(
-      u,
+      h,
       {
         variant: "primary",
         onClick: m,
@@ -43,7 +43,7 @@ function S({
         children: i("continueCta")
       }
     ) })
-  ] }) });
+  ] });
 }
 export {
   S as DismissalPayPeriodSelectionPresentation

package/dist/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelectionPresentation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DismissalPayPeriodSelectionPresentation.js","sources":["../../../../../src/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelectionPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Flex, ActionsLayout } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport type { SelectOption } from '@/components/Common/UI/Select/SelectTypes'\n\n/** @internal /\nexport interface DismissalPayPeriodSelectionPresentationProps {\n /* Pay period options to display in the select. /\n payPeriodOptions: SelectOption[]\n /* Key of the currently selected pay period option, or undefined when none is selected. /\n selectedPeriodKey: string \| undefined\n /* Called when the user selects a pay period from the options. /\n onSelectPeriod: (value: string) => void\n /* Called when the user clicks the continue button. /\n onSubmit: () => void\n /* Whether the submit action is in flight. /\n isPending: boolean\n /* CSS class name applied to the root element. /\n className?: string\n}\n\n/* @internal */\nexport function DismissalPayPeriodSelectionPresentation({\n payPeriodOptions,\n selectedPeriodKey,\n onSelectPeriod,\n onSubmit,\n isPending,\n className,\n}: DismissalPayPeriodSelectionPresentationProps) {\n useI18n('Payroll.Dismissal')\n const { t } = useTranslation('Payroll.Dismissal')\n const { Heading, Text, Select, Button, Alert } = useComponentContext()\n\n const hasNoPayPeriods = payPeriodOptions.length === 0\n\n if (hasNoPayPeriods) {\n return (\n <~~section~~ className={className}~~>\n <Flex~~ flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" gap={4}>\n <Heading as=\"h2\">{t('pageTitle')}</Heading>\n </Flex>\n <Alert status=\"info\" label={t('emptyState')} />\n </Flex>\n ~~</section>\n~~ )\n }\n\n return (\n <~~section~~ className={className}~~>\n <Flex~~ flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" gap={4}>\n <Heading as=\"h2\">{t('pageTitle')}</Heading>\n <Text variant=\"supporting\">{t('pageDescription')}</Text>\n </Flex>\n\n <Select\n label={t('selectLabel')}\n options={payPeriodOptions}\n value={selectedPeriodKey}\n onChange={onSelectPeriod}\n placeholder={t('selectPlaceholder')}\n isRequired\n />\n\n <ActionsLayout>\n <Button\n variant=\"primary\"\n onClick={onSubmit}\n isLoading={isPending}\n isDisabled={isPending \|\| selectedPeriodKey === undefined}\n >\n {t('continueCta')}\n </Button>\n </ActionsLayout>\n </Flex>\n ~~</section>\n~~ )\n}\n"],"names":["DismissalPayPeriodSelectionPresentation","payPeriodOptions","selectedPeriodKey","onSelectPeriod","onSubmit","isPending","className","useI18n","t","useTranslation","Heading","Text","Select","Button","Alert","useComponentContext","~~jsx~~","~~jsxs~~","~~Flex~~","ActionsLayout"],"mappings":";;;;;;AAuBO,SAASA,EAAwC;AAAA,EACtD,kBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,GAAiD;AAC/C,EAAAC,EAAQ,mBAAmB;AAC3B,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,mBAAmB,GAC1C,EAAE,SAAAC,GAAS,MAAAC,GAAM,QAAAC,GAAQ,QAAAC,GAAQ,OAAAC,EAAA,IAAUC,EAAA;AAIjD,SAFwBd,EAAiB,WAAW,~~IAIhD~~,~~gBAAAe~~,~~EAAC~~,~~aAAQ,~~WAAAV,~~GACP~~,~~UAAA,gBAAAW,EAACC,KAAK,~~eAAc,UAAS,KAAK,~~IAChC~~,UAAA;AAAA,IAAA,~~gBAAAF~~,~~EAACE~~,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA,~~gBAAAF~~,~~EAACN~~,GAAA,EAAQ,IAAG,MAAM,UAAAF,EAAE,WAAW,EAAA,CAAE,GACnC;AAAA,sBACCM,GAAA,EAAM,QAAO,QAAO,OAAON,EAAE,YAAY,EAAA,CAAG;AAAA,EAAA,~~EAAA,CAC~~/C,~~EAAA~~,~~CACF~~,~~IAKF~~,~~gBAAAQ,EAAC,aAAQ,~~WAAAV,~~GACP~~,~~UAAA,gBAAAW,EAACC,KAAK,~~eAAc,UAAS,KAAK,~~IAChC~~,UAAA;AAAA,IAAA,~~gBAAAD~~,~~EAACC~~,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,~~gBAAAF~~,~~EAACN~~,GAAA,EAAQ,IAAG,MAAM,UAAAF,EAAE,WAAW,GAAE;AAAA,wBAChCG,GAAA,EAAK,SAAQ,cAAc,UAAAH,EAAE,iBAAiB,EAAA,CAAE;AAAA,IAAA,GACnD;AAAA,IAEA,~~gBAAAQ~~;AAAA,~~MAACJ~~;AAAA,MAAA;AAAA,QACC,OAAOJ,EAAE,aAAa;AAAA,QACtB,SAASP;AAAA,QACT,OAAOC;AAAA,QACP,UAAUC;AAAA,QACV,aAAaK,EAAE,mBAAmB;AAAA,QAClC,YAAU;AAAA,MAAA;AAAA,IAAA;AAAA,sBAGXW,GAAA,EACC,UAAA,~~gBAAAH~~;AAAA,~~MAACH~~;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,SAAST;AAAA,QACT,WAAWC;AAAA,QACX,YAAYA,KAAaH,MAAsB;AAAA,QAE9C,YAAE,aAAa;AAAA,MAAA;AAAA,IAAA,EAClB,CACF;AAAA,EAAA,~~EAAA,CACF,EAAA,CACF~~;AAEJ;"}
1	+ {"version":3,"file":"DismissalPayPeriodSelectionPresentation.js","sources":["../../../../../src/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelectionPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Flex, ActionsLayout } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport type { SelectOption } from '@/components/Common/UI/Select/SelectTypes'\n\n/** @internal /\nexport interface DismissalPayPeriodSelectionPresentationProps {\n /* Pay period options to display in the select. /\n payPeriodOptions: SelectOption[]\n /* Key of the currently selected pay period option, or undefined when none is selected. /\n selectedPeriodKey: string \| undefined\n /* Called when the user selects a pay period from the options. /\n onSelectPeriod: (value: string) => void\n /* Called when the user clicks the continue button. /\n onSubmit: () => void\n /* Whether the submit action is in flight. /\n isPending: boolean\n /* CSS class name applied to the root element. /\n className?: string\n}\n\n/* @internal */\nexport function DismissalPayPeriodSelectionPresentation({\n payPeriodOptions,\n selectedPeriodKey,\n onSelectPeriod,\n onSubmit,\n isPending,\n className,\n}: DismissalPayPeriodSelectionPresentationProps) {\n useI18n('Payroll.Dismissal')\n const { t } = useTranslation('Payroll.Dismissal')\n const { Heading, Text, Select, Button, Alert } = useComponentContext()\n\n const hasNoPayPeriods = payPeriodOptions.length === 0\n\n if (hasNoPayPeriods) {\n return (\n <Flex className={className} flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" gap={4}>\n <Heading as=\"h2\">{t('pageTitle')}</Heading>\n </Flex>\n <Alert status=\"info\" label={t('emptyState')} />\n </Flex>\n )\n }\n\n return (\n <Flex className={className} flexDirection=\"column\" gap={24}>\n <Flex flexDirection=\"column\" gap={4}>\n <Heading as=\"h2\">{t('pageTitle')}</Heading>\n <Text variant=\"supporting\">{t('pageDescription')}</Text>\n </Flex>\n\n <Select\n label={t('selectLabel')}\n options={payPeriodOptions}\n value={selectedPeriodKey}\n onChange={onSelectPeriod}\n placeholder={t('selectPlaceholder')}\n isRequired\n />\n\n <ActionsLayout>\n <Button\n variant=\"primary\"\n onClick={onSubmit}\n isLoading={isPending}\n isDisabled={isPending \|\| selectedPeriodKey === undefined}\n >\n {t('continueCta')}\n </Button>\n </ActionsLayout>\n </Flex>\n )\n}\n"],"names":["DismissalPayPeriodSelectionPresentation","payPeriodOptions","selectedPeriodKey","onSelectPeriod","onSubmit","isPending","className","useI18n","t","useTranslation","Heading","Text","Select","Button","Alert","useComponentContext","Flex","jsx","jsxs","ActionsLayout"],"mappings":";;;;;;AAuBO,SAASA,EAAwC;AAAA,EACtD,kBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,GAAiD;AAC/C,EAAAC,EAAQ,mBAAmB;AAC3B,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,mBAAmB,GAC1C,EAAE,SAAAC,GAAS,MAAAC,GAAM,QAAAC,GAAQ,QAAAC,GAAQ,OAAAC,EAAA,IAAUC,EAAA;AAIjD,SAFwBd,EAAiB,WAAW,sBAI/Ce,GAAA,EAAK,WAAAV,GAAsB,eAAc,UAAS,KAAK,IACtD,UAAA;AAAA,IAAA,gBAAAW,EAACD,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA,gBAAAC,EAACP,GAAA,EAAQ,IAAG,MAAM,UAAAF,EAAE,WAAW,EAAA,CAAE,GACnC;AAAA,sBACCM,GAAA,EAAM,QAAO,QAAO,OAAON,EAAE,YAAY,EAAA,CAAG;AAAA,EAAA,GAC/C,sBAKDQ,GAAA,EAAK,WAAAV,GAAsB,eAAc,UAAS,KAAK,IACtD,UAAA;AAAA,IAAA,gBAAAY,EAACF,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAC,EAACP,GAAA,EAAQ,IAAG,MAAM,UAAAF,EAAE,WAAW,GAAE;AAAA,wBAChCG,GAAA,EAAK,SAAQ,cAAc,UAAAH,EAAE,iBAAiB,EAAA,CAAE;AAAA,IAAA,GACnD;AAAA,IAEA,gBAAAS;AAAA,MAACL;AAAA,MAAA;AAAA,QACC,OAAOJ,EAAE,aAAa;AAAA,QACtB,SAASP;AAAA,QACT,OAAOC;AAAA,QACP,UAAUC;AAAA,QACV,aAAaK,EAAE,mBAAmB;AAAA,QAClC,YAAU;AAAA,MAAA;AAAA,IAAA;AAAA,sBAGXW,GAAA,EACC,UAAA,gBAAAF;AAAA,MAACJ;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,SAAST;AAAA,QACT,WAAWC;AAAA,QACX,YAAYA,KAAaH,MAAsB;AAAA,QAE9C,YAAE,aAAa;AAAA,MAAA;AAAA,IAAA,EAClB,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/Payroll/GrossUpModal/GrossUpModal.js CHANGED Viewed

@@ -1,115 +1,119 @@
-import { jsx as e, jsxs as t, Fragment as I } from "react/jsx-runtime";
-import { useRef as R, useState as o, useEffect as S } from "react";
-import { useForm as U, FormProvider as j } from "react-hook-form";
-import { useTranslation as k } from "react-i18next";
-import { z as P } from "zod";
-import { zodResolver as z } from "@hookform/resolvers/zod";
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { useRef as F, useState as o, useEffect as G } from "react";
+import { useForm as R, FormProvider as U } from "react-hook-form";
+import { useTranslation as z } from "react-i18next";
+import { z as w } from "zod";
+import { zodResolver as H } from "@hookform/resolvers/zod";
 import a from "./GrossUpModal.module.scss.js";
-import { Flex as B } from "../../Common/Flex/Flex.js";
-import { ActionsLayout as D } from "../../Common/ActionsLayout/ActionsLayout.js";
+import { Flex as j } from "../../Common/Flex/Flex.js";
+import { ActionsLayout as k } from "../../Common/ActionsLayout/ActionsLayout.js";
 import "react-error-boundary";
 import "@tanstack/react-query";
-import { useBase as H } from "../../Base/useBase.js";
+import { useBase as B } from "../../Base/useBase.js";
 import "@gusto/embedded-api/models/errors/apierror";
 import "@gusto/embedded-api/models/errors/gustoembeddederror";
 import "@gusto/embedded-api/models/errors/sdkvalidationerror";
 import "@gusto/embedded-api/models/errors/unprocessableentityerror";
 import "@gusto/embedded-api/models/errors/httpclienterrors";
-import { formatNumberAsCurrency as L } from "../../../helpers/formattedStrings.js";
+import { formatNumberAsCurrency as D } from "../../../helpers/formattedStrings.js";
 import "../../../shared/constants.js";
-import { useComponentContext as V } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as E } from "../../../i18n/I18n.js";
-import { NumberInputField as T } from "../../Common/Fields/NumberInputField/NumberInputField.js";
-const q = P.object({
-  netPay: P.number().positive()
+import { useComponentContext as L } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import "../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
+import { useI18n as V } from "../../../i18n/I18n.js";
+import { NumberInputField as E } from "../../Common/Fields/NumberInputField/NumberInputField.js";
+const T = w.object({
+  netPay: w.number().positive()
 });
-function pe({ isOpen: n, onCalculateGrossUp: w, onApply: A, onCancel: d }) {
-  E("Payroll.GrossUpModal");
-  const { t: r } = k("Payroll.GrossUpModal"), { Modal: M, Heading: u, Text: p, Button: i, Alert: f } = V(), { baseSubmitHandler: y } = H(), N = R(null), [l, c] = o(null), [h, m] = o(null), [g, b] = o(!1), [x, v] = o(!1), s = U({
-    resolver: z(q),
-    defaultValues: { netPay: 0 }
+function ue({ isOpen: n, onCalculateGrossUp: P, onApply: x, onCancel: p }) {
+  V("Payroll.GrossUpModal");
+  const { t: r } = z("Payroll.GrossUpModal"), { Modal: A, Heading: u, Text: i, Button: c, Alert: f } = L(), { baseSubmitHandler: y } = B(), M = F(null), [l, m] = o(null), [h, d] = o(null), [g, b] = o(!1), [N, v] = o(!1), s = R({
+    resolver: H(T),
+    // Start blank rather than 0: 0 is not a valid net amount, and a leading 0
+    // in the field means typing an amount produces values like "0350".
+    defaultValues: {}
   });
-  S(() => {
-    n || (s.reset({ netPay: 0 }), c(null), m(null));
+  G(() => {
+    n || (s.reset(), m(null), d(null));
   }, [n, s.reset]);
-  const F = async (G) => {
-    m(null), c(null), b(!0), await y(null, async () => {
+  const I = async (S) => {
+    d(null), m(null), b(!0), await y(null, async () => {
       try {
-        const C = await w(G.netPay);
-        C ? c(C) : m(r("errorMessage"));
+        const C = await P(S.netPay);
+        C ? m(C) : d(r("errorMessage"));
       } finally {
         b(!1);
       }
     });
   };
   return /* @__PURE__ */ e(
-    M,
+    A,
     {
       isOpen: n,
-      onClose: d,
-      containerRef: N,
-      footer: /* @__PURE__ */ t(D, { children: [
+      onClose: p,
+      containerRef: M,
+      footer: /* @__PURE__ */ t(k, { children: [
         /* @__PURE__ */ e(
-          i,
+          c,
           {
             variant: "primary",
             isDisabled: !l,
             onClick: async () => {
               l && (v(!0), await y(null, async () => {
                 try {
-                  await A(l);
+                  await x(l);
                 } finally {
                   v(!1);
                 }
               }));
             },
-            isLoading: x,
+            isLoading: N,
             children: r("applyCta")
           }
         ),
-        /* @__PURE__ */ e(i, { variant: "secondary", onClick: d, children: r("cancelCta") })
+        /* @__PURE__ */ e(c, { variant: "secondary", onClick: p, children: r("cancelCta") })
       ] }),
-      children: /* @__PURE__ */ t(j, { ...s, children: [
+      children: /* @__PURE__ */ t(U, { ...s, children: [
         /* @__PURE__ */ t("div", { className: a.header, children: [
           /* @__PURE__ */ e(u, { as: "h2", styledAs: "h3", children: r("title") }),
-          /* @__PURE__ */ e(p, { variant: "supporting", as: "p", children: r("description") })
+          /* @__PURE__ */ e(i, { variant: "supporting", as: "p", children: r("description") })
         ] }),
         /* @__PURE__ */ t("div", { className: a.content, children: [
           h && /* @__PURE__ */ e("div", { className: a.alert, children: /* @__PURE__ */ e(f, { label: h, status: "error", disableScrollIntoView: !0 }) }),
           /* @__PURE__ */ e("div", { className: a.alert, children: /* @__PURE__ */ e(f, { label: r("warning"), status: "warning", disableScrollIntoView: !0 }) }),
-          /* @__PURE__ */ t(B, { flexDirection: "row", gap: 8, children: [
+          /* @__PURE__ */ t(j, { flexDirection: "row", gap: 8, alignItems: "flex-end", children: [
             /* @__PURE__ */ e(
-              T,
+              E,
               {
                 name: "netPay",
                 label: r("netPayLabel"),
                 format: "currency",
+                adornmentStart: "$",
                 errorMessage: r("validations.netPay"),
                 min: 0,
                 isRequired: !0
               }
             ),
             /* @__PURE__ */ e(
-              i,
+              c,
               {
                 variant: "secondary",
                 className: a.calculateButton,
                 isDisabled: g,
-                onClick: s.handleSubmit(F),
+                onClick: s.handleSubmit(I),
                 children: r(g ? "calculatingCta" : "calculateCta")
               }
             )
           ] }),
-          l && /* @__PURE__ */ e(I, { children: /* @__PURE__ */ t("div", { className: a.result, children: [
-            /* @__PURE__ */ e(p, { size: "sm", variant: "supporting", weight: "semibold", children: r("grossPayResult") }),
-            /* @__PURE__ */ e(u, { as: "h3", children: L(parseFloat(l)) })
-          ] }) })
+          l ? /* @__PURE__ */ t("div", { className: a.result, children: [
+            /* @__PURE__ */ e(i, { size: "sm", variant: "supporting", weight: "semibold", children: r("grossPayResult") }),
+            /* @__PURE__ */ e(u, { as: "h3", children: D(parseFloat(l)) })
+          ] }) : /* @__PURE__ */ e(i, { size: "sm", variant: "supporting", children: r("applyHint") })
         ] })
       ] })
     }
   );
 }
 export {
-  pe as GrossUpModal
+  ue as GrossUpModal
 };
 //# sourceMappingURL=GrossUpModal.js.map