@mx-cartographer/experiences 9.6.1 → 9.6.3

package/dist/insights-v2/blocks/ComponentBlocks/index.d.ts

@@ -3,5 +3,8 @@ export * from './AccountSwitchBlock';
 export * from './DirectDepositBlock';
 export * from './BudgetBlock';
 export * from './SaveExtraBlock';
+export * from './SavingsOpportunityBlock';
 export * from './TransactionBlock';
+export * from './UpcomingBillBlock';
+export * from './UpcomingSubscriptionBlock';
 export * from './WithdrawalBlock';

package/dist/insights-v2/blocks/resolveVariantConfig.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Picks a block's per-variant config from its `layout.ts` table by the backend
+ * `instance_slot.variant`, falling back to `fallback` for anything the table does not own.
+ *
+ * `Object.hasOwn` rather than a bare index: the key is backend-controlled, and an inherited
+ * name like `constructor` would otherwise return a truthy non-config that `??` lets through.
+ * Unknown variants warn, like `createVariantBlock`, so a backend typo or a new server variant
+ * is visible instead of silently degrading.
+ */
+export declare const resolveVariantConfig: <K extends string, C>(table: Record<K, C>, variant: string | null | undefined, fallback: K, blockName: string) => C;

package/dist/insights-v2/blocks/resolveVariantConfig.es.js

@@ -0,0 +1,6 @@
+var u = (o, n, r, e) => n != null && Object.hasOwn(o, n) ? o[n] : (n != null && console.warn(`[${e}] Unknown variant "${n}" — rendering "${r}". Add it to layout.ts.`), o[r]);
+export {
+  u as resolveVariantConfig
+};
+
+//# sourceMappingURL=resolveVariantConfig.es.js.map

package/dist/insights-v2/blocks/resolveVariantConfig.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveVariantConfig.es.js","names":[],"sources":["../../../src/insights-v2/blocks/resolveVariantConfig.ts"],"sourcesContent":["/**\n * Picks a block's per-variant config from its `layout.ts` table by the backend\n * `instance_slot.variant`, falling back to `fallback` for anything the table does not own.\n *\n * `Object.hasOwn` rather than a bare index: the key is backend-controlled, and an inherited\n * name like `constructor` would otherwise return a truthy non-config that `??` lets through.\n * Unknown variants warn, like `createVariantBlock`, so a backend typo or a new server variant\n * is visible instead of silently degrading.\n */\nexport const resolveVariantConfig = <K extends string, C>(\n  table: Record<K, C>,\n  variant: string | null | undefined,\n  fallback: K,\n  blockName: string,\n): C => {\n  if (variant != null && Object.hasOwn(table, variant)) return table[variant as K]\n\n  if (variant != null) {\n    console.warn(\n      `[${blockName}] Unknown variant \"${variant}\" — rendering \"${fallback}\". Add it to layout.ts.`,\n    )\n  }\n\n  return table[fallback]\n}\n"],"mappings":"AASA,IAAa,IAAA,CACX,GACA,GACA,GACA,MAEI,KAAW,QAAQ,OAAO,OAAO,GAAO,CAAO,IAAU,EAAM,CAAA,KAE/D,KAAW,QACb,QAAQ,KACN,IAAI,CAAA,sBAA+B,CAAA,kBAAyB,CAAA,yBAC9D,GAGK,EAAM,CAAA"}

package/dist/insights-v2/components/celebrationGradients.d.ts

@@ -1,12 +1,13 @@
+import { Theme } from '@mui/material/styles';
 /**
- * Decorative celebration washes used behind confetti-backed "complete"/milestone states.
- * Shared so both the block layer (`AccountBlock`) and the presentational
- * components/stories reference one source instead of re-declaring the string.
+ * Decorative slot washes shared by the block layouts and the presentational components, so
+ * one source holds each gradient. The 20%–25% washes layer over `background.paper` via
+ * `backgroundImage`; `DISCOVERED_ACCOUNTS_GRADIENT` is opaque and stands alone.
  *
- * - WARM_LIME_ACCENT_GRADIENT: 20%-opacity warm→lime wash; layer over `background.paper`
- *   for a tinted background. Used for merchant categorization and deposit celebration states.
- * - CELEBRATION_GRADIENT: 20%-opacity warm→pink wash; layer over `background.paper`.
- * - DISCOVERED_ACCOUNTS_GRADIENT: Fully opaque (100% opacity); use as the sole background.
+ * - WARM_LIME_ACCENT_GRADIENT: merchant categorization and deposit celebration states.
+ * - CELEBRATION_GRADIENT / ACCOUNT_CONNECTED_GRADIENT: balance milestones, account connected.
+ * - WARNING_WASH_GRADIENT: a flagged charge (Unexpected Subscription Payment).
+ * - getPrimaryWashGradient(theme): pending connect / detected subscription, from the palette.
  */
 /**
  * Warm → lime accent wash at 20% opacity. Used as a tinted background behind
@@ -23,3 +24,14 @@ export declare const DISCOVERED_ACCOUNTS_GRADIENT = "linear-gradient(200.73deg,
  * `background` shorthand — a 20% gradient over transparency renders wrong.
  */
 export declare const ACCOUNT_CONNECTED_GRADIENT = "linear-gradient(257deg, rgba(255, 224, 153, 0.2) 1.86%, rgba(255, 129, 230, 0.2) 101.54%)";
+/**
+ * Orange → red-orange wash at 25% opacity behind a flagged charge (Unexpected Subscription
+ * Payment). Figma "Warning Gradient 1": a bespoke two-stop blend with no palette token, so it
+ * stays a literal like the other washes here rather than being derived from `palette.warning`.
+ */
+export declare const WARNING_WASH_GRADIENT = "linear-gradient(201deg, rgba(255, 170, 0, 0.25) 1.86%, rgba(255, 68, 0, 0.25) 101.54%)";
+/**
+ * Blue slot wash behind a pending connect / detected-subscription row: `primary.light` →
+ * `primary.main` at 75% over paper, built from the live palette so it follows the theme.
+ */
+export declare const getPrimaryWashGradient: ({ palette }: Theme) => string;

package/dist/insights-v2/components/celebrationGradients.es.js

@@ -1,8 +1,11 @@
-var r = "linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(173, 248, 43, 0.2) 101.54%)", a = "linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(255, 128, 229, 0.2) 101.54%)", g = "linear-gradient(257deg, rgba(255, 224, 153, 0.2) 1.86%, rgba(255, 129, 230, 0.2) 101.54%)";
+import { alpha as a } from "@mui/material/styles";
+var i = "linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(173, 248, 43, 0.2) 101.54%)", e = "linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(255, 128, 229, 0.2) 101.54%)", n = "linear-gradient(257deg, rgba(255, 224, 153, 0.2) 1.86%, rgba(255, 129, 230, 0.2) 101.54%)", d = "linear-gradient(201deg, rgba(255, 170, 0, 0.25) 1.86%, rgba(255, 68, 0, 0.25) 101.54%)", N = ({ palette: r }) => `linear-gradient(173deg, ${a(r.primary.light, 0.75)} 46.41%, ${a(r.primary.main, 0.75)} 78.14%)`;
 export {
-  g as ACCOUNT_CONNECTED_GRADIENT,
-  a as CELEBRATION_GRADIENT,
-  r as WARM_LIME_ACCENT_GRADIENT
+  n as ACCOUNT_CONNECTED_GRADIENT,
+  e as CELEBRATION_GRADIENT,
+  i as WARM_LIME_ACCENT_GRADIENT,
+  d as WARNING_WASH_GRADIENT,
+  N as getPrimaryWashGradient
 };
 
 //# sourceMappingURL=celebrationGradients.es.js.map

package/dist/insights-v2/components/celebrationGradients.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"celebrationGradients.es.js","names":[],"sources":["../../../src/insights-v2/components/celebrationGradients.ts"],"sourcesContent":["/**\n * Decorative celebration washes used behind confetti-backed \"complete\"/milestone states.\n * Shared so both the block layer (`AccountBlock`) and the presentational\n * components/stories reference one source instead of re-declaring the string.\n *\n * - WARM_LIME_ACCENT_GRADIENT: 20%-opacity warm→lime wash; layer over `background.paper`\n *   for a tinted background. Used for merchant categorization and deposit celebration states.\n * - CELEBRATION_GRADIENT: 20%-opacity warm→pink wash; layer over `background.paper`.\n * - DISCOVERED_ACCOUNTS_GRADIENT: Fully opaque (100% opacity); use as the sole background.\n */\n\n/**\n * Warm → lime accent wash at 20% opacity. Used as a tinted background behind\n * merchant categorization highlights and deposit celebration callouts.\n */\nexport const WARM_LIME_ACCENT_GRADIENT =\n  'linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(173, 248, 43, 0.2) 101.54%)'\n\n/** Warm → pink wash behind balance/savings milestones. */\nexport const CELEBRATION_GRADIENT =\n  'linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(255, 128, 229, 0.2) 101.54%)'\n\n/** Peach → pink gradient for Discovered Accounts success state. */\nexport const DISCOVERED_ACCOUNTS_GRADIENT =\n  'linear-gradient(200.73deg, rgba(255, 224, 153, 1) 1.86%, rgba(255, 129, 230, 1) 101.54%)'\n\n/**\n * Warm → pink wash at 20% opacity for the account-connected success state.\n * Layer over `background.paper` (the Figma spec's `#FFF` base), not the\n * `background` shorthand — a 20% gradient over transparency renders wrong.\n */\nexport const ACCOUNT_CONNECTED_GRADIENT =\n  'linear-gradient(257deg, rgba(255, 224, 153, 0.2) 1.86%, rgba(255, 129, 230, 0.2) 101.54%)'\n"],"mappings":"AAeA,IAAa,IACX,+FAGW,IACX,gGAWW,IACX"}
+{"version":3,"file":"celebrationGradients.es.js","names":[],"sources":["../../../src/insights-v2/components/celebrationGradients.ts"],"sourcesContent":["import { alpha, type Theme } from '@mui/material/styles'\n\n/**\n * Decorative slot washes shared by the block layouts and the presentational components, so\n * one source holds each gradient. The 20%–25% washes layer over `background.paper` via\n * `backgroundImage`; `DISCOVERED_ACCOUNTS_GRADIENT` is opaque and stands alone.\n *\n * - WARM_LIME_ACCENT_GRADIENT: merchant categorization and deposit celebration states.\n * - CELEBRATION_GRADIENT / ACCOUNT_CONNECTED_GRADIENT: balance milestones, account connected.\n * - WARNING_WASH_GRADIENT: a flagged charge (Unexpected Subscription Payment).\n * - getPrimaryWashGradient(theme): pending connect / detected subscription, from the palette.\n */\n\n/**\n * Warm → lime accent wash at 20% opacity. Used as a tinted background behind\n * merchant categorization highlights and deposit celebration callouts.\n */\nexport const WARM_LIME_ACCENT_GRADIENT =\n  'linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(173, 248, 43, 0.2) 101.54%)'\n\n/** Warm → pink wash behind balance/savings milestones. */\nexport const CELEBRATION_GRADIENT =\n  'linear-gradient(200.73deg, rgba(255, 223, 152, 0.2) 1.86%, rgba(255, 128, 229, 0.2) 101.54%)'\n\n/** Peach → pink gradient for Discovered Accounts success state. */\nexport const DISCOVERED_ACCOUNTS_GRADIENT =\n  'linear-gradient(200.73deg, rgba(255, 224, 153, 1) 1.86%, rgba(255, 129, 230, 1) 101.54%)'\n\n/**\n * Warm → pink wash at 20% opacity for the account-connected success state.\n * Layer over `background.paper` (the Figma spec's `#FFF` base), not the\n * `background` shorthand — a 20% gradient over transparency renders wrong.\n */\nexport const ACCOUNT_CONNECTED_GRADIENT =\n  'linear-gradient(257deg, rgba(255, 224, 153, 0.2) 1.86%, rgba(255, 129, 230, 0.2) 101.54%)'\n\n/**\n * Orange → red-orange wash at 25% opacity behind a flagged charge (Unexpected Subscription\n * Payment). Figma \"Warning Gradient 1\": a bespoke two-stop blend with no palette token, so it\n * stays a literal like the other washes here rather than being derived from `palette.warning`.\n */\nexport const WARNING_WASH_GRADIENT =\n  'linear-gradient(201deg, rgba(255, 170, 0, 0.25) 1.86%, rgba(255, 68, 0, 0.25) 101.54%)'\n\n/**\n * Blue slot wash behind a pending connect / detected-subscription row: `primary.light` →\n * `primary.main` at 75% over paper, built from the live palette so it follows the theme.\n */\nexport const getPrimaryWashGradient = ({ palette }: Theme) =>\n  `linear-gradient(173deg, ${alpha(palette.primary.light, 0.75)} 46.41%, ${alpha(palette.primary.main, 0.75)} 78.14%)`\n"],"mappings":";AAiBA,IAAa,IACX,+FAGW,IACX,gGAWW,IACX,6FAOW,IACX,0FAMW,IAAA,CAA0B,EAAE,SAAA,EAAA,MACvC,2BAA2B,EAAM,EAAQ,QAAQ,OAAO,IAAI,CAAA,YAAa,EAAM,EAAQ,QAAQ,MAAM,IAAI,CAAA"}

package/dist/insights-v2/index.es.js

@@ -1,118 +1,125 @@
-import o from "./components/StatusPill.es.js";
+import r from "./components/StatusPill.es.js";
 import { resolveInsightRender as m } from "./resolveInsightRender.es.js";
 import { useBeatActions as a } from "./beatActions.es.js";
 import f from "./components/BadgedTile.es.js";
 import { OverflowMenu as n } from "./components/OverflowMenu.es.js";
-import { InsightOptionsMenu as s } from "./components/InsightOptionsMenu.es.js";
-import d, { isLogoGuid as C } from "./components/LogoFromGuid.es.js";
-import B from "./components/StatusBadge.es.js";
+import { InsightOptionsMenu as l } from "./components/InsightOptionsMenu.es.js";
+import d, { isLogoGuid as g } from "./components/LogoFromGuid.es.js";
+import C from "./components/StatusBadge.es.js";
 import k from "./components/CompactInsightCard.es.js";
 import h from "./components/InsightErrorCard.es.js";
-import { BAR_CHART_VARIANTS as A, barChartVariant as b, buildChartData as T, buildDataSeries as I } from "./blocks/ChartBlocks/BarchartBlock/utils.es.js";
+import { BAR_CHART_VARIANTS as b, barChartVariant as A, buildChartData as T, buildDataSeries as I } from "./blocks/ChartBlocks/BarchartBlock/utils.es.js";
 import { BarchartBlock as v } from "./blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js";
-import { DoubleBarChartBlock as w } from "./blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
-import O from "./blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
-import P from "./blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
-import y from "./blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
+import { DoubleBarChartBlock as O } from "./blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
+import M from "./blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
+import E from "./blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
+import R from "./blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
 import V from "./blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js";
 import G from "./components/TransferLogoCard.es.js";
-import N from "./blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
-import U from "./components/AccountHeroCard.es.js";
+import _ from "./blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
+import W from "./components/AccountHeroCard.es.js";
 import q from "./components/DirectDepositCard.es.js";
 import J from "./blocks/ComponentBlocks/DirectDepositBlock/DirectDepositBlock.es.js";
 import { BudgetBlock as Q } from "./blocks/ComponentBlocks/BudgetBlock/BudgetBlock.es.js";
 import Y from "./components/SaveAnExtraCard.es.js";
 import $ from "./blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
-import or from "./components/InsightTransactionRow.es.js";
-import mr from "./components/TransactionListCard.es.js";
-import { TransactionBlock as ar, TransactionBlockVariant as pr } from "./blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
-import er from "./components/WithdrawalCard.es.js";
-import cr from "./blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
-import { SVGImageBlock as lr } from "./blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
-import Cr from "./components/ConnectionDetailDrillDown.es.js";
-import Br from "./components/AmountPill.es.js";
-import kr from "./components/DesignateEmergencySavingsCard.es.js";
-import hr from "./components/shared/StatusSnackbar.es.js";
-import Ar from "./components/FeedbackDialog.es.js";
-import Tr from "./components/FeedbackModal.es.js";
-import Lr from "./components/SurveyModal.es.js";
-import { ErrorCard as Hr } from "./components/ErrorCard.es.js";
-import { HOST_ACTIONS as Mr } from "./ctaActions/hostActions.es.js";
-import { useBeatCtaActions as Er, useCtaHandler as Pr } from "./ctaActions/useCtaAction.es.js";
-import { FeedbackBar as yr } from "./components/FeedbackBar.es.js";
-import { DismissInsightDialog as Vr } from "./components/DismissInsightDialog.es.js";
-import { HiddenConfirmationCard as Gr } from "./components/HiddenConfirmationCard.es.js";
-import { LoadingCard as Nr } from "./components/LoadingCard.es.js";
-import { ObsolesceBanner as Ur } from "./components/ObsolesceBanner.es.js";
-import qr from "./components/BaseLayout.es.js";
-import Jr from "./components/StatusMessageCard.es.js";
-import Qr from "./components/LogoTile.es.js";
-import Yr from "./components/LogoClusterCard.es.js";
-import $r from "./components/MerchantHighlightCard.es.js";
-import oo from "./components/P2PLogoStack.es.js";
-import mo from "./components/SavingsOpportunityCard.es.js";
-import ao from "./components/SubscriptionHeroCard.es.js";
-import fo from "./components/UpcomingBillCard.es.js";
+import ro from "./components/SavingsOpportunityCard.es.js";
+import mo from "./blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js";
+import ao from "./components/InsightTransactionRow.es.js";
+import fo from "./components/TransactionListCard.es.js";
+import { transactionBlockVariant as no } from "./blocks/ComponentBlocks/TransactionBlock/layout.es.js";
+import { TransactionBlock as lo } from "./blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
+import go from "./components/UpcomingBillCard.es.js";
+import Co from "./blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import ko from "./components/AmountPill.es.js";
+import ho from "./components/SubscriptionHeroCard.es.js";
+import bo from "./blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js";
+import To from "./components/WithdrawalCard.es.js";
+import Lo from "./blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
+import { SVGImageBlock as Ho } from "./blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import wo from "./components/ConnectionDetailDrillDown.es.js";
+import yo from "./components/DesignateEmergencySavingsCard.es.js";
+import Po from "./components/shared/StatusSnackbar.es.js";
+import Fo from "./components/FeedbackDialog.es.js";
+import xo from "./components/FeedbackModal.es.js";
+import Uo from "./components/SurveyModal.es.js";
+import { ErrorCard as No } from "./components/ErrorCard.es.js";
+import { HOST_ACTIONS as jo } from "./ctaActions/hostActions.es.js";
+import { useBeatCtaActions as zo, useCtaHandler as Jo } from "./ctaActions/useCtaAction.es.js";
+import { FeedbackBar as Qo } from "./components/FeedbackBar.es.js";
+import { DismissInsightDialog as Yo } from "./components/DismissInsightDialog.es.js";
+import { HiddenConfirmationCard as $o } from "./components/HiddenConfirmationCard.es.js";
+import { LoadingCard as rr } from "./components/LoadingCard.es.js";
+import { ObsolesceBanner as mr } from "./components/ObsolesceBanner.es.js";
+import ar from "./components/BaseLayout.es.js";
+import fr from "./components/StatusMessageCard.es.js";
+import nr from "./components/LogoTile.es.js";
+import lr from "./components/LogoClusterCard.es.js";
+import dr from "./components/MerchantHighlightCard.es.js";
+import Br from "./components/P2PLogoStack.es.js";
 export {
   V as AccountBlock,
-  U as AccountHeroCard,
-  N as AccountSwitchBlock,
-  Br as AmountPill,
-  A as BAR_CHART_VARIANTS,
+  W as AccountHeroCard,
+  _ as AccountSwitchBlock,
+  ko as AmountPill,
+  b as BAR_CHART_VARIANTS,
   f as BadgedTile,
   v as BarchartBlock,
-  qr as BaseLayout,
+  ar as BaseLayout,
   Q as BudgetBlock,
   k as CompactInsightCard,
-  Cr as ConnectionDetailDrillDown,
-  kr as DesignateEmergencySavingsCard,
+  wo as ConnectionDetailDrillDown,
+  yo as DesignateEmergencySavingsCard,
   J as DirectDepositBlock,
   q as DirectDepositCard,
-  Vr as DismissInsightDialog,
-  P as DonutChartBlock,
-  w as DoubleBarChartBlock,
-  y as DoubleProgressBarBlock,
-  Hr as ErrorCard,
-  yr as FeedbackBar,
-  Ar as FeedbackDialog,
-  Tr as FeedbackModal,
-  Mr as HOST_ACTIONS,
-  Gr as HiddenConfirmationCard,
+  Yo as DismissInsightDialog,
+  E as DonutChartBlock,
+  O as DoubleBarChartBlock,
+  R as DoubleProgressBarBlock,
+  No as ErrorCard,
+  Qo as FeedbackBar,
+  Fo as FeedbackDialog,
+  xo as FeedbackModal,
+  jo as HOST_ACTIONS,
+  $o as HiddenConfirmationCard,
   h as InsightErrorCard,
-  s as InsightOptionsMenu,
-  or as InsightTransactionRow,
-  Nr as LoadingCard,
-  Yr as LogoClusterCard,
+  l as InsightOptionsMenu,
+  ao as InsightTransactionRow,
+  rr as LoadingCard,
+  lr as LogoClusterCard,
   d as LogoFromGuid,
-  Qr as LogoTile,
-  $r as MerchantHighlightCard,
-  Ur as ObsolesceBanner,
+  nr as LogoTile,
+  dr as MerchantHighlightCard,
+  mr as ObsolesceBanner,
   n as OverflowMenu,
-  oo as P2PLogoStack,
-  lr as SVGImageBlock,
+  Br as P2PLogoStack,
+  Ho as SVGImageBlock,
   Y as SaveAnExtraCard,
   $ as SaveExtraBlock,
-  mo as SavingsOpportunityCard,
-  B as StatusBadge,
-  Jr as StatusMessageCard,
-  o as StatusPill,
-  hr as StatusSnackbar,
-  O as StepChartBlock,
-  ao as SubscriptionHeroCard,
-  Lr as SurveyModal,
-  ar as TransactionBlock,
-  pr as TransactionBlockVariant,
-  mr as TransactionListCard,
+  mo as SavingsOpportunityBlock,
+  ro as SavingsOpportunityCard,
+  C as StatusBadge,
+  fr as StatusMessageCard,
+  r as StatusPill,
+  Po as StatusSnackbar,
+  M as StepChartBlock,
+  ho as SubscriptionHeroCard,
+  Uo as SurveyModal,
+  lo as TransactionBlock,
+  fo as TransactionListCard,
   G as TransferLogoCard,
-  fo as UpcomingBillCard,
-  cr as WithdrawalBlock,
-  er as WithdrawalCard,
-  b as barChartVariant,
+  Co as UpcomingBillBlock,
+  go as UpcomingBillCard,
+  bo as UpcomingSubscriptionBlock,
+  Lo as WithdrawalBlock,
+  To as WithdrawalCard,
+  A as barChartVariant,
   T as buildChartData,
   I as buildDataSeries,
-  C as isLogoGuid,
+  g as isLogoGuid,
   m as resolveInsightRender,
+  no as transactionBlockVariant,
   a as useBeatActions,
-  Er as useBeatCtaActions,
-  Pr as useCtaHandler
+  zo as useBeatCtaActions,
+  Jo as useCtaHandler
 };

package/dist/insights-v2/mappings/blocks.es.js

@@ -2,65 +2,68 @@ import { ContactSupportActionBlock as c } from "../actionBlocks/ContactSupportAc
 import { actionBlocksKey as o } from "./actionBlocksKey.es.js";
 import { BarchartBlock as m } from "../blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js";
 import { DoubleBarChartBlock as l } from "../blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
-import _ from "../blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
-import p from "../blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
+import p from "../blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
+import _ from "../blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
 import s from "../blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
 import C from "../blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js";
 import k from "../blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
 import B from "../blocks/ComponentBlocks/DirectDepositBlock/DirectDepositBlock.es.js";
 import { BudgetBlock as T } from "../blocks/ComponentBlocks/BudgetBlock/BudgetBlock.es.js";
 import A from "../blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
+import u from "../blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js";
 import { TransactionBlock as O } from "../blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
-import f from "../blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
-import u from "../blocks/ImageBlocks/ImageBlock.es.js";
-import { SVGImageBlock as N } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
-import { FeedbackModalActionBlock as I } from "../actionBlocks/FeedbackModalActionBlock.es.js";
-import { ConnectionDetailActionBlock as d } from "../actionBlocks/ConnectionDetailActionBlock.es.js";
-import { ConnectWidgetActionBlock as b } from "../actionBlocks/ConnectWidgetActionBlock.es.js";
-import { SurveyModalActionBlock as L } from "../actionBlocks/SurveyModalActionBlock.es.js";
-import { PlaceholderActionBlock as D } from "../actionBlocks/PlaceholderActionBlock.es.js";
-import { getMakeTransferDrawerTitle as P } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
-import { MakeTransferActionBlockLayer as g } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
-import { getDrawerHeaderTitle as h } from "../actionBlocks/TransactionHistoryBlock/utils.es.js";
-import { TransactionDetailsBlock as R } from "../actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js";
-import { useTransactionDetailsPrepare as a } from "../actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js";
-import { TransactionHistoryBlock as S } from "../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js";
-import { useRecurringTransactionPrepare as i } from "../actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js";
-import { RecurringTransactionBlock as K } from "../actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.es.js";
-import { TransactionListBlock as E } from "../actionBlocks/TransactionListBlock/TransactionListBlock.es.js";
-import { RemainingCashBlock as v } from "../actionBlocks/RemainingCashBlock/RemainingCashBlock.es.js";
-import { hasDrawerBlock as ko } from "./hasDrawerBlock.es.js";
-import { AmountInputModalBlock as M } from "../actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js";
+import f from "../blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import N from "../blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js";
+import b from "../blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
+import I from "../blocks/ImageBlocks/ImageBlock.es.js";
+import { SVGImageBlock as d } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import { FeedbackModalActionBlock as g } from "../actionBlocks/FeedbackModalActionBlock.es.js";
+import { ConnectionDetailActionBlock as L } from "../actionBlocks/ConnectionDetailActionBlock.es.js";
+import { ConnectWidgetActionBlock as D } from "../actionBlocks/ConnectWidgetActionBlock.es.js";
+import { SurveyModalActionBlock as P } from "../actionBlocks/SurveyModalActionBlock.es.js";
+import { PlaceholderActionBlock as h } from "../actionBlocks/PlaceholderActionBlock.es.js";
+import { getMakeTransferDrawerTitle as S } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
+import { MakeTransferActionBlockLayer as R } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
+import { getDrawerHeaderTitle as K } from "../actionBlocks/TransactionHistoryBlock/utils.es.js";
+import { TransactionDetailsBlock as E } from "../actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js";
+import { useTransactionDetailsPrepare as i } from "../actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js";
+import { TransactionHistoryBlock as v } from "../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js";
+import { useRecurringTransactionPrepare as a } from "../actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js";
+import { RecurringTransactionBlock as M } from "../actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.es.js";
+import { TransactionListBlock as w } from "../actionBlocks/TransactionListBlock/TransactionListBlock.es.js";
+import { RemainingCashBlock as y } from "../actionBlocks/RemainingCashBlock/RemainingCashBlock.es.js";
+import { hasDrawerBlock as fo } from "./hasDrawerBlock.es.js";
+import { AmountInputModalBlock as U } from "../actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js";
 var r = (e) => {
-}, To = {
+}, bo = {
   [o.PLACEHOLDER_ACTION_BLOCK]: {
-    Component: D,
+    Component: h,
     usePrepare: r,
     title: () => "Action Block Layer Drilldown"
   },
   [o.MAKE_TRANSFER_ACTION_BLOCK]: {
-    Component: g,
+    Component: R,
     usePrepare: r,
-    title: P
+    title: S
   },
   [o.TRANSCATION_HISTORY_ACTION_BLOCK]: {
-    Component: S,
+    Component: v,
     usePrepare: r,
-    title: h
+    title: K
   },
   [o.TRANSACTION_DETAILS_ACTION_BLOCK]: {
-    Component: R,
-    usePrepare: a,
+    Component: E,
+    usePrepare: i,
     title: () => "Transaction Details"
   },
   [o.RECURRING_TRANSACTION_ACTION_BLOCK]: {
-    Component: K,
-    usePrepare: i,
+    Component: M,
+    usePrepare: a,
     title: (e, t) => t.recurring?.expense_details ?? ""
   },
   [o.REMAINING_CASH_ACTION_BLOCK]: {
-    Component: v,
-    usePrepare: i,
+    Component: y,
+    usePrepare: a,
     title: (e, t) => t.insights_feed?.remaining_cash?.title ?? ""
   },
   [o.CONTACT_SUPPORT_ACTION_BLOCK]: {
@@ -69,54 +72,57 @@ var r = (e) => {
     title: (e, t) => t.help?.request_support ?? ""
   },
   [o.FEEDBACK_MODAL_ACTION_BLOCK]: {
-    Component: I,
+    Component: g,
     usePrepare: r,
     presentation: "modal"
   },
   [o.CONNECTION_DETAIL_ACTION_BLOCK]: {
-    Component: d,
+    Component: L,
     usePrepare: r,
     title: (e, t) => t.insights_feed?.connection_details?.connection_details_drawer_title ?? ""
   },
   [o.CONNECT_WIDGET_ACTION_BLOCK]: {
-    Component: b,
+    Component: D,
     usePrepare: r
   },
   [o.SURVEY_MODAL_ACTION_BLOCK]: {
-    Component: L,
+    Component: P,
     usePrepare: r,
     presentation: "modal"
   },
   [o.TRANSACTION_LIST_ACTION_BLOCK]: {
-    Component: E,
-    usePrepare: a,
+    Component: w,
+    usePrepare: i,
     title: (e, t, n) => n?.insights_payload?.title ?? ""
   },
   [o.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {
-    Component: M,
+    Component: U,
     presentation: "modal",
     usePrepare: r
   }
-}, Ao = {
+}, Io = {
   account_block: C,
   account_switch_block: k,
   direct_deposit_block: B,
   bar_chart_block: m,
   budget_block: T,
-  donut_chart_block: p,
+  donut_chart_block: _,
   double_bar_chart_block: l,
   double_progress_bar_block: s,
-  image_block: u,
+  image_block: I,
   save_extra_block: A,
-  step_chart_block: _,
-  svg_image_block: N,
-  withdrawal_block: f,
+  savings_opportunity_block: u,
+  step_chart_block: p,
+  svg_image_block: d,
+  upcoming_bill_block: f,
+  upcoming_subscription_block: N,
+  withdrawal_block: b,
   transaction_block: O
 };
 export {
-  To as actionBlocks,
-  Ao as blocks,
-  ko as hasDrawerBlock
+  bo as actionBlocks,
+  Io as blocks,
+  fo as hasDrawerBlock
 };
 
 //# sourceMappingURL=blocks.es.js.map

package/dist/insights-v2/mappings/blocks.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"blocks.es.js","names":[],"sources":["../../../src/insights-v2/mappings/blocks.ts"],"sourcesContent":["import {\n  AccountBlock,\n  AccountSwitchBlock,\n  DirectDepositBlock,\n  BarchartBlock,\n  BudgetBlock,\n  DonutChartBlock,\n  DoubleBarChartBlock,\n  DoubleProgressBarBlock,\n  SaveExtraBlock,\n  SVGImageBlock,\n  WithdrawalBlock,\n  TransactionBlock,\n} from '../blocks'\nimport StepChartBlock from '../blocks/ChartBlocks/StepChartBlock'\nimport ImageBlock from '../blocks/ImageBlocks/ImageBlock'\n\nimport type { Beat, GlobalCopy, InsightsPayload } from '../../core'\nimport { ContactSupportActionBlock } from '../actionBlocks/ContactSupportActionBlock'\nimport { FeedbackModalActionBlock } from '../actionBlocks/FeedbackModalActionBlock'\nimport { ConnectionDetailActionBlock } from '../actionBlocks/ConnectionDetailActionBlock'\nimport { ConnectWidgetActionBlock } from '../actionBlocks/ConnectWidgetActionBlock'\nimport { SurveyModalActionBlock } from '../actionBlocks/SurveyModalActionBlock'\nimport { PlaceholderActionBlock } from '../actionBlocks/PlaceholderActionBlock'\nimport { MakeTransferActionBlockLayer } from '../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer'\nimport { getMakeTransferDrawerTitle } from '../actionBlocks/MakeTransferActionBlock/layout'\nimport { TransactionHistoryBlock } from '../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock'\nimport { getDrawerHeaderTitle } from '../actionBlocks/TransactionHistoryBlock/utils'\nimport {\n  TransactionDetailsBlock,\n  useTransactionDetailsPrepare,\n} from '../actionBlocks/TransactionDetailsBlock'\nimport {\n  RecurringTransactionBlock,\n  useRecurringTransactionPrepare,\n} from '../actionBlocks/RecurringTransactionBlock'\nimport { TransactionListBlock } from '../actionBlocks/TransactionListBlock'\nimport { RemainingCashBlock } from '../actionBlocks/RemainingCashBlock'\nimport { AmountInputModalBlock } from '../actionBlocks/AmountInputModalBlock'\n// Keys live in ./actionBlocksKey (imported directly by chart blocks/tests too) to avoid a\n// circular import between this module and the chart blocks — see that file for details.\nimport { actionBlocksKey } from './actionBlocksKey'\n\n// Drilldown indexes are not passed down: action blocks read them from\n// InsightsV2Store (useInsightsV2Store().actionDrawer).\nexport interface ActionBlockProps {\n  beat: Beat\n}\n\nconst noop = (_: ActionBlockProps) => {}\n\n// Re-exported so existing `hasDrawerBlock` imports from this module keep working.\nexport { hasDrawerBlock } from './hasDrawerBlock'\n\nexport interface ActionBlockEntry {\n  Component: React.ComponentType<ActionBlockProps>\n  usePrepare: (props: ActionBlockProps) => void // required; default to noop in each entry\n  // Resolves the drawer title from the clicked CTA's variant + copy, with the beat available\n  // for blocks that title from beat fields (e.g. transaction-list reads insights_payload.title).\n  // Falls back to the CTA label when the resolver returns an empty string / is absent.\n  title?: (variant: string | null | undefined, copy: GlobalCopy, beat?: Beat) => string\n  // 'drawer' (default) or 'modal' (component renders its own dialog, no Drawer wrapper).\n  presentation?: 'drawer' | 'modal'\n}\n\n// Registry of drawer drilldowns, keyed by the `block` name the backend sends\n// on a beat's CTA. To add one: create a component taking ActionBlockProps,\n// read the clicked indexes from useInsightsV2Store().actionDrawer, and\n// register it here. Add\n// `usePrepare` when the block needs to load data before rendering.\n\nexport const actionBlocks = {\n  [actionBlocksKey.PLACEHOLDER_ACTION_BLOCK]: {\n    Component: PlaceholderActionBlock,\n    usePrepare: noop,\n    title: () => 'Action Block Layer Drilldown',\n  },\n  [actionBlocksKey.MAKE_TRANSFER_ACTION_BLOCK]: {\n    Component: MakeTransferActionBlockLayer,\n    usePrepare: noop,\n    title: getMakeTransferDrawerTitle,\n  },\n  [actionBlocksKey.TRANSCATION_HISTORY_ACTION_BLOCK]: {\n    Component: TransactionHistoryBlock,\n    usePrepare: noop,\n    title: getDrawerHeaderTitle,\n  },\n  [actionBlocksKey.TRANSACTION_DETAILS_ACTION_BLOCK]: {\n    Component: TransactionDetailsBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: () => 'Transaction Details',\n  },\n  // Expense Details for one recurring subscription. Which subscription a beat names is resolved in\n  // `RecurringTransactionBlock/subscriptionBeats.ts`, not through this registry.\n  [actionBlocksKey.RECURRING_TRANSACTION_ACTION_BLOCK]: {\n    Component: RecurringTransactionBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.recurring?.expense_details ?? '',\n  },\n  // Remaining Cash for the Payday Cash Left Over Status beat. Store-driven: reuses the recurring\n  // loader, which also loads accounts and categories, so CashflowStore's computeds are ready.\n  [actionBlocksKey.REMAINING_CASH_ACTION_BLOCK]: {\n    Component: RemainingCashBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.insights_feed?.remaining_cash?.title ?? '',\n  },\n  // The block renders its own drawer (the help module's RequestSupport) on top of the action\n  // drawer, so the action drawer's title is the CTA label.\n  [actionBlocksKey.CONTACT_SUPPORT_ACTION_BLOCK]: {\n    Component: ContactSupportActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) => copy.help?.request_support ?? '',\n  },\n  [actionBlocksKey.FEEDBACK_MODAL_ACTION_BLOCK]: {\n    Component: FeedbackModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.CONNECTION_DETAIL_ACTION_BLOCK]: {\n    Component: ConnectionDetailActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) =>\n      copy.insights_feed?.connection_details?.connection_details_drawer_title ?? '',\n  },\n  // Boots MX's Connect widget (web-widget-sdk iframe) inside the action\n  // drawer; the drawer title falls back to the CTA label.\n  [actionBlocksKey.CONNECT_WIDGET_ACTION_BLOCK]: {\n    Component: ConnectWidgetActionBlock,\n    usePrepare: noop,\n  },\n  [actionBlocksKey.SURVEY_MODAL_ACTION_BLOCK]: {\n    Component: SurveyModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.TRANSACTION_LIST_ACTION_BLOCK]: {\n    Component: TransactionListBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: (_variant, _copy, beat) => beat?.insights_payload?.title ?? '',\n  },\n  // One whole-dollar setting in a dialog; the CTA variant picks which (low-balance threshold or\n  // safety net). A modal: no drawer, so no drawer title.\n  [actionBlocksKey.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {\n    Component: AmountInputModalBlock,\n    presentation: 'modal',\n    // Loads inside the block: it mounts only while open, so mounting is the open-time load.\n    usePrepare: noop,\n  },\n} as Record<string, ActionBlockEntry>\n\nexport const blocks = {\n  account_block: AccountBlock,\n  account_switch_block: AccountSwitchBlock,\n  direct_deposit_block: DirectDepositBlock,\n  bar_chart_block: BarchartBlock,\n  budget_block: BudgetBlock,\n  donut_chart_block: DonutChartBlock,\n  double_bar_chart_block: DoubleBarChartBlock,\n  double_progress_bar_block: DoubleProgressBarBlock,\n  image_block: ImageBlock,\n  save_extra_block: SaveExtraBlock,\n  step_chart_block: StepChartBlock,\n  svg_image_block: SVGImageBlock,\n  withdrawal_block: WithdrawalBlock,\n  transaction_block: TransactionBlock,\n} as Record<string, React.ComponentType<{ payload: InsightsPayload; beatGuid?: string }>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,IAAM,IAAA,CAAQ,MAAwB;AAAC,GAsB1B,KAAe;AAAA,EACzB,CAAA,EAAgB,wBAAA,GAA2B;AAAA,IAC1C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EACC,CAAA,EAAgB,0BAAA,GAA6B;AAAA,IAC5C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EAGC,CAAA,EAAgB,kCAAA,GAAqC;AAAA,IACpD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,WAAW,mBAAmB;AAAA,EAChE;AAAA,EAGC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,eAAe,gBAAgB,SAAS;AAAA,EAC1E;AAAA,EAGC,CAAA,EAAgB,4BAAA,GAA+B;AAAA,IAC9C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,MAAM,mBAAmB;AAAA,EAC3D;AAAA,EACC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,8BAAA,GAAiC;AAAA,IAChD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAChB,EAAK,eAAe,oBAAoB,mCAAmC;AAAA,EAC/E;AAAA,EAGC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACC,CAAA,EAAgB,yBAAA,GAA4B;AAAA,IAC3C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,6BAAA,GAAgC;AAAA,IAC/C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,GAAO,MAAS,GAAM,kBAAkB,SAAS;AAAA,EACrE;AAAA,EAGC,CAAA,EAAgB,+BAAA,GAAkC;AAAA,IACjD,WAAW;AAAA,IACX,cAAc;AAAA,IAEd,YAAY;AAAA,EACd;AACF,GAEa,KAAS;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,mBAAmB;AACrB"}
+{"version":3,"file":"blocks.es.js","names":[],"sources":["../../../src/insights-v2/mappings/blocks.ts"],"sourcesContent":["import {\n  AccountBlock,\n  AccountSwitchBlock,\n  DirectDepositBlock,\n  BarchartBlock,\n  BudgetBlock,\n  DonutChartBlock,\n  DoubleBarChartBlock,\n  DoubleProgressBarBlock,\n  SaveExtraBlock,\n  SavingsOpportunityBlock,\n  SVGImageBlock,\n  UpcomingBillBlock,\n  UpcomingSubscriptionBlock,\n  WithdrawalBlock,\n  TransactionBlock,\n} from '../blocks'\nimport StepChartBlock from '../blocks/ChartBlocks/StepChartBlock'\nimport ImageBlock from '../blocks/ImageBlocks/ImageBlock'\n\nimport type { Beat, GlobalCopy, InsightsPayload } from '../../core'\nimport { ContactSupportActionBlock } from '../actionBlocks/ContactSupportActionBlock'\nimport { FeedbackModalActionBlock } from '../actionBlocks/FeedbackModalActionBlock'\nimport { ConnectionDetailActionBlock } from '../actionBlocks/ConnectionDetailActionBlock'\nimport { ConnectWidgetActionBlock } from '../actionBlocks/ConnectWidgetActionBlock'\nimport { SurveyModalActionBlock } from '../actionBlocks/SurveyModalActionBlock'\nimport { PlaceholderActionBlock } from '../actionBlocks/PlaceholderActionBlock'\nimport { MakeTransferActionBlockLayer } from '../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer'\nimport { getMakeTransferDrawerTitle } from '../actionBlocks/MakeTransferActionBlock/layout'\nimport { TransactionHistoryBlock } from '../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock'\nimport { getDrawerHeaderTitle } from '../actionBlocks/TransactionHistoryBlock/utils'\nimport {\n  TransactionDetailsBlock,\n  useTransactionDetailsPrepare,\n} from '../actionBlocks/TransactionDetailsBlock'\nimport {\n  RecurringTransactionBlock,\n  useRecurringTransactionPrepare,\n} from '../actionBlocks/RecurringTransactionBlock'\nimport { TransactionListBlock } from '../actionBlocks/TransactionListBlock'\nimport { RemainingCashBlock } from '../actionBlocks/RemainingCashBlock'\nimport { AmountInputModalBlock } from '../actionBlocks/AmountInputModalBlock'\n// Keys live in ./actionBlocksKey (imported directly by chart blocks/tests too) to avoid a\n// circular import between this module and the chart blocks — see that file for details.\nimport { actionBlocksKey } from './actionBlocksKey'\n\n// Drilldown indexes are not passed down: action blocks read them from\n// InsightsV2Store (useInsightsV2Store().actionDrawer).\nexport interface ActionBlockProps {\n  beat: Beat\n}\n\nconst noop = (_: ActionBlockProps) => {}\n\n// Re-exported so existing `hasDrawerBlock` imports from this module keep working.\nexport { hasDrawerBlock } from './hasDrawerBlock'\n\nexport interface ActionBlockEntry {\n  Component: React.ComponentType<ActionBlockProps>\n  usePrepare: (props: ActionBlockProps) => void // required; default to noop in each entry\n  // Resolves the drawer title from the clicked CTA's variant + copy, with the beat available\n  // for blocks that title from beat fields (e.g. transaction-list reads insights_payload.title).\n  // Falls back to the CTA label when the resolver returns an empty string / is absent.\n  title?: (variant: string | null | undefined, copy: GlobalCopy, beat?: Beat) => string\n  // 'drawer' (default) or 'modal' (component renders its own dialog, no Drawer wrapper).\n  presentation?: 'drawer' | 'modal'\n}\n\n// Registry of drawer drilldowns, keyed by the `block` name the backend sends\n// on a beat's CTA. To add one: create a component taking ActionBlockProps,\n// read the clicked indexes from useInsightsV2Store().actionDrawer, and\n// register it here. Add\n// `usePrepare` when the block needs to load data before rendering.\n\nexport const actionBlocks = {\n  [actionBlocksKey.PLACEHOLDER_ACTION_BLOCK]: {\n    Component: PlaceholderActionBlock,\n    usePrepare: noop,\n    title: () => 'Action Block Layer Drilldown',\n  },\n  [actionBlocksKey.MAKE_TRANSFER_ACTION_BLOCK]: {\n    Component: MakeTransferActionBlockLayer,\n    usePrepare: noop,\n    title: getMakeTransferDrawerTitle,\n  },\n  [actionBlocksKey.TRANSCATION_HISTORY_ACTION_BLOCK]: {\n    Component: TransactionHistoryBlock,\n    usePrepare: noop,\n    title: getDrawerHeaderTitle,\n  },\n  [actionBlocksKey.TRANSACTION_DETAILS_ACTION_BLOCK]: {\n    Component: TransactionDetailsBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: () => 'Transaction Details',\n  },\n  // Expense Details for one recurring subscription. Which subscription a beat names is resolved in\n  // `RecurringTransactionBlock/subscriptionBeats.ts`, not through this registry.\n  [actionBlocksKey.RECURRING_TRANSACTION_ACTION_BLOCK]: {\n    Component: RecurringTransactionBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.recurring?.expense_details ?? '',\n  },\n  // Remaining Cash for the Payday Cash Left Over Status beat. Store-driven: reuses the recurring\n  // loader, which also loads accounts and categories, so CashflowStore's computeds are ready.\n  [actionBlocksKey.REMAINING_CASH_ACTION_BLOCK]: {\n    Component: RemainingCashBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.insights_feed?.remaining_cash?.title ?? '',\n  },\n  // The block renders its own drawer (the help module's RequestSupport) on top of the action\n  // drawer, so the action drawer's title is the CTA label.\n  [actionBlocksKey.CONTACT_SUPPORT_ACTION_BLOCK]: {\n    Component: ContactSupportActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) => copy.help?.request_support ?? '',\n  },\n  [actionBlocksKey.FEEDBACK_MODAL_ACTION_BLOCK]: {\n    Component: FeedbackModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.CONNECTION_DETAIL_ACTION_BLOCK]: {\n    Component: ConnectionDetailActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) =>\n      copy.insights_feed?.connection_details?.connection_details_drawer_title ?? '',\n  },\n  // Boots MX's Connect widget (web-widget-sdk iframe) inside the action\n  // drawer; the drawer title falls back to the CTA label.\n  [actionBlocksKey.CONNECT_WIDGET_ACTION_BLOCK]: {\n    Component: ConnectWidgetActionBlock,\n    usePrepare: noop,\n  },\n  [actionBlocksKey.SURVEY_MODAL_ACTION_BLOCK]: {\n    Component: SurveyModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.TRANSACTION_LIST_ACTION_BLOCK]: {\n    Component: TransactionListBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: (_variant, _copy, beat) => beat?.insights_payload?.title ?? '',\n  },\n  // One whole-dollar setting in a dialog; the CTA variant picks which (low-balance threshold or\n  // safety net). A modal: no drawer, so no drawer title.\n  [actionBlocksKey.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {\n    Component: AmountInputModalBlock,\n    presentation: 'modal',\n    // Loads inside the block: it mounts only while open, so mounting is the open-time load.\n    usePrepare: noop,\n  },\n} as Record<string, ActionBlockEntry>\n\nexport const blocks = {\n  account_block: AccountBlock,\n  account_switch_block: AccountSwitchBlock,\n  direct_deposit_block: DirectDepositBlock,\n  bar_chart_block: BarchartBlock,\n  budget_block: BudgetBlock,\n  donut_chart_block: DonutChartBlock,\n  double_bar_chart_block: DoubleBarChartBlock,\n  double_progress_bar_block: DoubleProgressBarBlock,\n  image_block: ImageBlock,\n  save_extra_block: SaveExtraBlock,\n  savings_opportunity_block: SavingsOpportunityBlock,\n  step_chart_block: StepChartBlock,\n  svg_image_block: SVGImageBlock,\n  upcoming_bill_block: UpcomingBillBlock,\n  upcoming_subscription_block: UpcomingSubscriptionBlock,\n  withdrawal_block: WithdrawalBlock,\n  transaction_block: TransactionBlock,\n} as Record<string, React.ComponentType<{ payload: InsightsPayload; beatGuid?: string }>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoDA,IAAM,IAAA,CAAQ,MAAwB;AAAC,GAsB1B,KAAe;AAAA,EACzB,CAAA,EAAgB,wBAAA,GAA2B;AAAA,IAC1C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EACC,CAAA,EAAgB,0BAAA,GAA6B;AAAA,IAC5C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EAGC,CAAA,EAAgB,kCAAA,GAAqC;AAAA,IACpD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,WAAW,mBAAmB;AAAA,EAChE;AAAA,EAGC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,eAAe,gBAAgB,SAAS;AAAA,EAC1E;AAAA,EAGC,CAAA,EAAgB,4BAAA,GAA+B;AAAA,IAC9C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,MAAM,mBAAmB;AAAA,EAC3D;AAAA,EACC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,8BAAA,GAAiC;AAAA,IAChD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAChB,EAAK,eAAe,oBAAoB,mCAAmC;AAAA,EAC/E;AAAA,EAGC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACC,CAAA,EAAgB,yBAAA,GAA4B;AAAA,IAC3C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,6BAAA,GAAgC;AAAA,IAC/C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,GAAO,MAAS,GAAM,kBAAkB,SAAS;AAAA,EACrE;AAAA,EAGC,CAAA,EAAgB,+BAAA,GAAkC;AAAA,IACjD,WAAW;AAAA,IACX,cAAc;AAAA,IAEd,YAAY;AAAA,EACd;AACF,GAEa,KAAS;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,2BAA2B;AAAA,EAC3B,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,6BAA6B;AAAA,EAC7B,kBAAkB;AAAA,EAClB,mBAAmB;AACrB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mx-cartographer/experiences",
-  "version": "9.6.1",
+  "version": "9.6.3",
   "description": "Library containing experience widgets",
   "author": "MX",
   "license": "MIT",