@mx-cartographer/experiences 9.6.6 → 9.6.8

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

@@ -0,0 +1,48 @@
+import { ReactNode } from 'react';
+export interface DebtPayoffStat {
+    /** Row label, e.g. "Projected payoff". */
+    label: ReactNode;
+    /** Pre-formatted row value, e.g. "Mar 2027". */
+    value: ReactNode;
+}
+export interface DebtPayoffPillConfig {
+    /** Pill background color token. The pill is borderless. */
+    bgcolor: string;
+    /** Pill label color token. */
+    labelColor: string;
+}
+/**
+ * Style props for the card. The Debts block supplies them for its look; the card itself
+ * is variant-agnostic. Only what a caller sets today is here; add a knob with its first caller.
+ */
+export interface DebtPayoffCardStyleProps {
+    /** Slot surface token behind the white card. Default `background.default`. */
+    bgcolor?: string;
+    /** Status pill color tokens. */
+    pill?: DebtPayoffPillConfig;
+}
+interface DebtPayoffCardProps extends DebtPayoffCardStyleProps {
+    /** Institution/account logo rendered beside the account name. */
+    logo: ReactNode;
+    /** Primary line, e.g. "Epic Bank Credit *0987". */
+    name: ReactNode;
+    /** Optional secondary line beneath the name, e.g. "Credit Card". */
+    subtitle?: ReactNode;
+    /** Caption above the balance, e.g. "Current balance". Rendered only together with `balance`. */
+    balanceLabel?: ReactNode;
+    /** Pre-formatted balance, e.g. "$4,500.00". Omitted (with its caption) when unknown. */
+    balance?: ReactNode;
+    /** Label/value rows beneath the balance (payoff date, monthly payment, rate). */
+    stats?: DebtPayoffStat[];
+    /** Optional status pill label beside the account, e.g. the payoff strategy name. */
+    statusLabel?: ReactNode;
+}
+/**
+ * A debt account card: logo + account name row (with an optional status pill), the current
+ * balance, and a divided list of label/value payoff stats, on a tinted slot.
+ *
+ * Purely presentational — it knows nothing about beats or variants; the Debts block passes
+ * the style props for its look.
+ */
+declare const DebtPayoffCard: ({ balance, balanceLabel, bgcolor, logo, name, pill, stats, statusLabel, subtitle, }: DebtPayoffCardProps) => import("react/jsx-runtime").JSX.Element;
+export default DebtPayoffCard;

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

@@ -0,0 +1,132 @@
+import u from "./StatusPill.es.js";
+import e from "@mui/material/Stack";
+import { Text as o } from "@mxenabled/mxui";
+import { Fragment as v, jsx as r, jsxs as t } from "react/jsx-runtime";
+import x from "@mui/material/Box";
+import y from "@mui/material/Divider";
+var w = {
+  bgcolor: "grey.200",
+  labelColor: "text.primary"
+}, h = (i) => typeof i == "string" ? i : void 0, I = ({ balance: i, balanceLabel: l, bgcolor: m = "background.default", logo: s, name: d, pill: a = w, stats: c = [], statusLabel: p, subtitle: n }) => /* @__PURE__ */ r(e, {
+  sx: {
+    px: 16,
+    width: "100%"
+  },
+  children: /* @__PURE__ */ r(x, {
+    sx: {
+      bgcolor: m,
+      borderRadius: "8px",
+      p: 16,
+      width: "100%"
+    },
+    children: /* @__PURE__ */ t(e, {
+      sx: {
+        bgcolor: "background.paper",
+        border: "1px solid",
+        borderColor: "divider",
+        borderRadius: "8px",
+        gap: 12,
+        p: 16,
+        width: "100%"
+      },
+      children: [
+        /* @__PURE__ */ t(e, {
+          sx: {
+            alignItems: "center",
+            flexDirection: "row",
+            gap: 12
+          },
+          children: [
+            /* @__PURE__ */ r(x, {
+              sx: {
+                borderRadius: "4px",
+                display: "flex",
+                flexShrink: 0,
+                height: 40,
+                overflow: "hidden",
+                width: 40
+              },
+              children: s
+            }),
+            /* @__PURE__ */ t(e, {
+              sx: {
+                flexGrow: 1,
+                minWidth: 0
+              },
+              children: [/* @__PURE__ */ r(o, {
+                sx: { fontWeight: 600 },
+                title: h(d),
+                truncate: !0,
+                variant: "body2",
+                children: d
+              }), n && /* @__PURE__ */ r(o, {
+                color: "text.secondary",
+                title: h(n),
+                truncate: !0,
+                variant: "caption",
+                children: n
+              })]
+            }),
+            p && /* @__PURE__ */ r(u, {
+              bgcolor: a.bgcolor,
+              label: p,
+              labelColor: a.labelColor,
+              labelVariant: "caption",
+              sx: {
+                alignSelf: "center",
+                border: "none",
+                flexShrink: 0,
+                px: 12
+              }
+            })
+          ]
+        }),
+        i != null && l != null && /* @__PURE__ */ t(e, { children: [/* @__PURE__ */ r(o, {
+          color: "text.secondary",
+          variant: "caption",
+          children: l
+        }), /* @__PURE__ */ r(o, {
+          bold: !0,
+          color: "text.primary",
+          component: "p",
+          variant: "h2",
+          children: i
+        })] }),
+        c.length > 0 && /* @__PURE__ */ t(v, { children: [/* @__PURE__ */ r(y, {}), /* @__PURE__ */ r(e, {
+          component: "dl",
+          sx: {
+            gap: 8,
+            m: 0
+          },
+          children: c.map(({ label: f, value: g }, b) => /* @__PURE__ */ t(e, {
+            sx: {
+              alignItems: "baseline",
+              flexDirection: "row",
+              gap: 12,
+              justifyContent: "space-between"
+            },
+            children: [/* @__PURE__ */ r(o, {
+              color: "text.secondary",
+              component: "dt",
+              variant: "caption",
+              children: f
+            }), /* @__PURE__ */ r(o, {
+              component: "dd",
+              sx: {
+                fontWeight: 600,
+                m: 0
+              },
+              variant: "body2",
+              children: g
+            })]
+          }, b))
+        })] })
+      ]
+    })
+  })
+});
+export {
+  I as default
+};
+
+//# sourceMappingURL=DebtPayoffCard.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DebtPayoffCard.es.js","names":[],"sources":["../../../src/insights-v2/components/DebtPayoffCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport StatusPill from './StatusPill'\n\nexport interface DebtPayoffStat {\n  /** Row label, e.g. \"Projected payoff\". */\n  label: ReactNode\n  /** Pre-formatted row value, e.g. \"Mar 2027\". */\n  value: ReactNode\n}\n\nexport interface DebtPayoffPillConfig {\n  /** Pill background color token. The pill is borderless. */\n  bgcolor: string\n  /** Pill label color token. */\n  labelColor: string\n}\n\n/**\n * Style props for the card. The Debts block supplies them for its look; the card itself\n * is variant-agnostic. Only what a caller sets today is here; add a knob with its first caller.\n */\nexport interface DebtPayoffCardStyleProps {\n  /** Slot surface token behind the white card. Default `background.default`. */\n  bgcolor?: string\n  /** Status pill color tokens. */\n  pill?: DebtPayoffPillConfig\n}\n\ninterface DebtPayoffCardProps extends DebtPayoffCardStyleProps {\n  /** Institution/account logo rendered beside the account name. */\n  logo: ReactNode\n  /** Primary line, e.g. \"Epic Bank Credit *0987\". */\n  name: ReactNode\n  /** Optional secondary line beneath the name, e.g. \"Credit Card\". */\n  subtitle?: ReactNode\n  /** Caption above the balance, e.g. \"Current balance\". Rendered only together with `balance`. */\n  balanceLabel?: ReactNode\n  /** Pre-formatted balance, e.g. \"$4,500.00\". Omitted (with its caption) when unknown. */\n  balance?: ReactNode\n  /** Label/value rows beneath the balance (payoff date, monthly payment, rate). */\n  stats?: DebtPayoffStat[]\n  /** Optional status pill label beside the account, e.g. the payoff strategy name. */\n  statusLabel?: ReactNode\n}\n\nconst NEUTRAL_PILL: DebtPayoffPillConfig = { bgcolor: 'grey.200', labelColor: 'text.primary' }\n\n/** Native tooltip with the full value for a truncated line, when the value is plain text. */\nconst titleOf = (value: ReactNode) => (typeof value === 'string' ? value : undefined)\n\n/**\n * A debt account card: logo + account name row (with an optional status pill), the current\n * balance, and a divided list of label/value payoff stats, on a tinted slot.\n *\n * Purely presentational — it knows nothing about beats or variants; the Debts block passes\n * the style props for its look.\n */\nconst DebtPayoffCard = ({\n  balance,\n  balanceLabel,\n  bgcolor = 'background.default',\n  logo,\n  name,\n  pill = NEUTRAL_PILL,\n  stats = [],\n  statusLabel,\n  subtitle,\n}: DebtPayoffCardProps) => (\n  <Stack sx={{ px: 16, width: '100%' }}>\n    <Box sx={{ bgcolor, borderRadius: '8px', p: 16, width: '100%' }}>\n      <Stack\n        sx={{\n          bgcolor: 'background.paper',\n          border: '1px solid',\n          borderColor: 'divider',\n          borderRadius: '8px',\n          gap: 12,\n          p: 16,\n          width: '100%',\n        }}\n      >\n        <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 12 }}>\n          <Box\n            sx={{\n              borderRadius: '4px',\n              display: 'flex',\n              flexShrink: 0,\n              height: 40,\n              overflow: 'hidden',\n              width: 40,\n            }}\n          >\n            {logo}\n          </Box>\n          <Stack sx={{ flexGrow: 1, minWidth: 0 }}>\n            <Text sx={{ fontWeight: 600 }} title={titleOf(name)} truncate={true} variant=\"body2\">\n              {name}\n            </Text>\n            {subtitle && (\n              <Text\n                color=\"text.secondary\"\n                title={titleOf(subtitle)}\n                truncate={true}\n                variant=\"caption\"\n              >\n                {subtitle}\n              </Text>\n            )}\n          </Stack>\n          {statusLabel && (\n            <StatusPill\n              bgcolor={pill.bgcolor}\n              label={statusLabel}\n              labelColor={pill.labelColor}\n              labelVariant=\"caption\"\n              sx={{ alignSelf: 'center', border: 'none', flexShrink: 0, px: 12 }}\n            />\n          )}\n        </Stack>\n\n        {balance != null && balanceLabel != null && (\n          <Stack>\n            <Text color=\"text.secondary\" variant=\"caption\">\n              {balanceLabel}\n            </Text>\n            {/* Display-size figure, not a heading: the feed owns the heading outline. */}\n            <Text bold={true} color=\"text.primary\" component=\"p\" variant=\"h2\">\n              {balance}\n            </Text>\n          </Stack>\n        )}\n\n        {stats.length > 0 && (\n          <>\n            <Divider />\n            <Stack component=\"dl\" sx={{ gap: 8, m: 0 }}>\n              {stats.map(({ label, value }, index) => (\n                <Stack\n                  key={index}\n                  sx={{\n                    alignItems: 'baseline',\n                    flexDirection: 'row',\n                    gap: 12,\n                    justifyContent: 'space-between',\n                  }}\n                >\n                  <Text color=\"text.secondary\" component=\"dt\" variant=\"caption\">\n                    {label}\n                  </Text>\n                  <Text component=\"dd\" sx={{ fontWeight: 600, m: 0 }} variant=\"body2\">\n                    {value}\n                  </Text>\n                </Stack>\n              ))}\n            </Stack>\n          </>\n        )}\n      </Stack>\n    </Box>\n  </Stack>\n)\n\nexport default DebtPayoffCard\n"],"mappings":"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"}

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

@@ -2,6 +2,7 @@ export * from './blocks';
 export { default as AccountHeroCard } from './components/AccountHeroCard';
 export { default as ConnectionDetailDrillDown, type ConnectionDetailContent, } from './components/ConnectionDetailDrillDown';
 export { default as DirectDepositCard, type DirectDepositCardStyleProps, type DirectDepositPillConfig, } from './components/DirectDepositCard';
+export { default as DebtPayoffCard, type DebtPayoffCardStyleProps, type DebtPayoffPillConfig, type DebtPayoffStat, } from './components/DebtPayoffCard';
 export { default as AmountPill } from './components/AmountPill';
 export { default as BadgedTile } from './components/BadgedTile';
 export { default as StatusBadge, type StatusTone } from './components/StatusBadge';

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

@@ -4,15 +4,15 @@ 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 l } from "./components/InsightOptionsMenu.es.js";
-import d, { isLogoGuid as g } from "./components/LogoFromGuid.es.js";
-import C from "./components/StatusBadge.es.js";
+import d, { isLogoGuid as B } from "./components/LogoFromGuid.es.js";
+import g from "./components/StatusBadge.es.js";
 import k from "./components/CompactInsightCard.es.js";
 import h from "./components/InsightErrorCard.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 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 y from "./blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
+import P 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";
@@ -21,105 +21,109 @@ 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 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";
+import Y from "./components/DebtPayoffCard.es.js";
+import $ from "./components/UpcomingBillCard.es.js";
+import ro from "./blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import mo from "./blocks/ComponentBlocks/DebtsBlock/DebtsBlock.es.js";
+import ao from "./components/SaveAnExtraCard.es.js";
+import fo from "./blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
+import no from "./components/SavingsOpportunityCard.es.js";
+import lo from "./blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js";
+import Bo from "./components/InsightTransactionRow.es.js";
+import go from "./components/TransactionListCard.es.js";
+import { transactionBlockVariant as ko } from "./blocks/ComponentBlocks/TransactionBlock/layout.es.js";
+import { TransactionBlock as ho } from "./blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
+import bo from "./components/AmountPill.es.js";
+import To from "./components/SubscriptionHeroCard.es.js";
+import Lo from "./blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js";
+import Ho from "./components/WithdrawalCard.es.js";
+import wo from "./blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
+import { SVGImageBlock as Mo } from "./blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import Eo from "./components/ConnectionDetailDrillDown.es.js";
+import Fo from "./components/DesignateEmergencySavingsCard.es.js";
+import xo from "./components/shared/StatusSnackbar.es.js";
+import Uo from "./components/FeedbackDialog.es.js";
+import No from "./components/FeedbackModal.es.js";
+import jo from "./components/SurveyModal.es.js";
+import { ErrorCard as zo } from "./components/ErrorCard.es.js";
+import { HOST_ACTIONS as Ko } from "./ctaActions/hostActions.es.js";
+import { useBeatCtaActions as Xo, useCtaHandler as Yo } from "./ctaActions/useCtaAction.es.js";
+import { FeedbackBar as $o } from "./components/FeedbackBar.es.js";
+import { DismissInsightDialog as rr } from "./components/DismissInsightDialog.es.js";
+import { HiddenConfirmationCard as mr } from "./components/HiddenConfirmationCard.es.js";
+import { LoadingCard as ar } from "./components/LoadingCard.es.js";
+import { ObsolesceBanner as fr } from "./components/ObsolesceBanner.es.js";
+import nr from "./components/BaseLayout.es.js";
+import lr from "./components/StatusMessageCard.es.js";
+import dr from "./components/LogoTile.es.js";
+import Cr from "./components/LogoClusterCard.es.js";
+import ur from "./components/MerchantHighlightCard.es.js";
+import Sr from "./components/P2PLogoStack.es.js";
 export {
   V as AccountBlock,
   W as AccountHeroCard,
   _ as AccountSwitchBlock,
-  ko as AmountPill,
+  bo as AmountPill,
   b as BAR_CHART_VARIANTS,
   f as BadgedTile,
   v as BarchartBlock,
-  ar as BaseLayout,
+  nr as BaseLayout,
   Q as BudgetBlock,
   k as CompactInsightCard,
-  wo as ConnectionDetailDrillDown,
-  yo as DesignateEmergencySavingsCard,
+  Eo as ConnectionDetailDrillDown,
+  Y as DebtPayoffCard,
+  mo as DebtsBlock,
+  Fo as DesignateEmergencySavingsCard,
   J as DirectDepositBlock,
   q as DirectDepositCard,
-  Yo as DismissInsightDialog,
-  E as DonutChartBlock,
+  rr as DismissInsightDialog,
+  P 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,
+  zo as ErrorCard,
+  $o as FeedbackBar,
+  Uo as FeedbackDialog,
+  No as FeedbackModal,
+  Ko as HOST_ACTIONS,
+  mr as HiddenConfirmationCard,
   h as InsightErrorCard,
   l as InsightOptionsMenu,
-  ao as InsightTransactionRow,
-  rr as LoadingCard,
-  lr as LogoClusterCard,
+  Bo as InsightTransactionRow,
+  ar as LoadingCard,
+  Cr as LogoClusterCard,
   d as LogoFromGuid,
-  nr as LogoTile,
-  dr as MerchantHighlightCard,
-  mr as ObsolesceBanner,
+  dr as LogoTile,
+  ur as MerchantHighlightCard,
+  fr as ObsolesceBanner,
   n as OverflowMenu,
-  Br as P2PLogoStack,
-  Ho as SVGImageBlock,
-  Y as SaveAnExtraCard,
-  $ as SaveExtraBlock,
-  mo as SavingsOpportunityBlock,
-  ro as SavingsOpportunityCard,
-  C as StatusBadge,
-  fr as StatusMessageCard,
+  Sr as P2PLogoStack,
+  Mo as SVGImageBlock,
+  ao as SaveAnExtraCard,
+  fo as SaveExtraBlock,
+  lo as SavingsOpportunityBlock,
+  no as SavingsOpportunityCard,
+  g as StatusBadge,
+  lr as StatusMessageCard,
   r as StatusPill,
-  Po as StatusSnackbar,
-  M as StepChartBlock,
-  ho as SubscriptionHeroCard,
-  Uo as SurveyModal,
-  lo as TransactionBlock,
-  fo as TransactionListCard,
+  xo as StatusSnackbar,
+  y as StepChartBlock,
+  To as SubscriptionHeroCard,
+  jo as SurveyModal,
+  ho as TransactionBlock,
+  go as TransactionListCard,
   G as TransferLogoCard,
-  Co as UpcomingBillBlock,
-  go as UpcomingBillCard,
-  bo as UpcomingSubscriptionBlock,
-  Lo as WithdrawalBlock,
-  To as WithdrawalCard,
+  ro as UpcomingBillBlock,
+  $ as UpcomingBillCard,
+  Lo as UpcomingSubscriptionBlock,
+  wo as WithdrawalBlock,
+  Ho as WithdrawalCard,
   A as barChartVariant,
   T as buildChartData,
   I as buildDataSeries,
-  g as isLogoGuid,
+  B as isLogoGuid,
   m as resolveInsightRender,
-  no as transactionBlockVariant,
+  ko as transactionBlockVariant,
   a as useBeatActions,
-  zo as useBeatCtaActions,
-  Jo as useCtaHandler
+  Xo as useBeatCtaActions,
+  Yo as useCtaHandler
 };

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

@@ -1,4 +1,4 @@
-import { ContactSupportActionBlock as c } from "../actionBlocks/ContactSupportActionBlock.es.js";
+import { ContactSupportActionBlock as n } from "../actionBlocks/ContactSupportActionBlock.es.js";
 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";
@@ -9,120 +9,122 @@ 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/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import A from "../blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import u from "../blocks/ComponentBlocks/DebtsBlock/DebtsBlock.es.js";
+import O from "../blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
+import f from "../blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js";
+import { TransactionBlock as b } from "../blocks/ComponentBlocks/TransactionBlock/TransactionBlock.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 I from "../blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
+import d from "../blocks/ImageBlocks/ImageBlock.es.js";
+import { SVGImageBlock as g } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import { FeedbackModalActionBlock as L } from "../actionBlocks/FeedbackModalActionBlock.es.js";
+import { ConnectionDetailActionBlock as D } from "../actionBlocks/ConnectionDetailActionBlock.es.js";
+import { ConnectWidgetActionBlock as P } from "../actionBlocks/ConnectWidgetActionBlock.es.js";
+import { SurveyModalActionBlock as h } from "../actionBlocks/SurveyModalActionBlock.es.js";
+import { PlaceholderActionBlock as S } from "../actionBlocks/PlaceholderActionBlock.es.js";
+import { getMakeTransferDrawerTitle as R } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
+import { MakeTransferActionBlockLayer as K } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
+import { getDrawerHeaderTitle as E } from "../actionBlocks/TransactionHistoryBlock/utils.es.js";
+import { TransactionDetailsBlock as v } 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 { TransactionHistoryBlock as M } 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";
+import { RecurringTransactionBlock as w } from "../actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.es.js";
+import { TransactionListBlock as y } from "../actionBlocks/TransactionListBlock/TransactionListBlock.es.js";
+import { RemainingCashBlock as U } from "../actionBlocks/RemainingCashBlock/RemainingCashBlock.es.js";
+import { hasDrawerBlock as No } from "./hasDrawerBlock.es.js";
+import { AmountInputModalBlock as H } from "../actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js";
 var r = (e) => {
-}, bo = {
+}, go = {
   [o.PLACEHOLDER_ACTION_BLOCK]: {
-    Component: h,
+    Component: S,
     usePrepare: r,
     title: () => "Action Block Layer Drilldown"
   },
   [o.MAKE_TRANSFER_ACTION_BLOCK]: {
-    Component: R,
+    Component: K,
     usePrepare: r,
-    title: S
+    title: R
   },
   [o.TRANSCATION_HISTORY_ACTION_BLOCK]: {
-    Component: v,
+    Component: M,
     usePrepare: r,
-    title: K
+    title: E
   },
   [o.TRANSACTION_DETAILS_ACTION_BLOCK]: {
-    Component: E,
+    Component: v,
     usePrepare: i,
     title: () => "Transaction Details"
   },
   [o.RECURRING_TRANSACTION_ACTION_BLOCK]: {
-    Component: M,
+    Component: w,
     usePrepare: a,
     title: (e, t) => t.recurring?.expense_details ?? ""
   },
   [o.REMAINING_CASH_ACTION_BLOCK]: {
-    Component: y,
+    Component: U,
     usePrepare: a,
     title: (e, t) => t.insights_feed?.remaining_cash?.title ?? ""
   },
   [o.CONTACT_SUPPORT_ACTION_BLOCK]: {
-    Component: c,
+    Component: n,
     usePrepare: r,
     title: (e, t) => t.help?.request_support ?? ""
   },
   [o.FEEDBACK_MODAL_ACTION_BLOCK]: {
-    Component: g,
+    Component: L,
     usePrepare: r,
     presentation: "modal"
   },
   [o.CONNECTION_DETAIL_ACTION_BLOCK]: {
-    Component: L,
+    Component: D,
     usePrepare: r,
     title: (e, t) => t.insights_feed?.connection_details?.connection_details_drawer_title ?? ""
   },
   [o.CONNECT_WIDGET_ACTION_BLOCK]: {
-    Component: D,
+    Component: P,
     usePrepare: r
   },
   [o.SURVEY_MODAL_ACTION_BLOCK]: {
-    Component: P,
+    Component: h,
     usePrepare: r,
     presentation: "modal"
   },
   [o.TRANSACTION_LIST_ACTION_BLOCK]: {
-    Component: w,
+    Component: y,
     usePrepare: i,
-    title: (e, t, n) => n?.insights_payload?.title ?? ""
+    title: (e, t, c) => c?.insights_payload?.title ?? ""
   },
   [o.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {
-    Component: U,
+    Component: H,
     presentation: "modal",
     usePrepare: r
   }
-}, Io = {
+}, Lo = {
   account_block: C,
   account_switch_block: k,
   direct_deposit_block: B,
   bar_chart_block: m,
   budget_block: T,
+  debts_block: u,
   donut_chart_block: _,
   double_bar_chart_block: l,
   double_progress_bar_block: s,
-  image_block: I,
-  save_extra_block: A,
-  savings_opportunity_block: u,
+  image_block: d,
+  save_extra_block: O,
+  savings_opportunity_block: f,
   step_chart_block: p,
-  svg_image_block: d,
-  upcoming_bill_block: f,
+  svg_image_block: g,
+  upcoming_bill_block: A,
   upcoming_subscription_block: N,
-  withdrawal_block: b,
-  transaction_block: O
+  withdrawal_block: I,
+  transaction_block: b
 };
 export {
-  bo as actionBlocks,
-  Io as blocks,
-  fo as hasDrawerBlock
+  go as actionBlocks,
+  Lo as blocks,
+  No as hasDrawerBlock
 };
 
 //# sourceMappingURL=blocks.es.js.map