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

@mx-cartographer/experiences 9.6.11 → 9.6.13

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

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js CHANGED Viewed

@@ -1,27 +1,28 @@
-import { formatCurrency as b } from "../../../../core/utils/NumberFormatting.es.js";
-import { useContainerDimensions as S } from "../../../hooks/useContainerDimensions.es.js";
-import { DepositLogo as D } from "../../../components/ComponentBlocks/DepositLogo.es.js";
-import { Confetti as z } from "../../../components/shared/Confetti.es.js";
-import { ReactComponent as L } from "../../../components/shared/images/PaidOffCard.es.js";
-import { ReactComponent as $ } from "../../../components/shared/images/SavingsAccountDeposit.es.js";
-import { resolveVariantConfig as B } from "../../resolveVariantConfig.es.js";
-import { HeaderComponent as G } from "./HeaderComponent.es.js";
-import { getLayoutConfig as N } from "./layout.es.js";
-import { IconComponent as P } from "./IconComponent.es.js";
-import { useRef as V } from "react";
+import { slot as m } from "../../../../core/types/Insights.es.js";
+import { formatCurrency as R } from "../../../../core/utils/NumberFormatting.es.js";
+import { useContainerDimensions as L } from "../../../hooks/useContainerDimensions.es.js";
+import { DepositLogo as $ } from "../../../components/ComponentBlocks/DepositLogo.es.js";
+import { Confetti as B } from "../../../components/shared/Confetti.es.js";
+import { ReactComponent as G } from "../../../components/shared/images/PaidOffCard.es.js";
+import { ReactComponent as N } from "../../../components/shared/images/SavingsAccountDeposit.es.js";
+import { resolveVariantConfig as P } from "../../resolveVariantConfig.es.js";
+import { HeaderComponent as V } from "./HeaderComponent.es.js";
+import { getLayoutConfig as j } from "./layout.es.js";
+import { IconComponent as A } from "./IconComponent.es.js";
+import { useRef as F } from "react";
 import t from "@mui/material/Stack";
-import { Text as a } from "@mxenabled/mxui";
-import { Icon as j } from "@mxenabled/mx-icons";
+import { Text as s } from "@mxenabled/mxui";
+import { Icon as E } from "@mxenabled/mx-icons";
 import { jsx as o, jsxs as r } from "react/jsx-runtime";
-import { useTheme as A } from "@mui/material/styles";
+import { useTheme as H } from "@mui/material/styles";
 import i from "@mui/material/Box";
-var F = {
+var O = {
   deposit_received: "payments",
   status_on_track: "monetization_on"
-}, io = ({ payload: y }) => {
-  const v = A(), c = V(null), { height: d, width: l } = S(c), { instance_slot: m } = y, { variant: s, amount: p, sub_text: w, header_text: n, institution_guid: h, institution_name: u, icon_name: R, label: _, merchant_guid: C, merchant_name: f, category_guid: k } = m, e = B(N(v), s, "default", "AccountBlock");
+}, co = ({ payload: _ }) => {
+  const C = H(), p = F(null), { height: u, width: h } = L(p), { instance_slot: n } = _, { variant: c, header_text: a, institution_guid: f, institution_name: g, icon_name: k, label: T, merchant_guid: I, merchant_name: x, category_guid: S } = n, { data: d } = n, l = m(d, "amount") ?? n.amount, b = m(d, "sub_text") ?? n.sub_text, y = m(d, "logo"), e = P(j(C), c, "default", "AccountBlock");
   if (e?.isConfetti) {
-    const T = {
+    const D = {
       paidOffCard: /* @__PURE__ */ o(i, {
         sx: {
           flexShrink: 0,
@@ -29,7 +30,7 @@ var F = {
           position: "relative",
           width: 44
         },
-        children: /* @__PURE__ */ o(L, {
+        children: /* @__PURE__ */ o(G, {
           "aria-hidden": !0,
           role: "presentation",
           style: {
@@ -39,7 +40,7 @@ var F = {
           }
         })
       }),
-      savings: /* @__PURE__ */ o($, {
+      savings: /* @__PURE__ */ o(N, {
         "aria-hidden": !0,
         height: 55,
         role: "presentation",
@@ -53,27 +54,27 @@ var F = {
           overflow: "hidden",
           width: 48
         },
-        children: /* @__PURE__ */ o(D, {
-          categoryGuid: k,
-          iconName: F[s] ?? "payments",
-          institutionGuid: h,
-          institutionName: u,
-          merchantGuid: C,
-          merchantName: f
+        children: /* @__PURE__ */ o($, {
+          categoryGuid: S,
+          iconName: O[c] ?? "payments",
+          institutionGuid: f,
+          institutionName: g,
+          merchantGuid: I,
+          merchantName: x
         })
       })
-    }[e.graphic ?? "logo"], g = e.secondarySource === "merchant" ? f ?? u : _, x = g ? /* @__PURE__ */ o(a, {
+    }[e.graphic ?? "logo"], v = e.secondarySource === "merchant" ? x ?? g : T, w = v ? /* @__PURE__ */ o(s, {
       color: e.secondaryColor,
       variant: e.secondaryVariant,
-      children: g
-    }) : null, I = /* @__PURE__ */ o(a, {
+      children: v
+    }) : null, z = /* @__PURE__ */ o(s, {
       bold: !0,
       color: "success.dark",
       variant: e.amountVariant,
-      children: `${e.amountPrefix ?? ""}${b(p, "0,0.00")}`
+      children: `${e.amountPrefix ?? ""}${R(l, "0,0.00")}`
     });
     return /* @__PURE__ */ r(i, {
-      ref: c,
+      ref: p,
       sx: {
         backgroundImage: e.gradient,
         bgcolor: "background.paper",
@@ -89,10 +90,10 @@ var F = {
           position: "absolute",
           zIndex: 1
         },
-        children: /* @__PURE__ */ o(z, {
-          height: d,
-          shouldRun: d > 0 && l > 0,
-          width: l
+        children: /* @__PURE__ */ o(B, {
+          height: u,
+          shouldRun: u > 0 && h > 0,
+          width: h
         })
       }), /* @__PURE__ */ r(t, {
         sx: {
@@ -102,16 +103,16 @@ var F = {
           width: "100%",
           zIndex: 2
         },
-        children: [e.categoryStrip && n && /* @__PURE__ */ o(i, {
+        children: [e.categoryStrip && a && /* @__PURE__ */ o(i, {
           sx: {
             bgcolor: "success.main",
             px: 12,
             py: 4
           },
-          children: /* @__PURE__ */ o(a, {
+          children: /* @__PURE__ */ o(s, {
             color: "success.contrastText",
             variant: "caption",
-            children: n
+            children: a
           })
         }), /* @__PURE__ */ r(t, {
           sx: {
@@ -133,16 +134,16 @@ var F = {
               display: "flex",
               flexShrink: 0
             },
-            children: T
+            children: D
           }), /* @__PURE__ */ r(t, {
             sx: {
               flex: "1 0 0",
               minWidth: 0
             },
             children: [
-              e.secondaryPosition === "above" && x,
-              I,
-              e.secondaryPosition === "below" && x
+              e.secondaryPosition === "above" && w,
+              z,
+              e.secondaryPosition === "below" && w
             ]
           })]
         })]
@@ -154,47 +155,48 @@ var F = {
       p: 16,
       ...e
     },
-    children: [n && /* @__PURE__ */ o(G, { headerText: n }), /* @__PURE__ */ r(t, {
+    children: [a && /* @__PURE__ */ o(V, { headerText: a }), /* @__PURE__ */ r(t, {
       sx: {
         alignItems: "center",
         bgcolor: "background.paper",
         borderRadius: "8px",
-        ...n && {
+        ...a && {
           borderTopLeftRadius: "0",
           borderTopRightRadius: "0"
         },
         gap: 16,
         p: 16,
         width: "100%",
-        ...(h || R) && { flexDirection: "row" }
+        ...(f || k || y?.guid) && { flexDirection: "row" }
       },
-      children: [/* @__PURE__ */ o(P, {
-        slot: m,
-        variant: s
-      }), /* @__PURE__ */ r(t, { children: [/* @__PURE__ */ o(a, {
+      children: [/* @__PURE__ */ o(A, {
+        logo: y,
+        slot: n,
+        variant: c
+      }), /* @__PURE__ */ r(t, { children: [l != null && /* @__PURE__ */ o(s, {
         variant: "h1",
-        children: b(p, "0,0.00")
+        children: R(l, "0,0.00")
       }), /* @__PURE__ */ r(t, {
         sx: {
           gap: 8,
           flexDirection: "row",
           alignItems: "center"
         },
-        children: [e?.sub_logo && /* @__PURE__ */ o(j, {
+        children: [e?.sub_logo && /* @__PURE__ */ o(E, {
           color: "warning",
           fill: !0,
           name: e.sub_logo,
           size: 20
-        }), /* @__PURE__ */ o(a, {
+        }), b && /* @__PURE__ */ o(s, {
           variant: "body2",
-          children: w
+          children: b
         })]
       })] })]
     })]
   });
 };
 export {
-  io as default
+  co as default
 };
 //# sourceMappingURL=AccountBlock.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AccountBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useRef } from 'react'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport type { InsightsPayload } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\nimport { DepositLogo } from '../../../components/ComponentBlocks/DepositLogo'\nimport { Confetti } from '../../../components/shared/Confetti'\nimport { ReactComponent as PaidOffCardGraphic } from '../../../components/shared/images/PaidOffCard.svg'\nimport { ReactComponent as SavingsGraphic } from '../../../components/shared/images/SavingsAccountDeposit.svg'\nimport { useContainerDimensions } from '../../../hooks/useContainerDimensions'\n\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\n\nimport { HeaderComponent } from './HeaderComponent'\nimport { IconComponent } from './IconComponent'\nimport { getLayoutConfig } from './layout'\n\n/** Default generic-tile icon per deposit variant, used when no merchant/institution logo. */\nconst depositIcons: Record<string, string> = {\n deposit_received: 'payments',\n status_on_track: 'monetization_on',\n}\n\nconst AccountBlock = ({ payload }: { payload: InsightsPayload; beatGuid?: string }) => {\n const theme = useTheme()\n const containerRef = useRef<HTMLDivElement>(null)\n const { height, width } = useContainerDimensions(containerRef)\n const { instance_slot } = payload\n const {\n variant,\n amount,\n sub_text,\n header_text,\n institution_guid,\n institution_name,\n icon_name,\n label,\n merchant_guid,\n merchant_name,\n category_guid,\n } = instance_slot\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n // Confetti-backed celebration variants (deposits, payoff, savings) — a success-tinted card\n // on a gradient + confetti wash. Everything variant-specific is flat on `layoutConfig`.\n if (layoutConfig?.isConfetti) {\n const graphics: Record<string, React.ReactNode> = {\n paidOffCard: (\n // SVG is 58x46 but the card sits at (0,14) with the check badge overflowing top-right.\n // Box it to the card's real 44x32 footprint and shift the SVG up so it aligns with the text.\n <Box sx={{ flexShrink: 0, height: 32, position: 'relative', width: 44 }}>\n <PaidOffCardGraphic\n aria-hidden={true}\n role=\"presentation\"\n style={{ left: 0, position: 'absolute', top: -14 }}\n />\n </Box>\n ),\n savings: <SavingsGraphic aria-hidden={true} height={55} role=\"presentation\" width={55} />,\n logo: (\n <Box\n sx={{\n borderRadius: '4px',\n flexShrink: 0,\n height: 48,\n overflow: 'hidden',\n width: 48,\n }}\n >\n <DepositLogo\n categoryGuid={category_guid}\n iconName={depositIcons[variant as keyof typeof depositIcons] ?? 'payments'}\n institutionGuid={institution_guid}\n institutionName={institution_name}\n merchantGuid={merchant_guid}\n merchantName={merchant_name}\n />\n </Box>\n ),\n }\n const graphic = graphics[layoutConfig.graphic ?? 'logo']\n\n // Deposit cards show the payer name — a merchant when we have one, otherwise the institution.\n const secondaryText =\n layoutConfig.secondarySource === 'merchant' ? (merchant_name ?? institution_name) : label\n const secondary = secondaryText ? (\n <Text color={layoutConfig.secondaryColor} variant={layoutConfig.secondaryVariant}>\n {secondaryText}\n </Text>\n ) : null\n const amountText = (\n <Text bold={true} color=\"success.dark\" variant={layoutConfig.amountVariant}>\n {`${layoutConfig.amountPrefix ?? ''}${formatCurrency(amount, '0,0.00')}`}\n </Text>\n )\n\n return (\n <Box\n ref={containerRef}\n sx={{\n backgroundImage: layoutConfig.gradient,\n bgcolor: 'background.paper',\n overflow: 'hidden',\n position: 'relative',\n p: 16,\n width: '100%',\n }}\n >\n <Box\n sx={{\n inset: 0,\n pointerEvents: 'none',\n position: 'absolute',\n zIndex: 1,\n }}\n >\n <Confetti height={height} shouldRun={height > 0 && width > 0} width={width} />\n </Box>\n\n <Stack\n sx={{\n borderRadius: '8px',\n overflow: 'hidden',\n position: 'relative',\n width: '100%',\n zIndex: 2,\n }}\n >\n {layoutConfig.categoryStrip && header_text && (\n <Box sx={{ bgcolor: 'success.main', px: 12, py: 4 }}>\n <Text color=\"success.contrastText\" variant=\"caption\">\n {header_text}\n </Text>\n </Box>\n )}\n\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'success.lighter',\n border: '1px solid',\n borderColor: 'success.main',\n borderRadius: '8px',\n // With a strip above, the body's top corners tuck under it (no double border line).\n ...(layoutConfig.categoryStrip && {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderTop: 0,\n }),\n flexDirection: 'row',\n ...layoutConfig.rowSx,\n }}\n >\n <Box sx={{ display: 'flex', flexShrink: 0 }}>{graphic}</Box>\n\n <Stack sx={{ flex: '1 0 0', minWidth: 0 }}>\n {layoutConfig.secondaryPosition === 'above' && secondary}\n {amountText}\n {layoutConfig.secondaryPosition === 'below' && secondary}\n </Stack>\n </Stack>\n </Stack>\n </Box>\n )\n }\n\n return (\n <Stack\n sx={{\n p: 16,\n ...layoutConfig,\n }}\n >\n {header_text && <HeaderComponent headerText={header_text} />}\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'background.paper',\n borderRadius: '8px',\n ...(header_text && {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n }),\n gap: 16,\n p: 16,\n width: '100%',\n ...((institution_guid \|\| icon_name) && {\n flexDirection: 'row',\n }),\n }}\n >\n <IconComponent slot={instance_slot} variant={variant} />\n\n <Stack>\n <Text variant=\"h1\">{formatCurrency(amount, '0,0.00')}</Text>\n <Stack sx={{ gap: 8, flexDirection: 'row', alignItems: 'center' }}>\n {layoutConfig?.sub_logo && (\n <Icon color=\"warning\" fill={true} name={layoutConfig.sub_logo} size={20} />\n )}\n <Text variant=\"body2\">{sub_text}</Text>\n </Stack>\n </Stack>\n </Stack>\n </Stack>\n )\n}\n\nexport default AccountBlock\n"],"mappings":"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"}
1	+ {"version":3,"file":"AccountBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useRef } from 'react'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { slot, type InsightsPayload, type LogoRef } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\nimport { DepositLogo } from '../../../components/ComponentBlocks/DepositLogo'\nimport { Confetti } from '../../../components/shared/Confetti'\nimport { ReactComponent as PaidOffCardGraphic } from '../../../components/shared/images/PaidOffCard.svg'\nimport { ReactComponent as SavingsGraphic } from '../../../components/shared/images/SavingsAccountDeposit.svg'\nimport { useContainerDimensions } from '../../../hooks/useContainerDimensions'\n\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\n\nimport { HeaderComponent } from './HeaderComponent'\nimport { IconComponent } from './IconComponent'\nimport { getLayoutConfig } from './layout'\n\n/** Default generic-tile icon per deposit variant, used when no merchant/institution logo. */\nconst depositIcons: Record<string, string> = {\n deposit_received: 'payments',\n status_on_track: 'monetization_on',\n}\n\nconst AccountBlock = ({ payload }: { payload: InsightsPayload; beatGuid?: string }) => {\n const theme = useTheme()\n const containerRef = useRef<HTMLDivElement>(null)\n const { height, width } = useContainerDimensions(containerRef)\n const { instance_slot } = payload\n const {\n variant,\n header_text,\n institution_guid,\n institution_name,\n icon_name,\n label,\n merchant_guid,\n merchant_name,\n category_guid,\n } = instance_slot\n // V2 variants fill `instance_slot.data` (ditto's account_block slots); the rest still send the\n // flat legacy fields, so each value falls back to its flat field.\n const { data } = instance_slot\n const amount = slot<number>(data, 'amount') ?? instance_slot.amount\n const sub_text = slot<string>(data, 'sub_text') ?? instance_slot.sub_text\n const logo = slot<LogoRef>(data, 'logo')\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n // Confetti-backed celebration variants (deposits, payoff, savings) — a success-tinted card\n // on a gradient + confetti wash. Everything variant-specific is flat on `layoutConfig`.\n if (layoutConfig?.isConfetti) {\n const graphics: Record<string, React.ReactNode> = {\n paidOffCard: (\n // SVG is 58x46 but the card sits at (0,14) with the check badge overflowing top-right.\n // Box it to the card's real 44x32 footprint and shift the SVG up so it aligns with the text.\n <Box sx={{ flexShrink: 0, height: 32, position: 'relative', width: 44 }}>\n <PaidOffCardGraphic\n aria-hidden={true}\n role=\"presentation\"\n style={{ left: 0, position: 'absolute', top: -14 }}\n />\n </Box>\n ),\n savings: <SavingsGraphic aria-hidden={true} height={55} role=\"presentation\" width={55} />,\n logo: (\n <Box\n sx={{\n borderRadius: '4px',\n flexShrink: 0,\n height: 48,\n overflow: 'hidden',\n width: 48,\n }}\n >\n <DepositLogo\n categoryGuid={category_guid}\n iconName={depositIcons[variant as keyof typeof depositIcons] ?? 'payments'}\n institutionGuid={institution_guid}\n institutionName={institution_name}\n merchantGuid={merchant_guid}\n merchantName={merchant_name}\n />\n </Box>\n ),\n }\n const graphic = graphics[layoutConfig.graphic ?? 'logo']\n\n // Deposit cards show the payer name — a merchant when we have one, otherwise the institution.\n const secondaryText =\n layoutConfig.secondarySource === 'merchant' ? (merchant_name ?? institution_name) : label\n const secondary = secondaryText ? (\n <Text color={layoutConfig.secondaryColor} variant={layoutConfig.secondaryVariant}>\n {secondaryText}\n </Text>\n ) : null\n const amountText = (\n <Text bold={true} color=\"success.dark\" variant={layoutConfig.amountVariant}>\n {`${layoutConfig.amountPrefix ?? ''}${formatCurrency(amount, '0,0.00')}`}\n </Text>\n )\n\n return (\n <Box\n ref={containerRef}\n sx={{\n backgroundImage: layoutConfig.gradient,\n bgcolor: 'background.paper',\n overflow: 'hidden',\n position: 'relative',\n p: 16,\n width: '100%',\n }}\n >\n <Box\n sx={{\n inset: 0,\n pointerEvents: 'none',\n position: 'absolute',\n zIndex: 1,\n }}\n >\n <Confetti height={height} shouldRun={height > 0 && width > 0} width={width} />\n </Box>\n\n <Stack\n sx={{\n borderRadius: '8px',\n overflow: 'hidden',\n position: 'relative',\n width: '100%',\n zIndex: 2,\n }}\n >\n {layoutConfig.categoryStrip && header_text && (\n <Box sx={{ bgcolor: 'success.main', px: 12, py: 4 }}>\n <Text color=\"success.contrastText\" variant=\"caption\">\n {header_text}\n </Text>\n </Box>\n )}\n\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'success.lighter',\n border: '1px solid',\n borderColor: 'success.main',\n borderRadius: '8px',\n // With a strip above, the body's top corners tuck under it (no double border line).\n ...(layoutConfig.categoryStrip && {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderTop: 0,\n }),\n flexDirection: 'row',\n ...layoutConfig.rowSx,\n }}\n >\n <Box sx={{ display: 'flex', flexShrink: 0 }}>{graphic}</Box>\n\n <Stack sx={{ flex: '1 0 0', minWidth: 0 }}>\n {layoutConfig.secondaryPosition === 'above' && secondary}\n {amountText}\n {layoutConfig.secondaryPosition === 'below' && secondary}\n </Stack>\n </Stack>\n </Stack>\n </Box>\n )\n }\n\n return (\n <Stack\n sx={{\n p: 16,\n ...layoutConfig,\n }}\n >\n {header_text && <HeaderComponent headerText={header_text} />}\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'background.paper',\n borderRadius: '8px',\n ...(header_text && {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n }),\n gap: 16,\n p: 16,\n width: '100%',\n ...((institution_guid \|\| icon_name \|\| logo?.guid) && {\n flexDirection: 'row',\n }),\n }}\n >\n <IconComponent logo={logo} slot={instance_slot} variant={variant} />\n\n <Stack>\n {amount != null && <Text variant=\"h1\">{formatCurrency(amount, '0,0.00')}</Text>}\n <Stack sx={{ gap: 8, flexDirection: 'row', alignItems: 'center' }}>\n {layoutConfig?.sub_logo && (\n <Icon color=\"warning\" fill={true} name={layoutConfig.sub_logo} size={20} />\n )}\n {sub_text && <Text variant=\"body2\">{sub_text}</Text>}\n </Stack>\n </Stack>\n </Stack>\n </Stack>\n )\n}\n\nexport default AccountBlock\n"],"mappings":"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"}

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.d.ts CHANGED Viewed

@@ -1,7 +1,9 @@
-import { InstanceSlot } from '../../../../core';
+import { InstanceSlot, LogoRef } from '../../../../core';
 interface IconComponentProps {
     slot: InstanceSlot;
     variant?: string | null;
+    /** V2: the slot's logo object (`instance_slot.data.logo`), badged with the layout's `badge`. */
+    logo?: LogoRef;
 }
-export declare const IconComponent: ({ slot, variant }: IconComponentProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const IconComponent: ({ slot, variant, logo }: IconComponentProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.es.js CHANGED Viewed

@@ -1,31 +1,62 @@
-import c from "../../../../common/components/IconBacking.es.js";
+import l from "../../../../common/components/IconBacking.es.js";
+import a from "../../../components/LogoFromGuid.es.js";
 import { resolveVariantConfig as m } from "../../resolveVariantConfig.es.js";
-import { getLayoutConfig as s } from "./layout.es.js";
-import { InstitutionLogo as u } from "@mxenabled/mxui";
-import { Icon as t } from "@mxenabled/mx-icons";
-import { jsx as r, jsxs as a } from "react/jsx-runtime";
-import { useTheme as d } from "@mui/material/styles";
-import { Stack as e } from "@mui/material";
-var C = ({ slot: o, variant: n }) => {
-  const l = d(), i = m(s(l), n, "default", "AccountBlock");
-  return o.institution_guid ? /* @__PURE__ */ a(e, {
+import { getLayoutConfig as u } from "./layout.es.js";
+import { InstitutionLogo as g } from "@mxenabled/mxui";
+import { Icon as e } from "@mxenabled/mx-icons";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useTheme as f } from "@mui/material/styles";
+import { Stack as t } from "@mui/material";
+var k = ({ slot: i, variant: c, logo: n }) => {
+  const d = f(), r = m(u(d), c, "default", "AccountBlock");
+  return /^INS-[A-Za-z0-9-]+$/.test(n?.guid ?? "") ? /* @__PURE__ */ s(t, {
     sx: {
       alignItems: "center",
       flexDirection: "row",
       position: "relative"
     },
-    children: [/* @__PURE__ */ r(u, {
-      alt: `${o.institution_name}`,
-      institutionGuid: `${o.institution_guid}`,
+    children: [/* @__PURE__ */ o(a, {
+      logo: n,
       size: 48
-    }), /* @__PURE__ */ r(c, {
+    }), r.badge && /* @__PURE__ */ o(l, {
       size: 20,
       sx: {
         position: "absolute",
         right: -8,
         top: -8
       },
-      children: /* @__PURE__ */ r(t, {
+      children: /* @__PURE__ */ o(e, {
+        "aria-hidden": !0,
+        color: "error",
+        "data-testid": "account-block-error-badge",
+        fill: !0,
+        name: r.badge,
+        size: 20,
+        sx: {
+          gridColumn: 1,
+          gridRow: 1,
+          zIndex: 2
+        }
+      })
+    })]
+  }) : i.institution_guid ? /* @__PURE__ */ s(t, {
+    sx: {
+      alignItems: "center",
+      flexDirection: "row",
+      position: "relative"
+    },
+    children: [/* @__PURE__ */ o(g, {
+      alt: `${i.institution_name}`,
+      institutionGuid: `${i.institution_guid}`,
+      size: 48
+    }), /* @__PURE__ */ o(l, {
+      size: 20,
+      sx: {
+        position: "absolute",
+        right: -8,
+        top: -8
+      },
+      children: /* @__PURE__ */ o(e, {
         color: "error",
         fill: !0,
         name: "error",
@@ -37,29 +68,29 @@ var C = ({ slot: o, variant: n }) => {
         }
       })
     })]
-  }) : o.icon_name ? /* @__PURE__ */ r(e, {
+  }) : i.icon_name ? /* @__PURE__ */ o(t, {
     sx: {
       alignItems: "center",
-      bgcolor: i.logo_bGcolor,
+      bgcolor: r.logo_bGcolor,
       borderRadius: "6px",
       height: 48,
       justifyContent: "center",
       width: 48,
-      ...i.logo_border_color && {
-        borderColor: i.logo_border_color,
+      ...r.logo_border_color && {
+        borderColor: r.logo_border_color,
         borderStyle: "solid",
         borderWidth: 1.5
       }
     },
-    children: /* @__PURE__ */ r(t, {
-      name: o.icon_name,
+    children: /* @__PURE__ */ o(e, {
+      name: i.icon_name,
       size: 24,
-      sx: { color: i.logo_color }
+      sx: { color: r.logo_color }
     })
   }) : null;
 };
 export {
-  C as IconComponent
+  k as IconComponent
 };
 //# sourceMappingURL=IconComponent.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconComponent.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.tsx"],"sourcesContent":["import { Stack } from '@mui/material'\nimport { Icon } from '@mxenabled/mx-icons'\nimport { InstitutionLogo } from '@mxenabled/mxui'\nimport { IconBacking } from '../../../../common'\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\nimport { getLayoutConfig } from './layout'\nimport { useTheme } from '@mui/material/styles'\nimport type { InstanceSlot } from '../../../../core'\n\ninterface IconComponentProps {\n slot: InstanceSlot\n variant?: string \| null\n}\n\nexport const IconComponent = ({ slot, variant }: IconComponentProps) => {\n const theme = useTheme()\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n if (slot.institution_guid) {\n return (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', position: 'relative' }}>\n <InstitutionLogo\n alt={`${slot.institution_name}`}\n institutionGuid={`${slot.institution_guid}`}\n size={48}\n />\n <IconBacking size={20} sx={{ position: 'absolute', right: -8, top: -8 }}>\n <Icon\n color=\"error\"\n fill={true}\n name=\"error\"\n size={20}\n sx={{ gridColumn: 1, gridRow: 1, zIndex: 2 }}\n />\n </IconBacking>\n </Stack>\n )\n }\n\n if (slot.icon_name) {\n return (\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: layoutConfig.logo_bGcolor,\n borderRadius: '6px',\n height: 48,\n justifyContent: 'center',\n width: 48,\n ...(layoutConfig.logo_border_color && {\n borderColor: layoutConfig.logo_border_color,\n borderStyle: 'solid',\n borderWidth: 1.5,\n }),\n }}\n >\n <Icon\n name={slot.icon_name}\n size={24}\n sx={{\n color: layoutConfig.logo_color,\n }}\n />\n </Stack>\n )\n }\n\n return null\n}\n"],"mappings":"~~;;;;;;;;AAcA~~,IAAa,IAAA,CAAiB,EAAE,MAAA,GAAM,SAAA,EAAA,~~MAAkC~~;~~AACtE~~,QAAM,IAAQ,EAAS,GACjB,IAAe,EACnB,EAAgB,CAAK,GACrB,GACA,WACA,cACF;~~AAEA~~,SAAI,EAAK,mBAEL,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,UAAU;AAAA,IAAW;AAAA,IAA9E,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,KAAK,GAAG,EAAK,gBAAA;AAAA,MACb,iBAAiB,GAAG,EAAK,gBAAA;AAAA,MACzB,MAAM;AAAA,IACP,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MAAa,MAAM;AAAA,MAAI,IAAI;AAAA,QAAE,UAAU;AAAA,QAAY,OAAO;AAAA,QAAI,KAAK;AAAA,MAAG;AAAA,MACpE,UAAA,gBAAA,EAAC,GAAD;AAAA,QACE,OAAM;AAAA,QACN,MAAM;AAAA,QACN,MAAK;AAAA,QACL,MAAM;AAAA,QACN,IAAI;AAAA,UAAE,YAAY;AAAA,UAAG,SAAS;AAAA,UAAG,QAAQ;AAAA,QAAE;AAAA,MAC5C,CAAA;AAAA,IACU,CAAA,CACR;AAAA,OAIP,EAAK,YAEL,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,YAAY;AAAA,MACZ,SAAS,EAAa;AAAA,MACtB,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB,OAAO;AAAA,MACP,GAAI,EAAa,qBAAqB;AAAA,QACpC,aAAa,EAAa;AAAA,QAC1B,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IAEA,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM,EAAK;AAAA,MACX,MAAM;AAAA,MACN,IAAI,EACF,OAAO,EAAa,WACtB;AAAA,IACD,CAAA;AAAA,EACI,CAAA,IAIJ;AACT"}
1	+ {"version":3,"file":"IconComponent.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.tsx"],"sourcesContent":["import { Stack } from '@mui/material'\nimport { Icon } from '@mxenabled/mx-icons'\nimport { InstitutionLogo } from '@mxenabled/mxui'\nimport { IconBacking } from '../../../../common'\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\nimport { getLayoutConfig } from './layout'\nimport { useTheme } from '@mui/material/styles'\nimport type { InstanceSlot, LogoRef } from '../../../../core'\nimport LogoFromGuid from '../../../components/LogoFromGuid'\n\ninterface IconComponentProps {\n slot: InstanceSlot\n variant?: string \| null\n /** V2: the slot's logo object (`instance_slot.data.logo`), badged with the layout's `badge`. */\n logo?: LogoRef\n}\n\nexport const IconComponent = ({ slot, variant, logo }: IconComponentProps) => {\n const theme = useTheme()\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n // V2 slot logo: an institution guid only; anything else falls through to the legacy fields.\n if (/^INS-[A-Za-z0-9-]+$/.test(logo?.guid ?? '')) {\n return (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', position: 'relative' }}>\n <LogoFromGuid logo={logo} size={48} />\n {layoutConfig.badge && (\n <IconBacking size={20} sx={{ position: 'absolute', right: -8, top: -8 }}>\n <Icon\n aria-hidden={true}\n color=\"error\"\n data-testid=\"account-block-error-badge\"\n fill={true}\n name={layoutConfig.badge}\n size={20}\n sx={{ gridColumn: 1, gridRow: 1, zIndex: 2 }}\n />\n </IconBacking>\n )}\n </Stack>\n )\n }\n\n if (slot.institution_guid) {\n return (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', position: 'relative' }}>\n <InstitutionLogo\n alt={`${slot.institution_name}`}\n institutionGuid={`${slot.institution_guid}`}\n size={48}\n />\n <IconBacking size={20} sx={{ position: 'absolute', right: -8, top: -8 }}>\n <Icon\n color=\"error\"\n fill={true}\n name=\"error\"\n size={20}\n sx={{ gridColumn: 1, gridRow: 1, zIndex: 2 }}\n />\n </IconBacking>\n </Stack>\n )\n }\n\n if (slot.icon_name) {\n return (\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: layoutConfig.logo_bGcolor,\n borderRadius: '6px',\n height: 48,\n justifyContent: 'center',\n width: 48,\n ...(layoutConfig.logo_border_color && {\n borderColor: layoutConfig.logo_border_color,\n borderStyle: 'solid',\n borderWidth: 1.5,\n }),\n }}\n >\n <Icon\n name={slot.icon_name}\n size={24}\n sx={{\n color: layoutConfig.logo_color,\n }}\n />\n </Stack>\n )\n }\n\n return null\n}\n"],"mappings":";;;;;;;;;AAiBA,IAAa,IAAA,CAAiB,EAAE,MAAA,GAAM,SAAA,GAAS,MAAA,EAAA,MAA+B;AAC5E,QAAM,IAAQ,EAAS,GACjB,IAAe,EACnB,EAAgB,CAAK,GACrB,GACA,WACA,cACF;AAGA,SAAI,sBAAsB,KAAK,GAAM,QAAQ,EAAE,IAE3C,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,UAAU;AAAA,IAAW;AAAA,IAA9E,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MAAoB,MAAA;AAAA,MAAM,MAAM;AAAA,IAAK,CAAA,GACpC,EAAa,SACZ,gBAAA,EAAC,GAAD;AAAA,MAAa,MAAM;AAAA,MAAI,IAAI;AAAA,QAAE,UAAU;AAAA,QAAY,OAAO;AAAA,QAAI,KAAK;AAAA,MAAG;AAAA,MACpE,UAAA,gBAAA,EAAC,GAAD;AAAA,QACE,eAAa;AAAA,QACb,OAAM;AAAA,QACN,eAAY;AAAA,QACZ,MAAM;AAAA,QACN,MAAM,EAAa;AAAA,QACnB,MAAM;AAAA,QACN,IAAI;AAAA,UAAE,YAAY;AAAA,UAAG,SAAS;AAAA,UAAG,QAAQ;AAAA,QAAE;AAAA,MAC5C,CAAA;AAAA,IACU,CAAA,CAEV;AAAA,OAIP,EAAK,mBAEL,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,UAAU;AAAA,IAAW;AAAA,IAA9E,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,KAAK,GAAG,EAAK,gBAAA;AAAA,MACb,iBAAiB,GAAG,EAAK,gBAAA;AAAA,MACzB,MAAM;AAAA,IACP,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MAAa,MAAM;AAAA,MAAI,IAAI;AAAA,QAAE,UAAU;AAAA,QAAY,OAAO;AAAA,QAAI,KAAK;AAAA,MAAG;AAAA,MACpE,UAAA,gBAAA,EAAC,GAAD;AAAA,QACE,OAAM;AAAA,QACN,MAAM;AAAA,QACN,MAAK;AAAA,QACL,MAAM;AAAA,QACN,IAAI;AAAA,UAAE,YAAY;AAAA,UAAG,SAAS;AAAA,UAAG,QAAQ;AAAA,QAAE;AAAA,MAC5C,CAAA;AAAA,IACU,CAAA,CACR;AAAA,OAIP,EAAK,YAEL,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,YAAY;AAAA,MACZ,SAAS,EAAa;AAAA,MACtB,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB,OAAO;AAAA,MACP,GAAI,EAAa,qBAAqB;AAAA,QACpC,aAAa,EAAa;AAAA,QAC1B,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IAEA,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM,EAAK;AAAA,MACX,MAAM;AAAA,MACN,IAAI,EACF,OAAO,EAAa,WACtB;AAAA,IACD,CAAA;AAAA,EACI,CAAA,IAIJ;AACT"}

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.d.ts CHANGED Viewed

@@ -6,6 +6,8 @@ export interface BlockLayoutConfig {
     logo_border_color?: string;
     /** mx-icons glyph shown before `sub_text` (e.g. a warning icon on overdraft_warning). */
     sub_logo?: string;
+    /** mx-icons glyph badged on the logo's corner (e.g. `error` on Low Account Balance's V2 tile). */
+    badge?: string;
     /** When true, AccountBlock renders the confetti-backed celebration card using the fields below. */
     isConfetti?: boolean;
     /** Gradient wash layered over `background.paper` for the confetti card. */

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.es.js CHANGED Viewed

@@ -1,11 +1,15 @@
-import { CELEBRATION_GRADIENT as o, WARM_LIME_ACCENT_GRADIENT as a } from "../../../components/celebrationGradients.es.js";
-import { alpha as e } from "@mui/material/styles";
-var i = (r) => ({
+import { CELEBRATION_GRADIENT as a, WARM_LIME_ACCENT_GRADIENT as o } from "../../../components/celebrationGradients.es.js";
+import { alpha as t } from "@mui/material/styles";
+var e = { background: "linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)" }, g = (r) => ({
   overdraft_warning: {
     background: r.palette.warning.light,
     sub_logo: "error"
   },
-  low_balance_alert: { background: "linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)" },
+  low_balance_alert: e,
+  low_balance: {
+    ...e,
+    badge: "error"
+  },
   status_off_track: {
     logo_color: "background.paper",
     logo_bGcolor: "error.main",
@@ -13,13 +17,13 @@ var i = (r) => ({
   },
   interest_charges_summary: {
     logo_color: "text.primary",
-    logo_bGcolor: e(r.palette.categories?.feesCharges || "", 0.25),
+    logo_bGcolor: t(r.palette.categories?.feesCharges || "", 0.25),
     logo_border_color: "categories.feesCharges",
     background: "linear-gradient(256.82deg, rgba(227, 39, 39, 0.2) 1.86%, rgba(255, 123, 0, 0.2) 101.54%)"
   },
   deposit_received: {
     isConfetti: !0,
-    gradient: a,
+    gradient: o,
     graphic: "logo",
     amountVariant: "h3",
     amountPrefix: "+",
@@ -35,7 +39,7 @@ var i = (r) => ({
   },
   status_on_track: {
     isConfetti: !0,
-    gradient: a,
+    gradient: o,
     graphic: "logo",
     amountVariant: "h2",
     rowSx: {
@@ -49,7 +53,7 @@ var i = (r) => ({
   },
   payoff_celebration: {
     isConfetti: !0,
-    gradient: o,
+    gradient: a,
     graphic: "paidOffCard",
     amountVariant: "h2",
     rowSx: {
@@ -64,7 +68,7 @@ var i = (r) => ({
   },
   savings_deposit: {
     isConfetti: !0,
-    gradient: o,
+    gradient: a,
     graphic: "savings",
     amountVariant: "h2",
     rowSx: {
@@ -79,7 +83,7 @@ var i = (r) => ({
   default: {}
 });
 export {
-  i as getLayoutConfig
+  g as getLayoutConfig
 };
 //# sourceMappingURL=layout.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.ts"],"sourcesContent":["import { alpha, type SxProps, type Theme } from '@mui/material/styles'\n\nimport {\n CELEBRATION_GRADIENT,\n WARM_LIME_ACCENT_GRADIENT,\n} from '../../../components/celebrationGradients'\n\nexport interface BlockLayoutConfig {\n background?: string\n logo_color?: string\n logo_bGcolor?: string\n logo_border_color?: string\n /** mx-icons glyph shown before `sub_text` (e.g. a warning icon on overdraft_warning). /\n sub_logo?: string\n /* When true, AccountBlock renders the confetti-backed celebration card using the fields below. /\n isConfetti?: boolean\n /* Gradient wash layered over `background.paper` for the confetti card. /\n gradient?: string\n /* Which illustration sits left of the text. `logo` is the data-driven merchant/institution logo. /\n graphic?: 'paidOffCard' \| 'savings' \| 'logo'\n /* Amount typography variant — `h2` for milestones, `h3` for deposits. /\n amountVariant?: 'h2' \| 'h3'\n /* Prefix prepended to the formatted amount, e.g. `+` for deposits. /\n amountPrefix?: string\n /* Render the colored category strip (`header_text`) at the top of the card. /\n categoryStrip?: boolean\n /* Layout overrides for the graphic+text row (padding, gap). /\n rowSx?: SxProps\n /* Which payload field feeds the secondary line beside the amount. /\n secondarySource?: 'merchant' \| 'label'\n /* Whether the secondary line sits above or below the amount. /\n secondaryPosition?: 'above' \| 'below'\n /* Typography variant for the secondary line. /\n secondaryVariant?: 'body2' \| 'caption'\n /* Theme color path for the secondary line. */\n secondaryColor?: string\n}\n\nexport const getLayoutConfig = (theme: Theme): Record<string, BlockLayoutConfig> => {\n return {\n overdraft_warning: {\n background: theme.palette.warning.light,\n sub_logo: 'error',\n },\n low_balance_alert: {\n ~~background:\n 'linear-gradient(256.82deg,~~ ~~rgba(255,~~ ~~47,~~ ~~40,~~ ~~0.2)~~ 1.~~86%,~~ ~~rgba(255,~~ 0, 72, ~~0.2)~~ ~~101.54%)~~'~~,\n~~ },\n // Shared on/off-track status pair — used by Monthly Obligations Status and\n // Payday Cash Left Over Status (identical designs, different copy).\n status_off_track: {\n logo_color: 'background.paper',\n logo_bGcolor: 'error.main',\n background:\n 'linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)',\n },\n interest_charges_summary: {\n logo_color: 'text.primary',\n logo_bGcolor: alpha(theme.palette.categories?.feesCharges \|\| '', 0.25),\n logo_border_color: 'categories.feesCharges',\n background:\n 'linear-gradient(256.82deg, rgba(227, 39, 39, 0.2) 1.86%, rgba(255, 123, 0, 0.2) 101.54%)',\n },\n // Shared deposit-celebration card — used by both the standard deposit and the emergency-fund\n // deposit beats (identical design, different copy), so one design-named variant serves both.\n deposit_received: {\n isConfetti: true,\n gradient: WARM_LIME_ACCENT_GRADIENT,\n graphic: 'logo',\n amountVariant: 'h3',\n amountPrefix: '+',\n categoryStrip: true,\n rowSx: { gap: 12, p: 12 },\n secondarySource: 'merchant',\n secondaryPosition: 'below',\n secondaryVariant: 'body2',\n secondaryColor: 'text.primary',\n },\n status_on_track: {\n isConfetti: true,\n gradient: WARM_LIME_ACCENT_GRADIENT,\n graphic: 'logo',\n amountVariant: 'h2',\n rowSx: { gap: 16, p: 16 },\n secondarySource: 'label',\n secondaryPosition: 'below',\n secondaryVariant: 'caption',\n secondaryColor: 'text.secondary',\n },\n payoff_celebration: {\n isConfetti: true,\n gradient: CELEBRATION_GRADIENT,\n graphic: 'paidOffCard',\n amountVariant: 'h2',\n rowSx: { gap: 24, px: 24, py: 16 },\n secondarySource: 'label',\n secondaryPosition: 'below',\n secondaryVariant: 'caption',\n secondaryColor: 'text.secondary',\n },\n savings_deposit: {\n isConfetti: true,\n gradient: CELEBRATION_GRADIENT,\n graphic: 'savings',\n amountVariant: 'h2',\n rowSx: { gap: 16, p: 16 },\n secondarySource: 'label',\n secondaryPosition: 'above',\n secondaryVariant: 'body2',\n secondaryColor: 'text.primary',\n },\n // Neutral fallback for an unknown/unmatched variant: renders the plain standard card (no\n // confetti, no special background). `resolveVariantConfig` warns before falling back here.\n default: {},\n }\n}\n"],"mappings":";;~~AAsCA~~,~~IAAa~~,IAAA,CAAmB,OACvB;AAAA,EACL,mBAAmB;AAAA,IACjB,YAAY,EAAM,QAAQ,QAAQ;AAAA,IAClC,UAAU;AAAA,EACZ;AAAA,EACA,mBAAmB,~~EACjB~~,~~YACE~~,~~0FACJ~~;AAAA,~~EAGA~~,kBAAkB;AAAA,IAChB,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,YACE;AAAA,EACJ;AAAA,EACA,0BAA0B;AAAA,IACxB,YAAY;AAAA,IACZ,cAAc,EAAM,EAAM,QAAQ,YAAY,eAAe,IAAI,IAAI;AAAA,IACrE,mBAAmB;AAAA,IACnB,YACE;AAAA,EACJ;AAAA,EAGA,kBAAkB;AAAA,IAChB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,cAAc;AAAA,IACd,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,oBAAoB;AAAA,IAClB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,IAAI;AAAA,MAAI,IAAI;AAAA,IAAG;AAAA,IACjC,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EAGA,SAAS,CAAC;AACZ"}
1	+ {"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.ts"],"sourcesContent":["import { alpha, type SxProps, type Theme } from '@mui/material/styles'\n\nimport {\n CELEBRATION_GRADIENT,\n WARM_LIME_ACCENT_GRADIENT,\n} from '../../../components/celebrationGradients'\n\nexport interface BlockLayoutConfig {\n background?: string\n logo_color?: string\n logo_bGcolor?: string\n logo_border_color?: string\n /** mx-icons glyph shown before `sub_text` (e.g. a warning icon on overdraft_warning). /\n sub_logo?: string\n /* mx-icons glyph badged on the logo's corner (e.g. `error` on Low Account Balance's V2 tile). /\n badge?: string\n /* When true, AccountBlock renders the confetti-backed celebration card using the fields below. /\n isConfetti?: boolean\n /* Gradient wash layered over `background.paper` for the confetti card. /\n gradient?: string\n /* Which illustration sits left of the text. `logo` is the data-driven merchant/institution logo. /\n graphic?: 'paidOffCard' \| 'savings' \| 'logo'\n /* Amount typography variant — `h2` for milestones, `h3` for deposits. /\n amountVariant?: 'h2' \| 'h3'\n /* Prefix prepended to the formatted amount, e.g. `+` for deposits. /\n amountPrefix?: string\n /* Render the colored category strip (`header_text`) at the top of the card. /\n categoryStrip?: boolean\n /* Layout overrides for the graphic+text row (padding, gap). /\n rowSx?: SxProps\n /* Which payload field feeds the secondary line beside the amount. /\n secondarySource?: 'merchant' \| 'label'\n /* Whether the secondary line sits above or below the amount. /\n secondaryPosition?: 'above' \| 'below'\n /* Typography variant for the secondary line. /\n secondaryVariant?: 'body2' \| 'caption'\n /* Theme color path for the secondary line. */\n secondaryColor?: string\n}\n\n// Low Account Balance's red tile, shared by its legacy (`low_balance_alert`) and V2 (`low_balance`)\n// variant names.\nconst LOW_BALANCE_TILE: BlockLayoutConfig = {\n background:\n 'linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)',\n}\n\nexport const getLayoutConfig = (theme: Theme): Record<string, BlockLayoutConfig> => {\n return {\n overdraft_warning: {\n background: theme.palette.warning.light,\n sub_logo: 'error',\n },\n low_balance_alert: LOW_BALANCE_TILE,\n // V2 name for the same tile: content from `instance_slot.data`, the logo badged with `badge`.\n low_balance: { ...LOW_BALANCE_TILE, badge: 'error' },\n // Shared on/off-track status pair — used by Monthly Obligations Status and\n // Payday Cash Left Over Status (identical designs, different copy).\n status_off_track: {\n logo_color: 'background.paper',\n logo_bGcolor: 'error.main',\n background:\n 'linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)',\n },\n interest_charges_summary: {\n logo_color: 'text.primary',\n logo_bGcolor: alpha(theme.palette.categories?.feesCharges \|\| '', 0.25),\n logo_border_color: 'categories.feesCharges',\n background:\n 'linear-gradient(256.82deg, rgba(227, 39, 39, 0.2) 1.86%, rgba(255, 123, 0, 0.2) 101.54%)',\n },\n // Shared deposit-celebration card — used by both the standard deposit and the emergency-fund\n // deposit beats (identical design, different copy), so one design-named variant serves both.\n deposit_received: {\n isConfetti: true,\n gradient: WARM_LIME_ACCENT_GRADIENT,\n graphic: 'logo',\n amountVariant: 'h3',\n amountPrefix: '+',\n categoryStrip: true,\n rowSx: { gap: 12, p: 12 },\n secondarySource: 'merchant',\n secondaryPosition: 'below',\n secondaryVariant: 'body2',\n secondaryColor: 'text.primary',\n },\n status_on_track: {\n isConfetti: true,\n gradient: WARM_LIME_ACCENT_GRADIENT,\n graphic: 'logo',\n amountVariant: 'h2',\n rowSx: { gap: 16, p: 16 },\n secondarySource: 'label',\n secondaryPosition: 'below',\n secondaryVariant: 'caption',\n secondaryColor: 'text.secondary',\n },\n payoff_celebration: {\n isConfetti: true,\n gradient: CELEBRATION_GRADIENT,\n graphic: 'paidOffCard',\n amountVariant: 'h2',\n rowSx: { gap: 24, px: 24, py: 16 },\n secondarySource: 'label',\n secondaryPosition: 'below',\n secondaryVariant: 'caption',\n secondaryColor: 'text.secondary',\n },\n savings_deposit: {\n isConfetti: true,\n gradient: CELEBRATION_GRADIENT,\n graphic: 'savings',\n amountVariant: 'h2',\n rowSx: { gap: 16, p: 16 },\n secondarySource: 'label',\n secondaryPosition: 'above',\n secondaryVariant: 'body2',\n secondaryColor: 'text.primary',\n },\n // Neutral fallback for an unknown/unmatched variant: renders the plain standard card (no\n // confetti, no special background). `resolveVariantConfig` warns before falling back here.\n default: {},\n }\n}\n"],"mappings":";;AA0CA,IAAM,IAAsC,EAC1C,YACE,0FACJ,GAEa,IAAA,CAAmB,OACvB;AAAA,EACL,mBAAmB;AAAA,IACjB,YAAY,EAAM,QAAQ,QAAQ;AAAA,IAClC,UAAU;AAAA,EACZ;AAAA,EACA,mBAAmB;AAAA,EAEnB,aAAa;AAAA,IAAE,GAAG;AAAA,IAAkB,OAAO;AAAA,EAAQ;AAAA,EAGnD,kBAAkB;AAAA,IAChB,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,YACE;AAAA,EACJ;AAAA,EACA,0BAA0B;AAAA,IACxB,YAAY;AAAA,IACZ,cAAc,EAAM,EAAM,QAAQ,YAAY,eAAe,IAAI,IAAI;AAAA,IACrE,mBAAmB;AAAA,IACnB,YACE;AAAA,EACJ;AAAA,EAGA,kBAAkB;AAAA,IAChB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,cAAc;AAAA,IACd,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,oBAAoB;AAAA,IAClB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,IAAI;AAAA,MAAI,IAAI;AAAA,IAAG;AAAA,IACjC,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EAGA,SAAS,CAAC;AACZ"}