npm - @mx-cartographer/experiences - Versions diffs - 9.6.13 → 9.6.14 - Mend

@mx-cartographer/experiences 9.6.13 → 9.6.14

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

package/CHANGELOG.md CHANGED Viewed

@@ -1,3 +1,16 @@
+## [9.6.14] - 10-15-2026
+- **ADDED** - `onAnalyticsEvent` callback on `BeatActions` (WEC-1849)
+- **ADDED** - `src/insights-v2/analytics/` module: events config, resolver, `useAnalyticsEvent()` hook (WEC-1849)
+- **ADDED** - analytics routed through ctaActions via `sendCtaAnalytics` (WEC-1849)
+- **ADDED** - `PRIMARY_ACTION_SELECTED` / `SECONDARY_ACTION_SELECTED` / `FIRST_TIME_PRIMARY_ACTION_SELECTED` CTA press events (WEC-1849)
+- **ADDED** - `CHART_BAR_CLICKED` / `DRAWER_CHART_BAR_CLICKED` / `TAB_SELECTED` chart analytics events (WEC-1849)
+- **ADDED** - Declarative analytics trigger: `analytics` on `RunHandlerOptions` (WEC-1849)
+- **ADDED** - LowAccountBalance + SavingsOpportunityV2 dialog analytics in `AmountInputModalBlock` (WEC-1849)
+- **ADDED** - `OPENED_CONNECT_DRAWER` event in `ConnectWidgetActionBlock` (WEC-1849)
+- **NOTE** - Scoped to Firefly analytics only (WEC-1849)
+- **REFACTOR** - Collapsed the `sendCtaAnalytics` → fake-CTA → `ctaHandlers.sendAnalyticsEvent` chain into one function that resolves the payload and calls `onAnalyticsEvent` directly; removed the now-redundant runtime eventKey check (a typo'd key already fails typecheck). Kept `CtaStep.analytics` and the runner's `step.analytics` check for future `ctaConfig` entries (none use it yet; `RunHandlerOptions.analytics` has real callers today). Removed the `AnalyticsEvents` self-mapping constant — `sendCtaAnalytics`/`resolveAnalyticsEvent`/`useAnalyticsEvent()`/`RunHandlerOptions.analytics` now take the catalogue entry itself (e.g. `ANALYTICS_EVENTS_CONFIG.PRIMARY_ACTION_SELECTED`) instead of a lookup key, so there is nothing to look up and a typo'd property name fails typecheck at the call site. Dropped the unused `stores` parameter from `resolveAnalyticsEvent`/`postHog.properties`. Added `reportCtaClick` (press event + first-time bookkeeping together) and routed the `contact_support_block` bypass through it, so that CTA now also fires `FIRST_TIME_PRIMARY_ACTION_SELECTED` and records `cta_clicked_at` on its first press (WEC-1849)
 ## [9.6.13] - 10-15-2026
 - **ADDED** - `ICO-<name>` logo guids: `logoFromEntityGuid` / `logoFromRef` map them to a filled mx-icons status icon in the logo's `color`, `LogoFromGuid` draws it and `isLogoGuid` accepts the prefix; `SubHeader` draws `logo_fill` icons filled. Fee Detected's header sends `ICO-error` (WEC-1885)

package/dist/common/components/CurrencyDialog.d.ts CHANGED Viewed

@@ -12,6 +12,11 @@ interface CurrencyDialogProps {
     /** Disables the primary button on top of the built-in input check (e.g. while saving). */
     isPrimaryDisabled?: boolean;
     handleInputChange?: (value: string) => void;
+    /**
+     * Click on the amount input (e.g. analytics). Click, not focus: the input autofocuses on open,
+     * so a focus callback would fire per open rather than per user interaction.
+     */
+    handleInputClick?: () => void;
     handleModalClose: () => void;
     handlePrimaryAction: () => void;
     handleSecondaryAction?: () => void;
@@ -23,5 +28,5 @@ interface CurrencyDialogProps {
     subtitle?: ReactNode;
     title: string;
 }
-declare const CurrencyDialog: ({ closeAriaLabel, content, errorText, inputLabel, inputValue, isOpen, isPrimaryDisabled, handleInputChange, handleModalClose, handlePrimaryAction, handleSecondaryAction, primaryColor, primaryText, secondaryColor, secondaryText, subtitle, title, }: CurrencyDialogProps) => import("react/jsx-runtime").JSX.Element;
+declare const CurrencyDialog: ({ closeAriaLabel, content, errorText, inputLabel, inputValue, isOpen, isPrimaryDisabled, handleInputChange, handleInputClick, handleModalClose, handlePrimaryAction, handleSecondaryAction, primaryColor, primaryText, secondaryColor, secondaryText, subtitle, title, }: CurrencyDialogProps) => import("react/jsx-runtime").JSX.Element;
 export default CurrencyDialog;

package/dist/common/components/CurrencyDialog.es.js CHANGED Viewed

@@ -1,18 +1,18 @@
-import { useScreenSize as k } from "../hooks/useScreenSize.es.js";
+import { useScreenSize as S } from "../hooks/useScreenSize.es.js";
 import n from "@mui/material/Stack";
-import { H3 as S, P as j } from "@mxenabled/mxui";
+import { H3 as j, P as M } from "@mxenabled/mxui";
 import f from "@mui/material/Button";
-import { Icon as M } from "@mxenabled/mx-icons";
+import { Icon as $ } from "@mxenabled/mx-icons";
 import { jsx as o, jsxs as t } from "react/jsx-runtime";
-import $ from "@mui/material/Dialog";
-import B from "@mui/material/DialogContent";
-import F from "@mui/material/IconButton";
-import H from "@mui/material/DialogActions";
-import w from "@mui/material/InputAdornment";
-import A from "@mui/material/TextField";
-var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValue: i, isOpen: u, isPrimaryDisabled: x = !1, handleInputChange: b, handleModalClose: m, handlePrimaryAction: s, handleSecondaryAction: C, primaryColor: D = "primary", primaryText: p, secondaryColor: v = "primary", secondaryText: l, subtitle: y, title: c }) => {
-  const d = x || (r ? !(i !== "" && i !== "0" && !isNaN(parseFloat(i ?? "0"))) : !1), { isSmallMobile: I } = k();
-  return /* @__PURE__ */ o($, {
+import B from "@mui/material/Dialog";
+import F from "@mui/material/DialogContent";
+import H from "@mui/material/IconButton";
+import w from "@mui/material/DialogActions";
+import A from "@mui/material/InputAdornment";
+import N from "@mui/material/TextField";
+var X = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValue: i, isOpen: u, isPrimaryDisabled: x = !1, handleInputChange: b, handleInputClick: C, handleModalClose: m, handlePrimaryAction: s, handleSecondaryAction: D, primaryColor: k = "primary", primaryText: p, secondaryColor: v = "primary", secondaryText: l, subtitle: y, title: c }) => {
+  const d = x || (r ? !(i !== "" && i !== "0" && !isNaN(parseFloat(i ?? "0"))) : !1), { isSmallMobile: I } = S();
+  return /* @__PURE__ */ o(B, {
     "aria-label": c,
     "aria-labelledby": "modal-title",
     maxWidth: "xs",
@@ -23,7 +23,7 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
       "& .MuiDialogContent-root": { p: 0 },
       ...I && { "& .MuiDialog-paper": { minWidth: "100%" } }
     },
-    children: /* @__PURE__ */ o(B, { children: /* @__PURE__ */ t("form", {
+    children: /* @__PURE__ */ o(F, { children: /* @__PURE__ */ t("form", {
       onSubmit: (e) => {
         e.preventDefault(), d || s();
       },
@@ -41,11 +41,11 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
           },
           children: [/* @__PURE__ */ t(n, {
             sx: { gap: 4 },
-            children: [/* @__PURE__ */ o(S, {
+            children: [/* @__PURE__ */ o(j, {
               id: "modal-title",
               children: c
             }), y]
-          }), /* @__PURE__ */ o(F, {
+          }), /* @__PURE__ */ o(H, {
             "aria-label": h,
             onClick: m,
             sx: {
@@ -54,7 +54,7 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
               right: 8,
               top: 18
             },
-            children: /* @__PURE__ */ o(M, {
+            children: /* @__PURE__ */ o($, {
               name: "close",
               sx: { color: "action.active" }
             })
@@ -65,10 +65,10 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
             gap: 24,
             px: 24
           },
-          children: [/* @__PURE__ */ o(j, {
+          children: [/* @__PURE__ */ o(M, {
             variant: "subtitle1",
             children: g
-          }), r && /* @__PURE__ */ o(A, {
+          }), r && /* @__PURE__ */ o(N, {
             autoFocus: !0,
             error: !!a,
             helperText: a,
@@ -77,8 +77,9 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
             onChange: ({ target: { value: e } }) => {
               /^\d*\.?\d*$/.test(e) && b?.(e);
             },
+            onClick: C,
             slotProps: {
-              input: { startAdornment: /* @__PURE__ */ o(w, {
+              input: { startAdornment: /* @__PURE__ */ o(A, {
                 position: "start",
                 children: "$"
               }) },
@@ -93,7 +94,7 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
             value: i
           })]
         }),
-        /* @__PURE__ */ t(H, {
+        /* @__PURE__ */ t(w, {
           sx: {
             justifyContent: "flex-end",
             gap: 16,
@@ -103,11 +104,11 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
           children: [l && /* @__PURE__ */ o(f, {
             "aria-label": l,
             color: v,
-            onClick: C,
+            onClick: D,
             children: l
           }), /* @__PURE__ */ o(f, {
             "aria-label": p,
-            color: D,
+            color: k,
             disabled: d,
             onClick: s,
             variant: "contained",
@@ -119,7 +120,7 @@ var U = ({ closeAriaLabel: h, content: g, errorText: a, inputLabel: r, inputValu
   });
 };
 export {
-  U as default
+  X as default
 };
 //# sourceMappingURL=CurrencyDialog.es.js.map

package/dist/common/components/CurrencyDialog.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CurrencyDialog.es.js","names":[],"sources":["../../../src/common/components/CurrencyDialog.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { H3, P } from '@mxenabled/mxui'\n\nimport Button, { type ButtonProps } from '@mui/material/Button'\nimport Dialog from '@mui/material/Dialog'\nimport DialogActions from '@mui/material/DialogActions'\nimport DialogContent from '@mui/material/DialogContent'\nimport IconButton from '@mui/material/IconButton'\nimport InputAdornment from '@mui/material/InputAdornment'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\n\nimport { useScreenSize } from '../hooks'\n\ninterface CurrencyDialogProps {\n closeAriaLabel: string\n /** Body copy; a node so callers can emphasise part of it (e.g. a bold account name). /\n content?: ReactNode\n /* Validation or save error, shown under the input and marking it invalid. /\n errorText?: string\n inputLabel?: string\n inputValue?: string\n isOpen: boolean\n /* Disables the primary button on top of the built-in input check (e.g. while saving). /\n isPrimaryDisabled?: boolean\n handleInputChange?: (value: string) => void\n handleModalClose: () => void\n handlePrimaryAction: () => void\n handleSecondaryAction?: () => void\n primaryColor?: ButtonProps['color']\n primaryText: string\n secondaryColor?: ButtonProps['color']\n secondaryText?: string\n /* A line under the title, e.g. the account a setting applies to. /\n subtitle?: ReactNode\n title: string\n}\n\n// Created for V2 of BudgetDetailsDrawer.\n// The previous design will be replaced once the new design is finalized.\n// Also needs to be updated to use the mxui library\n// with the updated Dialog components.\n\nconst CurrencyDialog = ({\n closeAriaLabel,\n content,\n errorText,\n inputLabel,\n inputValue,\n isOpen,\n isPrimaryDisabled = false,\n handleInputChange,\n handleModalClose,\n handlePrimaryAction,\n handleSecondaryAction,\n primaryColor = 'primary',\n primaryText,\n secondaryColor = 'primary',\n secondaryText,\n subtitle,\n title,\n}: CurrencyDialogProps) => {\n const numericValue = parseFloat(inputValue ?? '0')\n const isValid = inputValue !== '' && inputValue !== '0' && !isNaN(numericValue)\n // One rule for the button and for Enter: the form's submit must not bypass a disabled button.\n const isPrimaryBlocked = isPrimaryDisabled \|\| (inputLabel ? !isValid : false)\n\n const { isSmallMobile } = useScreenSize()\n\n return (\n <Dialog\n aria-label={title}\n aria-labelledby=\"modal-title\"\n maxWidth=\"xs\"\n onClose={handleModalClose}\n open={isOpen}\n role=\"dialog\"\n sx={{\n '& .MuiDialogContent-root': { p: 0 },\n ...(isSmallMobile && { '& .MuiDialog-paper': { minWidth: '100%' } }),\n }}\n >\n <DialogContent>\n <form\n onSubmit={(e) => {\n e.preventDefault()\n if (!isPrimaryBlocked) handlePrimaryAction()\n }}\n >\n <Stack\n sx={{\n alignItems: 'center',\n flexDirection: 'row',\n justifyContent: 'space-between',\n pb: 12,\n pl: 24,\n position: 'relative',\n pr: 16,\n pt: 24,\n }}\n >\n <Stack sx={{ gap: 4 }}>\n <H3 id=\"modal-title\">{title}</H3>\n {subtitle}\n </Stack>\n <IconButton\n aria-label={closeAriaLabel}\n onClick={handleModalClose}\n sx={{ minHeight: 24, position: 'absolute', right: 8, top: 18 }}\n >\n <Icon name=\"close\" sx={{ color: 'action.active' }} />\n </IconButton>\n </Stack>\n <Stack sx={{ gap: 24, px: 24 }}>\n <P variant=\"subtitle1\">{content}</P>\n {inputLabel && (\n <TextField\n autoFocus={true}\n error={!!errorText}\n helperText={errorText}\n inputMode=\"decimal\"\n label={inputLabel}\n onChange={({ target: { value } }) => {\n if (!/^\\d\\.?\\d$/.test(value)) return\n\n handleInputChange?.(value)\n }}\n slotProps={{\n input: {\n startAdornment: <InputAdornment position=\"start\">$</InputAdornment>,\n },\n // Announce errors: focus is usually on the primary button when one appears.\n formHelperText: { role: 'alert' },\n htmlInput: {\n 'aria-label': inputLabel,\n noValidate: true,\n pattern: '[0-9]\\\\.?[0-9]*',\n },\n }}\n type=\"text\"\n value={inputValue}\n />\n )}\n </Stack>\n <DialogActions\n sx={{\n justifyContent: 'flex-end',\n gap: 16,\n p: 24,\n '>:not(style)~:not(style)': { ml: 0 },\n }}\n >\n {secondaryText && (\n <Button\n aria-label={secondaryText}\n color={secondaryColor}\n onClick={handleSecondaryAction}\n >\n {secondaryText}\n </Button>\n )}\n <Button\n aria-label={primaryText}\n color={primaryColor}\n disabled={isPrimaryBlocked}\n onClick={handlePrimaryAction}\n variant=\"contained\"\n >\n {primaryText}\n </Button>\n </DialogActions>\n </form>\n </DialogContent>\n </Dialog>\n )\n}\n\nexport default CurrencyDialog\n"],"mappings":";;;;;;;;;;;;~~AA6CA~~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"}
1	+ {"version":3,"file":"CurrencyDialog.es.js","names":[],"sources":["../../../src/common/components/CurrencyDialog.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { H3, P } from '@mxenabled/mxui'\n\nimport Button, { type ButtonProps } from '@mui/material/Button'\nimport Dialog from '@mui/material/Dialog'\nimport DialogActions from '@mui/material/DialogActions'\nimport DialogContent from '@mui/material/DialogContent'\nimport IconButton from '@mui/material/IconButton'\nimport InputAdornment from '@mui/material/InputAdornment'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\n\nimport { useScreenSize } from '../hooks'\n\ninterface CurrencyDialogProps {\n closeAriaLabel: string\n /** Body copy; a node so callers can emphasise part of it (e.g. a bold account name). /\n content?: ReactNode\n /* Validation or save error, shown under the input and marking it invalid. /\n errorText?: string\n inputLabel?: string\n inputValue?: string\n isOpen: boolean\n /* Disables the primary button on top of the built-in input check (e.g. while saving). /\n isPrimaryDisabled?: boolean\n handleInputChange?: (value: string) => void\n /\n Click on the amount input (e.g. analytics). Click, not focus: the input autofocuses on open,\n * so a focus callback would fire per open rather than per user interaction.\n /\n handleInputClick?: () => void\n handleModalClose: () => void\n handlePrimaryAction: () => void\n handleSecondaryAction?: () => void\n primaryColor?: ButtonProps['color']\n primaryText: string\n secondaryColor?: ButtonProps['color']\n secondaryText?: string\n /* A line under the title, e.g. the account a setting applies to. /\n subtitle?: ReactNode\n title: string\n}\n\n// Created for V2 of BudgetDetailsDrawer.\n// The previous design will be replaced once the new design is finalized.\n// Also needs to be updated to use the mxui library\n// with the updated Dialog components.\n\nconst CurrencyDialog = ({\n closeAriaLabel,\n content,\n errorText,\n inputLabel,\n inputValue,\n isOpen,\n isPrimaryDisabled = false,\n handleInputChange,\n handleInputClick,\n handleModalClose,\n handlePrimaryAction,\n handleSecondaryAction,\n primaryColor = 'primary',\n primaryText,\n secondaryColor = 'primary',\n secondaryText,\n subtitle,\n title,\n}: CurrencyDialogProps) => {\n const numericValue = parseFloat(inputValue ?? '0')\n const isValid = inputValue !== '' && inputValue !== '0' && !isNaN(numericValue)\n // One rule for the button and for Enter: the form's submit must not bypass a disabled button.\n const isPrimaryBlocked = isPrimaryDisabled \|\| (inputLabel ? !isValid : false)\n\n const { isSmallMobile } = useScreenSize()\n\n return (\n <Dialog\n aria-label={title}\n aria-labelledby=\"modal-title\"\n maxWidth=\"xs\"\n onClose={handleModalClose}\n open={isOpen}\n role=\"dialog\"\n sx={{\n '& .MuiDialogContent-root': { p: 0 },\n ...(isSmallMobile && { '& .MuiDialog-paper': { minWidth: '100%' } }),\n }}\n >\n <DialogContent>\n <form\n onSubmit={(e) => {\n e.preventDefault()\n if (!isPrimaryBlocked) handlePrimaryAction()\n }}\n >\n <Stack\n sx={{\n alignItems: 'center',\n flexDirection: 'row',\n justifyContent: 'space-between',\n pb: 12,\n pl: 24,\n position: 'relative',\n pr: 16,\n pt: 24,\n }}\n >\n <Stack sx={{ gap: 4 }}>\n <H3 id=\"modal-title\">{title}</H3>\n {subtitle}\n </Stack>\n <IconButton\n aria-label={closeAriaLabel}\n onClick={handleModalClose}\n sx={{ minHeight: 24, position: 'absolute', right: 8, top: 18 }}\n >\n <Icon name=\"close\" sx={{ color: 'action.active' }} />\n </IconButton>\n </Stack>\n <Stack sx={{ gap: 24, px: 24 }}>\n <P variant=\"subtitle1\">{content}</P>\n {inputLabel && (\n <TextField\n autoFocus={true}\n error={!!errorText}\n helperText={errorText}\n inputMode=\"decimal\"\n label={inputLabel}\n onChange={({ target: { value } }) => {\n if (!/^\\d\\.?\\d$/.test(value)) return\n\n handleInputChange?.(value)\n }}\n onClick={handleInputClick}\n slotProps={{\n input: {\n startAdornment: <InputAdornment position=\"start\">$</InputAdornment>,\n },\n // Announce errors: focus is usually on the primary button when one appears.\n formHelperText: { role: 'alert' },\n htmlInput: {\n 'aria-label': inputLabel,\n noValidate: true,\n pattern: '[0-9]\\\\.?[0-9]*',\n },\n }}\n type=\"text\"\n value={inputValue}\n />\n )}\n </Stack>\n <DialogActions\n sx={{\n justifyContent: 'flex-end',\n gap: 16,\n p: 24,\n '>:not(style)~:not(style)': { ml: 0 },\n }}\n >\n {secondaryText && (\n <Button\n aria-label={secondaryText}\n color={secondaryColor}\n onClick={handleSecondaryAction}\n >\n {secondaryText}\n </Button>\n )}\n <Button\n aria-label={primaryText}\n color={primaryColor}\n disabled={isPrimaryBlocked}\n onClick={handlePrimaryAction}\n variant=\"contained\"\n >\n {primaryText}\n </Button>\n </DialogActions>\n </form>\n </DialogContent>\n </Dialog>\n )\n}\n\nexport default CurrencyDialog\n"],"mappings":"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"}

package/dist/insights-v2/actionBlocks/ActionBlockLayer.es.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { useGlobalCopyStore as C, useGlobalUiStore as _, useInsightsV2Store as h } from "../../common/context/hooks.es.js";
 import B from "../../common/components/drawer/Drawer.es.js";
 import v from "../../common/components/Loader.es.js";
-import { getDynamicCtaBasedOnTriggers as w } from "./util.es.js";
-import { hasDrawerBlock as D } from "../mappings/hasDrawerBlock.es.js";
+import { hasDrawerBlock as w } from "../mappings/hasDrawerBlock.es.js";
+import { getDynamicCtaBasedOnTriggers as D } from "./util.es.js";
 import { actionBlocks as b } from "../mappings/blocks.es.js";
 import { observer as L } from "mobx-react-lite";
 import x from "@mui/material/Stack";
@@ -16,7 +16,7 @@ var m = ({ actionBlock: s, ...o }) => {
   if (!o.insights_payload) return null;
   const { primary_cta: u, secondary_cta: f, in_description_cta: k } = o.insights_payload, a = c.isDrawerOpen && c.guid === o.guid;
   if (!p) return a ? /* @__PURE__ */ e(v, {}) : null;
-  const r = w(c, u, f, k), l = D(r?.block), t = l ? b[r?.block] : void 0;
+  const r = D(c, u, f, k), l = w(r?.block), t = l ? b[r?.block] : void 0;
   if (t?.presentation === "modal") return a ? /* @__PURE__ */ e(m, {
     actionBlock: t,
     beat: o

package/dist/insights-v2/actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js CHANGED Viewed

@@ -1,39 +1,41 @@
-import { buildDynamicCopy as G } from "../../../core/utils/Localization.es.js";
-import W from "../../../common/utils/AccountDisplayName.es.js";
-import { useGlobalCopyStore as j, useInsightsV2Store as z, useSettingsStore as q, useUserStore as J } from "../../../common/context/hooks.es.js";
-import K from "../../../common/components/Loader.es.js";
-import Q from "../../../common/components/CurrencyDialog.es.js";
-import { useBeatActions as X } from "../../beatActions.es.js";
-import { getDynamicCtaBasedOnTriggers as Y } from "../util.es.js";
-import { useCtaHandler as Z } from "../../ctaActions/useCtaAction.es.js";
-import { AMOUNT_INPUT_VARIANTS as oo, findLowBalanceProfile as to, isAmountInputVariant as L, isWholeAmount as eo, toInputValue as io } from "./layout.es.js";
+import { buildDynamicCopy as j } from "../../../core/utils/Localization.es.js";
+import z from "../../../common/utils/AccountDisplayName.es.js";
+import { useGlobalCopyStore as q, useInsightsV2Store as J, useSettingsStore as K, useUserStore as Q } from "../../../common/context/hooks.es.js";
+import X from "../../../common/components/Loader.es.js";
+import Z from "../../../common/components/CurrencyDialog.es.js";
+import { useBeatActions as oo } from "../../beatActions.es.js";
+import { ANALYTICS_EVENTS_CONFIG as c } from "../../analytics/analyticsEventsConfig.es.js";
+import { useCtaHandler as to } from "../../ctaActions/useCtaAction.es.js";
+import { useAnalyticsEvent as eo } from "../../analytics/useAnalyticsEvent.es.js";
+import { getDynamicCtaBasedOnTriggers as io } from "../util.es.js";
+import { AMOUNT_INPUT_VARIANTS as no, findLowBalanceProfile as ro, isAmountInputVariant as x, isWholeAmount as ao, toInputValue as so } from "./layout.es.js";
 import r from "react";
-import { observer as no } from "mobx-react-lite";
-import T from "@mui/material/Stack";
-import { H3 as ro, InstitutionLogo as ao, Text as P } from "@mxenabled/mxui";
-import { Icon as so } from "@mxenabled/mx-icons";
+import { observer as co } from "mobx-react-lite";
+import P from "@mui/material/Stack";
+import { H3 as lo, InstitutionLogo as uo, Text as H } from "@mxenabled/mxui";
+import { Icon as mo } from "@mxenabled/mx-icons";
 import { jsx as e, jsxs as k } from "react/jsx-runtime";
-import co from "@mui/material/Dialog";
-import lo from "@mui/material/IconButton";
-var D = ({ children: y, closeAriaLabel: i, heading: o, onClose: l }) => {
+import po from "@mui/material/Dialog";
+import _o from "@mui/material/IconButton";
+var w = ({ children: I, closeAriaLabel: i, heading: o, onClose: l }) => {
   const u = r.useId();
-  return /* @__PURE__ */ e(co, {
+  return /* @__PURE__ */ e(po, {
     "aria-labelledby": o ? u : void 0,
     maxWidth: "xs",
     onClose: l,
     open: !0,
-    children: /* @__PURE__ */ k(T, {
+    children: /* @__PURE__ */ k(P, {
       sx: {
         gap: 12,
         p: 24,
         position: "relative"
       },
       children: [
-        o && /* @__PURE__ */ e(ro, {
+        o && /* @__PURE__ */ e(lo, {
           id: u,
           children: o
         }),
-        /* @__PURE__ */ e(lo, {
+        /* @__PURE__ */ e(_o, {
           "aria-label": i || "Close",
           onClick: l,
           sx: {
@@ -41,88 +43,91 @@ var D = ({ children: y, closeAriaLabel: i, heading: o, onClose: l }) => {
             right: 8,
             top: 18
           },
-          children: /* @__PURE__ */ e(so, {
+          children: /* @__PURE__ */ e(mo, {
             name: "close",
             sx: { color: "action.active" }
           })
         }),
-        y
+        I
       ]
     })
   });
-}, Po = no(function({ beat: i }) {
-  const { common: o, insights_feed: l } = j(), { actionDrawer: u, closeActionDrawer: c } = z(), f = q(), { userInsightProfile: v } = J(), b = Z(i, X()), { primary_cta: B, secondary_cta: N, in_description_cta: M } = i.insights_payload ?? {}, s = Y(u, B, N, M)?.variant, a = l?.amount_input_modal, t = s === oo.LOW_BALANCE_THRESHOLD, _ = t ? to(f.notificationProfiles, i.primary_account_guid) : void 0, I = t ? _?.threshold : v?.savings_opportunity_minimum_checking_account_balance, [V, E] = r.useState(t), d = r.useRef(!0);
+}, ko = co(function({ beat: i }) {
+  const { common: o, insights_feed: l } = q(), { actionDrawer: u, closeActionDrawer: m } = J(), f = K(), { userInsightProfile: v } = Q(), S = to(i, oo()), T = eo(), { primary_cta: B, secondary_cta: O, in_description_cta: V } = i.insights_payload ?? {}, s = io(u, B, O, V)?.variant, a = l?.amount_input_modal, t = s === no.LOW_BALANCE_THRESHOLD, h = t ? ro(f.notificationProfiles, i.primary_account_guid) : void 0, E = t ? h?.threshold : v?.savings_opportunity_minimum_checking_account_balance, [G, R] = r.useState(t), d = r.useRef(!0);
   r.useEffect(() => (d.current = !0, () => {
     d.current = !1;
   }), []), r.useEffect(() => {
     t && f.loadNotificationProfiles().finally(() => {
-      d.current && E(!1);
+      d.current && R(!1);
     });
   }, [t, f]);
-  const [H, O] = r.useState(null), [S, A] = r.useState(!1), [R, h] = r.useState(!1), m = H ?? io(I);
-  if (V) return /* @__PURE__ */ e(D, {
+  const [F, M] = r.useState(null), [A, C] = r.useState(!1), [U, y] = r.useState(!1), p = F ?? so(E);
+  if (G) return /* @__PURE__ */ e(w, {
     closeAriaLabel: o?.close_aria,
-    onClose: c,
-    children: /* @__PURE__ */ e(K, {})
+    onClose: m,
+    children: /* @__PURE__ */ e(X, {})
   });
-  const n = L(s) ? a?.[s] : void 0, x = !!n?.title && !!n.description && !!n.input_label && !!a?.whole_number_error && !!a.save_error && !!o?.save_button && (!t || !!o.cancel_button) && !!o.close_aria;
-  if (!a || !n || !x || !(t ? _ : v))
-    return console.warn(`amount_input_modal_block: ${a ? L(s) ? x ? t ? "no low-balance profile for the account" : "user insight profile not set by the host" : `copy incomplete for "${s}"` : `unknown variant "${s}"` : "copy namespace missing"}`), /* @__PURE__ */ e(D, {
+  const n = x(s) ? a?.[s] : void 0, b = !!n?.title && !!n.description && !!n.input_label && !!a?.whole_number_error && !!a.save_error && !!o?.save_button && (!t || !!o.cancel_button) && !!o.close_aria;
+  if (!a || !n || !b || !(t ? h : v))
+    return console.warn(`amount_input_modal_block: ${a ? x(s) ? b ? t ? "no low-balance profile for the account" : "user insight profile not set by the host" : `copy incomplete for "${s}"` : `unknown variant "${s}"` : "copy namespace missing"}`), /* @__PURE__ */ e(w, {
       closeAriaLabel: o?.close_aria,
       heading: o?.error_heading,
-      onClose: c,
-      children: /* @__PURE__ */ e(P, { children: o?.error_message })
+      onClose: m,
+      children: /* @__PURE__ */ e(H, { children: o?.error_message })
     });
-  const C = !t && !!I, w = i.primary_account ? W(i.primary_account) : "", g = eo(m), U = m !== "" && !g, $ = async () => {
-    if (!g || S) return;
-    const p = Number(m);
-    A(!0), h(!1);
-    const F = t ? await b("updateNotificationProfileThreshold", {
-      profileGuid: _?.guid,
-      threshold: p
-    }) : await b("updateUserInsightProfile", { fields: { savings_opportunity_minimum_checking_account_balance: p } });
-    d.current && (A(!1), F ? c() : h(!0));
+  const D = () => {
+    T(t ? c.EDIT_INSIGHT_THRESHOLD_CANCELED : c.EDIT_SAFETY_NET_CANCEL), m();
+  }, L = !t && !!E, N = i.primary_account ? z(i.primary_account) : "", g = ao(p), $ = p !== "" && !g, W = async () => {
+    if (!g || A) return;
+    const _ = Number(p);
+    C(!0), y(!1);
+    const Y = t ? await S("updateNotificationProfileThreshold", {
+      profileGuid: h?.guid,
+      threshold: _
+    }, { analytics: c.EDIT_INSIGHT_THRESHOLD_SAVE }) : await S("updateUserInsightProfile", { fields: { savings_opportunity_minimum_checking_account_balance: _ } }, { analytics: c.EDIT_SAFETY_NET_SAVE });
+    d.current && (C(!1), Y ? m() : y(!0));
   };
-  return /* @__PURE__ */ e(Q, {
+  return /* @__PURE__ */ e(Z, {
     closeAriaLabel: o.close_aria,
-    content: G(C && n.description_edit || n.description, /* @__PURE__ */ e("strong", { children: w }, "account")),
-    errorText: U ? a.whole_number_error : R ? a.save_error : void 0,
-    handleInputChange: (p) => {
-      O(p), h(!1);
+    content: j(L && n.description_edit || n.description, /* @__PURE__ */ e("strong", { children: N }, "account")),
+    errorText: $ ? a.whole_number_error : U ? a.save_error : void 0,
+    handleInputChange: (_) => {
+      M(_), y(!1);
     },
-    handleModalClose: c,
+    handleInputClick: t ? () => T(c.EDIT_INSIGHT_THRESHOLD_INPUT_SELECTED) : void 0,
+    handleModalClose: D,
     handlePrimaryAction: () => {
-      $();
+      W();
     },
-    handleSecondaryAction: c,
+    handleSecondaryAction: D,
     inputLabel: n.input_label,
-    inputValue: m,
+    inputValue: p,
     isOpen: !0,
-    isPrimaryDisabled: S || !g,
+    isPrimaryDisabled: A || !g,
     primaryText: o.save_button,
     secondaryText: t ? o.cancel_button : void 0,
-    subtitle: t && i.primary_account ? /* @__PURE__ */ k(T, {
+    subtitle: t && i.primary_account ? /* @__PURE__ */ k(P, {
       sx: {
         alignItems: "center",
         flexDirection: "row",
         gap: 8
       },
-      children: [/* @__PURE__ */ e(ao, {
+      children: [/* @__PURE__ */ e(uo, {
         alt: "",
         institutionGuid: i.primary_account.institution_guid ?? "",
         size: 16
-      }), /* @__PURE__ */ e(P, {
+      }), /* @__PURE__ */ e(H, {
         color: "text.secondary",
         uppercase: !0,
         variant: "body2",
-        children: w
+        children: N
       })]
     }) : void 0,
-    title: C && n.title_edit || n.title
+    title: L && n.title_edit || n.title
   });
 });
 export {
-  Po as AmountInputModalBlock
+  ko as AmountInputModalBlock
 };
 //# sourceMappingURL=AmountInputModalBlock.es.js.map

package/dist/insights-v2/actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountInputModalBlock.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/AmountInputModalBlock/AmountInputModalBlock.tsx"],"sourcesContent":["import React from 'react'\n\nimport Stack from '@mui/material/Stack'\n\nimport MuiDialog from '@mui/material/Dialog'\nimport IconButton from '@mui/material/IconButton'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { H3, InstitutionLogo, Text } from '@mxenabled/mxui'\nimport { observer } from 'mobx-react-lite'\n\nimport {\n CurrencyDialog,\n Loader,\n buildDynamicCopy,\n useGlobalCopyStore,\n useInsightsV2Store,\n useSettingsStore,\n useUserStore,\n} from '../../../common'\nimport getAccountDisplayName from '../../../common/utils/AccountDisplayName'\nimport { useBeatActions } from '../../beatActions'\nimport { useCtaHandler } from '../../ctaActions'\nimport type { ActionBlockProps } from '../../mappings/blocks'\nimport { getDynamicCtaBasedOnTriggers } from '../util'\n\nimport {\n AMOUNT_INPUT_VARIANTS,\n findLowBalanceProfile,\n isAmountInputVariant,\n isWholeAmount,\n toInputValue,\n} from './layout'\n\n/*\n The dialog frame for the states that have no form: loading, and a non-retriable problem. Named by\n * its heading and closable by button, Esc and backdrop, like the form dialog.\n /\nconst StatusDialog = ({\n children,\n closeAriaLabel,\n heading,\n onClose,\n}: React.PropsWithChildren<{ closeAriaLabel?: string; heading?: string; onClose: () => void }>) => {\n const headingId = React.useId()\n\n return (\n <MuiDialog\n aria-labelledby={heading ? headingId : undefined}\n maxWidth=\"xs\"\n onClose={onClose}\n open={true}\n >\n <Stack sx={{ gap: 12, p: 24, position: 'relative' }}>\n {heading && <H3 id={headingId}>{heading}</H3>}\n <IconButton\n aria-label={closeAriaLabel \|\| 'Close'}\n onClick={onClose}\n sx={{ position: 'absolute', right: 8, top: 18 }}\n >\n <Icon name=\"close\" sx={{ color: 'action.active' }} />\n </IconButton>\n {children}\n </Stack>\n </MuiDialog>\n )\n}\n\n/\n `amount_input_modal_block`: one whole-dollar setting edited in a dialog (Figma 441:24913 and\n * 5402:34137). The CTA's variant picks what is edited:\n * - `low_balance_threshold`: the `threshold` on the beat account's low-balance alert profile;\n * - `safety_net`: `savings_opportunity_minimum_checking_account_balance` on the insight profile.\n \n Registered with `presentation: 'modal'`, so no drawer opens behind it; closing the dialog ends\n * the action-drawer session. `observer` is required: the starting values are read from stores.\n /\nexport const AmountInputModalBlock = observer(function AmountInputModalBlock({\n beat,\n}: ActionBlockProps) {\n const { common: commonCopy, insights_feed: insightsFeedCopy } = useGlobalCopyStore()\n const { actionDrawer, closeActionDrawer } = useInsightsV2Store()\n const settingsStore = useSettingsStore()\n const { userInsightProfile } = useUserStore()\n const runHandler = useCtaHandler(beat, useBeatActions())\n\n const { primary_cta, secondary_cta, in_description_cta } = beat.insights_payload ?? {}\n const variant = getDynamicCtaBasedOnTriggers(\n actionDrawer,\n primary_cta,\n secondary_cta,\n in_description_cta,\n )?.variant\n const copy = insightsFeedCopy?.amount_input_modal\n const isLowBalance = variant === AMOUNT_INPUT_VARIANTS.LOW_BALANCE_THRESHOLD\n\n const lowBalanceProfile = isLowBalance\n ? findLowBalanceProfile(settingsStore.notificationProfiles, beat.primary_account_guid)\n : undefined\n const savedAmount = isLowBalance\n ? lowBalanceProfile?.threshold\n : userInsightProfile?.savings_opportunity_minimum_checking_account_balance\n\n // Mounted only while open (modal presentation), so mounting is the open: profiles are reloaded\n // here on each open, so the threshold prefills as saved now. `SettingsStore` swallows a failed\n // request, which leaves no profile for the account: the missing-profile error below covers it.\n const [isLoadingProfiles, setIsLoadingProfiles] = React.useState(isLowBalance)\n // False once unmounted: a save that resolves after the user closed the dialog must not close\n // (or update) whatever action session is open by then.\n const isMounted = React.useRef(true)\n\n React.useEffect(() => {\n isMounted.current = true\n\n return () => {\n isMounted.current = false\n }\n }, [])\n\n React.useEffect(() => {\n if (!isLowBalance) return\n\n void settingsStore.loadNotificationProfiles().finally(() => {\n if (isMounted.current) setIsLoadingProfiles(false)\n })\n }, [isLowBalance, settingsStore])\n\n // `null` until the user types: the field shows the saved amount until then.\n const [typed, setTyped] = React.useState<string \| null>(null)\n const [isSaving, setIsSaving] = React.useState(false)\n const [saveFailed, setSaveFailed] = React.useState(false)\n\n const value = typed ?? toInputValue(savedAmount)\n\n if (isLoadingProfiles) {\n return (\n <StatusDialog closeAriaLabel={commonCopy?.close_aria} onClose={closeActionDrawer}>\n <Loader />\n </StatusDialog>\n )\n }\n\n // Copy ships separately (see the doc's Rollout order), so check every string the form renders:\n // a partial ship falls to the error dialog instead of throwing mid-render.\n const variantCopy = isAmountInputVariant(variant) ? copy?.[variant] : undefined\n const hasCopy =\n !!variantCopy?.title &&\n !!variantCopy.description &&\n !!variantCopy.input_label &&\n !!copy?.whole_number_error &&\n !!copy.save_error &&\n !!commonCopy?.save_button &&\n // Cancel renders for the low-balance variant only.\n (!isLowBalance \|\| !!commonCopy.cancel_button) &&\n !!commonCopy.close_aria\n const hasProfile = isLowBalance ? !!lowBalanceProfile : !!userInsightProfile\n\n if (!copy \|\| !variantCopy \|\| !hasCopy \|\| !hasProfile) {\n // One message to the user; distinct warnings so a rollout problem can be traced to its cause.\n console.warn(\n `amount_input_modal_block: ${\n !copy\n ? 'copy namespace missing'\n : !isAmountInputVariant(variant)\n ? `unknown variant \"${variant}\"`\n : !hasCopy\n ? `copy incomplete for \"${variant}\"`\n : isLowBalance\n ? 'no low-balance profile for the account'\n : 'user insight profile not set by the host'\n }`,\n )\n\n return (\n <StatusDialog\n closeAriaLabel={commonCopy?.close_aria}\n heading={commonCopy?.error_heading}\n onClose={closeActionDrawer}\n >\n <Text>{commonCopy?.error_message}</Text>\n </StatusDialog>\n )\n }\n\n const isEdit = !isLowBalance && !!savedAmount\n const accountName = beat.primary_account ? getAccountDisplayName(beat.primary_account) : ''\n const isValid = isWholeAmount(value)\n const isInvalid = value !== '' && !isValid\n\n const handleSave = async () => {\n // Guarded here too, not only by the disabled button: Enter submits the dialog's form directly.\n if (!isValid \|\| isSaving) return\n\n const amount = Number(value)\n\n setIsSaving(true)\n setSaveFailed(false)\n\n const ok = isLowBalance\n ? await runHandler('updateNotificationProfileThreshold', {\n profileGuid: lowBalanceProfile?.guid,\n threshold: amount,\n })\n : await runHandler('updateUserInsightProfile', {\n fields: { savings_opportunity_minimum_checking_account_balance: amount },\n })\n\n if (!isMounted.current) return\n\n setIsSaving(false)\n\n if (ok) closeActionDrawer()\n else setSaveFailed(true)\n }\n\n return (\n <CurrencyDialog\n closeAriaLabel={commonCopy.close_aria}\n // Only strings and the <strong> go in, so the result is renderable (the helper's type also\n // admits raw DOM nodes).\n content={\n buildDynamicCopy(\n (isEdit && variantCopy.description_edit) \|\| variantCopy.description,\n <strong key=\"account\">{accountName}</strong>,\n ) as React.ReactNode\n }\n errorText={isInvalid ? copy.whole_number_error : saveFailed ? copy.save_error : undefined}\n handleInputChange={(next) => {\n setTyped(next)\n setSaveFailed(false)\n }}\n handleModalClose={closeActionDrawer}\n handlePrimaryAction={() => void handleSave()}\n handleSecondaryAction={closeActionDrawer}\n inputLabel={variantCopy.input_label}\n inputValue={value}\n isOpen={true}\n isPrimaryDisabled={isSaving \|\| !isValid}\n primaryText={commonCopy.save_button}\n secondaryText={isLowBalance ? commonCopy.cancel_button : undefined}\n subtitle={\n isLowBalance && beat.primary_account ? (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n {/ Decorative: the account name is the visible text beside it. */}\n <InstitutionLogo\n alt=\"\"\n institutionGuid={beat.primary_account.institution_guid ?? ''}\n size={16}\n />\n <Text color=\"text.secondary\" uppercase={true} variant=\"body2\">\n {accountName}\n </Text>\n </Stack>\n ) : undefined\n }\n title={(isEdit && variantCopy.title_edit) \|\| variantCopy.title}\n />\n )\n})\n"],"mappings":"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"}
1	+ {"version":3,"file":"AmountInputModalBlock.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/AmountInputModalBlock/AmountInputModalBlock.tsx"],"sourcesContent":["import React from 'react'\n\nimport Stack from '@mui/material/Stack'\n\nimport MuiDialog from '@mui/material/Dialog'\nimport IconButton from '@mui/material/IconButton'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { H3, InstitutionLogo, Text } from '@mxenabled/mxui'\nimport { observer } from 'mobx-react-lite'\n\nimport {\n CurrencyDialog,\n Loader,\n buildDynamicCopy,\n useGlobalCopyStore,\n useInsightsV2Store,\n useSettingsStore,\n useUserStore,\n} from '../../../common'\nimport getAccountDisplayName from '../../../common/utils/AccountDisplayName'\nimport { ANALYTICS_EVENTS_CONFIG, useAnalyticsEvent } from '../../analytics'\nimport { useBeatActions } from '../../beatActions'\nimport { useCtaHandler } from '../../ctaActions'\nimport type { ActionBlockProps } from '../../mappings/blocks'\nimport { getDynamicCtaBasedOnTriggers } from '../util'\n\nimport {\n AMOUNT_INPUT_VARIANTS,\n findLowBalanceProfile,\n isAmountInputVariant,\n isWholeAmount,\n toInputValue,\n} from './layout'\n\n/*\n The dialog frame for the states that have no form: loading, and a non-retriable problem. Named by\n * its heading and closable by button, Esc and backdrop, like the form dialog.\n /\nconst StatusDialog = ({\n children,\n closeAriaLabel,\n heading,\n onClose,\n}: React.PropsWithChildren<{ closeAriaLabel?: string; heading?: string; onClose: () => void }>) => {\n const headingId = React.useId()\n\n return (\n <MuiDialog\n aria-labelledby={heading ? headingId : undefined}\n maxWidth=\"xs\"\n onClose={onClose}\n open={true}\n >\n <Stack sx={{ gap: 12, p: 24, position: 'relative' }}>\n {heading && <H3 id={headingId}>{heading}</H3>}\n <IconButton\n aria-label={closeAriaLabel \|\| 'Close'}\n onClick={onClose}\n sx={{ position: 'absolute', right: 8, top: 18 }}\n >\n <Icon name=\"close\" sx={{ color: 'action.active' }} />\n </IconButton>\n {children}\n </Stack>\n </MuiDialog>\n )\n}\n\n/\n `amount_input_modal_block`: one whole-dollar setting edited in a dialog (Figma 441:24913 and\n * 5402:34137). The CTA's variant picks what is edited:\n * - `low_balance_threshold`: the `threshold` on the beat account's low-balance alert profile;\n * - `safety_net`: `savings_opportunity_minimum_checking_account_balance` on the insight profile.\n \n Registered with `presentation: 'modal'`, so no drawer opens behind it; closing the dialog ends\n * the action-drawer session. `observer` is required: the starting values are read from stores.\n /\nexport const AmountInputModalBlock = observer(function AmountInputModalBlock({\n beat,\n}: ActionBlockProps) {\n const { common: commonCopy, insights_feed: insightsFeedCopy } = useGlobalCopyStore()\n const { actionDrawer, closeActionDrawer } = useInsightsV2Store()\n const settingsStore = useSettingsStore()\n const { userInsightProfile } = useUserStore()\n const runHandler = useCtaHandler(beat, useBeatActions())\n const fireAnalyticsEvent = useAnalyticsEvent()\n\n const { primary_cta, secondary_cta, in_description_cta } = beat.insights_payload ?? {}\n const variant = getDynamicCtaBasedOnTriggers(\n actionDrawer,\n primary_cta,\n secondary_cta,\n in_description_cta,\n )?.variant\n const copy = insightsFeedCopy?.amount_input_modal\n const isLowBalance = variant === AMOUNT_INPUT_VARIANTS.LOW_BALANCE_THRESHOLD\n\n const lowBalanceProfile = isLowBalance\n ? findLowBalanceProfile(settingsStore.notificationProfiles, beat.primary_account_guid)\n : undefined\n const savedAmount = isLowBalance\n ? lowBalanceProfile?.threshold\n : userInsightProfile?.savings_opportunity_minimum_checking_account_balance\n\n // Mounted only while open (modal presentation), so mounting is the open: profiles are reloaded\n // here on each open, so the threshold prefills as saved now. `SettingsStore` swallows a failed\n // request, which leaves no profile for the account: the missing-profile error below covers it.\n const [isLoadingProfiles, setIsLoadingProfiles] = React.useState(isLowBalance)\n // False once unmounted: a save that resolves after the user closed the dialog must not close\n // (or update) whatever action session is open by then.\n const isMounted = React.useRef(true)\n\n React.useEffect(() => {\n isMounted.current = true\n\n return () => {\n isMounted.current = false\n }\n }, [])\n\n React.useEffect(() => {\n if (!isLowBalance) return\n\n void settingsStore.loadNotificationProfiles().finally(() => {\n if (isMounted.current) setIsLoadingProfiles(false)\n })\n }, [isLowBalance, settingsStore])\n\n // `null` until the user types: the field shows the saved amount until then.\n const [typed, setTyped] = React.useState<string \| null>(null)\n const [isSaving, setIsSaving] = React.useState(false)\n const [saveFailed, setSaveFailed] = React.useState(false)\n\n const value = typed ?? toInputValue(savedAmount)\n\n if (isLoadingProfiles) {\n return (\n <StatusDialog closeAriaLabel={commonCopy?.close_aria} onClose={closeActionDrawer}>\n <Loader />\n </StatusDialog>\n )\n }\n\n // Copy ships separately (see the doc's Rollout order), so check every string the form renders:\n // a partial ship falls to the error dialog instead of throwing mid-render.\n const variantCopy = isAmountInputVariant(variant) ? copy?.[variant] : undefined\n const hasCopy =\n !!variantCopy?.title &&\n !!variantCopy.description &&\n !!variantCopy.input_label &&\n !!copy?.whole_number_error &&\n !!copy.save_error &&\n !!commonCopy?.save_button &&\n // Cancel renders for the low-balance variant only.\n (!isLowBalance \|\| !!commonCopy.cancel_button) &&\n !!commonCopy.close_aria\n const hasProfile = isLowBalance ? !!lowBalanceProfile : !!userInsightProfile\n\n if (!copy \|\| !variantCopy \|\| !hasCopy \|\| !hasProfile) {\n // One message to the user; distinct warnings so a rollout problem can be traced to its cause.\n console.warn(\n `amount_input_modal_block: ${\n !copy\n ? 'copy namespace missing'\n : !isAmountInputVariant(variant)\n ? `unknown variant \"${variant}\"`\n : !hasCopy\n ? `copy incomplete for \"${variant}\"`\n : isLowBalance\n ? 'no low-balance profile for the account'\n : 'user insight profile not set by the host'\n }`,\n )\n\n return (\n <StatusDialog\n closeAriaLabel={commonCopy?.close_aria}\n heading={commonCopy?.error_heading}\n onClose={closeActionDrawer}\n >\n <Text>{commonCopy?.error_message}</Text>\n </StatusDialog>\n )\n }\n\n // Trigger 4 — user dismissed without saving (close icon, Cancel button, backdrop). Pulse\n // parity: EditThreshold.js close button / EditSafetyNet.js cancel button.\n const handleDismiss = () => {\n fireAnalyticsEvent(\n isLowBalance\n ? ANALYTICS_EVENTS_CONFIG.EDIT_INSIGHT_THRESHOLD_CANCELED\n : ANALYTICS_EVENTS_CONFIG.EDIT_SAFETY_NET_CANCEL,\n )\n closeActionDrawer()\n }\n\n const isEdit = !isLowBalance && !!savedAmount\n const accountName = beat.primary_account ? getAccountDisplayName(beat.primary_account) : ''\n const isValid = isWholeAmount(value)\n const isInvalid = value !== '' && !isValid\n\n const handleSave = async () => {\n // Guarded here too, not only by the disabled button: Enter submits the dialog's form directly.\n if (!isValid \|\| isSaving) return\n\n const amount = Number(value)\n\n setIsSaving(true)\n setSaveFailed(false)\n\n // Trigger 2: save analytics ride the handler run, fired only on success.\n const ok = isLowBalance\n ? await runHandler(\n 'updateNotificationProfileThreshold',\n { profileGuid: lowBalanceProfile?.guid, threshold: amount },\n { analytics: ANALYTICS_EVENTS_CONFIG.EDIT_INSIGHT_THRESHOLD_SAVE },\n )\n : await runHandler(\n 'updateUserInsightProfile',\n { fields: { savings_opportunity_minimum_checking_account_balance: amount } },\n { analytics: ANALYTICS_EVENTS_CONFIG.EDIT_SAFETY_NET_SAVE },\n )\n\n if (!isMounted.current) return\n\n setIsSaving(false)\n\n if (ok) closeActionDrawer()\n else setSaveFailed(true)\n }\n\n return (\n <CurrencyDialog\n closeAriaLabel={commonCopy.close_aria}\n // Only strings and the <strong> go in, so the result is renderable (the helper's type also\n // admits raw DOM nodes).\n content={\n buildDynamicCopy(\n (isEdit && variantCopy.description_edit) \|\| variantCopy.description,\n <strong key=\"account\">{accountName}</strong>,\n ) as React.ReactNode\n }\n errorText={isInvalid ? copy.whole_number_error : saveFailed ? copy.save_error : undefined}\n handleInputChange={(next) => {\n setTyped(next)\n setSaveFailed(false)\n }}\n handleInputClick={\n // Pulse fires input-selected for the threshold dialog only (EditThreshold.js); the\n // safety-net dialog has no input event.\n isLowBalance\n ? () => fireAnalyticsEvent(ANALYTICS_EVENTS_CONFIG.EDIT_INSIGHT_THRESHOLD_INPUT_SELECTED)\n : undefined\n }\n handleModalClose={handleDismiss}\n handlePrimaryAction={() => void handleSave()}\n handleSecondaryAction={handleDismiss}\n inputLabel={variantCopy.input_label}\n inputValue={value}\n isOpen={true}\n isPrimaryDisabled={isSaving \|\| !isValid}\n primaryText={commonCopy.save_button}\n secondaryText={isLowBalance ? commonCopy.cancel_button : undefined}\n subtitle={\n isLowBalance && beat.primary_account ? (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n {/ Decorative: the account name is the visible text beside it. */}\n <InstitutionLogo\n alt=\"\"\n institutionGuid={beat.primary_account.institution_guid ?? ''}\n size={16}\n />\n <Text color=\"text.secondary\" uppercase={true} variant=\"body2\">\n {accountName}\n </Text>\n </Stack>\n ) : undefined\n }\n title={(isEdit && variantCopy.title_edit) \|\| variantCopy.title}\n />\n )\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAuCA,IAAM,IAAA,CAAgB,EACpB,UAAA,GACA,gBAAA,GACA,SAAA,GACA,SAAA,EAAA,MACiG;AACjG,QAAM,IAAY,EAAM,MAAM;AAE9B,SACE,gBAAA,EAAC,IAAD;AAAA,IACE,mBAAiB,IAAU,IAAY;AAAA,IACvC,UAAS;AAAA,IACA,SAAA;AAAA,IACT,MAAM;AAAA,IAEN,UAAA,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,KAAK;AAAA,QAAI,GAAG;AAAA,QAAI,UAAU;AAAA,MAAW;AAAA,MAAlD,UAAA;AAAA,QACG,KAAW,gBAAA,EAAC,IAAD;AAAA,UAAI,IAAI;AAAA,UAAY,UAAA;AAAA,QAAY,CAAA;AAAA,QAC5C,gBAAA,EAAC,IAAD;AAAA,UACE,cAAY,KAAkB;AAAA,UAC9B,SAAS;AAAA,UACT,IAAI;AAAA,YAAE,UAAU;AAAA,YAAY,OAAO;AAAA,YAAG,KAAK;AAAA,UAAG;AAAA,UAE9C,UAAA,gBAAA,EAAC,IAAD;AAAA,YAAM,MAAK;AAAA,YAAQ,IAAI,EAAE,OAAO,gBAAgB;AAAA,UAAI,CAAA;AAAA,QAC1C,CAAA;AAAA,QACX;AAAA,MACI;AAAA;EACE,CAAA;AAEf,GAWa,KAAwB,GAAS,SAA+B,EAC3E,MAAA,EAAA,GACmB;AACnB,QAAM,EAAE,QAAQ,GAAY,eAAe,EAAA,IAAqB,EAAmB,GAC7E,EAAE,cAAA,GAAc,mBAAA,EAAA,IAAsB,EAAmB,GACzD,IAAgB,EAAiB,GACjC,EAAE,oBAAA,EAAA,IAAuB,EAAa,GACtC,IAAa,GAAc,GAAM,GAAe,CAAC,GACjD,IAAqB,GAAkB,GAEvC,EAAE,aAAA,GAAa,eAAA,GAAe,oBAAA,EAAA,IAAuB,EAAK,oBAAoB,CAAC,GAC/E,IAAU,GACd,GACA,GACA,GACA,CACF,GAAG,SACG,IAAO,GAAkB,oBACzB,IAAe,MAAY,GAAsB,uBAEjD,IAAoB,IACtB,GAAsB,EAAc,sBAAsB,EAAK,oBAAoB,IACnF,QACE,IAAc,IAChB,GAAmB,YACnB,GAAoB,sDAKlB,CAAC,GAAmB,CAAA,IAAwB,EAAM,SAAS,CAAY,GAGvE,IAAY,EAAM,OAAO,EAAI;AAEnC,EAAA,EAAM,UAAA,OACJ,EAAU,UAAU,IAEpB,MAAa;AACX,IAAA,EAAU,UAAU;AAAA,EACtB,IACC,CAAC,CAAC,GAEL,EAAM,UAAA,MAAgB;AACpB,IAAK,KAEL,EAAmB,yBAAyB,EAAE,QAAA,MAAc;AAC1D,MAAI,EAAU,WAAS,EAAqB,EAAK;AAAA,IACnD,CAAC;AAAA,EACH,GAAG,CAAC,GAAc,CAAa,CAAC;AAGhC,QAAM,CAAC,GAAO,CAAA,IAAY,EAAM,SAAwB,IAAI,GACtD,CAAC,GAAU,CAAA,IAAe,EAAM,SAAS,EAAK,GAC9C,CAAC,GAAY,CAAA,IAAiB,EAAM,SAAS,EAAK,GAElD,IAAQ,KAAS,GAAa,CAAW;AAE/C,MAAI,EACF,QACE,gBAAA,EAAC,GAAD;AAAA,IAAc,gBAAgB,GAAY;AAAA,IAAY,SAAS;AAAA,IAC7D,UAAA,gBAAA,EAAC,GAAD,CAAS,CAAA;AAAA,EACG,CAAA;AAMlB,QAAM,IAAc,EAAqB,CAAO,IAAI,IAAO,CAAA,IAAW,QAChE,IACJ,CAAC,CAAC,GAAa,SACf,CAAC,CAAC,EAAY,eACd,CAAC,CAAC,EAAY,eACd,CAAC,CAAC,GAAM,sBACR,CAAC,CAAC,EAAK,cACP,CAAC,CAAC,GAAY,gBAEb,CAAC,KAAgB,CAAC,CAAC,EAAW,kBAC/B,CAAC,CAAC,EAAW;AAGf,MAAI,CAAC,KAAQ,CAAC,KAAe,CAAC,KAAW,EAFtB,IAAiB,IAAsB;AAIxD,mBAAQ,KACN,6BACG,IAEI,EAAqB,CAAO,IAE1B,IAEC,IACE,2CACA,6CAHF,wBAAwB,CAAA,MAF1B,oBAAoB,CAAA,MAFtB,wBAOM,EAEd,GAGE,gBAAA,EAAC,GAAD;AAAA,MACE,gBAAgB,GAAY;AAAA,MAC5B,SAAS,GAAY;AAAA,MACrB,SAAS;AAAA,MAET,UAAA,gBAAA,EAAC,GAAD,EAAA,UAAO,GAAY,cAAoB,CAAA;AAAA,IAC3B,CAAA;AAMlB,QAAM,IAAA,MAAsB;AAC1B,IAAA,EACE,IACI,EAAwB,kCACxB,EAAwB,sBAC9B,GACA,EAAkB;AAAA,EACpB,GAEM,IAAS,CAAC,KAAgB,CAAC,CAAC,GAC5B,IAAc,EAAK,kBAAkB,EAAsB,EAAK,eAAe,IAAI,IACnF,IAAU,GAAc,CAAK,GAC7B,IAAY,MAAU,MAAM,CAAC,GAE7B,IAAa,YAAY;AAE7B,QAAI,CAAC,KAAW,EAAU;AAE1B,UAAM,IAAS,OAAO,CAAK;AAE3B,IAAA,EAAY,EAAI,GAChB,EAAc,EAAK;AAGnB,UAAM,IAAK,IACP,MAAM,EACJ,sCACA;AAAA,MAAE,aAAa,GAAmB;AAAA,MAAM,WAAW;AAAA,IAAO,GAC1D,EAAE,WAAW,EAAwB,4BAA4B,CACnE,IACA,MAAM,EACJ,4BACA,EAAE,QAAQ,EAAE,sDAAsD,EAAO,EAAE,GAC3E,EAAE,WAAW,EAAwB,qBAAqB,CAC5D;AAEJ,IAAK,EAAU,YAEf,EAAY,EAAK,GAEb,IAAI,EAAkB,IACrB,EAAc,EAAI;AAAA,EACzB;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,gBAAgB,EAAW;AAAA,IAG3B,SACE,EACG,KAAU,EAAY,oBAAqB,EAAY,aACxD,gBAAA,EAAC,UAAD,EAAA,UAAuB,EAAoB,GAA/B,SAA+B,CAC7C;AAAA,IAEF,WAAW,IAAY,EAAK,qBAAqB,IAAa,EAAK,aAAa;AAAA,IAChF,mBAAA,CAAoB,MAAS;AAC3B,MAAA,EAAS,CAAI,GACb,EAAc,EAAK;AAAA,IACrB;AAAA,IACA,kBAGE,IAAA,MACU,EAAmB,EAAwB,qCAAqC,IACtF;AAAA,IAEN,kBAAkB;AAAA,IAClB,qBAAA,MAAA;AAA2B,MAAK,EAAW;AAAA;AAAA,IAC3C,uBAAuB;AAAA,IACvB,YAAY,EAAY;AAAA,IACxB,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,mBAAmB,KAAY,CAAC;AAAA,IAChC,aAAa,EAAW;AAAA,IACxB,eAAe,IAAe,EAAW,gBAAgB;AAAA,IACzD,UACE,KAAgB,EAAK,kBACnB,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,eAAe;AAAA,QAAO,KAAK;AAAA,MAAE;AAAA,MAAhE,UAAA,CAEE,gBAAA,EAAC,IAAD;AAAA,QACE,KAAI;AAAA,QACJ,iBAAiB,EAAK,gBAAgB,oBAAoB;AAAA,QAC1D,MAAM;AAAA,MACP,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,QAAM,OAAM;AAAA,QAAiB,WAAW;AAAA,QAAM,SAAQ;AAAA,QACnD,UAAA;AAAA,MACG,CAAA,CACD;AAAA,IACL,CAAA,IAAA;AAAA,IAEN,OAAQ,KAAU,EAAY,cAAe,EAAY;AAAA,EAC1D,CAAA;AAEL,CAAC"}

package/dist/insights-v2/actionBlocks/ConnectWidgetActionBlock.es.js CHANGED Viewed

@@ -1,16 +1,22 @@
-import { useAccountStore as c, useInsightsV2Store as i } from "../../common/context/hooks.es.js";
-import s from "../../common/components/ConnectWidgetPanel.es.js";
-import { useEffect as u, useRef as f } from "react";
-import { observer as m } from "mobx-react-lite";
-import { jsx as p } from "react/jsx-runtime";
-var v = m(function({ beat: o }) {
-  const { actionDrawer: e } = i(), { refreshAccounts: n } = c(), t = e.isDrawerOpen && e.guid === o.guid, r = f(t);
-  return u(() => {
-    r.current && !t && n(), r.current = t;
-  }, [t]), /* @__PURE__ */ p(s, { isActive: t });
+import { useAccountStore as u, useInsightsV2Store as m } from "../../common/context/hooks.es.js";
+import a from "../../common/components/ConnectWidgetPanel.es.js";
+import { ANALYTICS_EVENTS_CONFIG as p } from "../analytics/analyticsEventsConfig.es.js";
+import { useAnalyticsEvent as A } from "../analytics/useAnalyticsEvent.es.js";
+import { useEffect as c, useRef as i } from "react";
+import { observer as E } from "mobx-react-lite";
+import { jsx as C } from "react/jsx-runtime";
+var S = E(function({ beat: s }) {
+  const { actionDrawer: e } = m(), { refreshAccounts: f } = u(), r = A(), t = e.isDrawerOpen && e.guid === s.guid, n = i(t);
+  c(() => {
+    n.current && !t && f(), n.current = t;
+  }, [t]);
+  const o = i(!1);
+  return c(() => {
+    t && !o.current && r(p.OPENED_CONNECT_DRAWER), o.current = t;
+  }, [t, r]), /* @__PURE__ */ C(a, { isActive: t });
 });
 export {
-  v as ConnectWidgetActionBlock
+  S as ConnectWidgetActionBlock
 };
 //# sourceMappingURL=ConnectWidgetActionBlock.es.js.map

package/dist/insights-v2/actionBlocks/ConnectWidgetActionBlock.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConnectWidgetActionBlock.es.js","names":[],"sources":["../../../src/insights-v2/actionBlocks/ConnectWidgetActionBlock.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { ConnectWidgetPanel, useAccountStore, useInsightsV2Store } from '../../common'\nimport type { ActionBlockProps } from '../mappings/blocks'\n\n/*\n `connect_widget_block` — opens MX's Connect widget itself via the shared\n * `ConnectWidgetPanel` (src/common): SSO url via ConnectStore and the\n * iframe-based `@mxenabled/web-widget-sdk` ConnectWidget, with loading/error\n * statuses.\n \n Renders the panel directly (not `ConnectDrawer`, which wraps it in its own\n * `Drawer`) — `ActionBlockLayer` already supplies the action drawer's chrome\n * (title from the CTA label, close button), so a second nested `Drawer` here\n * would produce two stacked drawers with two headers and two close buttons.\n \n `ActionBlockLayer` does not unmount a drawer-presentation block when the\n * drawer closes — it only toggles the `Drawer`'s `isOpen` — so the account\n * refresh (parity with `ConnectDrawer`'s own `onClose`) is driven by watching\n * this beat's `actionDrawer.isDrawerOpen` transition from true to false,\n * rather than an unmount effect, which would never fire.\n */\nexport const ConnectWidgetActionBlock = observer(function ConnectWidgetActionBlock({\n beat,\n}: ActionBlockProps) {\n const { actionDrawer } = useInsightsV2Store()\n const { refreshAccounts } = useAccountStore()\n\n const isCurrentBeatOpen = actionDrawer.isDrawerOpen && actionDrawer.guid === beat.guid\n const wasOpen = useRef(isCurrentBeatOpen)\n\n useEffect(() => {\n if (wasOpen.current && !isCurrentBeatOpen) {\n void refreshAccounts()\n }\n wasOpen.current = isCurrentBeatOpen\n }, [isCurrentBeatOpen])\n\n return <ConnectWidgetPanel isActive={isCurrentBeatOpen} />\n})\n"],"mappings":"~~;;;;;AAuBA~~,IAAa,IAA2B,EAAS,SAAkC,EACjF,MAAA,EAAA,GACmB;AACnB,QAAM,EAAE,cAAA,EAAA,IAAiB,EAAmB,GACtC,EAAE,iBAAA,EAAA,IAAoB,EAAgB,~~GAEtC~~,IAAoB,EAAa,gBAAgB,EAAa,SAAS,EAAK,MAC5E,IAAU,EAAO,CAAiB;AAExC,~~SAAA~~,EAAA,MAAgB;AACd,IAAI,EAAQ,WAAW,CAAC,KACtB,EAAqB,GAEvB,EAAQ,UAAU;AAAA,EACpB,GAAG,CAAC,CAAiB,CAAC,~~GAEf~~,gBAAA,EAAC,GAAD,EAAoB,UAAU,EAAoB,CAAA;AAC3D,CAAC"}
1	+ {"version":3,"file":"ConnectWidgetActionBlock.es.js","names":[],"sources":["../../../src/insights-v2/actionBlocks/ConnectWidgetActionBlock.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { ConnectWidgetPanel, useAccountStore, useInsightsV2Store } from '../../common'\nimport { ANALYTICS_EVENTS_CONFIG, useAnalyticsEvent } from '../analytics'\nimport type { ActionBlockProps } from '../mappings/blocks'\n\n/*\n `connect_widget_block` — opens MX's Connect widget itself via the shared\n * `ConnectWidgetPanel` (src/common): SSO url via ConnectStore and the\n * iframe-based `@mxenabled/web-widget-sdk` ConnectWidget, with loading/error\n * statuses.\n \n Renders the panel directly (not `ConnectDrawer`, which wraps it in its own\n * `Drawer`) — `ActionBlockLayer` already supplies the action drawer's chrome\n * (title from the CTA label, close button), so a second nested `Drawer` here\n * would produce two stacked drawers with two headers and two close buttons.\n \n `ActionBlockLayer` does not unmount a drawer-presentation block when the\n * drawer closes — it only toggles the `Drawer`'s `isOpen` — so the account\n * refresh (parity with `ConnectDrawer`'s own `onClose`) is driven by watching\n * this beat's `actionDrawer.isDrawerOpen` transition from true to false,\n * rather than an unmount effect, which would never fire.\n */\nexport const ConnectWidgetActionBlock = observer(function ConnectWidgetActionBlock({\n beat,\n}: ActionBlockProps) {\n const { actionDrawer } = useInsightsV2Store()\n const { refreshAccounts } = useAccountStore()\n const fireAnalyticsEvent = useAnalyticsEvent()\n\n const isCurrentBeatOpen = actionDrawer.isDrawerOpen && actionDrawer.guid === beat.guid\n const wasOpen = useRef(isCurrentBeatOpen)\n\n useEffect(() => {\n if (wasOpen.current && !isCurrentBeatOpen) {\n void refreshAccounts()\n }\n wasOpen.current = isCurrentBeatOpen\n }, [isCurrentBeatOpen])\n\n // OPENED_CONNECT_DRAWER: the drawer actually opened (any path — CTA or otherwise). Own ref +\n // effect, separate from the refresh logic above: this one is rising-edge, so its ref starts\n // `false` — the block's first render typically happens with the drawer already open (children\n // render on open), and that first open must fire too. Fires once per open, re-arms on close.\n // Pulse parity: ConnectDiscoveredAccounts/Beat.js onPrimaryCtaClick's `opened_connect_drawer`.\n const hasFiredOpen = useRef(false)\n\n useEffect(() => {\n if (isCurrentBeatOpen && !hasFiredOpen.current) {\n fireAnalyticsEvent(ANALYTICS_EVENTS_CONFIG.OPENED_CONNECT_DRAWER)\n }\n hasFiredOpen.current = isCurrentBeatOpen\n }, [isCurrentBeatOpen, fireAnalyticsEvent])\n\n return <ConnectWidgetPanel isActive={isCurrentBeatOpen} />\n})\n"],"mappings":";;;;;;;AAwBA,IAAa,IAA2B,EAAS,SAAkC,EACjF,MAAA,EAAA,GACmB;AACnB,QAAM,EAAE,cAAA,EAAA,IAAiB,EAAmB,GACtC,EAAE,iBAAA,EAAA,IAAoB,EAAgB,GACtC,IAAqB,EAAkB,GAEvC,IAAoB,EAAa,gBAAgB,EAAa,SAAS,EAAK,MAC5E,IAAU,EAAO,CAAiB;AAExC,EAAA,EAAA,MAAgB;AACd,IAAI,EAAQ,WAAW,CAAC,KACtB,EAAqB,GAEvB,EAAQ,UAAU;AAAA,EACpB,GAAG,CAAC,CAAiB,CAAC;AAOtB,QAAM,IAAe,EAAO,EAAK;AAEjC,SAAA,EAAA,MAAgB;AACd,IAAI,KAAqB,CAAC,EAAa,WACrC,EAAmB,EAAwB,qBAAqB,GAElE,EAAa,UAAU;AAAA,EACzB,GAAG,CAAC,GAAmB,CAAkB,CAAC,GAEnC,gBAAA,EAAC,GAAD,EAAoB,UAAU,EAAoB,CAAA;AAC3D,CAAC"}