@mx-cartographer/experiences 9.3.5 → 9.3.6

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## [9.3.6] - 08-12-2026
+
+- **ADDED** - Creating the new TransparentOverdraftV2 insight
+
 ## [9.3.5] - 08-12-2026
 
 - **FIXED** - Transaction detail view showed transfer/credit amounts (e.g. an account-to-account transfer deposit) as an unsigned, default-colored amount because the header keyed off `isIncome` (true only for the Income category) while the list keyed off `transaction_type`; the detail view now uses `transaction_type === CREDIT` so credits render as `+$Amount` in success green, consistent with the transactions list (MEW-3703)

package/dist/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { CommonBeatProps } from '../../../types/CommonBeat';
+export interface TransparentOverdraftV2Props extends CommonBeatProps {
+    accountName: string;
+    formattedProjectedBalance: string;
+    projectedBalanceLabel: string;
+}
+export declare const TransparentOverdraftV2: React.FC<TransparentOverdraftV2Props>;

package/dist/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2.es.js

@@ -0,0 +1,50 @@
+import { InsightButton as i } from "../../shared/InsightsCard/InsightButton.es.js";
+import { BeatCardMUI as s } from "../../shared/InsightsCard/BeatCardMUI.es.js";
+import { TransparentOverdraftV2Body as c } from "./TransparentOverdraftV2Body.es.js";
+import "react";
+import n from "@mui/material/Stack";
+import { Text as f } from "@mxenabled/mxui";
+import { jsx as r, jsxs as h } from "react/jsx-runtime";
+var T = ({ accountName: m, beat: t, buttonProps: e, formattedProjectedBalance: d, isMini: o, projectedBalanceLabel: p, ...a }) => /* @__PURE__ */ r(s, {
+  ...a,
+  beat: t,
+  button: /* @__PURE__ */ h(n, {
+    sx: { gap: 8 },
+    children: [/* @__PURE__ */ r(i, {
+      ...e,
+      beat: t
+    }), /* @__PURE__ */ r(i, {
+      ...e,
+      beat: t,
+      hide: !t.supporting_action,
+      primary: !1
+    })]
+  }),
+  header: {
+    ...a.header,
+    subHeader: /* @__PURE__ */ r(n, {
+      alignItems: "center",
+      direction: "row",
+      sx: {
+        gap: 4,
+        mt: 4
+      },
+      children: /* @__PURE__ */ r(f, {
+        sx: { color: "text.secondary" },
+        variant: "body2",
+        children: m
+      })
+    })
+  },
+  isMini: o,
+  children: /* @__PURE__ */ r(c, {
+    formattedProjectedBalance: d,
+    isMini: o ?? !1,
+    projectedBalanceLabel: p
+  })
+});
+export {
+  T as TransparentOverdraftV2
+};
+
+//# sourceMappingURL=TransparentOverdraftV2.es.js.map

package/dist/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransparentOverdraftV2.es.js","names":[],"sources":["../../../../../src/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport Stack from '@mui/material/Stack'\n\nimport { CommonBeatProps } from '../../../types/CommonBeat'\nimport { BeatCardMUI } from '../../shared/InsightsCard/BeatCardMUI'\nimport { InsightButton } from '../../shared/InsightsCard/InsightButton'\n\nimport { TransparentOverdraftV2Body } from './TransparentOverdraftV2Body'\n\nexport interface TransparentOverdraftV2Props extends CommonBeatProps {\n  accountName: string\n  formattedProjectedBalance: string\n  projectedBalanceLabel: string\n}\n\nexport const TransparentOverdraftV2: React.FC<TransparentOverdraftV2Props> = ({\n  accountName,\n  beat,\n  buttonProps,\n  formattedProjectedBalance,\n  isMini,\n  projectedBalanceLabel,\n  ...restProps\n}) => {\n  return (\n    <BeatCardMUI\n      {...restProps}\n      beat={beat}\n      button={\n        <Stack sx={{ gap: 8 }}>\n          <InsightButton {...buttonProps} beat={beat} />\n          <InsightButton\n            {...buttonProps}\n            beat={beat}\n            hide={!beat.supporting_action}\n            primary={false}\n          />\n        </Stack>\n      }\n      header={{\n        ...restProps.header,\n        subHeader: (\n          <Stack alignItems=\"center\" direction=\"row\" sx={{ gap: 4, mt: 4 }}>\n            {/* Remove InstitutionLogo until the V2 payload carries institution_guid */}\n            <Text sx={{ color: 'text.secondary' }} variant=\"body2\">\n              {accountName}\n            </Text>\n          </Stack>\n        ),\n      }}\n      isMini={isMini}\n    >\n      <TransparentOverdraftV2Body\n        formattedProjectedBalance={formattedProjectedBalance}\n        isMini={isMini ?? false}\n        projectedBalanceLabel={projectedBalanceLabel}\n      />\n    </BeatCardMUI>\n  )\n}\n"],"mappings":";;;;;;;AAkBA,IAAa,IAAA,CAAiE,EAC5E,aAAA,GACA,MAAA,GACA,aAAA,GACA,2BAAA,GACA,QAAA,GACA,uBAAA,GACA,GAAG,EAAA,MAGD,gBAAA,EAAC,GAAD;AAAA,EACE,GAAI;AAAA,EACE,MAAA;AAAA,EACN,QACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAE,KAAK,EAAE;AAAA,IAApB,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MAAe,GAAI;AAAA,MAAmB,MAAA;AAAA,IAAO,CAAA,GAC7C,gBAAA,EAAC,GAAD;AAAA,MACE,GAAI;AAAA,MACE,MAAA;AAAA,MACN,MAAM,CAAC,EAAK;AAAA,MACZ,SAAS;AAAA,IACV,CAAA,CACI;AAAA;EAET,QAAQ;AAAA,IACN,GAAG,EAAU;AAAA,IACb,WACE,gBAAA,EAAC,GAAD;AAAA,MAAO,YAAW;AAAA,MAAS,WAAU;AAAA,MAAM,IAAI;AAAA,QAAE,KAAK;AAAA,QAAG,IAAI;AAAA,MAAE;AAAA,MAE7D,UAAA,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAI,EAAE,OAAO,iBAAiB;AAAA,QAAG,SAAQ;AAAA,QAC5C,UAAA;AAAA,MACG,CAAA;AAAA,IACD,CAAA;AAAA,EAEX;AAAA,EACQ,QAAA;AAAA,EAER,UAAA,gBAAA,EAAC,GAAD;AAAA,IAC6B,2BAAA;AAAA,IAC3B,QAAQ,KAAU;AAAA,IACK,uBAAA;AAAA,EACxB,CAAA;AACU,CAAA"}

package/dist/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2Body.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+interface TransparentOverdraftV2BodyProps {
+    formattedProjectedBalance: string;
+    isMini: boolean;
+    projectedBalanceLabel: string;
+}
+export declare const TransparentOverdraftV2Body: React.FC<TransparentOverdraftV2BodyProps>;
+export {};

package/dist/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2Body.es.js

@@ -0,0 +1,68 @@
+import "react";
+import e from "@mui/material/Stack";
+import { P as c, Text as m } from "@mxenabled/mxui";
+import { Icon as s } from "@mxenabled/mx-icons";
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
+import d from "@mui/material/Card";
+var y = ({ formattedProjectedBalance: i, isMini: o = !1, projectedBalanceLabel: a }) => {
+  const t = {
+    boxContainer: {
+      bgcolor: "warning.light",
+      marginBottom: o ? 0 : 24,
+      py: 16,
+      px: 24,
+      width: "100%"
+    },
+    card: {
+      alignItems: "center",
+      borderRadius: 2,
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      p: 16,
+      width: "100%"
+    }
+  };
+  return /* @__PURE__ */ r(e, {
+    sx: t.boxContainer,
+    children: /* @__PURE__ */ n(d, {
+      sx: {
+        ...t.card,
+        bgcolor: "background.paper"
+      },
+      children: [/* @__PURE__ */ r(m, {
+        component: "span",
+        sx: {
+          color: "text.primary",
+          fontWeight: 700,
+          mb: 4
+        },
+        variant: o ? "h2" : "h1",
+        children: i
+      }), /* @__PURE__ */ n(e, {
+        alignItems: "center",
+        direction: "row",
+        sx: { gap: 4 },
+        children: [/* @__PURE__ */ r(s, {
+          "aria-hidden": "true",
+          fill: !0,
+          name: "error",
+          size: 16,
+          sx: { color: "warning.main" }
+        }), /* @__PURE__ */ r(c, {
+          sx: {
+            color: "text.secondary",
+            fontWeight: 400
+          },
+          variant: "body2",
+          children: a
+        })]
+      })]
+    })
+  });
+};
+export {
+  y as TransparentOverdraftV2Body
+};
+
+//# sourceMappingURL=TransparentOverdraftV2Body.es.js.map

package/dist/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2Body.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransparentOverdraftV2Body.es.js","names":[],"sources":["../../../../../src/insights/components/insights/TransparentOverdraftV2/TransparentOverdraftV2Body.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { P, Text } from '@mxenabled/mxui'\n\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\n\ninterface TransparentOverdraftV2BodyProps {\n  formattedProjectedBalance: string\n  isMini: boolean\n  projectedBalanceLabel: string\n}\n\nexport const TransparentOverdraftV2Body: React.FC<TransparentOverdraftV2BodyProps> = ({\n  formattedProjectedBalance,\n  isMini = false,\n  projectedBalanceLabel,\n}) => {\n  const styles = {\n    boxContainer: {\n      bgcolor: 'warning.light',\n      marginBottom: isMini ? 0 : 24,\n      py: 16,\n      px: 24,\n      width: '100%',\n    },\n    card: {\n      alignItems: 'center',\n      borderRadius: 2,\n      display: 'flex',\n      flexDirection: 'column',\n      justifyContent: 'center',\n      p: 16,\n      width: '100%',\n    },\n  }\n\n  return (\n    <Stack sx={styles.boxContainer}>\n      <Card\n        sx={{\n          ...styles.card,\n          bgcolor: 'background.paper',\n        }}\n      >\n        <Text\n          component=\"span\"\n          sx={{ color: 'text.primary', fontWeight: 700, mb: 4 }}\n          variant={isMini ? 'h2' : 'h1'}\n        >\n          {formattedProjectedBalance}\n        </Text>\n\n        <Stack alignItems=\"center\" direction=\"row\" sx={{ gap: 4 }}>\n          <Icon\n            aria-hidden=\"true\"\n            fill={true}\n            name=\"error\"\n            size={16}\n            sx={{ color: 'warning.main' }}\n          />\n          <P sx={{ color: 'text.secondary', fontWeight: 400 }} variant=\"body2\">\n            {projectedBalanceLabel}\n          </P>\n        </Stack>\n      </Card>\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;AAcA,IAAa,IAAA,CAAyE,EACpF,2BAAA,GACA,QAAA,IAAS,IACT,uBAAA,EAAA,MACI;AACJ,QAAM,IAAS;AAAA,IACb,cAAc;AAAA,MACZ,SAAS;AAAA,MACT,cAAc,IAAS,IAAI;AAAA,MAC3B,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,IACT;AAAA,IACA,MAAM;AAAA,MACJ,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,SAAS;AAAA,MACT,eAAe;AAAA,MACf,gBAAgB;AAAA,MAChB,GAAG;AAAA,MACH,OAAO;AAAA,IACT;AAAA,EACF;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAO;AAAA,IAChB,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,IAAI;AAAA,QACF,GAAG,EAAO;AAAA,QACV,SAAS;AAAA,MACX;AAAA,MAJF,UAAA,CAME,gBAAA,EAAC,GAAD;AAAA,QACE,WAAU;AAAA,QACV,IAAI;AAAA,UAAE,OAAO;AAAA,UAAgB,YAAY;AAAA,UAAK,IAAI;AAAA,QAAE;AAAA,QACpD,SAAS,IAAS,OAAO;AAAA,QAExB,UAAA;AAAA,MACG,CAAA,GAEN,gBAAA,EAAC,GAAD;AAAA,QAAO,YAAW;AAAA,QAAS,WAAU;AAAA,QAAM,IAAI,EAAE,KAAK,EAAE;AAAA,QAAxD,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,UACE,eAAY;AAAA,UACZ,MAAM;AAAA,UACN,MAAK;AAAA,UACL,MAAM;AAAA,UACN,IAAI,EAAE,OAAO,eAAe;AAAA,QAC7B,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,UAAG,IAAI;AAAA,YAAE,OAAO;AAAA,YAAkB,YAAY;AAAA,UAAI;AAAA,UAAG,SAAQ;AAAA,UAC1D,UAAA;AAAA,QACA,CAAA,CACE;AAAA,MACH,CAAA,CAAA;AAAA;EACD,CAAA;AAEX"}

package/dist/insights/components/insights/TransparentOverdraftV2/index.d.ts

@@ -0,0 +1 @@
+export * from './TransparentOverdraftV2';

package/dist/insights/components/insights/index.d.ts

@@ -19,6 +19,7 @@ export * from './P2pCategorization';
 export * from './SavingsAccountBalancesSummary';
 export * from './SetUpDirectDeposit';
 export * from './SwitchDirectDeposit';
+export * from './TransparentOverdraftV2';
 export * from './UnifiedDeposit';
 export * from './WeeklyNoSpendDays';
 export * from './MarketingHub';

package/dist/insights/index.es.js

@@ -17,7 +17,7 @@ import { MiniInsightCard as U } from "./components/shared/MiniInsightCard.es.js"
 import { MenuAction as H } from "./components/shared/MenuAction.es.js";
 import w from "./components/shared/P2P/P2PMultipleCategorization.es.js";
 import V from "./components/shared/SaveEnoughToLiveOnBottomSection.es.js";
-import O from "./components/shared/SaveEnoughToLiveOnTopSection.es.js";
+import z from "./components/shared/SaveEnoughToLiveOnTopSection.es.js";
 import W from "./components/shared/StatusIndicator.es.js";
 import R from "./components/shared/TransactionCard.es.js";
 import { DirectDeposit as X } from "./components/shared/DirectDeposit/DirectDeposit.es.js";
@@ -43,7 +43,7 @@ import { LinedCardZeroState as ko } from "./components/shared/ZeroState/LinedCar
 import { ErrorCard as Eo } from "./components/shared/ErrorCard/ErrorCard.es.js";
 import { FeedbackHeader as Lo } from "./components/shared/GenericFeedback/FeedbackHeader.es.js";
 import { FeedbackButtons as xo } from "./components/shared/GenericFeedback/FeedbackButtons.es.js";
-import { FeedbackDescription as zo } from "./components/shared/GenericFeedback/FeedbackDescription.es.js";
+import { FeedbackDescription as Oo } from "./components/shared/GenericFeedback/FeedbackDescription.es.js";
 import { FeedbackOptions as No } from "./components/shared/GenericFeedback/FeedbackOptions.es.js";
 import { BeatFeedbackText as Go } from "./components/shared/GenericFeedback/FeedbackText.es.js";
 import { AccountDiscoverability as jo } from "./components/insights/AccountDiscoverability/AccountDiscoverability.es.js";
@@ -70,7 +70,7 @@ import { MonthlyEmergencyFundReviewBody as kr } from "./components/insights/Mont
 import { LastMonthsContributionSection as Er } from "./components/insights/MonthlyEmergencyFundReview/LastMonthsContributionSection.es.js";
 import { ProjectedCompletionSection as Lr } from "./components/insights/MonthlyEmergencyFundReview/ProjectedCompletionSection.es.js";
 import { TotalSavedSection as xr } from "./components/insights/MonthlyEmergencyFundReview/TotalSection.es.js";
-import { MonthlySavingsToIncomeComparison as zr } from "./components/insights/MonthlySavingsToIncomeComparison/MonthlySavingsToIncomeComparison.es.js";
+import { MonthlySavingsToIncomeComparison as Or } from "./components/insights/MonthlySavingsToIncomeComparison/MonthlySavingsToIncomeComparison.es.js";
 import { MonthlySpendingComparisonV2 as Nr } from "./components/insights/MonthlySpendingComparisonV2/MonthlySpendingComparisonV2.es.js";
 import { MonthlySpendToIncomeComparisonV2 as Gr } from "./components/insights/MonthlySpendToIncomeComparisonV2/MonthlySpendToIncomeComparisonV2.es.js";
 import { P2pCategorization as jr } from "./components/insights/P2pCategorization/P2pCategorization.es.js";
@@ -81,14 +81,15 @@ import { SetUpDirectDepositBody as _r } from "./components/insights/SetUpDirectD
 import { AccountBox as ot } from "./components/insights/SwitchDirectDeposit/AccountBox.es.js";
 import { SwitchDirectDepositMainContainer as tt } from "./components/insights/SwitchDirectDeposit/SwitchDirectDepositMainContainer.es.js";
 import { SwitchDirectDepositBody as mt } from "./components/insights/SwitchDirectDeposit/SwitchDirectDepositBody.es.js";
-import { UnifiedDeposit as at } from "./components/insights/UnifiedDeposit/UnifiedDeposit.es.js";
-import { WeeklyNoSpendDays as nt } from "./components/insights/WeeklyNoSpendDays/WeeklyNoSpendDays.es.js";
-import { UserFeedback as dt } from "./components/insights/UserFeedback/UserFeedback.es.js";
-import { DirectDepositDeepLink as st } from "./components/shared/DeepLinks/DirectDeposit/DirectDepositDeepLink.es.js";
-import { Header as lt } from "./components/feed/Header.es.js";
-import { P2PCategorizationSingleAccount as ut } from "./components/shared/P2PCategorizationSingleAccount/P2PCategorizationSingleAccount.es.js";
-import { DrillDownCalculation as Bt, variants as gt } from "./components/shared/DrillDownCalculation/DrillDownCalculation.es.js";
-import { SaveAnExtra100 as yt } from "./components/shared/SaveAnExtra100/SaveAnExtra100.es.js";
+import { TransparentOverdraftV2 as at } from "./components/insights/TransparentOverdraftV2/TransparentOverdraftV2.es.js";
+import { UnifiedDeposit as nt } from "./components/insights/UnifiedDeposit/UnifiedDeposit.es.js";
+import { WeeklyNoSpendDays as dt } from "./components/insights/WeeklyNoSpendDays/WeeklyNoSpendDays.es.js";
+import { UserFeedback as st } from "./components/insights/UserFeedback/UserFeedback.es.js";
+import { DirectDepositDeepLink as lt } from "./components/shared/DeepLinks/DirectDeposit/DirectDepositDeepLink.es.js";
+import { Header as ut } from "./components/feed/Header.es.js";
+import { P2PCategorizationSingleAccount as Bt } from "./components/shared/P2PCategorizationSingleAccount/P2PCategorizationSingleAccount.es.js";
+import { DrillDownCalculation as ht, variants as yt } from "./components/shared/DrillDownCalculation/DrillDownCalculation.es.js";
+import { SaveAnExtra100 as Tt } from "./components/shared/SaveAnExtra100/SaveAnExtra100.es.js";
 export {
   ot as AccountBox,
   jo as AccountDiscoverability,
@@ -122,7 +123,7 @@ export {
   sr as CustomTransaction,
   Mo as Description,
   X as DirectDeposit,
-  st as DirectDepositDeepLink,
+  lt as DirectDepositDeepLink,
   q as DirectDepositSubHeader,
   ur as DiscoveredAccountsBody,
   T as DiscoveredAccountsConnect,
@@ -130,7 +131,7 @@ export {
   hr as DiscoveredAccountsMiniInsight,
   f as DoubleBarChart,
   c as DoubleBarChartMXUI,
-  Bt as DrillDownCalculation,
+  ht as DrillDownCalculation,
   vo as EmbeddedCard,
   C as EmptyBarChart,
   Eo as ErrorCard,
@@ -138,11 +139,11 @@ export {
   vr as FederalBankHolidayMUI,
   xo as FeedbackButtons,
   Ao as FeedbackCard,
-  zo as FeedbackDescription,
+  Oo as FeedbackDescription,
   Lo as FeedbackHeader,
   No as FeedbackOptions,
   K as FullFeedBodyHeader,
-  lt as Header,
+  ut as Header,
   Fo as InsightButton,
   Er as LastMonthsContributionSection,
   Y as LeftBox,
@@ -153,11 +154,11 @@ export {
   U as MiniInsightCard,
   Fr as MonthlyDebtToIncomeComparisonV2,
   kr as MonthlyEmergencyFundReviewBody,
-  zr as MonthlySavingsToIncomeComparison,
+  Or as MonthlySavingsToIncomeComparison,
   Gr as MonthlySpendToIncomeComparisonV2,
   Nr as MonthlySpendingComparisonV2,
   Ar as Offer,
-  ut as P2PCategorizationSingleAccount,
+  Bt as P2PCategorizationSingleAccount,
   w as P2PMultipleCategorization,
   jr as P2pCategorization,
   Zr as P2pCategorizationMultipleTransactions,
@@ -167,9 +168,9 @@ export {
   I as PulseGraidentBox,
   b as PulseProgressBar,
   ro as RightBox,
-  yt as SaveAnExtra100,
+  Tt as SaveAnExtra100,
   V as SaveEnoughToLiveOnBottomSection,
-  O as SaveEnoughToLiveOnTopSection,
+  z as SaveEnoughToLiveOnTopSection,
   Qr as SavingsAccountBalancesSummary,
   _r as SetUpDirectDepositBody,
   lr as SharedDeposit,
@@ -178,8 +179,9 @@ export {
   tt as SwitchDirectDepositMainContainer,
   xr as TotalSavedSection,
   R as TransactionCard,
-  at as UnifiedDeposit,
-  dt as UserFeedback,
-  nt as WeeklyNoSpendDays,
-  gt as variants
+  at as TransparentOverdraftV2,
+  nt as UnifiedDeposit,
+  st as UserFeedback,
+  dt as WeeklyNoSpendDays,
+  yt as variants
 };

package/package.json

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