@mx-cartographer/experiences 9.6.11 → 9.6.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/core/stores/InsightsV2Store.d.ts +1 -1
  3. package/dist/core/stores/InsightsV2Store.es.js.map +1 -1
  4. package/dist/core/types/Insights.d.ts +17 -0
  5. package/dist/core/types/Insights.es.js.map +1 -1
  6. package/dist/core/types/index.d.ts +1 -1
  7. package/dist/insights-v2/actionBlocks/ActionBlockLayer.es.js +21 -21
  8. package/dist/insights-v2/actionBlocks/ActionBlockLayer.es.js.map +1 -1
  9. package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js +63 -61
  10. package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js.map +1 -1
  11. package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/layout.d.ts +2 -1
  12. package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/layout.es.js +59 -38
  13. package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/layout.es.js.map +1 -1
  14. package/dist/insights-v2/actionBlocks/util.d.ts +2 -2
  15. package/dist/insights-v2/actionBlocks/util.es.js +3 -3
  16. package/dist/insights-v2/actionBlocks/util.es.js.map +1 -1
  17. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js +57 -55
  18. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js.map +1 -1
  19. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.d.ts +4 -2
  20. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.es.js +54 -23
  21. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.es.js.map +1 -1
  22. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.d.ts +2 -0
  23. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.es.js +14 -10
  24. package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.es.js.map +1 -1
  25. package/dist/insights-v2/components/BaseLayout.es.js +119 -99
  26. package/dist/insights-v2/components/BaseLayout.es.js.map +1 -1
  27. package/dist/insights-v2/components/statusIcon.d.ts +7 -0
  28. package/dist/insights-v2/components/statusIcon.es.js +10 -0
  29. package/dist/insights-v2/components/statusIcon.es.js.map +1 -0
  30. package/dist/microinsights/cards/InsightCard.es.js +78 -73
  31. package/dist/microinsights/cards/InsightCard.es.js.map +1 -1
  32. package/package.json +1 -1
@@ -1,11 +1,12 @@
1
1
  import { buildDynamicCopy as p } from "../../../core/utils/Localization.es.js";
2
- import { DATE_FORMATS_INTL as u, formatDate as N } from "../../../core/constants/DateFormats.es.js";
3
- import { getCategoryColor as y } from "../../../core/utils/CategoryUtil.es.js";
2
+ import { DATE_FORMATS_INTL as y, formatDate as N } from "../../../core/constants/DateFormats.es.js";
3
+ import { fromUnixUTC as d } from "../../../core/utils/DateUtil.es.js";
4
+ import { getCategoryColor as f } from "../../../core/utils/CategoryUtil.es.js";
4
5
  import { MerchantLogo as S } from "@mxenabled/mxui";
5
6
  import { Icon as O } from "@mxenabled/mx-icons";
6
7
  import { jsx as c } from "react/jsx-runtime";
7
- import { endOfMonth as T, startOfMonth as f } from "date-fns";
8
- var i = {
8
+ import { endOfMonth as A, startOfMonth as C } from "date-fns";
9
+ var s = {
9
10
  TRANSACTION: "not_standard_amount",
10
11
  CATEGORY_SPEND: "category_spend",
11
12
  MONTHLY_SPEND: "monthly_spend_comparison",
@@ -16,46 +17,59 @@ var i = {
16
17
  DEBT_TO_INCOME: "monthly_debt_to_income",
17
18
  COST_OF_LIVING: "cost_living_to_income",
18
19
  NON_ESSENTIAL_CATEGORY: "non_essential_category_summary",
19
- DEPOSIT_SUMMARY: "monthly_deposit_summary"
20
- }, _ = (e, t) => t && y(t, e) || e.palette.primary.main, l = (e) => ({
21
- start: f(new Date(e ?? NaN)),
22
- end: T(new Date(e ?? NaN))
23
- }), d = (e) => e?.length ? { accounts: e } : {}, g = ({ beatTransactions: e, dataSeries: t, selectedIndex: o }) => {
24
- const r = t[o], a = r?.guid, n = e.find((s) => s.guid === a)?.has_been_split;
20
+ DEPOSIT_SUMMARY: "monthly_deposit_summary",
21
+ LOW_BALANCE: "low_balance"
22
+ }, l = (e, t) => t && f(t, e) || e.palette.primary.main, _ = (e) => ({
23
+ start: C(new Date(e ?? NaN)),
24
+ end: A(new Date(e ?? NaN))
25
+ }), m = (e) => e?.length ? { accounts: e } : {}, T = ({ beat: e }) => {
26
+ const { account_guid: t, from_date: o, to_date: r } = e.insights_payload?.drilldown_data ?? {};
27
+ return typeof t != "string" || typeof o != "number" || typeof r != "number" || !Number.isFinite(o) || !Number.isFinite(r) || r <= o ? {
28
+ accounts: [],
29
+ custom: () => !1
30
+ } : {
31
+ accounts: [t],
32
+ dateRange: {
33
+ start: d(o),
34
+ end: d(r - 1)
35
+ }
36
+ };
37
+ }, g = ({ beatTransactions: e, dataSeries: t, selectedIndex: o }) => {
38
+ const r = t[o], a = r?.guid, n = e.find((i) => i.guid === a)?.has_been_split;
25
39
  return {
26
- custom: (s) => s.guid === a,
27
- dateRange: l(r?.date),
40
+ custom: (i) => i.guid === a,
41
+ dateRange: _(r?.date),
28
42
  showSplits: !n
29
43
  };
30
- }, C = ({ dataSeries: e, selectedIndex: t, instanceSlotData: o }) => {
44
+ }, h = ({ dataSeries: e, selectedIndex: t, instanceSlotData: o }) => {
31
45
  const r = e[t], a = o.category_guid ?? r?.guid;
32
46
  return {
33
47
  custom: (n) => n.category_guid === a || n.top_level_category_guid === a,
34
- dateRange: l(r?.date)
48
+ dateRange: _(r?.date)
35
49
  };
36
50
  }, I = ({ dataSeries: e, selectedIndex: t, spendCategoryGuids: o, instanceSlotData: r }) => {
37
51
  const a = e[t];
38
52
  return {
39
53
  custom: (n) => !!n.top_level_category_guid && o.includes(n.top_level_category_guid),
40
- dateRange: l(a?.date),
41
- ...d(r.account_guids)
54
+ dateRange: _(a?.date),
55
+ ...m(r.account_guids)
42
56
  };
43
- }, h = ({ beat: e, dataSeries: t, selectedIndex: o, isLastTab: r, instanceSlotData: a }) => {
44
- const n = t[o], { start: s, end: m } = l(n?.date);
57
+ }, L = ({ beat: e, dataSeries: t, selectedIndex: o, isLastTab: r, instanceSlotData: a }) => {
58
+ const n = t[o], { start: i, end: u } = _(n?.date);
45
59
  return {
46
60
  dateRange: {
47
- start: s,
48
- end: r && e.created_at ? new Date(e.created_at) : m
61
+ start: i,
62
+ end: r && e.created_at ? new Date(e.created_at) : u
49
63
  },
50
- ...d(a.account_guids)
64
+ ...m(a.account_guids)
51
65
  };
52
- }, B = {
53
- [i.TRANSACTION]: {
66
+ }, P = {
67
+ [s.TRANSACTION]: {
54
68
  top: "singleBar",
55
69
  scope: "store",
56
70
  filterMode: "store",
57
71
  filterStrategy: g,
58
- colors: (e, t) => [_(e, t)],
72
+ colors: (e, t) => [l(e, t)],
59
73
  header: (e) => {
60
74
  const { title: t, subHeader: o } = e;
61
75
  return {
@@ -74,53 +88,60 @@ var i = {
74
88
  onDismiss: () => e(!0)
75
89
  })
76
90
  },
77
- [i.CATEGORY_SPEND]: {
91
+ [s.CATEGORY_SPEND]: {
78
92
  top: "singleBar",
79
- filterStrategy: C,
93
+ filterStrategy: h,
80
94
  scope: "store",
81
95
  filterMode: "store",
82
- colors: (e, t) => [_(e, t)],
96
+ colors: (e, t) => [l(e, t)],
83
97
  header: (e) => ({
84
98
  heading: e.categoryName,
85
- subHeadingText: e.selectedDate && N(e.selectedDate, u.MONTH_LONG) || "",
99
+ subHeadingText: e.selectedDate && N(e.selectedDate, y.MONTH_LONG) || "",
86
100
  icon: /* @__PURE__ */ c(O, {
87
101
  name: "calendar_month",
88
102
  size: 16
89
103
  })
90
104
  })
91
105
  },
92
- [i.MONTHLY_SPEND]: {
106
+ [s.MONTHLY_SPEND]: {
93
107
  top: "singleBar",
94
108
  filterStrategy: I,
95
109
  scope: "store",
96
110
  filterMode: "store",
97
111
  colors: (e) => [e.palette.chart.chart2 ?? e.palette.primary.main]
98
112
  },
99
- [i.ACCOUNT_BALANCE]: {
113
+ [s.ACCOUNT_BALANCE]: {
100
114
  top: "singleBar",
101
- filterStrategy: h,
115
+ filterStrategy: L,
102
116
  scope: "store",
103
117
  filterMode: "store",
104
118
  colors: (e) => [e.palette.success.main]
105
119
  },
106
- [i.UPCOMING_BILL]: {
120
+ [s.UPCOMING_BILL]: {
107
121
  top: "upcomingBill",
108
122
  filterStrategy: g,
109
123
  scope: "beat",
110
124
  filterMode: "local",
111
- colors: (e, t) => [_(e, t)]
125
+ colors: (e, t) => [l(e, t)]
126
+ },
127
+ [s.LOW_BALANCE]: {
128
+ top: "list",
129
+ filterStrategy: T,
130
+ scope: "store",
131
+ filterMode: "store",
132
+ colors: (e) => [e.palette.primary.main]
112
133
  }
113
- }, G = {
134
+ }, w = {
114
135
  top: "singleBar",
115
136
  filterStrategy: g,
116
137
  scope: "store",
117
138
  filterMode: "store",
118
- colors: (e, t) => [_(e, t)]
139
+ colors: (e, t) => [l(e, t)]
119
140
  };
120
141
  export {
121
- i as DRILLDOWN_VARIANTS,
122
- G as FALLBACK,
123
- B as layout
142
+ s as DRILLDOWN_VARIANTS,
143
+ w as FALLBACK,
144
+ P as layout
124
145
  };
125
146
 
126
147
  //# sourceMappingURL=layout.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"layout.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionHistoryBlock/layout.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport type { Theme } from '@mui/material/styles'\nimport { endOfMonth, startOfMonth } from 'date-fns'\nimport { getCategoryColor } from '../../../core/utils/CategoryUtil'\nimport {\n type Beat,\n type InsightsFeedCopy,\n type Subtitle,\n type Transaction,\n buildDynamicCopy,\n} from '../../../core'\nimport type { TransactionFilter } from '../../../core/stores/TransactionStore'\nimport type { InsightsInstanceSlotData } from '../../../core/types/InsightsInstanceSlotData'\nimport { MerchantLogo } from '@mxenabled/mxui'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../core/constants'\nimport { Icon } from '@mxenabled/mx-icons'\nimport type { ChartDataSeriesItem } from '../../blocks/ChartBlocks/BarchartBlock/utils'\nimport type { TipSectionProps } from '../../../insights/components/shared/ChartDrawerTemplate/TipSection'\n\nexport interface DrillDownHeader {\n heading?: string\n subHeadingText?: string\n icon?: ReactNode\n}\n\nexport interface DrillDownHeaderContext {\n title?: string\n subHeader?: Subtitle\n categoryName: string\n selectedDate?: string | Date\n}\n\nexport const DRILLDOWN_VARIANTS = {\n TRANSACTION: 'not_standard_amount',\n CATEGORY_SPEND: 'category_spend',\n MONTHLY_SPEND: 'monthly_spend_comparison',\n ACCOUNT_BALANCE: 'account_balance',\n UPCOMING_BILL: 'upcoming_bill',\n SPEND_TO_INCOME: 'monthly_spend_to_income',\n SAVINGS_TO_INCOME: 'monthly_savings_to_income',\n DEBT_TO_INCOME: 'monthly_debt_to_income',\n COST_OF_LIVING: 'cost_living_to_income',\n NON_ESSENTIAL_CATEGORY: 'non_essential_category_summary',\n DEPOSIT_SUMMARY: 'monthly_deposit_summary',\n} as const\n\nexport type DrillDownVariant = (typeof DRILLDOWN_VARIANTS)[keyof typeof DRILLDOWN_VARIANTS]\n\n/**\n * One row of the flattened data_series a filterStrategy indexes into: a single-bar monthly total or a\n * synthesized upcoming-bill bar. Fields are optional because the backend keys each row dynamically\n * from data_series.names and not every variant carries a guid/category. Double-bar comparison rows\n * will extend this in the next MR.\n */\n\n// Resolves the top-chart palette from the theme (and the beat's category, when relevant).\nexport type ColorKind = (theme: Theme, categoryGuid?: string) => string[]\n\n// Resolves the dynamic drawer header (heading/sub-heading/icon JSX) from the selection context.\nexport type HeaderKind = (ctx: DrillDownHeaderContext) => DrillDownHeader\n\n/**\n * Everything a filterStrategy needs to turn the currently-selected bar/sub-tab into a\n * TransactionFilter. Data-only so strategies stay pure and testable.\n */\nexport interface FilterContext {\n beat: Beat\n beatTransactions: Transaction[]\n dataSeries: ChartDataSeriesItem[]\n selectedIndex: number\n subIndex: number\n isLastTab: boolean\n instanceSlotData: InsightsInstanceSlotData\n spendCategoryGuids: string[]\n displayedDateRange: { start: Date; end: Date }\n}\n\n// Resolves the current selection into a TransactionFilter. Carried on each config row so behavior\n// lives next to the variant it belongs to (no separate strategy registry to chase).\nexport type FilterStrategy = (ctx: FilterContext) => TransactionFilter\n\nexport interface DrillDownVariantConfig {\n top: 'singleBar' | 'upcomingBill' | 'doubleBar' | 'tabsOnly'\n filterStrategy: FilterStrategy\n colors: ColorKind\n header?: HeaderKind\n tipSection?: (\n setCloseTipSection: (flag: boolean) => void,\n copy: InsightsFeedCopy,\n merchantName?: string,\n ) => TipSectionProps\n scope: 'store' | 'beat'\n filterMode: 'store' | 'local'\n}\nconst categoryColor = (theme: Theme, categoryGuid?: string): string =>\n (categoryGuid && getCategoryColor(categoryGuid, theme)) || theme.palette.primary.main\n\nconst monthRange = (date: string | number | Date | undefined) => ({\n start: startOfMonth(new Date(date ?? NaN)),\n end: endOfMonth(new Date(date ?? NaN)),\n})\n\n// Scopes a filter to the beat's accounts when the beat carries account_guids; otherwise leaves\n// accounts unset so the store default (all accounts) applies.\nconst accountScope = (accountGuids?: string[]): Pick<TransactionFilter, 'accounts'> =>\n accountGuids?.length ? { accounts: accountGuids } : {}\n\n// ── Single-bar filter strategies (this MR) ────────────────────────────────────────────────────\n\n// BillAmountNotStandard / UpcomingBill — the series carries a transaction (TRN) guid; match a single\n// transaction by guid within its month.\nconst transactionGuidStrategy: FilterStrategy = ({\n beatTransactions,\n dataSeries,\n selectedIndex,\n}) => {\n const seriesItem = dataSeries[selectedIndex]\n const seriesGuid = seriesItem?.guid\n const hasBeenSplit = beatTransactions.find((trn) => trn.guid === seriesGuid)?.has_been_split\n\n return {\n custom: (trn) => trn.guid === seriesGuid,\n dateRange: monthRange(seriesItem?.date),\n showSplits: !hasBeenSplit,\n }\n}\n\n// CategorySpendingV2 — match transactions in the beat's category (or whose top-level category is that\n// guid) within the month.\nconst categoryStrategy: FilterStrategy = ({ dataSeries, selectedIndex, instanceSlotData }) => {\n const seriesItem = dataSeries[selectedIndex]\n const categoryGuid = instanceSlotData.category_guid ?? seriesItem?.guid\n\n return {\n custom: (trn) =>\n trn.category_guid === categoryGuid || trn.top_level_category_guid === categoryGuid,\n dateRange: monthRange(seriesItem?.date),\n }\n}\n\n// MonthlySpendComparisonV2 — no per-bar guid; show all spending-category transactions\n// (income/transfers/investments excluded via spendCategoryGuids) within the month.\nconst spendCategoriesStrategy: FilterStrategy = ({\n dataSeries,\n selectedIndex,\n spendCategoryGuids,\n instanceSlotData,\n}) => {\n const seriesItem = dataSeries[selectedIndex]\n\n return {\n custom: (trn) =>\n !!trn.top_level_category_guid && spendCategoryGuids.includes(trn.top_level_category_guid),\n dateRange: monthRange(seriesItem?.date),\n ...accountScope(instanceSlotData.account_guids),\n }\n}\n\n// SavingsAccountBalancesSummary — balances, not categorized spend. Filter by month only; the most\n// recent month is capped at the beat's creation time to match the snapshot the balance was computed\n// from.\nconst accountDateStrategy: FilterStrategy = ({\n beat,\n dataSeries,\n selectedIndex,\n isLastTab,\n instanceSlotData,\n}) => {\n const seriesItem = dataSeries[selectedIndex]\n const { start, end } = monthRange(seriesItem?.date)\n\n return {\n dateRange: {\n start,\n end: isLastTab && beat.created_at ? new Date(beat.created_at) : end,\n },\n ...accountScope(instanceSlotData.account_guids),\n }\n}\n\n// ── Double-bar + tabsOnly strategies (NEXT MR) ───────────────────────────────────────────────────\n// TODO(next MR — double bar): comparisonAggregatedGuidsStrategy — month × sub-tab membership over the\n// comparison bars' precomputed subGuids. Needs comparisonBars in FilterContext.\n// TODO(next MR — tabsOnly): aggregatedGuids / depositSummary strategies for the donut-drawer beats.\n\nexport const layout: Partial<Record<DrillDownVariant, DrillDownVariantConfig>> = {\n [DRILLDOWN_VARIANTS.TRANSACTION]: {\n top: 'singleBar',\n scope: 'store',\n filterMode: 'store',\n filterStrategy: transactionGuidStrategy,\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n header: (ctx: DrillDownHeaderContext) => {\n const { title, subHeader } = ctx\n return {\n heading: title,\n subHeadingText: subHeader?.text || undefined,\n icon: (\n <MerchantLogo\n alt={subHeader?.text}\n categoryGuid={subHeader?.logo?.category_guid || ''}\n merchantGuid={subHeader?.logo?.merchant_guid || ''}\n size={16}\n />\n ),\n }\n },\n tipSection: (setCloseTipSection, copy, merchantName = '') => {\n return {\n message: buildDynamicCopy(\n copy.general.tip_section_message,\n <strong>{copy.general.tip_section_title}</strong>,\n <strong>{merchantName}</strong>,\n ),\n onDismiss: () => setCloseTipSection(true),\n } as TipSectionProps\n },\n },\n [DRILLDOWN_VARIANTS.CATEGORY_SPEND]: {\n top: 'singleBar',\n filterStrategy: categoryStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n header: (ctx: DrillDownHeaderContext) => {\n return {\n heading: ctx.categoryName,\n subHeadingText: ctx.selectedDate\n ? formatDate(ctx.selectedDate, DATE_FORMATS_INTL.MONTH_LONG) || ''\n : '',\n icon: <Icon name=\"calendar_month\" size={16} />,\n }\n },\n },\n [DRILLDOWN_VARIANTS.MONTHLY_SPEND]: {\n top: 'singleBar',\n filterStrategy: spendCategoriesStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme) => [theme.palette.chart.chart2 ?? theme.palette.primary.main],\n },\n [DRILLDOWN_VARIANTS.ACCOUNT_BALANCE]: {\n top: 'singleBar',\n filterStrategy: accountDateStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme) => [theme.palette.success.main],\n },\n [DRILLDOWN_VARIANTS.UPCOMING_BILL]: {\n top: 'upcomingBill',\n filterStrategy: transactionGuidStrategy,\n scope: 'beat',\n filterMode: 'local',\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n },\n\n // ── NEXT MR: double-bar comparison beats (month tabs + spend/income sub-tabs) ────────────────\n // [DRILLDOWN_VARIANTS.SPEND_TO_INCOME]: comparison('spendVsIncome'),\n // [DRILLDOWN_VARIANTS.SAVINGS_TO_INCOME]: comparison('savingsVsIncome'),\n // [DRILLDOWN_VARIANTS.DEBT_TO_INCOME]: comparison('debtVsIncome'),\n // [DRILLDOWN_VARIANTS.COST_OF_LIVING]: comparison('costOfLiving'),\n //\n // ── NEXT MR: tabsOnly donut-drawer beats (no top chart) ───────────────────────────────────\n // [DRILLDOWN_VARIANTS.NON_ESSENTIAL_CATEGORY]: { top: 'tabsOnly', ... },\n // [DRILLDOWN_VARIANTS.DEPOSIT_SUMMARY]: { top: 'tabsOnly', ... },\n}\n\n// Fallback for a missing/typo'd backend variant: a single-bar, store-scoped drawer filtered by the\n// beat's transaction guid and colored by category, so the drawer still renders instead of crashing.\nexport const FALLBACK: DrillDownVariantConfig = {\n top: 'singleBar',\n filterStrategy: transactionGuidStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"layout.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionHistoryBlock/layout.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport type { Theme } from '@mui/material/styles'\nimport { endOfMonth, startOfMonth } from 'date-fns'\nimport { getCategoryColor } from '../../../core/utils/CategoryUtil'\nimport {\n type Beat,\n type InsightsFeedCopy,\n type Subtitle,\n type Transaction,\n buildDynamicCopy,\n} from '../../../core'\nimport type { TransactionFilter } from '../../../core/stores/TransactionStore'\nimport type { InsightsInstanceSlotData } from '../../../core/types/InsightsInstanceSlotData'\nimport { MerchantLogo } from '@mxenabled/mxui'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../core/constants'\nimport { fromUnixUTC } from '../../../core/utils/DateUtil'\nimport { Icon } from '@mxenabled/mx-icons'\nimport type { ChartDataSeriesItem } from '../../blocks/ChartBlocks/BarchartBlock/utils'\nimport type { TipSectionProps } from '../../../insights/components/shared/ChartDrawerTemplate/TipSection'\n\nexport interface DrillDownHeader {\n heading?: string\n subHeadingText?: string\n icon?: ReactNode\n}\n\nexport interface DrillDownHeaderContext {\n title?: string\n subHeader?: Subtitle\n categoryName: string\n selectedDate?: string | Date\n}\n\nexport const DRILLDOWN_VARIANTS = {\n TRANSACTION: 'not_standard_amount',\n CATEGORY_SPEND: 'category_spend',\n MONTHLY_SPEND: 'monthly_spend_comparison',\n ACCOUNT_BALANCE: 'account_balance',\n UPCOMING_BILL: 'upcoming_bill',\n SPEND_TO_INCOME: 'monthly_spend_to_income',\n SAVINGS_TO_INCOME: 'monthly_savings_to_income',\n DEBT_TO_INCOME: 'monthly_debt_to_income',\n COST_OF_LIVING: 'cost_living_to_income',\n NON_ESSENTIAL_CATEGORY: 'non_essential_category_summary',\n DEPOSIT_SUMMARY: 'monthly_deposit_summary',\n LOW_BALANCE: 'low_balance',\n} as const\n\nexport type DrillDownVariant = (typeof DRILLDOWN_VARIANTS)[keyof typeof DRILLDOWN_VARIANTS]\n\n/**\n * One row of the flattened data_series a filterStrategy indexes into: a single-bar monthly total or a\n * synthesized upcoming-bill bar. Fields are optional because the backend keys each row dynamically\n * from data_series.names and not every variant carries a guid/category. Double-bar comparison rows\n * will extend this in the next MR.\n */\n\n// Resolves the top-chart palette from the theme (and the beat's category, when relevant).\nexport type ColorKind = (theme: Theme, categoryGuid?: string) => string[]\n\n// Resolves the dynamic drawer header (heading/sub-heading/icon JSX) from the selection context.\nexport type HeaderKind = (ctx: DrillDownHeaderContext) => DrillDownHeader\n\n/**\n * Everything a filterStrategy needs to turn the currently-selected bar/sub-tab into a\n * TransactionFilter. Data-only so strategies stay pure and testable.\n */\nexport interface FilterContext {\n beat: Beat\n beatTransactions: Transaction[]\n dataSeries: ChartDataSeriesItem[]\n selectedIndex: number\n subIndex: number\n isLastTab: boolean\n instanceSlotData: InsightsInstanceSlotData\n spendCategoryGuids: string[]\n displayedDateRange: { start: Date; end: Date }\n}\n\n// Resolves the current selection into a TransactionFilter. Carried on each config row so behavior\n// lives next to the variant it belongs to (no separate strategy registry to chase).\nexport type FilterStrategy = (ctx: FilterContext) => TransactionFilter\n\nexport interface DrillDownVariantConfig {\n // `list`: no chart or tabs above the transaction list (an account's transactions for a window).\n top: 'singleBar' | 'upcomingBill' | 'doubleBar' | 'tabsOnly' | 'list'\n filterStrategy: FilterStrategy\n colors: ColorKind\n header?: HeaderKind\n tipSection?: (\n setCloseTipSection: (flag: boolean) => void,\n copy: InsightsFeedCopy,\n merchantName?: string,\n ) => TipSectionProps\n scope: 'store' | 'beat'\n filterMode: 'store' | 'local'\n}\nconst categoryColor = (theme: Theme, categoryGuid?: string): string =>\n (categoryGuid && getCategoryColor(categoryGuid, theme)) || theme.palette.primary.main\n\nconst monthRange = (date: string | number | Date | undefined) => ({\n start: startOfMonth(new Date(date ?? NaN)),\n end: endOfMonth(new Date(date ?? NaN)),\n})\n\n// Scopes a filter to the beat's accounts when the beat carries account_guids; otherwise leaves\n// accounts unset so the store default (all accounts) applies.\nconst accountScope = (accountGuids?: string[]): Pick<TransactionFilter, 'accounts'> =>\n accountGuids?.length ? { accounts: accountGuids } : {}\n\n// Low Account Balance — `drilldown_data` names one account and a window (epoch seconds at UTC\n// midnight, to_date exclusive). Fails closed: a drawer that cannot name its rows shows none.\nconst accountWindowStrategy: FilterStrategy = ({ beat }) => {\n const { account_guid, from_date, to_date } = beat.insights_payload?.drilldown_data ?? {}\n if (\n typeof account_guid !== 'string' ||\n typeof from_date !== 'number' ||\n typeof to_date !== 'number' ||\n !Number.isFinite(from_date) ||\n !Number.isFinite(to_date) ||\n to_date <= from_date\n ) {\n return { accounts: [], custom: () => false }\n }\n\n return {\n accounts: [account_guid],\n dateRange: { start: fromUnixUTC(from_date), end: fromUnixUTC(to_date - 1) },\n }\n}\n\n// ── Single-bar filter strategies (this MR) ────────────────────────────────────────────────────\n\n// BillAmountNotStandard / UpcomingBill — the series carries a transaction (TRN) guid; match a single\n// transaction by guid within its month.\nconst transactionGuidStrategy: FilterStrategy = ({\n beatTransactions,\n dataSeries,\n selectedIndex,\n}) => {\n const seriesItem = dataSeries[selectedIndex]\n const seriesGuid = seriesItem?.guid\n const hasBeenSplit = beatTransactions.find((trn) => trn.guid === seriesGuid)?.has_been_split\n\n return {\n custom: (trn) => trn.guid === seriesGuid,\n dateRange: monthRange(seriesItem?.date),\n showSplits: !hasBeenSplit,\n }\n}\n\n// CategorySpendingV2 — match transactions in the beat's category (or whose top-level category is that\n// guid) within the month.\nconst categoryStrategy: FilterStrategy = ({ dataSeries, selectedIndex, instanceSlotData }) => {\n const seriesItem = dataSeries[selectedIndex]\n const categoryGuid = instanceSlotData.category_guid ?? seriesItem?.guid\n\n return {\n custom: (trn) =>\n trn.category_guid === categoryGuid || trn.top_level_category_guid === categoryGuid,\n dateRange: monthRange(seriesItem?.date),\n }\n}\n\n// MonthlySpendComparisonV2 — no per-bar guid; show all spending-category transactions\n// (income/transfers/investments excluded via spendCategoryGuids) within the month.\nconst spendCategoriesStrategy: FilterStrategy = ({\n dataSeries,\n selectedIndex,\n spendCategoryGuids,\n instanceSlotData,\n}) => {\n const seriesItem = dataSeries[selectedIndex]\n\n return {\n custom: (trn) =>\n !!trn.top_level_category_guid && spendCategoryGuids.includes(trn.top_level_category_guid),\n dateRange: monthRange(seriesItem?.date),\n ...accountScope(instanceSlotData.account_guids),\n }\n}\n\n// SavingsAccountBalancesSummary — balances, not categorized spend. Filter by month only; the most\n// recent month is capped at the beat's creation time to match the snapshot the balance was computed\n// from.\nconst accountDateStrategy: FilterStrategy = ({\n beat,\n dataSeries,\n selectedIndex,\n isLastTab,\n instanceSlotData,\n}) => {\n const seriesItem = dataSeries[selectedIndex]\n const { start, end } = monthRange(seriesItem?.date)\n\n return {\n dateRange: {\n start,\n end: isLastTab && beat.created_at ? new Date(beat.created_at) : end,\n },\n ...accountScope(instanceSlotData.account_guids),\n }\n}\n\n// ── Double-bar + tabsOnly strategies (NEXT MR) ───────────────────────────────────────────────────\n// TODO(next MR — double bar): comparisonAggregatedGuidsStrategy — month × sub-tab membership over the\n// comparison bars' precomputed subGuids. Needs comparisonBars in FilterContext.\n// TODO(next MR — tabsOnly): aggregatedGuids / depositSummary strategies for the donut-drawer beats.\n\nexport const layout: Partial<Record<DrillDownVariant, DrillDownVariantConfig>> = {\n [DRILLDOWN_VARIANTS.TRANSACTION]: {\n top: 'singleBar',\n scope: 'store',\n filterMode: 'store',\n filterStrategy: transactionGuidStrategy,\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n header: (ctx: DrillDownHeaderContext) => {\n const { title, subHeader } = ctx\n return {\n heading: title,\n subHeadingText: subHeader?.text || undefined,\n icon: (\n <MerchantLogo\n alt={subHeader?.text}\n categoryGuid={subHeader?.logo?.category_guid || ''}\n merchantGuid={subHeader?.logo?.merchant_guid || ''}\n size={16}\n />\n ),\n }\n },\n tipSection: (setCloseTipSection, copy, merchantName = '') => {\n return {\n message: buildDynamicCopy(\n copy.general.tip_section_message,\n <strong>{copy.general.tip_section_title}</strong>,\n <strong>{merchantName}</strong>,\n ),\n onDismiss: () => setCloseTipSection(true),\n } as TipSectionProps\n },\n },\n [DRILLDOWN_VARIANTS.CATEGORY_SPEND]: {\n top: 'singleBar',\n filterStrategy: categoryStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n header: (ctx: DrillDownHeaderContext) => {\n return {\n heading: ctx.categoryName,\n subHeadingText: ctx.selectedDate\n ? formatDate(ctx.selectedDate, DATE_FORMATS_INTL.MONTH_LONG) || ''\n : '',\n icon: <Icon name=\"calendar_month\" size={16} />,\n }\n },\n },\n [DRILLDOWN_VARIANTS.MONTHLY_SPEND]: {\n top: 'singleBar',\n filterStrategy: spendCategoriesStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme) => [theme.palette.chart.chart2 ?? theme.palette.primary.main],\n },\n [DRILLDOWN_VARIANTS.ACCOUNT_BALANCE]: {\n top: 'singleBar',\n filterStrategy: accountDateStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme) => [theme.palette.success.main],\n },\n [DRILLDOWN_VARIANTS.UPCOMING_BILL]: {\n top: 'upcomingBill',\n filterStrategy: transactionGuidStrategy,\n scope: 'beat',\n filterMode: 'local',\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n },\n\n // Low Account Balance's \"Transactions\" link: the account's transactions for the alert's window.\n [DRILLDOWN_VARIANTS.LOW_BALANCE]: {\n top: 'list',\n filterStrategy: accountWindowStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme) => [theme.palette.primary.main],\n },\n\n // ── NEXT MR: double-bar comparison beats (month tabs + spend/income sub-tabs) ────────────────\n // [DRILLDOWN_VARIANTS.SPEND_TO_INCOME]: comparison('spendVsIncome'),\n // [DRILLDOWN_VARIANTS.SAVINGS_TO_INCOME]: comparison('savingsVsIncome'),\n // [DRILLDOWN_VARIANTS.DEBT_TO_INCOME]: comparison('debtVsIncome'),\n // [DRILLDOWN_VARIANTS.COST_OF_LIVING]: comparison('costOfLiving'),\n //\n // ── NEXT MR: tabsOnly donut-drawer beats (no top chart) ───────────────────────────────────\n // [DRILLDOWN_VARIANTS.NON_ESSENTIAL_CATEGORY]: { top: 'tabsOnly', ... },\n // [DRILLDOWN_VARIANTS.DEPOSIT_SUMMARY]: { top: 'tabsOnly', ... },\n}\n\n// Fallback for a missing/typo'd backend variant: a single-bar, store-scoped drawer filtered by the\n// beat's transaction guid and colored by category, so the drawer still renders instead of crashing.\nexport const FALLBACK: DrillDownVariantConfig = {\n top: 'singleBar',\n filterStrategy: transactionGuidStrategy,\n scope: 'store',\n filterMode: 'store',\n colors: (theme: Theme, categoryGuid?: string) => [categoryColor(theme, categoryGuid)],\n}\n"],"mappings":";;;;;;;;AAiCA,IAAa,IAAqB;AAAA,EAChC,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,wBAAwB;AAAA,EACxB,iBAAiB;AAAA,EACjB,aAAa;AACf,GAmDM,IAAA,CAAiB,GAAc,MAClC,KAAgB,EAAiB,GAAc,CAAK,KAAM,EAAM,QAAQ,QAAQ,MAE7E,IAAA,CAAc,OAA8C;AAAA,EAChE,OAAO,EAAa,IAAI,KAAK,KAAQ,GAAG,CAAC;AAAA,EACzC,KAAK,EAAW,IAAI,KAAK,KAAQ,GAAG,CAAC;AACvC,IAIM,IAAA,CAAgB,MACpB,GAAc,SAAS,EAAE,UAAU,EAAa,IAAI,CAAC,GAIjD,IAAA,CAAyC,EAAE,MAAA,EAAA,MAAW;AAC1D,QAAM,EAAE,cAAA,GAAc,WAAA,GAAW,SAAA,EAAA,IAAY,EAAK,kBAAkB,kBAAkB,CAAC;AACvF,SACE,OAAO,KAAiB,YACxB,OAAO,KAAc,YACrB,OAAO,KAAY,YACnB,CAAC,OAAO,SAAS,CAAS,KAC1B,CAAC,OAAO,SAAS,CAAO,KACxB,KAAW,IAEJ;AAAA,IAAE,UAAU,CAAC;AAAA,IAAG,QAAA,MAAc;AAAA,EAAM,IAGtC;AAAA,IACL,UAAU,CAAC,CAAY;AAAA,IACvB,WAAW;AAAA,MAAE,OAAO,EAAY,CAAS;AAAA,MAAG,KAAK,EAAY,IAAU,CAAC;AAAA,IAAE;AAAA,EAC5E;AACF,GAMM,IAAA,CAA2C,EAC/C,kBAAA,GACA,YAAA,GACA,eAAA,EAAA,MACI;AACJ,QAAM,IAAa,EAAW,CAAA,GACxB,IAAa,GAAY,MACzB,IAAe,EAAiB,KAAA,CAAM,MAAQ,EAAI,SAAS,CAAU,GAAG;AAE9E,SAAO;AAAA,IACL,QAAA,CAAS,MAAQ,EAAI,SAAS;AAAA,IAC9B,WAAW,EAAW,GAAY,IAAI;AAAA,IACtC,YAAY,CAAC;AAAA,EACf;AACF,GAIM,IAAA,CAAoC,EAAE,YAAA,GAAY,eAAA,GAAe,kBAAA,EAAA,MAAuB;AAC5F,QAAM,IAAa,EAAW,CAAA,GACxB,IAAe,EAAiB,iBAAiB,GAAY;AAEnE,SAAO;AAAA,IACL,QAAA,CAAS,MACP,EAAI,kBAAkB,KAAgB,EAAI,4BAA4B;AAAA,IACxE,WAAW,EAAW,GAAY,IAAI;AAAA,EACxC;AACF,GAIM,IAAA,CAA2C,EAC/C,YAAA,GACA,eAAA,GACA,oBAAA,GACA,kBAAA,EAAA,MACI;AACJ,QAAM,IAAa,EAAW,CAAA;AAE9B,SAAO;AAAA,IACL,QAAA,CAAS,MACP,CAAC,CAAC,EAAI,2BAA2B,EAAmB,SAAS,EAAI,uBAAuB;AAAA,IAC1F,WAAW,EAAW,GAAY,IAAI;AAAA,IACtC,GAAG,EAAa,EAAiB,aAAa;AAAA,EAChD;AACF,GAKM,IAAA,CAAuC,EAC3C,MAAA,GACA,YAAA,GACA,eAAA,GACA,WAAA,GACA,kBAAA,EAAA,MACI;AACJ,QAAM,IAAa,EAAW,CAAA,GACxB,EAAE,OAAA,GAAO,KAAA,EAAA,IAAQ,EAAW,GAAY,IAAI;AAElD,SAAO;AAAA,IACL,WAAW;AAAA,MACT,OAAA;AAAA,MACA,KAAK,KAAa,EAAK,aAAa,IAAI,KAAK,EAAK,UAAU,IAAI;AAAA,IAClE;AAAA,IACA,GAAG,EAAa,EAAiB,aAAa;AAAA,EAChD;AACF,GAOa,IAAoE;AAAA,EAC9E,CAAA,EAAmB,WAAA,GAAc;AAAA,IAChC,KAAK;AAAA,IACL,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,QAAA,CAAS,GAAc,MAA0B,CAAC,EAAc,GAAO,CAAY,CAAC;AAAA,IACpF,QAAA,CAAS,MAAgC;AACvC,YAAM,EAAE,OAAA,GAAO,WAAA,EAAA,IAAc;AAC7B,aAAO;AAAA,QACL,SAAS;AAAA,QACT,gBAAgB,GAAW,QAAQ;AAAA,QACnC,MACE,gBAAA,EAAC,GAAD;AAAA,UACE,KAAK,GAAW;AAAA,UAChB,cAAc,GAAW,MAAM,iBAAiB;AAAA,UAChD,cAAc,GAAW,MAAM,iBAAiB;AAAA,UAChD,MAAM;AAAA,QACP,CAAA;AAAA,MAEL;AAAA,IACF;AAAA,IACA,YAAA,CAAa,GAAoB,GAAM,IAAe,QAC7C;AAAA,MACL,SAAS,EACP,EAAK,QAAQ,qBACb,gBAAA,EAAC,UAAD,EAAA,UAAS,EAAK,QAAQ,kBAA0B,CAAA,GAChD,gBAAA,EAAC,UAAD,EAAA,UAAS,EAAqB,CAAA,CAChC;AAAA,MACA,WAAA,MAAiB,EAAmB,EAAI;AAAA,IAC1C;AAAA,EAEJ;AAAA,EACC,CAAA,EAAmB,cAAA,GAAiB;AAAA,IACnC,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,QAAA,CAAS,GAAc,MAA0B,CAAC,EAAc,GAAO,CAAY,CAAC;AAAA,IACpF,QAAA,CAAS,OACA;AAAA,MACL,SAAS,EAAI;AAAA,MACb,gBAAgB,EAAI,gBAChB,EAAW,EAAI,cAAc,EAAkB,UAAU,KAAK;AAAA,MAElE,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAiB,MAAM;AAAA,MAAK,CAAA;AAAA,IAC/C;AAAA,EAEJ;AAAA,EACC,CAAA,EAAmB,aAAA,GAAgB;AAAA,IAClC,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,QAAA,CAAS,MAAiB,CAAC,EAAM,QAAQ,MAAM,UAAU,EAAM,QAAQ,QAAQ,IAAI;AAAA,EACrF;AAAA,EACC,CAAA,EAAmB,eAAA,GAAkB;AAAA,IACpC,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,QAAA,CAAS,MAAiB,CAAC,EAAM,QAAQ,QAAQ,IAAI;AAAA,EACvD;AAAA,EACC,CAAA,EAAmB,aAAA,GAAgB;AAAA,IAClC,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,QAAA,CAAS,GAAc,MAA0B,CAAC,EAAc,GAAO,CAAY,CAAC;AAAA,EACtF;AAAA,EAGC,CAAA,EAAmB,WAAA,GAAc;AAAA,IAChC,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,QAAA,CAAS,MAAiB,CAAC,EAAM,QAAQ,QAAQ,IAAI;AAAA,EACvD;AAWF,GAIa,IAAmC;AAAA,EAC9C,KAAK;AAAA,EACL,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,QAAA,CAAS,GAAc,MAA0B,CAAC,EAAc,GAAO,CAAY,CAAC;AACtF"}
@@ -1,4 +1,4 @@
1
- import { ActionDrawerState, PrimaryCTA, SecondaryCTA } from '../../core';
1
+ import { ActionDrawerState, InDescriptionCTA, PrimaryCTA, SecondaryCTA } from '../../core';
2
2
  /**
3
3
  * A chart-bar drilldown's context carries which block it targets (see BarchartBlock /
4
4
  * DoubleBarChartBlock), since either CTA could in principle open the same drawer. Match that
@@ -10,4 +10,4 @@ export declare const getCtaForChartBarClick: (actionDrawer: ActionDrawerState, p
10
10
  * on what triggered it. Falls back to `primary_cta` whenever resolution comes up empty (e.g. a
11
11
  * `secondaryCta` trigger with no configured secondary CTA), so callers never have to null-check.
12
12
  */
13
- export declare const getDynamicCtaBasedOnTriggers: (actionDrawer: ActionDrawerState, primary_cta: PrimaryCTA | undefined, secondary_cta: SecondaryCTA | undefined) => PrimaryCTA | SecondaryCTA | undefined;
13
+ export declare const getDynamicCtaBasedOnTriggers: (actionDrawer: ActionDrawerState, primary_cta: PrimaryCTA | undefined, secondary_cta: SecondaryCTA | undefined, in_description_cta?: InDescriptionCTA) => PrimaryCTA | SecondaryCTA | InDescriptionCTA | undefined;
@@ -1,7 +1,7 @@
1
- var g = (e, r, t) => e.context?.block === r?.block ? r : t, n = (e, r, t) => e.trigger === "secondaryCta" ? t ?? r : e.trigger === "primaryCta" ? r : g(e, r, t) ?? r;
1
+ var n = (e, r, t) => e.context?.block === r?.block ? r : t, i = (e, r, t, g) => e.trigger === "inDescriptionCta" ? g : e.trigger === "secondaryCta" ? t ?? r : e.trigger === "primaryCta" ? r : n(e, r, t) ?? r;
2
2
  export {
3
- g as getCtaForChartBarClick,
4
- n as getDynamicCtaBasedOnTriggers
3
+ n as getCtaForChartBarClick,
4
+ i as getDynamicCtaBasedOnTriggers
5
5
  };
6
6
 
7
7
  //# sourceMappingURL=util.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"util.es.js","names":[],"sources":["../../../src/insights-v2/actionBlocks/util.ts"],"sourcesContent":["import type { ActionDrawerState, DrilldownPayload, PrimaryCTA, SecondaryCTA } from '../../core'\n\n/**\n * A chart-bar drilldown's context carries which block it targets (see BarchartBlock /\n * DoubleBarChartBlock), since either CTA could in principle open the same drawer. Match that\n * against `primary_cta.block`; anything else is assumed to be the secondary CTA's block.\n */\nexport const getCtaForChartBarClick = (\n actionDrawer: ActionDrawerState,\n primary_cta: PrimaryCTA | undefined,\n secondary_cta: SecondaryCTA | undefined,\n): PrimaryCTA | SecondaryCTA | undefined => {\n const context = actionDrawer.context as DrilldownPayload | undefined\n const blockName = context?.block\n\n if (blockName === primary_cta?.block) {\n return primary_cta\n }\n return secondary_cta\n}\n\n/**\n * Resolves which CTA (primary/secondary) drives the currently open drawer's title/variant, based\n * on what triggered it. Falls back to `primary_cta` whenever resolution comes up empty (e.g. a\n * `secondaryCta` trigger with no configured secondary CTA), so callers never have to null-check.\n */\nexport const getDynamicCtaBasedOnTriggers = (\n actionDrawer: ActionDrawerState,\n primary_cta: PrimaryCTA | undefined,\n secondary_cta: SecondaryCTA | undefined,\n): PrimaryCTA | SecondaryCTA | undefined => {\n if (actionDrawer.trigger === 'secondaryCta') {\n return secondary_cta ?? primary_cta\n }\n if (actionDrawer.trigger === 'primaryCta') {\n return primary_cta\n }\n return getCtaForChartBarClick(actionDrawer, primary_cta, secondary_cta) ?? primary_cta\n}\n"],"mappings":"AAOA,IAAa,IAAA,CACX,GACA,GACA,MAEgB,EAAa,SACF,UAET,GAAa,QACtB,IAEF,GAQI,IAAA,CACX,GACA,GACA,MAEI,EAAa,YAAY,iBACpB,KAAiB,IAEtB,EAAa,YAAY,eACpB,IAEF,EAAuB,GAAc,GAAa,CAAa,KAAK"}
1
+ {"version":3,"file":"util.es.js","names":[],"sources":["../../../src/insights-v2/actionBlocks/util.ts"],"sourcesContent":["import type {\n ActionDrawerState,\n DrilldownPayload,\n InDescriptionCTA,\n PrimaryCTA,\n SecondaryCTA,\n} from '../../core'\n\n/**\n * A chart-bar drilldown's context carries which block it targets (see BarchartBlock /\n * DoubleBarChartBlock), since either CTA could in principle open the same drawer. Match that\n * against `primary_cta.block`; anything else is assumed to be the secondary CTA's block.\n */\nexport const getCtaForChartBarClick = (\n actionDrawer: ActionDrawerState,\n primary_cta: PrimaryCTA | undefined,\n secondary_cta: SecondaryCTA | undefined,\n): PrimaryCTA | SecondaryCTA | undefined => {\n const context = actionDrawer.context as DrilldownPayload | undefined\n const blockName = context?.block\n\n if (blockName === primary_cta?.block) {\n return primary_cta\n }\n return secondary_cta\n}\n\n/**\n * Resolves which CTA (primary/secondary) drives the currently open drawer's title/variant, based\n * on what triggered it. Falls back to `primary_cta` whenever resolution comes up empty (e.g. a\n * `secondaryCta` trigger with no configured secondary CTA), so callers never have to null-check.\n */\nexport const getDynamicCtaBasedOnTriggers = (\n actionDrawer: ActionDrawerState,\n primary_cta: PrimaryCTA | undefined,\n secondary_cta: SecondaryCTA | undefined,\n in_description_cta?: InDescriptionCTA,\n): PrimaryCTA | SecondaryCTA | InDescriptionCTA | undefined => {\n // The description link names its own block and variant, like a CTA. Only its button fires this\n // trigger, so there is no other CTA to fall back to.\n if (actionDrawer.trigger === 'inDescriptionCta') {\n return in_description_cta\n }\n if (actionDrawer.trigger === 'secondaryCta') {\n return secondary_cta ?? primary_cta\n }\n if (actionDrawer.trigger === 'primaryCta') {\n return primary_cta\n }\n return getCtaForChartBarClick(actionDrawer, primary_cta, secondary_cta) ?? primary_cta\n}\n"],"mappings":"AAaA,IAAa,IAAA,CACX,GACA,GACA,MAEgB,EAAa,SACF,UAET,GAAa,QACtB,IAEF,GAQI,IAAA,CACX,GACA,GACA,GACA,MAII,EAAa,YAAY,qBACpB,IAEL,EAAa,YAAY,iBACpB,KAAiB,IAEtB,EAAa,YAAY,eACpB,IAEF,EAAuB,GAAc,GAAa,CAAa,KAAK"}
@@ -1,27 +1,28 @@
1
- import { formatCurrency as b } from "../../../../core/utils/NumberFormatting.es.js";
2
- import { useContainerDimensions as S } from "../../../hooks/useContainerDimensions.es.js";
3
- import { DepositLogo as D } from "../../../components/ComponentBlocks/DepositLogo.es.js";
4
- import { Confetti as z } from "../../../components/shared/Confetti.es.js";
5
- import { ReactComponent as L } from "../../../components/shared/images/PaidOffCard.es.js";
6
- import { ReactComponent as $ } from "../../../components/shared/images/SavingsAccountDeposit.es.js";
7
- import { resolveVariantConfig as B } from "../../resolveVariantConfig.es.js";
8
- import { HeaderComponent as G } from "./HeaderComponent.es.js";
9
- import { getLayoutConfig as N } from "./layout.es.js";
10
- import { IconComponent as P } from "./IconComponent.es.js";
11
- import { useRef as V } from "react";
1
+ import { slot as m } from "../../../../core/types/Insights.es.js";
2
+ import { formatCurrency as R } from "../../../../core/utils/NumberFormatting.es.js";
3
+ import { useContainerDimensions as L } from "../../../hooks/useContainerDimensions.es.js";
4
+ import { DepositLogo as $ } from "../../../components/ComponentBlocks/DepositLogo.es.js";
5
+ import { Confetti as B } from "../../../components/shared/Confetti.es.js";
6
+ import { ReactComponent as G } from "../../../components/shared/images/PaidOffCard.es.js";
7
+ import { ReactComponent as N } from "../../../components/shared/images/SavingsAccountDeposit.es.js";
8
+ import { resolveVariantConfig as P } from "../../resolveVariantConfig.es.js";
9
+ import { HeaderComponent as V } from "./HeaderComponent.es.js";
10
+ import { getLayoutConfig as j } from "./layout.es.js";
11
+ import { IconComponent as A } from "./IconComponent.es.js";
12
+ import { useRef as F } from "react";
12
13
  import t from "@mui/material/Stack";
13
- import { Text as a } from "@mxenabled/mxui";
14
- import { Icon as j } from "@mxenabled/mx-icons";
14
+ import { Text as s } from "@mxenabled/mxui";
15
+ import { Icon as E } from "@mxenabled/mx-icons";
15
16
  import { jsx as o, jsxs as r } from "react/jsx-runtime";
16
- import { useTheme as A } from "@mui/material/styles";
17
+ import { useTheme as H } from "@mui/material/styles";
17
18
  import i from "@mui/material/Box";
18
- var F = {
19
+ var O = {
19
20
  deposit_received: "payments",
20
21
  status_on_track: "monetization_on"
21
- }, io = ({ payload: y }) => {
22
- const v = A(), c = V(null), { height: d, width: l } = S(c), { instance_slot: m } = y, { variant: s, amount: p, sub_text: w, header_text: n, institution_guid: h, institution_name: u, icon_name: R, label: _, merchant_guid: C, merchant_name: f, category_guid: k } = m, e = B(N(v), s, "default", "AccountBlock");
22
+ }, co = ({ payload: _ }) => {
23
+ const C = H(), p = F(null), { height: u, width: h } = L(p), { instance_slot: n } = _, { variant: c, header_text: a, institution_guid: f, institution_name: g, icon_name: k, label: T, merchant_guid: I, merchant_name: x, category_guid: S } = n, { data: d } = n, l = m(d, "amount") ?? n.amount, b = m(d, "sub_text") ?? n.sub_text, y = m(d, "logo"), e = P(j(C), c, "default", "AccountBlock");
23
24
  if (e?.isConfetti) {
24
- const T = {
25
+ const D = {
25
26
  paidOffCard: /* @__PURE__ */ o(i, {
26
27
  sx: {
27
28
  flexShrink: 0,
@@ -29,7 +30,7 @@ var F = {
29
30
  position: "relative",
30
31
  width: 44
31
32
  },
32
- children: /* @__PURE__ */ o(L, {
33
+ children: /* @__PURE__ */ o(G, {
33
34
  "aria-hidden": !0,
34
35
  role: "presentation",
35
36
  style: {
@@ -39,7 +40,7 @@ var F = {
39
40
  }
40
41
  })
41
42
  }),
42
- savings: /* @__PURE__ */ o($, {
43
+ savings: /* @__PURE__ */ o(N, {
43
44
  "aria-hidden": !0,
44
45
  height: 55,
45
46
  role: "presentation",
@@ -53,27 +54,27 @@ var F = {
53
54
  overflow: "hidden",
54
55
  width: 48
55
56
  },
56
- children: /* @__PURE__ */ o(D, {
57
- categoryGuid: k,
58
- iconName: F[s] ?? "payments",
59
- institutionGuid: h,
60
- institutionName: u,
61
- merchantGuid: C,
62
- merchantName: f
57
+ children: /* @__PURE__ */ o($, {
58
+ categoryGuid: S,
59
+ iconName: O[c] ?? "payments",
60
+ institutionGuid: f,
61
+ institutionName: g,
62
+ merchantGuid: I,
63
+ merchantName: x
63
64
  })
64
65
  })
65
- }[e.graphic ?? "logo"], g = e.secondarySource === "merchant" ? f ?? u : _, x = g ? /* @__PURE__ */ o(a, {
66
+ }[e.graphic ?? "logo"], v = e.secondarySource === "merchant" ? x ?? g : T, w = v ? /* @__PURE__ */ o(s, {
66
67
  color: e.secondaryColor,
67
68
  variant: e.secondaryVariant,
68
- children: g
69
- }) : null, I = /* @__PURE__ */ o(a, {
69
+ children: v
70
+ }) : null, z = /* @__PURE__ */ o(s, {
70
71
  bold: !0,
71
72
  color: "success.dark",
72
73
  variant: e.amountVariant,
73
- children: `${e.amountPrefix ?? ""}${b(p, "0,0.00")}`
74
+ children: `${e.amountPrefix ?? ""}${R(l, "0,0.00")}`
74
75
  });
75
76
  return /* @__PURE__ */ r(i, {
76
- ref: c,
77
+ ref: p,
77
78
  sx: {
78
79
  backgroundImage: e.gradient,
79
80
  bgcolor: "background.paper",
@@ -89,10 +90,10 @@ var F = {
89
90
  position: "absolute",
90
91
  zIndex: 1
91
92
  },
92
- children: /* @__PURE__ */ o(z, {
93
- height: d,
94
- shouldRun: d > 0 && l > 0,
95
- width: l
93
+ children: /* @__PURE__ */ o(B, {
94
+ height: u,
95
+ shouldRun: u > 0 && h > 0,
96
+ width: h
96
97
  })
97
98
  }), /* @__PURE__ */ r(t, {
98
99
  sx: {
@@ -102,16 +103,16 @@ var F = {
102
103
  width: "100%",
103
104
  zIndex: 2
104
105
  },
105
- children: [e.categoryStrip && n && /* @__PURE__ */ o(i, {
106
+ children: [e.categoryStrip && a && /* @__PURE__ */ o(i, {
106
107
  sx: {
107
108
  bgcolor: "success.main",
108
109
  px: 12,
109
110
  py: 4
110
111
  },
111
- children: /* @__PURE__ */ o(a, {
112
+ children: /* @__PURE__ */ o(s, {
112
113
  color: "success.contrastText",
113
114
  variant: "caption",
114
- children: n
115
+ children: a
115
116
  })
116
117
  }), /* @__PURE__ */ r(t, {
117
118
  sx: {
@@ -133,16 +134,16 @@ var F = {
133
134
  display: "flex",
134
135
  flexShrink: 0
135
136
  },
136
- children: T
137
+ children: D
137
138
  }), /* @__PURE__ */ r(t, {
138
139
  sx: {
139
140
  flex: "1 0 0",
140
141
  minWidth: 0
141
142
  },
142
143
  children: [
143
- e.secondaryPosition === "above" && x,
144
- I,
145
- e.secondaryPosition === "below" && x
144
+ e.secondaryPosition === "above" && w,
145
+ z,
146
+ e.secondaryPosition === "below" && w
146
147
  ]
147
148
  })]
148
149
  })]
@@ -154,47 +155,48 @@ var F = {
154
155
  p: 16,
155
156
  ...e
156
157
  },
157
- children: [n && /* @__PURE__ */ o(G, { headerText: n }), /* @__PURE__ */ r(t, {
158
+ children: [a && /* @__PURE__ */ o(V, { headerText: a }), /* @__PURE__ */ r(t, {
158
159
  sx: {
159
160
  alignItems: "center",
160
161
  bgcolor: "background.paper",
161
162
  borderRadius: "8px",
162
- ...n && {
163
+ ...a && {
163
164
  borderTopLeftRadius: "0",
164
165
  borderTopRightRadius: "0"
165
166
  },
166
167
  gap: 16,
167
168
  p: 16,
168
169
  width: "100%",
169
- ...(h || R) && { flexDirection: "row" }
170
+ ...(f || k || y?.guid) && { flexDirection: "row" }
170
171
  },
171
- children: [/* @__PURE__ */ o(P, {
172
- slot: m,
173
- variant: s
174
- }), /* @__PURE__ */ r(t, { children: [/* @__PURE__ */ o(a, {
172
+ children: [/* @__PURE__ */ o(A, {
173
+ logo: y,
174
+ slot: n,
175
+ variant: c
176
+ }), /* @__PURE__ */ r(t, { children: [l != null && /* @__PURE__ */ o(s, {
175
177
  variant: "h1",
176
- children: b(p, "0,0.00")
178
+ children: R(l, "0,0.00")
177
179
  }), /* @__PURE__ */ r(t, {
178
180
  sx: {
179
181
  gap: 8,
180
182
  flexDirection: "row",
181
183
  alignItems: "center"
182
184
  },
183
- children: [e?.sub_logo && /* @__PURE__ */ o(j, {
185
+ children: [e?.sub_logo && /* @__PURE__ */ o(E, {
184
186
  color: "warning",
185
187
  fill: !0,
186
188
  name: e.sub_logo,
187
189
  size: 20
188
- }), /* @__PURE__ */ o(a, {
190
+ }), b && /* @__PURE__ */ o(s, {
189
191
  variant: "body2",
190
- children: w
192
+ children: b
191
193
  })]
192
194
  })] })]
193
195
  })]
194
196
  });
195
197
  };
196
198
  export {
197
- io as default
199
+ co as default
198
200
  };
199
201
 
200
202
  //# sourceMappingURL=AccountBlock.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AccountBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useRef } from 'react'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport type { InsightsPayload } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\nimport { DepositLogo } from '../../../components/ComponentBlocks/DepositLogo'\nimport { Confetti } from '../../../components/shared/Confetti'\nimport { ReactComponent as PaidOffCardGraphic } from '../../../components/shared/images/PaidOffCard.svg'\nimport { ReactComponent as SavingsGraphic } from '../../../components/shared/images/SavingsAccountDeposit.svg'\nimport { useContainerDimensions } from '../../../hooks/useContainerDimensions'\n\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\n\nimport { HeaderComponent } from './HeaderComponent'\nimport { IconComponent } from './IconComponent'\nimport { getLayoutConfig } from './layout'\n\n/** Default generic-tile icon per deposit variant, used when no merchant/institution logo. */\nconst depositIcons: Record<string, string> = {\n deposit_received: 'payments',\n status_on_track: 'monetization_on',\n}\n\nconst AccountBlock = ({ payload }: { payload: InsightsPayload; beatGuid?: string }) => {\n const theme = useTheme()\n const containerRef = useRef<HTMLDivElement>(null)\n const { height, width } = useContainerDimensions(containerRef)\n const { instance_slot } = payload\n const {\n variant,\n amount,\n sub_text,\n header_text,\n institution_guid,\n institution_name,\n icon_name,\n label,\n merchant_guid,\n merchant_name,\n category_guid,\n } = instance_slot\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n // Confetti-backed celebration variants (deposits, payoff, savings) — a success-tinted card\n // on a gradient + confetti wash. Everything variant-specific is flat on `layoutConfig`.\n if (layoutConfig?.isConfetti) {\n const graphics: Record<string, React.ReactNode> = {\n paidOffCard: (\n // SVG is 58x46 but the card sits at (0,14) with the check badge overflowing top-right.\n // Box it to the card's real 44x32 footprint and shift the SVG up so it aligns with the text.\n <Box sx={{ flexShrink: 0, height: 32, position: 'relative', width: 44 }}>\n <PaidOffCardGraphic\n aria-hidden={true}\n role=\"presentation\"\n style={{ left: 0, position: 'absolute', top: -14 }}\n />\n </Box>\n ),\n savings: <SavingsGraphic aria-hidden={true} height={55} role=\"presentation\" width={55} />,\n logo: (\n <Box\n sx={{\n borderRadius: '4px',\n flexShrink: 0,\n height: 48,\n overflow: 'hidden',\n width: 48,\n }}\n >\n <DepositLogo\n categoryGuid={category_guid}\n iconName={depositIcons[variant as keyof typeof depositIcons] ?? 'payments'}\n institutionGuid={institution_guid}\n institutionName={institution_name}\n merchantGuid={merchant_guid}\n merchantName={merchant_name}\n />\n </Box>\n ),\n }\n const graphic = graphics[layoutConfig.graphic ?? 'logo']\n\n // Deposit cards show the payer name — a merchant when we have one, otherwise the institution.\n const secondaryText =\n layoutConfig.secondarySource === 'merchant' ? (merchant_name ?? institution_name) : label\n const secondary = secondaryText ? (\n <Text color={layoutConfig.secondaryColor} variant={layoutConfig.secondaryVariant}>\n {secondaryText}\n </Text>\n ) : null\n const amountText = (\n <Text bold={true} color=\"success.dark\" variant={layoutConfig.amountVariant}>\n {`${layoutConfig.amountPrefix ?? ''}${formatCurrency(amount, '0,0.00')}`}\n </Text>\n )\n\n return (\n <Box\n ref={containerRef}\n sx={{\n backgroundImage: layoutConfig.gradient,\n bgcolor: 'background.paper',\n overflow: 'hidden',\n position: 'relative',\n p: 16,\n width: '100%',\n }}\n >\n <Box\n sx={{\n inset: 0,\n pointerEvents: 'none',\n position: 'absolute',\n zIndex: 1,\n }}\n >\n <Confetti height={height} shouldRun={height > 0 && width > 0} width={width} />\n </Box>\n\n <Stack\n sx={{\n borderRadius: '8px',\n overflow: 'hidden',\n position: 'relative',\n width: '100%',\n zIndex: 2,\n }}\n >\n {layoutConfig.categoryStrip && header_text && (\n <Box sx={{ bgcolor: 'success.main', px: 12, py: 4 }}>\n <Text color=\"success.contrastText\" variant=\"caption\">\n {header_text}\n </Text>\n </Box>\n )}\n\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'success.lighter',\n border: '1px solid',\n borderColor: 'success.main',\n borderRadius: '8px',\n // With a strip above, the body's top corners tuck under it (no double border line).\n ...(layoutConfig.categoryStrip && {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderTop: 0,\n }),\n flexDirection: 'row',\n ...layoutConfig.rowSx,\n }}\n >\n <Box sx={{ display: 'flex', flexShrink: 0 }}>{graphic}</Box>\n\n <Stack sx={{ flex: '1 0 0', minWidth: 0 }}>\n {layoutConfig.secondaryPosition === 'above' && secondary}\n {amountText}\n {layoutConfig.secondaryPosition === 'below' && secondary}\n </Stack>\n </Stack>\n </Stack>\n </Box>\n )\n }\n\n return (\n <Stack\n sx={{\n p: 16,\n ...layoutConfig,\n }}\n >\n {header_text && <HeaderComponent headerText={header_text} />}\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'background.paper',\n borderRadius: '8px',\n ...(header_text && {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n }),\n gap: 16,\n p: 16,\n width: '100%',\n ...((institution_guid || icon_name) && {\n flexDirection: 'row',\n }),\n }}\n >\n <IconComponent slot={instance_slot} variant={variant} />\n\n <Stack>\n <Text variant=\"h1\">{formatCurrency(amount, '0,0.00')}</Text>\n <Stack sx={{ gap: 8, flexDirection: 'row', alignItems: 'center' }}>\n {layoutConfig?.sub_logo && (\n <Icon color=\"warning\" fill={true} name={layoutConfig.sub_logo} size={20} />\n )}\n <Text variant=\"body2\">{sub_text}</Text>\n </Stack>\n </Stack>\n </Stack>\n </Stack>\n )\n}\n\nexport default AccountBlock\n"],"mappings":"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"}
1
+ {"version":3,"file":"AccountBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useRef } from 'react'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { slot, type InsightsPayload, type LogoRef } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\nimport { DepositLogo } from '../../../components/ComponentBlocks/DepositLogo'\nimport { Confetti } from '../../../components/shared/Confetti'\nimport { ReactComponent as PaidOffCardGraphic } from '../../../components/shared/images/PaidOffCard.svg'\nimport { ReactComponent as SavingsGraphic } from '../../../components/shared/images/SavingsAccountDeposit.svg'\nimport { useContainerDimensions } from '../../../hooks/useContainerDimensions'\n\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\n\nimport { HeaderComponent } from './HeaderComponent'\nimport { IconComponent } from './IconComponent'\nimport { getLayoutConfig } from './layout'\n\n/** Default generic-tile icon per deposit variant, used when no merchant/institution logo. */\nconst depositIcons: Record<string, string> = {\n deposit_received: 'payments',\n status_on_track: 'monetization_on',\n}\n\nconst AccountBlock = ({ payload }: { payload: InsightsPayload; beatGuid?: string }) => {\n const theme = useTheme()\n const containerRef = useRef<HTMLDivElement>(null)\n const { height, width } = useContainerDimensions(containerRef)\n const { instance_slot } = payload\n const {\n variant,\n header_text,\n institution_guid,\n institution_name,\n icon_name,\n label,\n merchant_guid,\n merchant_name,\n category_guid,\n } = instance_slot\n // V2 variants fill `instance_slot.data` (ditto's account_block slots); the rest still send the\n // flat legacy fields, so each value falls back to its flat field.\n const { data } = instance_slot\n const amount = slot<number>(data, 'amount') ?? instance_slot.amount\n const sub_text = slot<string>(data, 'sub_text') ?? instance_slot.sub_text\n const logo = slot<LogoRef>(data, 'logo')\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n // Confetti-backed celebration variants (deposits, payoff, savings) — a success-tinted card\n // on a gradient + confetti wash. Everything variant-specific is flat on `layoutConfig`.\n if (layoutConfig?.isConfetti) {\n const graphics: Record<string, React.ReactNode> = {\n paidOffCard: (\n // SVG is 58x46 but the card sits at (0,14) with the check badge overflowing top-right.\n // Box it to the card's real 44x32 footprint and shift the SVG up so it aligns with the text.\n <Box sx={{ flexShrink: 0, height: 32, position: 'relative', width: 44 }}>\n <PaidOffCardGraphic\n aria-hidden={true}\n role=\"presentation\"\n style={{ left: 0, position: 'absolute', top: -14 }}\n />\n </Box>\n ),\n savings: <SavingsGraphic aria-hidden={true} height={55} role=\"presentation\" width={55} />,\n logo: (\n <Box\n sx={{\n borderRadius: '4px',\n flexShrink: 0,\n height: 48,\n overflow: 'hidden',\n width: 48,\n }}\n >\n <DepositLogo\n categoryGuid={category_guid}\n iconName={depositIcons[variant as keyof typeof depositIcons] ?? 'payments'}\n institutionGuid={institution_guid}\n institutionName={institution_name}\n merchantGuid={merchant_guid}\n merchantName={merchant_name}\n />\n </Box>\n ),\n }\n const graphic = graphics[layoutConfig.graphic ?? 'logo']\n\n // Deposit cards show the payer name — a merchant when we have one, otherwise the institution.\n const secondaryText =\n layoutConfig.secondarySource === 'merchant' ? (merchant_name ?? institution_name) : label\n const secondary = secondaryText ? (\n <Text color={layoutConfig.secondaryColor} variant={layoutConfig.secondaryVariant}>\n {secondaryText}\n </Text>\n ) : null\n const amountText = (\n <Text bold={true} color=\"success.dark\" variant={layoutConfig.amountVariant}>\n {`${layoutConfig.amountPrefix ?? ''}${formatCurrency(amount, '0,0.00')}`}\n </Text>\n )\n\n return (\n <Box\n ref={containerRef}\n sx={{\n backgroundImage: layoutConfig.gradient,\n bgcolor: 'background.paper',\n overflow: 'hidden',\n position: 'relative',\n p: 16,\n width: '100%',\n }}\n >\n <Box\n sx={{\n inset: 0,\n pointerEvents: 'none',\n position: 'absolute',\n zIndex: 1,\n }}\n >\n <Confetti height={height} shouldRun={height > 0 && width > 0} width={width} />\n </Box>\n\n <Stack\n sx={{\n borderRadius: '8px',\n overflow: 'hidden',\n position: 'relative',\n width: '100%',\n zIndex: 2,\n }}\n >\n {layoutConfig.categoryStrip && header_text && (\n <Box sx={{ bgcolor: 'success.main', px: 12, py: 4 }}>\n <Text color=\"success.contrastText\" variant=\"caption\">\n {header_text}\n </Text>\n </Box>\n )}\n\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'success.lighter',\n border: '1px solid',\n borderColor: 'success.main',\n borderRadius: '8px',\n // With a strip above, the body's top corners tuck under it (no double border line).\n ...(layoutConfig.categoryStrip && {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderTop: 0,\n }),\n flexDirection: 'row',\n ...layoutConfig.rowSx,\n }}\n >\n <Box sx={{ display: 'flex', flexShrink: 0 }}>{graphic}</Box>\n\n <Stack sx={{ flex: '1 0 0', minWidth: 0 }}>\n {layoutConfig.secondaryPosition === 'above' && secondary}\n {amountText}\n {layoutConfig.secondaryPosition === 'below' && secondary}\n </Stack>\n </Stack>\n </Stack>\n </Box>\n )\n }\n\n return (\n <Stack\n sx={{\n p: 16,\n ...layoutConfig,\n }}\n >\n {header_text && <HeaderComponent headerText={header_text} />}\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: 'background.paper',\n borderRadius: '8px',\n ...(header_text && {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n }),\n gap: 16,\n p: 16,\n width: '100%',\n ...((institution_guid || icon_name || logo?.guid) && {\n flexDirection: 'row',\n }),\n }}\n >\n <IconComponent logo={logo} slot={instance_slot} variant={variant} />\n\n <Stack>\n {amount != null && <Text variant=\"h1\">{formatCurrency(amount, '0,0.00')}</Text>}\n <Stack sx={{ gap: 8, flexDirection: 'row', alignItems: 'center' }}>\n {layoutConfig?.sub_logo && (\n <Icon color=\"warning\" fill={true} name={layoutConfig.sub_logo} size={20} />\n )}\n {sub_text && <Text variant=\"body2\">{sub_text}</Text>}\n </Stack>\n </Stack>\n </Stack>\n </Stack>\n )\n}\n\nexport default AccountBlock\n"],"mappings":"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"}
@@ -1,7 +1,9 @@
1
- import { InstanceSlot } from '../../../../core';
1
+ import { InstanceSlot, LogoRef } from '../../../../core';
2
2
  interface IconComponentProps {
3
3
  slot: InstanceSlot;
4
4
  variant?: string | null;
5
+ /** V2: the slot's logo object (`instance_slot.data.logo`), badged with the layout's `badge`. */
6
+ logo?: LogoRef;
5
7
  }
6
- export declare const IconComponent: ({ slot, variant }: IconComponentProps) => import("react/jsx-runtime").JSX.Element | null;
8
+ export declare const IconComponent: ({ slot, variant, logo }: IconComponentProps) => import("react/jsx-runtime").JSX.Element | null;
7
9
  export {};