@gusto/embedded-react-sdk 0.24.1 → 0.26.0

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

@@ -1,96 +1,106 @@
-import { jsx as r, jsxs as h } from "react/jsx-runtime";
-import { useTranslation as T } from "react-i18next";
-import { useWireInRequestsListSuspense as v } from "@gusto/embedded-api/react-query/wireInRequestsList";
-import { usePayrollsListSuspense as M } from "@gusto/embedded-api/react-query/payrollsList";
-import { useState as F, useEffect as Z } from "react";
-import { BaseComponent as _ } from "../../../Base/Base.js";
+import { jsx as n, jsxs as h } from "react/jsx-runtime";
+import { useTranslation as v } from "react-i18next";
+import { useWireInRequestsListSuspense as M } from "@gusto/embedded-api/react-query/wireInRequestsList";
+import { usePayrollsListSuspense as N } from "@gusto/embedded-api/react-query/payrollsList";
+import { useState as Z, useEffect as _ } from "react";
+import { BaseComponent as j } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
-import { useComponentContext as j } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useComponentDictionary as k, useI18n as E } from "../../../../i18n/I18n.js";
+import { useComponentContext as k } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentDictionary as E, useI18n as G } from "../../../../i18n/I18n.js";
 import { Flex as g } from "../../../Common/Flex/Flex.js";
-import { useDateFormatter as N } from "../../../../hooks/useDateFormatter.js";
-function te(i) {
-  return /* @__PURE__ */ r(_, { ...i, children: /* @__PURE__ */ r(z, { ...i, children: i.children }) });
+import { useDateFormatter as z } from "../../../../hooks/useDateFormatter.js";
+import H from "../../../../hooks/useNumberFormatter.js";
+function ie(i) {
+  return /* @__PURE__ */ n(j, { ...i, children: /* @__PURE__ */ n(J, { ...i, children: i.children }) });
 }
-const z = ({
+const J = ({
   wireInId: i,
   companyId: u,
-  dictionary: y,
-  confirmationAlert: o,
-  onStartWireTransfer: D
+  dictionary: D,
+  confirmationAlert: l,
+  onStartWireTransfer: C
 }) => {
-  k("Payroll.ConfirmWireDetailsBanner", y), E("Payroll.ConfirmWireDetailsBanner");
-  const { t: s } = T("Payroll.ConfirmWireDetailsBanner"), { Alert: R, Banner: w, Button: C, UnorderedList: P, Text: S } = j(), L = N(), [W, c] = F(!1);
-  Z(() => {
-    o && c(!1);
-  }, [o]);
-  const { data: x } = v({
+  E("Payroll.ConfirmWireDetailsBanner", D), G("Payroll.ConfirmWireDetailsBanner");
+  const { t: s } = v("Payroll.ConfirmWireDetailsBanner"), { Alert: P, Banner: L, Button: R, UnorderedList: b, Text: c } = k(), q = z(), [w, d] = Z(!1), S = H("currency");
+  _(() => {
+    l && d(!1);
+  }, [l]);
+  const { data: B } = M({
     companyUuid: u
-  }), { data: B } = M({
+  }), { data: W } = N({
     companyId: u,
     processed: !0
-  }), d = (x.wireInRequestList || []).filter(
-    (t) => t.status === "awaiting_funds"
-  ), q = i ? d.filter((t) => t.uuid === i) : d, I = B.payrollList || [], n = q.map((t) => {
-    const e = I.find((a) => a.payrollUuid === t.paymentUuid), l = e?.payPeriod ? L.formatPayPeriodRange(e.payPeriod.startDate, e.payPeriod.endDate) : "";
+  }), p = (B.wireInRequestList || []).filter(
+    (e) => e.status === "awaiting_funds"
+  ), x = i ? p.filter((e) => e.uuid === i) : p, A = W.payrollList || [], r = x.map((e) => {
+    const t = A.find((o) => o.payrollUuid === e.paymentUuid), a = t?.payPeriod ? q.formatPayPeriodRange(t.payPeriod.startDate, t.payPeriod.endDate) : "";
     return {
-      wireInRequest: t,
-      payroll: e,
-      payrollRange: l
+      wireInRequest: e,
+      payroll: t,
+      payrollRange: a,
+      paymentType: e.paymentType,
+      requestedAmount: e.requestedAmount ?? ""
     };
-  }), f = n.length > 0 && (n.length > 1 || n[0]?.wireInRequest), p = !W && o;
-  if (!f && !p)
+  }), f = r.length > 0 && (r.length > 1 || r[0]?.wireInRequest), y = !w && l;
+  if (!f && !y)
     return null;
-  const U = (t) => {
-    const e = new Date(t), a = e.toLocaleTimeString("en-US", {
+  const T = (e) => {
+    const t = new Date(e), o = t.toLocaleTimeString("en-US", {
       hour: "numeric",
-      minute: e.getMinutes() === 0 ? void 0 : "2-digit",
+      minute: t.getMinutes() === 0 ? void 0 : "2-digit",
       hour12: !0,
       timeZone: "America/Los_Angeles",
       timeZoneName: "short"
-    }).replace(/\s?(AM|PM)/i, (A) => A.trim().toLowerCase()), m = e.toLocaleDateString("en-US", {
+    }).replace(/\s?(AM|PM)/i, (F) => F.trim().toLowerCase()), m = t.toLocaleDateString("en-US", {
       month: "long",
       day: "numeric",
       year: "numeric",
       timeZone: "America/Los_Angeles"
     });
-    return { time: a, date: m };
-  }, b = () => {
-    const t = n.length === 1, { wireInRequest: e, payrollRange: l } = n[0] || {};
-    if (t) {
-      if (i && e?.wireInDeadline) {
-        const { time: a, date: m } = U(e.wireInDeadline);
-        return s("banner.title", { time: a, date: m });
+    return { time: o, date: m };
+  }, I = () => {
+    const e = r.length === 1, { wireInRequest: t, payrollRange: a } = r[0] || {};
+    if (e) {
+      if (i && t?.wireInDeadline) {
+        const { time: o, date: m } = T(t.wireInDeadline);
+        return s("banner.title", { time: o, date: m });
       }
-      return s("banner.titleWithPayroll", { payrollRange: l });
+      return s("banner.titleWithPayroll", { payrollRange: a });
     }
-    return s("banner.titleMultiple", { count: n.length });
+    return s("banner.titleMultiple", { count: r.length });
+  }, U = () => {
+    if (r.length > 1)
+      return /* @__PURE__ */ n(
+        b,
+        {
+          items: r.map(
+            ({ paymentType: e, payrollRange: t, requestedAmount: a }, o) => e === "Payroll" ? /* @__PURE__ */ n(c, { children: s("banner.requestLabelPayroll", { payrollRange: t }) }, o) : /* @__PURE__ */ n(c, { children: s("banner.requestLabelContractorPaymentGroup", {
+              requestedAmount: S(Number(a))
+            }) }, o)
+          )
+        }
+      );
   };
   return /* @__PURE__ */ h(g, { flexDirection: "column", gap: 16, children: [
-    p && /* @__PURE__ */ r(
-      R,
+    y && /* @__PURE__ */ n(
+      P,
       {
         status: "success",
-        label: o.title,
+        label: l.title,
         onDismiss: () => {
-          c(!0);
+          d(!0);
         },
-        children: o.content
+        children: l.content
       }
     ),
-    f && /* @__PURE__ */ r(w, { status: "warning", title: b(), children: /* @__PURE__ */ h(g, { flexDirection: "column", gap: 16, alignItems: "flex-start", children: [
-      /* @__PURE__ */ r("div", { children: s("banner.description") }),
-      n.length > 1 && /* @__PURE__ */ r(
-        P,
-        {
-          items: n.map(({ payrollRange: t }, e) => /* @__PURE__ */ r(S, { children: t }, e))
-        }
-      ),
-      /* @__PURE__ */ r(C, { variant: "secondary", onClick: D, children: s("cta.startWireTransfer") })
+    f && /* @__PURE__ */ n(L, { status: "warning", title: I(), children: /* @__PURE__ */ h(g, { flexDirection: "column", gap: 16, alignItems: "flex-start", children: [
+      /* @__PURE__ */ n("div", { children: s("banner.description") }),
+      U(),
+      /* @__PURE__ */ n(R, { variant: "secondary", onClick: C, children: s("cta.startWireTransfer") })
     ] }) })
   ] });
 };
 export {
-  te as ConfirmWireDetailsBanner
+  ie as ConfirmWireDetailsBanner
 };
 //# sourceMappingURL=ConfirmWireDetailsBanner.js.map

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

@@ -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'\n\ninterface ConfirmWireDetailsBannerProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsBanner'> {\n  wireInId?: string\n  companyId: string\n  confirmationAlert?: ConfirmationAlert\n  onStartWireTransfer: () => void\n}\n\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}: 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<boolean>(false)\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    }\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  return (\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            {wireInRequestsWithPayrolls.length > 1 && (\n              <UnorderedList\n                items={wireInRequestsWithPayrolls.map(({ payrollRange }, index) => (\n                  <Text key={index}>{payrollRange}</Text>\n                ))}\n              />\n            )}\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","useComponentDictionary","useI18n","t","useTranslation","Alert","Banner","Button","UnorderedList","Text","useComponentContext","dateFormatter","useDateFormatter","isConfirmationAlertDismissed","setIsConfirmationAlertDismissed","useState","useEffect","wireInRequestsData","useWireInRequestsListSuspense","payrollsData","usePayrollsListSuspense","activeWireInRequests","request","wireInRequests","payrolls","wireInRequestsWithPayrolls","wireInRequest","payroll","p","payrollRange","shouldShowBanner","shouldShowConfirmationAlert","formatDeadline","deadline","date","time","match","dateString","getBannerTitle","isSingleWireInRequest","jsxs","Flex","index"],"mappings":"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"}
+{"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\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}: 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<boolean>(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 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","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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"}

package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.js

@@ -15,7 +15,6 @@ import { useComponentContext as S } from "../../../../contexts/ComponentAdapter/
 import { useComponentDictionary as z, useI18n as g } from "../../../../i18n/I18n.js";
 import { Flex as p, FlexItem as f } from "../../../Common/Flex/Flex.js";
 import { payrollWireEvents as N } from "../../../../shared/constants.js";
-import "classnames";
 import "react";
 import { TextAreaField as V } from "../../../Common/Fields/TextAreaField/TextAreaField.js";
 import { useDateFormatter as J } from "../../../../hooks/useDateFormatter.js";

package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmWireDetailsForm.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport z from 'zod'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useIsMutating } from '@tanstack/react-query'\nimport {\n  useWireInRequestsSubmitMutation,\n  mutationKeyWireInRequestsSubmit,\n} from '@gusto/embedded-api/react-query/wireInRequestsSubmit'\nimport { useWireInRequestsGetSuspense } from '@gusto/embedded-api/react-query/wireInRequestsGet'\nimport type { PutWireInRequestsWireInRequestUuidRequest } from '@gusto/embedded-api/models/operations/putwireinrequestswireinrequestuuid'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport styles from './ConfirmWireDetailsForm.module.scss'\nimport { Form as HtmlForm } from '@/components/Common/Form'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { Flex, FlexItem } from '@/components/Common/Flex/Flex'\nimport { payrollWireEvents, type EventType } from '@/shared/constants'\nimport { DatePickerField, NumberInputField, TextInputField } from '@/components/Common'\nimport { TextAreaField } from '@/components/Common/Fields/TextAreaField'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface ConfirmWireDetailsFormProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsForm'> {\n  wireInId: string\n  companyId: string\n  modalContainerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport const ConfirmWireDetailsFormSchema = z.object({\n  amountSent: z.number().positive(),\n  dateSent: z.date(),\n  bankName: z.string().nonempty(),\n  additionalNotes: z.string().optional(),\n})\n\nexport type ConfirmWireDetailsFormValues = z.infer<typeof ConfirmWireDetailsFormSchema>\n\nconst CONFIRM_WIRE_FORM_ID = 'confirm-wire-details-form'\n\nconst transformFormDataToPayload = (\n  data: ConfirmWireDetailsFormValues,\n): PutWireInRequestsWireInRequestUuidRequest['requestBody'] => {\n  return {\n    amountSent: String(data.amountSent),\n    dateSent: data.dateSent.toISOString().split('T')[0] || '',\n    bankName: data.bankName,\n    additionalNotes: data.additionalNotes || undefined,\n  }\n}\n\nexport function ConfirmWireDetailsForm(props: ConfirmWireDetailsFormProps) {\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  modalContainerRef,\n}: ConfirmWireDetailsFormProps) => {\n  useComponentDictionary('Payroll.ConfirmWireDetailsForm', dictionary)\n  useI18n('Payroll.ConfirmWireDetailsForm')\n  const { onEvent, baseSubmitHandler } = useBase()\n  const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n  const { Heading, Text } = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const { data } = useWireInRequestsGetSuspense({\n    wireInRequestUuid: wireInId,\n  })\n  const wireInRequest = data.wireInRequest\n\n  const { data: payrollsData } = usePayrollsListSuspense({\n    companyId,\n    processed: true,\n  })\n\n  const payrollData = payrollsData.payrollList?.find(\n    payroll => payroll.payrollUuid === wireInRequest?.paymentUuid,\n  )\n  const payPeriod = payrollData?.payPeriod\n  const payPeriodRange =\n    payPeriod?.startDate && payPeriod.endDate\n      ? dateFormatter.formatPayPeriodRange(payPeriod.startDate, payPeriod.endDate)\n      : undefined\n\n  const checkDate = payrollData\n    ? dateFormatter.formatShortWithYear(payrollData.checkDate)\n    : undefined\n\n  const formHandlers = useForm<ConfirmWireDetailsFormValues>({\n    resolver: zodResolver(ConfirmWireDetailsFormSchema),\n    defaultValues: {\n      bankName: '',\n    },\n  })\n\n  const { mutateAsync: submitWireInRequest } = useWireInRequestsSubmitMutation()\n\n  const onSubmit = async (data: ConfirmWireDetailsFormValues) => {\n    await baseSubmitHandler(data, async innerData => {\n      const payload = transformFormDataToPayload(innerData)\n      const response = await submitWireInRequest({\n        request: {\n          wireInRequestUuid: wireInId,\n          requestBody: payload,\n        },\n      })\n      onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_DONE, {\n        wireInRequest: response.wireInRequest,\n        confirmationAlert: {\n          title: payPeriodRange\n            ? t('confirmationAlert.title', { payrollRange: payPeriodRange })\n            : t('confirmationAlert.emptyTitle'),\n          content: checkDate ? (\n            <Text>{t('confirmationAlert.content', { checkDate })}</Text>\n          ) : undefined,\n        },\n      })\n    })\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <FlexItem>\n        <Heading as=\"h2\">\n          <Trans i18nKey=\"title\" t={t} values={{ payrollRange: payPeriodRange }} />\n        </Heading>\n        <Text>{t('description')}</Text>\n      </FlexItem>\n\n      <FormProvider {...formHandlers}>\n        <HtmlForm\n          id={CONFIRM_WIRE_FORM_ID}\n          onSubmit={formHandlers.handleSubmit(onSubmit)}\n          className={styles.form}\n        >\n          <Flex flexDirection=\"column\" gap={20}>\n            <NumberInputField\n              name=\"amountSent\"\n              label={t('amountLabel')}\n              isRequired\n              format=\"currency\"\n              errorMessage={t('validations.amount')}\n            />\n            <DatePickerField\n              name=\"dateSent\"\n              label={t('dateLabel')}\n              isRequired\n              errorMessage={t('validations.date')}\n              portalContainer={modalContainerRef?.current || undefined}\n            />\n            <TextInputField\n              name=\"bankName\"\n              label={t('bankNameLabel')}\n              isRequired\n              description={t('bankNameDescription')}\n              placeholder={t('bankNamePlaceholder')}\n              errorMessage={t('validations.bankName')}\n            />\n            <TextAreaField name=\"additionalNotes\" label={t('notesLabel')} rows={3} />\n          </Flex>\n        </HtmlForm>\n      </FormProvider>\n    </Flex>\n  )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n  useI18n('Payroll.ConfirmWireDetailsForm')\n  const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n  const { Button } = useComponentContext()\n  const isMutating = useIsMutating({\n    mutationKey: mutationKeyWireInRequestsSubmit(),\n  })\n  const isPending = isMutating > 0\n\n  return (\n    <Flex gap={12} justifyContent=\"space-evenly\">\n      <FlexItem flexGrow={1}>\n        <Button\n          variant=\"secondary\"\n          onClick={() => {\n            onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_CANCEL)\n          }}\n          isDisabled={isPending}\n          className={styles.button}\n        >\n          {t('cancelCta')}\n        </Button>\n      </FlexItem>\n      <FlexItem flexGrow={1}>\n        <Button\n          variant=\"primary\"\n          type=\"submit\"\n          form={CONFIRM_WIRE_FORM_ID}\n          isLoading={isPending}\n          className={styles.button}\n        >\n          {t('submitCta')}\n        </Button>\n      </FlexItem>\n    </Flex>\n  )\n}\nConfirmWireDetailsForm.Footer = Footer\n"],"names":["ConfirmWireDetailsFormSchema","z","CONFIRM_WIRE_FORM_ID","transformFormDataToPayload","data","ConfirmWireDetailsForm","props","jsx","BaseComponent","Root","wireInId","companyId","dictionary","modalContainerRef","useComponentDictionary","useI18n","onEvent","baseSubmitHandler","useBase","useTranslation","Heading","Text","useComponentContext","dateFormatter","useDateFormatter","useWireInRequestsGetSuspense","wireInRequest","payrollsData","usePayrollsListSuspense","payrollData","payroll","payPeriod","payPeriodRange","checkDate","formHandlers","useForm","zodResolver","submitWireInRequest","useWireInRequestsSubmitMutation","onSubmit","innerData","payload","response","payrollWireEvents","jsxs","Flex","FlexItem","Trans","FormProvider","HtmlForm","styles","NumberInputField","DatePickerField","TextInputField","TextAreaField","Footer","t","Button","isPending","useIsMutating","mutationKeyWireInRequestsSubmit"],"mappings":"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"}
+{"version":3,"file":"ConfirmWireDetailsForm.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport z from 'zod'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useIsMutating } from '@tanstack/react-query'\nimport {\n  useWireInRequestsSubmitMutation,\n  mutationKeyWireInRequestsSubmit,\n} from '@gusto/embedded-api/react-query/wireInRequestsSubmit'\nimport { useWireInRequestsGetSuspense } from '@gusto/embedded-api/react-query/wireInRequestsGet'\nimport type { PutWireInRequestsWireInRequestUuidRequest } from '@gusto/embedded-api/models/operations/putwireinrequestswireinrequestuuid'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport styles from './ConfirmWireDetailsForm.module.scss'\nimport { Form as HtmlForm } from '@/components/Common/Form'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { Flex, FlexItem } from '@/components/Common/Flex/Flex'\nimport { payrollWireEvents, type EventType } from '@/shared/constants'\nimport { DatePickerField, NumberInputField, TextInputField } from '@/components/Common'\nimport { TextAreaField } from '@/components/Common/Fields/TextAreaField'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface ConfirmWireDetailsFormProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsForm'> {\n  wireInId: string\n  companyId: string\n  modalContainerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport const ConfirmWireDetailsFormSchema = z.object({\n  amountSent: z.number().positive(),\n  dateSent: z.date(),\n  bankName: z.string().nonempty(),\n  additionalNotes: z.string().optional(),\n})\n\nexport type ConfirmWireDetailsFormValues = z.infer<typeof ConfirmWireDetailsFormSchema>\n\nconst CONFIRM_WIRE_FORM_ID = 'confirm-wire-details-form'\n\nconst transformFormDataToPayload = (\n  data: ConfirmWireDetailsFormValues,\n): PutWireInRequestsWireInRequestUuidRequest['requestBody'] => {\n  return {\n    amountSent: String(data.amountSent),\n    dateSent: data.dateSent.toISOString().split('T')[0] || '',\n    bankName: data.bankName,\n    additionalNotes: data.additionalNotes || undefined,\n  }\n}\n\nexport function ConfirmWireDetailsForm(props: ConfirmWireDetailsFormProps) {\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  modalContainerRef,\n}: ConfirmWireDetailsFormProps) => {\n  useComponentDictionary('Payroll.ConfirmWireDetailsForm', dictionary)\n  useI18n('Payroll.ConfirmWireDetailsForm')\n  const { onEvent, baseSubmitHandler } = useBase()\n  const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n  const { Heading, Text } = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const { data } = useWireInRequestsGetSuspense({\n    wireInRequestUuid: wireInId,\n  })\n  const wireInRequest = data.wireInRequest\n\n  const { data: payrollsData } = usePayrollsListSuspense({\n    companyId,\n    processed: true,\n  })\n\n  const payrollData = payrollsData.payrollList?.find(\n    payroll => payroll.payrollUuid === wireInRequest?.paymentUuid,\n  )\n  const payPeriod = payrollData?.payPeriod\n  const payPeriodRange =\n    payPeriod?.startDate && payPeriod.endDate\n      ? dateFormatter.formatPayPeriodRange(payPeriod.startDate, payPeriod.endDate)\n      : undefined\n\n  const checkDate = payrollData\n    ? dateFormatter.formatShortWithYear(payrollData.checkDate)\n    : undefined\n\n  const formHandlers = useForm<ConfirmWireDetailsFormValues>({\n    resolver: zodResolver(ConfirmWireDetailsFormSchema),\n    defaultValues: {\n      bankName: '',\n    },\n  })\n\n  const { mutateAsync: submitWireInRequest } = useWireInRequestsSubmitMutation()\n\n  const onSubmit = async (data: ConfirmWireDetailsFormValues) => {\n    await baseSubmitHandler(data, async innerData => {\n      const payload = transformFormDataToPayload(innerData)\n      const response = await submitWireInRequest({\n        request: {\n          wireInRequestUuid: wireInId,\n          requestBody: payload,\n        },\n      })\n      onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_DONE, {\n        wireInRequest: response.wireInRequest,\n        confirmationAlert: {\n          title: payPeriodRange\n            ? t('confirmationAlert.title', { payrollRange: payPeriodRange })\n            : t('confirmationAlert.emptyTitle'),\n          content: checkDate ? (\n            <Text>{t('confirmationAlert.content', { checkDate })}</Text>\n          ) : undefined,\n        },\n      })\n    })\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <FlexItem>\n        <Heading as=\"h2\">\n          <Trans i18nKey=\"title\" t={t} values={{ payrollRange: payPeriodRange }} />\n        </Heading>\n        <Text>{t('description')}</Text>\n      </FlexItem>\n\n      <FormProvider {...formHandlers}>\n        <HtmlForm\n          id={CONFIRM_WIRE_FORM_ID}\n          onSubmit={formHandlers.handleSubmit(onSubmit)}\n          className={styles.form}\n        >\n          <Flex flexDirection=\"column\" gap={20}>\n            <NumberInputField\n              name=\"amountSent\"\n              label={t('amountLabel')}\n              isRequired\n              format=\"currency\"\n              errorMessage={t('validations.amount')}\n            />\n            <DatePickerField\n              name=\"dateSent\"\n              label={t('dateLabel')}\n              isRequired\n              errorMessage={t('validations.date')}\n              portalContainer={modalContainerRef?.current || undefined}\n            />\n            <TextInputField\n              name=\"bankName\"\n              label={t('bankNameLabel')}\n              isRequired\n              description={t('bankNameDescription')}\n              placeholder={t('bankNamePlaceholder')}\n              errorMessage={t('validations.bankName')}\n            />\n            <TextAreaField name=\"additionalNotes\" label={t('notesLabel')} rows={3} />\n          </Flex>\n        </HtmlForm>\n      </FormProvider>\n    </Flex>\n  )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n  useI18n('Payroll.ConfirmWireDetailsForm')\n  const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n  const { Button } = useComponentContext()\n  const isMutating = useIsMutating({\n    mutationKey: mutationKeyWireInRequestsSubmit(),\n  })\n  const isPending = isMutating > 0\n\n  return (\n    <Flex gap={12} justifyContent=\"space-evenly\">\n      <FlexItem flexGrow={1}>\n        <Button\n          variant=\"secondary\"\n          onClick={() => {\n            onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_CANCEL)\n          }}\n          isDisabled={isPending}\n          className={styles.button}\n        >\n          {t('cancelCta')}\n        </Button>\n      </FlexItem>\n      <FlexItem flexGrow={1}>\n        <Button\n          variant=\"primary\"\n          type=\"submit\"\n          form={CONFIRM_WIRE_FORM_ID}\n          isLoading={isPending}\n          className={styles.button}\n        >\n          {t('submitCta')}\n        </Button>\n      </FlexItem>\n    </Flex>\n  )\n}\nConfirmWireDetailsForm.Footer = Footer\n"],"names":["ConfirmWireDetailsFormSchema","z","CONFIRM_WIRE_FORM_ID","transformFormDataToPayload","data","ConfirmWireDetailsForm","props","jsx","BaseComponent","Root","wireInId","companyId","dictionary","modalContainerRef","useComponentDictionary","useI18n","onEvent","baseSubmitHandler","useBase","useTranslation","Heading","Text","useComponentContext","dateFormatter","useDateFormatter","useWireInRequestsGetSuspense","wireInRequest","payrollsData","usePayrollsListSuspense","payrollData","payroll","payPeriod","payPeriodRange","checkDate","formHandlers","useForm","zodResolver","submitWireInRequest","useWireInRequestsSubmitMutation","onSubmit","innerData","payload","response","payrollWireEvents","jsxs","Flex","FlexItem","Trans","FormProvider","HtmlForm","styles","NumberInputField","DatePickerField","TextInputField","TextAreaField","Footer","t","Button","isPending","useIsMutating","mutationKeyWireInRequestsSubmit"],"mappings":"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"}

package/dist/components/Payroll/ConfirmWireDetails/WireInstructions/WireInstructions.js

@@ -1,38 +1,40 @@
 import { jsx as e, jsxs as m } from "react/jsx-runtime";
-import { useMemo as W } from "react";
+import { useMemo as k } from "react";
 import { useTranslation as v } from "react-i18next";
-import { useWireInRequestsListSuspense as T } from "@gusto/embedded-api/react-query/wireInRequestsList";
-import { usePayrollsListSuspense as x } from "@gusto/embedded-api/react-query/payrollsList";
+import { useWireInRequestsListSuspense as _ } from "@gusto/embedded-api/react-query/wireInRequestsList";
+import { usePayrollsListSuspense as E } from "@gusto/embedded-api/react-query/payrollsList";
 import u from "./WireInstructions.module.scss.js";
-import { BaseComponent as F } from "../../../Base/Base.js";
+import { BaseComponent as O } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
 import { Flex as p } from "../../../Common/Flex/Flex.js";
 import { useComponentContext as g } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useComponentDictionary as _, useI18n as A } from "../../../../i18n/I18n.js";
+import { useComponentDictionary as U, useI18n as L } from "../../../../i18n/I18n.js";
 import { payrollWireEvents as C } from "../../../../shared/constants.js";
 import { useDateFormatter as w } from "../../../../hooks/useDateFormatter.js";
-import E from "../../../../hooks/useNumberFormatter.js";
-import { useFlow as O } from "../../../Flow/useFlow.js";
-function k(n, a) {
-  const { data: i } = T({
+import B from "../../../../hooks/useNumberFormatter.js";
+import { useFlow as Y } from "../../../Flow/useFlow.js";
+function q(n, a) {
+  const { data: o } = _({
     companyUuid: n
-  }), { data: d } = x({
+  }), { data: d } = E({
     companyId: n,
     processed: !0
-  }), l = (i.wireInRequestList || []).filter(
-    (o) => o.status === "awaiting_funds"
-  ), r = l.find((o) => o.uuid === a), t = d.payrollList || [], f = W(
-    () => l.map((o) => {
-      const h = t.find((b) => b.payrollUuid === o.paymentUuid);
+  }), l = (o.wireInRequestList || []).filter(
+    (i) => i.status === "awaiting_funds"
+  ), r = l.find((i) => i.uuid === a), t = d.payrollList || [], f = k(
+    () => l.map((i) => {
+      const h = t.find((b) => b.payrollUuid === i.paymentUuid);
       return {
-        wireInRequest: o,
-        payroll: h
+        wireInRequest: i,
+        payroll: h,
+        paymentType: i.paymentType,
+        requestedAmount: i.requestedAmount ?? ""
       };
     }),
     [l, t]
   );
   return {
-    selectedInstruction: W(() => r ? {
+    selectedInstruction: k(() => r ? {
       id: r.uuid || "",
       trackingCode: r.uniqueTrackingCode || "",
       amount: parseFloat(r.requestedAmount || "0"),
@@ -47,55 +49,62 @@ function k(n, a) {
   };
 }
 function c({ label: n, value: a }) {
-  const { Text: i } = g();
+  const { Text: o } = g();
   return /* @__PURE__ */ m(p, { flexDirection: "column", gap: 8, children: [
-    /* @__PURE__ */ e(i, { className: u.fieldLabel, children: n }),
-    /* @__PURE__ */ e(i, { className: u.fieldValue, children: a })
+    /* @__PURE__ */ e(o, { className: u.fieldLabel, children: n }),
+    /* @__PURE__ */ e(o, { className: u.fieldValue, children: a })
   ] });
 }
-function U(n) {
-  return /* @__PURE__ */ e(F, { ...n, children: /* @__PURE__ */ e(B, { ...n, children: n.children }) });
+function j(n) {
+  return /* @__PURE__ */ e(O, { ...n, children: /* @__PURE__ */ e(G, { ...n, children: n.children }) });
 }
-const B = ({
+const G = ({
   companyId: n,
   wireInId: a,
-  selectedWireInId: i,
+  selectedWireInId: o,
   dictionary: d,
   onEvent: l,
   modalContainerRef: r
 }) => {
-  _("Payroll.WireInstructions", d), A("Payroll.WireInstructions");
-  const { t } = v("Payroll.WireInstructions"), { Select: f, Card: R, Text: o, UnorderedList: h, Heading: b, Alert: L } = g(), P = w(), q = E("currency"), { selectedInstruction: s, activeWireInRequestsWithPayrolls: I } = k(
+  U("Payroll.WireInstructions", d), L("Payroll.WireInstructions");
+  const { t } = v("Payroll.WireInstructions"), { Select: f, Card: A, Text: i, UnorderedList: h, Heading: b, Alert: S } = g(), D = w(), P = B("currency"), { selectedInstruction: s, activeWireInRequestsWithPayrolls: y } = q(
     n,
-    i
-  ), S = !a && I.length > 1, D = (N) => {
+    o
+  ), T = !a && y.length > 1, x = (N) => {
     l(C.PAYROLL_WIRE_INSTRUCTIONS_SELECT, {
       selectedWireInId: N
     });
   };
-  return I.length === 0 || i && !s ? /* @__PURE__ */ e(p, { flexDirection: "column", gap: 24, children: /* @__PURE__ */ e(o, { children: t("messages.noInstructions") }) }) : /* @__PURE__ */ m(p, { flexDirection: "column", gap: 24, children: [
+  return y.length === 0 || o && !s ? /* @__PURE__ */ e(p, { flexDirection: "column", gap: 24, children: /* @__PURE__ */ e(i, { children: t("messages.noInstructions") }) }) : /* @__PURE__ */ m(p, { flexDirection: "column", gap: 24, children: [
     /* @__PURE__ */ m("div", { children: [
       /* @__PURE__ */ e(b, { as: "h2", styledAs: "h3", children: t("title") }),
-      /* @__PURE__ */ e(o, { className: u.subtitle, children: t("subtitle") })
+      /* @__PURE__ */ e(i, { className: u.subtitle, children: t("subtitle") })
     ] }),
-    S && /* @__PURE__ */ e(
+    T && /* @__PURE__ */ e(
       f,
       {
         isRequired: !0,
         portalContainer: r?.current || void 0,
         label: t("selectLabel"),
-        value: i || "",
-        options: I.map(({ wireInRequest: N, payroll: y }) => ({
-          label: y?.payPeriod ? P.formatPayPeriodRange(
-            y.payPeriod.startDate,
-            y.payPeriod.endDate
-          ) : t("selectFallback"),
-          value: N.uuid || ""
-        })),
-        onChange: D
+        value: o || "",
+        options: y.map(
+          ({ wireInRequest: N, payroll: I, paymentType: R, requestedAmount: F }) => {
+            const W = I?.payPeriod ? D.formatPayPeriodRange(
+              I.payPeriod.startDate,
+              I.payPeriod.endDate
+            ) : "";
+            return {
+              label: R === "Payroll" ? W ? t("selectLabelPayroll", { payrollRange: W }) : t("selectFallback") : R === "ContractorPaymentGroup" ? t("selectLabelContractorPaymentGroup", {
+                requestedAmount: P(Number(F))
+              }) : t("selectFallback"),
+              value: N.uuid || ""
+            };
+          }
+        ),
+        onChange: x
       }
     ),
-    /* @__PURE__ */ e(L, { label: t("requirementsTitle"), disableScrollIntoView: !0, children: /* @__PURE__ */ e(
+    /* @__PURE__ */ e(S, { label: t("requirementsTitle"), disableScrollIntoView: !0, children: /* @__PURE__ */ e(
       h,
       {
         className: u.requirementsList,
@@ -107,7 +116,7 @@ const B = ({
         ]
       }
     ) }),
-    s && /* @__PURE__ */ e(p, { flexDirection: "column", gap: 16, children: /* @__PURE__ */ m(R, { className: u.requirementsCard, children: [
+    s && /* @__PURE__ */ e(p, { flexDirection: "column", gap: 16, children: /* @__PURE__ */ m(A, { className: u.requirementsCard, children: [
       /* @__PURE__ */ e(
         c,
         {
@@ -120,7 +129,7 @@ const B = ({
         c,
         {
           label: t("fields.amount"),
-          value: q(s.amount)
+          value: P(s.amount)
         }
       ),
       /* @__PURE__ */ e("hr", {}),
@@ -173,16 +182,16 @@ const B = ({
       )
     ] }) })
   ] });
-}, Y = ({ onEvent: n }) => {
-  A("Payroll.WireInstructions");
-  const { t: a } = v("Payroll.WireInstructions"), { Button: i } = g(), { companyId: d, selectedWireInId: l } = O(), { selectedInstruction: r } = k(d, l), t = () => {
+}, M = ({ onEvent: n }) => {
+  L("Payroll.WireInstructions");
+  const { t: a } = v("Payroll.WireInstructions"), { Button: o } = g(), { companyId: d, selectedWireInId: l } = Y(), { selectedInstruction: r } = q(d, l), t = () => {
     n(C.PAYROLL_WIRE_INSTRUCTIONS_DONE, {
       selectedWireInId: l
     });
   };
   return /* @__PURE__ */ m("div", { className: u.footer, children: [
     /* @__PURE__ */ e(
-      i,
+      o,
       {
         variant: "secondary",
         onClick: () => {
@@ -191,12 +200,12 @@ const B = ({
         children: a("cta.close")
       }
     ),
-    /* @__PURE__ */ e(i, { variant: "primary", onClick: t, isDisabled: !r, children: a("cta.confirm") })
+    /* @__PURE__ */ e(o, { variant: "primary", onClick: t, isDisabled: !r, children: a("cta.confirm") })
   ] });
 };
-U.Footer = Y;
+j.Footer = M;
 export {
-  B as Root,
-  U as WireInstructions
+  G as Root,
+  j as WireInstructions
 };
 //# sourceMappingURL=WireInstructions.js.map

package/dist/components/Payroll/ConfirmWireDetails/WireInstructions/WireInstructions.js.map

@@ -1 +1 @@
-{"version":3,"file":"WireInstructions.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/WireInstructions/WireInstructions.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useWireInRequestsListSuspense } from '@gusto/embedded-api/react-query/wireInRequestsList'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport type { ConfirmWireDetailsContextInterface } from '../ConfirmWireDetailsComponents'\nimport styles from './WireInstructions.module.scss'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { payrollWireEvents, type EventType } from '@/shared/constants'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useFlow } from '@/components/Flow/useFlow'\n\ninterface WireInstructionsProps extends BaseComponentInterface<'Payroll.WireInstructions'> {\n  companyId: string\n  wireInId?: string\n  selectedWireInId?: string\n  onEvent: OnEventType<EventType, unknown>\n  modalContainerRef?: React.RefObject<HTMLDivElement | null>\n}\n\ninterface WireInstructionFieldProps {\n  label: string\n  value: string\n  onCopy?: () => void\n  copyAriaLabel?: string\n  showCopiedMessage?: boolean\n  copiedMessage?: string\n}\n\nfunction useWireInstructionsState(companyId: string, selectedWireInId?: string) {\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    r => r.status === 'awaiting_funds',\n  )\n\n  const wireInInformation = activeWireInRequests.find(r => r.uuid === selectedWireInId)\n\n  const payrolls = payrollsData.payrollList || []\n\n  const activeWireInRequestsWithPayrolls = useMemo(\n    () =>\n      activeWireInRequests.map(wireInRequest => {\n        const payroll = payrolls.find(p => p.payrollUuid === wireInRequest.paymentUuid)\n        return {\n          wireInRequest,\n          payroll,\n        }\n      }),\n    [activeWireInRequests, payrolls],\n  )\n\n  const selectedInstruction = useMemo(() => {\n    if (!wireInInformation) return null\n\n    const instruction = {\n      id: wireInInformation.uuid || '',\n      trackingCode: wireInInformation.uniqueTrackingCode || '',\n      amount: parseFloat(wireInInformation.requestedAmount || '0'),\n      bankName: wireInInformation.originationBank || '',\n      bankAddress: wireInInformation.originationBankAddress || '',\n      recipientName: wireInInformation.recipientName || '',\n      recipientAddress: wireInInformation.recipientAddress || '',\n      recipientAccountNumber: wireInInformation.recipientAccountNumber || '',\n      recipientRoutingNumber: wireInInformation.recipientRoutingNumber || '',\n    }\n    return instruction\n  }, [wireInInformation])\n\n  return {\n    selectedInstruction,\n    activeWireInRequestsWithPayrolls,\n  }\n}\n\nfunction WireInstructionField({ label, value }: WireInstructionFieldProps) {\n  const { Text } = useComponentContext()\n\n  return (\n    <Flex flexDirection=\"column\" gap={8}>\n      <Text className={styles.fieldLabel}>{label}</Text>\n      <Text className={styles.fieldValue}>{value}</Text>\n    </Flex>\n  )\n}\n\nexport function WireInstructions(props: WireInstructionsProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nexport const Root = ({\n  companyId,\n  wireInId,\n  selectedWireInId,\n  dictionary,\n  onEvent,\n  modalContainerRef,\n}: WireInstructionsProps) => {\n  useComponentDictionary('Payroll.WireInstructions', dictionary)\n  useI18n('Payroll.WireInstructions')\n  const { t } = useTranslation('Payroll.WireInstructions')\n  const { Select, Card, Text, UnorderedList, Heading, Alert } = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const formatCurrency = useNumberFormatter('currency')\n\n  const { selectedInstruction, activeWireInRequestsWithPayrolls } = useWireInstructionsState(\n    companyId,\n    selectedWireInId,\n  )\n\n  const shouldShowDropdown = !wireInId && activeWireInRequestsWithPayrolls.length > 1\n\n  const handleWireInSelection = (updatedSelectedWireInId: string) => {\n    onEvent(payrollWireEvents.PAYROLL_WIRE_INSTRUCTIONS_SELECT, {\n      selectedWireInId: updatedSelectedWireInId,\n    })\n  }\n\n  if (activeWireInRequestsWithPayrolls.length === 0 || (selectedWireInId && !selectedInstruction)) {\n    return (\n      <Flex flexDirection=\"column\" gap={24}>\n        <Text>{t('messages.noInstructions')}</Text>\n      </Flex>\n    )\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <div>\n        <Heading as=\"h2\" styledAs=\"h3\">\n          {t('title')}\n        </Heading>\n        <Text className={styles.subtitle}>{t('subtitle')}</Text>\n      </div>\n\n      {shouldShowDropdown && (\n        <Select\n          isRequired\n          portalContainer={modalContainerRef?.current || undefined}\n          label={t('selectLabel')}\n          value={selectedWireInId || ''}\n          options={activeWireInRequestsWithPayrolls.map(({ wireInRequest, payroll }) => ({\n            label: payroll?.payPeriod\n              ? dateFormatter.formatPayPeriodRange(\n                  payroll.payPeriod.startDate,\n                  payroll.payPeriod.endDate,\n                )\n              : t('selectFallback'),\n            value: wireInRequest.uuid || '',\n          }))}\n          onChange={handleWireInSelection}\n        />\n      )}\n\n      <Alert label={t('requirementsTitle')} disableScrollIntoView>\n        <UnorderedList\n          className={styles.requirementsList}\n          items={[\n            t('requirements.trackingCode'),\n            t('requirements.amountMatch'),\n            t('requirements.usBank'),\n            t('requirements.authorized'),\n          ]}\n        />\n      </Alert>\n\n      {selectedInstruction && (\n        <Flex flexDirection=\"column\" gap={16}>\n          <Card className={styles.requirementsCard}>\n            <WireInstructionField\n              label={t('fields.trackingCode')}\n              value={selectedInstruction.trackingCode}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.amount')}\n              value={formatCurrency(selectedInstruction.amount)}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.bankName')}\n              value={selectedInstruction.bankName}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.bankAddress')}\n              value={selectedInstruction.bankAddress}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.recipientName')}\n              value={selectedInstruction.recipientName}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.recipientAddress')}\n              value={selectedInstruction.recipientAddress}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.accountNumber')}\n              value={selectedInstruction.recipientAccountNumber}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.routingNumber')}\n              value={selectedInstruction.recipientRoutingNumber}\n            />\n          </Card>\n        </Flex>\n      )}\n    </Flex>\n  )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n  useI18n('Payroll.WireInstructions')\n  const { t } = useTranslation('Payroll.WireInstructions')\n  const { Button } = useComponentContext()\n  const { companyId, selectedWireInId } = useFlow<ConfirmWireDetailsContextInterface>()\n  const { selectedInstruction } = useWireInstructionsState(companyId, selectedWireInId)\n\n  const handleConfirm = () => {\n    onEvent(payrollWireEvents.PAYROLL_WIRE_INSTRUCTIONS_DONE, {\n      selectedWireInId,\n    })\n  }\n\n  return (\n    <div className={styles.footer}>\n      <Button\n        variant=\"secondary\"\n        onClick={() => {\n          onEvent(payrollWireEvents.PAYROLL_WIRE_INSTRUCTIONS_CANCEL)\n        }}\n      >\n        {t('cta.close')}\n      </Button>\n      <Button variant=\"primary\" onClick={handleConfirm} isDisabled={!selectedInstruction}>\n        {t('cta.confirm')}\n      </Button>\n    </div>\n  )\n}\n\nWireInstructions.Footer = Footer\n"],"names":["useWireInstructionsState","companyId","selectedWireInId","wireInRequestsData","useWireInRequestsListSuspense","payrollsData","usePayrollsListSuspense","activeWireInRequests","r","wireInInformation","payrolls","activeWireInRequestsWithPayrolls","useMemo","wireInRequest","payroll","p","WireInstructionField","label","value","Text","useComponentContext","jsxs","Flex","jsx","styles","WireInstructions","props","BaseComponent","Root","wireInId","dictionary","onEvent","modalContainerRef","useComponentDictionary","useI18n","useTranslation","Select","Card","UnorderedList","Heading","Alert","dateFormatter","useDateFormatter","formatCurrency","useNumberFormatter","selectedInstruction","shouldShowDropdown","handleWireInSelection","updatedSelectedWireInId","payrollWireEvents","Footer","t","Button","useFlow","handleConfirm"],"mappings":"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"}
+{"version":3,"file":"WireInstructions.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/WireInstructions/WireInstructions.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useWireInRequestsListSuspense } from '@gusto/embedded-api/react-query/wireInRequestsList'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport type { ConfirmWireDetailsContextInterface } from '../ConfirmWireDetailsComponents'\nimport styles from './WireInstructions.module.scss'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { payrollWireEvents, type EventType } from '@/shared/constants'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useFlow } from '@/components/Flow/useFlow'\n\ninterface WireInstructionsProps extends BaseComponentInterface<'Payroll.WireInstructions'> {\n  companyId: string\n  wireInId?: string\n  selectedWireInId?: string\n  onEvent: OnEventType<EventType, unknown>\n  modalContainerRef?: React.RefObject<HTMLDivElement | null>\n}\n\ninterface WireInstructionFieldProps {\n  label: string\n  value: string\n  onCopy?: () => void\n  copyAriaLabel?: string\n  showCopiedMessage?: boolean\n  copiedMessage?: string\n}\n\nfunction useWireInstructionsState(companyId: string, selectedWireInId?: string) {\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    r => r.status === 'awaiting_funds',\n  )\n\n  const wireInInformation = activeWireInRequests.find(r => r.uuid === selectedWireInId)\n\n  const payrolls = payrollsData.payrollList || []\n\n  const activeWireInRequestsWithPayrolls = useMemo(\n    () =>\n      activeWireInRequests.map(wireInRequest => {\n        const payroll = payrolls.find(p => p.payrollUuid === wireInRequest.paymentUuid)\n        return {\n          wireInRequest,\n          payroll,\n          paymentType: wireInRequest.paymentType,\n          requestedAmount: wireInRequest.requestedAmount ?? '',\n        }\n      }),\n    [activeWireInRequests, payrolls],\n  )\n\n  const selectedInstruction = useMemo(() => {\n    if (!wireInInformation) return null\n\n    const instruction = {\n      id: wireInInformation.uuid || '',\n      trackingCode: wireInInformation.uniqueTrackingCode || '',\n      amount: parseFloat(wireInInformation.requestedAmount || '0'),\n      bankName: wireInInformation.originationBank || '',\n      bankAddress: wireInInformation.originationBankAddress || '',\n      recipientName: wireInInformation.recipientName || '',\n      recipientAddress: wireInInformation.recipientAddress || '',\n      recipientAccountNumber: wireInInformation.recipientAccountNumber || '',\n      recipientRoutingNumber: wireInInformation.recipientRoutingNumber || '',\n    }\n    return instruction\n  }, [wireInInformation])\n\n  return {\n    selectedInstruction,\n    activeWireInRequestsWithPayrolls,\n  }\n}\n\nfunction WireInstructionField({ label, value }: WireInstructionFieldProps) {\n  const { Text } = useComponentContext()\n\n  return (\n    <Flex flexDirection=\"column\" gap={8}>\n      <Text className={styles.fieldLabel}>{label}</Text>\n      <Text className={styles.fieldValue}>{value}</Text>\n    </Flex>\n  )\n}\n\nexport function WireInstructions(props: WireInstructionsProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nexport const Root = ({\n  companyId,\n  wireInId,\n  selectedWireInId,\n  dictionary,\n  onEvent,\n  modalContainerRef,\n}: WireInstructionsProps) => {\n  useComponentDictionary('Payroll.WireInstructions', dictionary)\n  useI18n('Payroll.WireInstructions')\n  const { t } = useTranslation('Payroll.WireInstructions')\n  const { Select, Card, Text, UnorderedList, Heading, Alert } = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const formatCurrency = useNumberFormatter('currency')\n\n  const { selectedInstruction, activeWireInRequestsWithPayrolls } = useWireInstructionsState(\n    companyId,\n    selectedWireInId,\n  )\n\n  const shouldShowDropdown = !wireInId && activeWireInRequestsWithPayrolls.length > 1\n\n  const handleWireInSelection = (updatedSelectedWireInId: string) => {\n    onEvent(payrollWireEvents.PAYROLL_WIRE_INSTRUCTIONS_SELECT, {\n      selectedWireInId: updatedSelectedWireInId,\n    })\n  }\n\n  if (activeWireInRequestsWithPayrolls.length === 0 || (selectedWireInId && !selectedInstruction)) {\n    return (\n      <Flex flexDirection=\"column\" gap={24}>\n        <Text>{t('messages.noInstructions')}</Text>\n      </Flex>\n    )\n  }\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <div>\n        <Heading as=\"h2\" styledAs=\"h3\">\n          {t('title')}\n        </Heading>\n        <Text className={styles.subtitle}>{t('subtitle')}</Text>\n      </div>\n\n      {shouldShowDropdown && (\n        <Select\n          isRequired\n          portalContainer={modalContainerRef?.current || undefined}\n          label={t('selectLabel')}\n          value={selectedWireInId || ''}\n          options={activeWireInRequestsWithPayrolls.map(\n            ({ wireInRequest, payroll, paymentType, requestedAmount }) => {\n              const payrollRange = payroll?.payPeriod\n                ? dateFormatter.formatPayPeriodRange(\n                    payroll.payPeriod.startDate,\n                    payroll.payPeriod.endDate,\n                  )\n                : ''\n\n              return {\n                label:\n                  paymentType === 'Payroll'\n                    ? payrollRange\n                      ? t('selectLabelPayroll', { payrollRange })\n                      : t('selectFallback')\n                    : paymentType === 'ContractorPaymentGroup'\n                      ? t('selectLabelContractorPaymentGroup', {\n                          requestedAmount: formatCurrency(Number(requestedAmount)),\n                        })\n                      : t('selectFallback'),\n                value: wireInRequest.uuid || '',\n              }\n            },\n          )}\n          onChange={handleWireInSelection}\n        />\n      )}\n      <Alert label={t('requirementsTitle')} disableScrollIntoView>\n        <UnorderedList\n          className={styles.requirementsList}\n          items={[\n            t('requirements.trackingCode'),\n            t('requirements.amountMatch'),\n            t('requirements.usBank'),\n            t('requirements.authorized'),\n          ]}\n        />\n      </Alert>\n      {selectedInstruction && (\n        <Flex flexDirection=\"column\" gap={16}>\n          <Card className={styles.requirementsCard}>\n            <WireInstructionField\n              label={t('fields.trackingCode')}\n              value={selectedInstruction.trackingCode}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.amount')}\n              value={formatCurrency(selectedInstruction.amount)}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.bankName')}\n              value={selectedInstruction.bankName}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.bankAddress')}\n              value={selectedInstruction.bankAddress}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.recipientName')}\n              value={selectedInstruction.recipientName}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.recipientAddress')}\n              value={selectedInstruction.recipientAddress}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.accountNumber')}\n              value={selectedInstruction.recipientAccountNumber}\n            />\n\n            <hr />\n\n            <WireInstructionField\n              label={t('fields.routingNumber')}\n              value={selectedInstruction.recipientRoutingNumber}\n            />\n          </Card>\n        </Flex>\n      )}\n    </Flex>\n  )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n  useI18n('Payroll.WireInstructions')\n  const { t } = useTranslation('Payroll.WireInstructions')\n  const { Button } = useComponentContext()\n  const { companyId, selectedWireInId } = useFlow<ConfirmWireDetailsContextInterface>()\n  const { selectedInstruction } = useWireInstructionsState(companyId, selectedWireInId)\n\n  const handleConfirm = () => {\n    onEvent(payrollWireEvents.PAYROLL_WIRE_INSTRUCTIONS_DONE, {\n      selectedWireInId,\n    })\n  }\n\n  return (\n    <div className={styles.footer}>\n      <Button\n        variant=\"secondary\"\n        onClick={() => {\n          onEvent(payrollWireEvents.PAYROLL_WIRE_INSTRUCTIONS_CANCEL)\n        }}\n      >\n        {t('cta.close')}\n      </Button>\n      <Button variant=\"primary\" onClick={handleConfirm} isDisabled={!selectedInstruction}>\n        {t('cta.confirm')}\n      </Button>\n    </div>\n  )\n}\n\nWireInstructions.Footer = Footer\n"],"names":["useWireInstructionsState","companyId","selectedWireInId","wireInRequestsData","useWireInRequestsListSuspense","payrollsData","usePayrollsListSuspense","activeWireInRequests","r","wireInInformation","payrolls","activeWireInRequestsWithPayrolls","useMemo","wireInRequest","payroll","p","WireInstructionField","label","value","Text","useComponentContext","jsxs","Flex","jsx","styles","WireInstructions","props","BaseComponent","Root","wireInId","dictionary","onEvent","modalContainerRef","useComponentDictionary","useI18n","useTranslation","Select","Card","UnorderedList","Heading","Alert","dateFormatter","useDateFormatter","formatCurrency","useNumberFormatter","selectedInstruction","shouldShowDropdown","handleWireInSelection","updatedSelectedWireInId","payrollWireEvents","paymentType","requestedAmount","payrollRange","Footer","t","Button","useFlow","handleConfirm"],"mappings":"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"}