@mx-cartographer/experiences 9.4.13 → 9.4.15

package/CHANGELOG.md

@@ -1,3 +1,24 @@
+## [9.4.15] - 09-03-2026
+
+- **ADDED** - Transaction History action block (single-bar): `transaction_history_block` registered in `mappings/blocks.ts`, rendering a `BarChartV2` over the beat's monthly `data_series` above a reused transactions `TransactionList` drilldown. Variant behavior (chart top, bar colors, drawer header, and the per-variant `filterStrategy`) is driven by `drillDownConfig`, covering the Transaction, CategorySpend, MonthlySpend, AccountBalance, and UpcomingBill variants (WEC-1701)
+- **ADDED** - Upcoming-bill drilldown synthesizes its chart bars from the beat's recurring-bill transactions plus a projected bill read off `instance_slot_data` (`buildUpcomingBillSeries`), de-duped by date and sorted oldest→newest with a `TRN-projected-bill` sentinel bar (WEC-1701)
+- **CHANGED** - Migrated insights-v2 instance-slot block names and bar-chart variant names to snake_case to match the backend contract: `BlockType` values, the `mappings/blocks.ts` map keys, `BAR_CHART_VARIANTS`, `BarchartBlock` layout keys, and the corresponding mock payloads (e.g. `bar_chart_block`, `category_color`, `monthly_spend_comparison`, `savings_account_balances_summary`, `budget_block`, `category_transactions_block`) (WEC-1701)
+- **CHANGED** - `buildChartData` accepts an optional date format (defaults to month-short; upcoming-bill passes month-day) and now carries each bar's `date` so chart tabs, filter indexing, and the drawer header stay aligned (WEC-1701)
+- **CHANGED** - `Legends` type made consistent: `additional_value`, `additional_value_type`, and `value_type` are now optional, and `instance_slot_data.legends` is typed as `Legends[]` (WEC-1701)
+- **CHANGED** - `drillDownConfig` type-hardened: `DataSeriesItem` replaces `any[]` for the data series shape; removed the unused `filterKind` field; `filterStrategy` is now a required discriminated union returning a typed `TransactionFilter` or `{ skip: true }` (WEC-1701)
+- **CHANGED** - `ActionDrawerState.context` stays `unknown` at the store level; drilldown components narrow to their expected payload shape via the new `useActionContext<DrilldownPayload>()` hook (WEC-1701)
+- **CHANGED** - `TransactionHistoryBlock` snapshots the shared transaction filter on mount and restores it on unmount via a `useLayoutEffect` cleanup function, keeping beat-specific filter state scoped to the block lifecycle instead of leaking into `InsightsV2Store` as a global concern (WEC-1701)
+- **FIXED** - Transaction History block renders the shared `EmptyBarChart` empty state instead of crashing when a single-bar or upcoming-bill beat produces no chart data (WEC-1701)
+- **FIXED** - Upcoming-bill drilldown rendered an empty chart because the recurring-bill scoping guids were read from the top-level `Beat`; they (plus `primary_transaction_guid` and `account_guids`) are now sourced from `instance_slot_data`, where the payload actually carries them, so the synthesized bars render again (WEC-1701)
+- **FIXED** - `TransactionHistoryBlock` `useLayoutEffect` deps now use stable joined-string keys (`beatTransactionGuidsKey`, `recurringBillGuidsKey`) instead of unmemoized computed arrays, preventing infinite render/fetch loops (WEC-1701)
+- **ADDED** - Unit tests for the Transaction History action block: `drillDownConfig` + filter strategies, `utils` (flattened series, upcoming-bill synthesis, drawer titles, default selection), the `useTransactionHistory` hook, `TransactionDrillDown`, the block render, `buildChartData` date-format behavior, and the block registry mapping (WEC-1701)
+
+## [9.4.14] - 09-03-2026
+
+- **ADDED** - insights-v2 `TransactionDetailsBlock` action block: shared drawer content any transaction beat opens via `primary_cta.block = 'TransactionDetailsBlock'`. Resolves its subject transaction from `instance_slot_data.transaction_guid`, then `beat.primary_transaction_guid`, then `transaction_guids[0]`, preferring the `transactionStore` object over the payload snapshot so inline edits write through; maps backend action-name strings to the `TopActions`/`BottomActions` enums (unknown names dropped, `undefined` means defaults, `[]` means none); `useTransactionDetailsPrepare` loads transaction data at drawer-open time. Registered in `mappings/blocks.ts`, with a Storybook story (WEC-1499)
+- **ADDED** - `TransactionDetailsBlockData` to the insights-v2 instance-slot-data union (WEC-1499)
+- **FIXED** - `TransactionDetailsBlock` no longer falls back to `beat.primary_transaction` when it is a snapshot of a *different* transaction than the resolved guid — previously a beat naming its subject via `instance_slot_data` whose guid missed in the store rendered the wrong transaction's details, and inline edits were made against the wrong subject (WEC-1499)
+
 ## [9.4.13] - 09-02-2026
 
 - **CHANGED** - the theme shape radius is half of `card_corner_radius`, so cards render at 2x the theme radius per MXUI convention (MEW-3445)

package/dist/core/types/Insights.d.ts

@@ -26,9 +26,9 @@ export interface InsightsPayload {
 export interface Legends {
     label: string;
     value: number;
-    additional_value: number;
-    additional_value_type: string;
-    value_type: string;
+    additional_value?: number;
+    additional_value_type?: string;
+    value_type?: string;
 }
 export interface Logo {
     category_guid?: string;
@@ -75,18 +75,18 @@ export interface Footer {
     account: string;
 }
 export declare const BlockType: {
-    readonly AccountBlock: "AccountBlock";
-    readonly BarChartBlock: "BarChartBlock";
-    readonly BudgetBlock: "BudgetBlock";
-    readonly CategoryTransactionsBlock: "CategoryTransactionsBlock";
-    readonly ImageBlock: "ImageBlock";
-    readonly DonutChartBlock: "DonutChartBlock";
-    readonly DoubleBarChartBlock: "DoubleBarChartBlock";
-    readonly DoubleProgressBarBlock: "DoubleProgressBarBlock";
-    readonly StepChartBlock: "StepChartBlock";
-    readonly SVGImageBlock: "SVGImageBlock";
+    readonly AccountBlock: "account_block";
+    readonly BarChartBlock: "bar_chart_block";
+    readonly BudgetBlock: "budget_block";
+    readonly CategoryTransactionsBlock: "category_transactions_block";
+    readonly ImageBlock: "image_block";
+    readonly DonutChartBlock: "donut_chart_block";
+    readonly DoubleBarChartBlock: "double_bar_chart_block";
+    readonly DoubleProgressBarBlock: "double_progress_bar_block";
+    readonly StepChartBlock: "step_chart_block";
+    readonly SVGImageBlock: "svg_image_block";
 };
-export type BlockType = keyof typeof BlockType;
+export type BlockType = (typeof BlockType)[keyof typeof BlockType];
 export interface InstanceSlot {
     block: BlockType;
     variant: string | null;

package/dist/core/types/InsightsInstanceSlotData.d.ts

@@ -1,12 +1,16 @@
 import { DataSeries, Legends } from '../../core';
 import { Transaction } from './Transaction';
-export interface InsightsInstanceSlotData extends Partial<BarChartBlockData>, Partial<BudgetBlockData>, Partial<DonutChartBlockData>, Partial<DoubleProgressBarBlockData>, Partial<ImageBlockData>, Partial<AccountBlockData>, Partial<SaveExtraBlockData>, Partial<StepChartBlockData>, Partial<SVGImageBlockData>, Partial<CategoryTransactionsBlockData>, Partial<AccountSwitchBlockData>, Partial<CommonProps> {
+export interface InsightsInstanceSlotData extends Partial<BarChartBlockData>, Partial<BudgetBlockData>, Partial<DonutChartBlockData>, Partial<DoubleProgressBarBlockData>, Partial<ImageBlockData>, Partial<AccountBlockData>, Partial<SaveExtraBlockData>, Partial<StepChartBlockData>, Partial<SVGImageBlockData>, Partial<CategoryTransactionsBlockData>, Partial<AccountSwitchBlockData>, Partial<TransactionDetailsBlockData>, Partial<CommonProps> {
 }
 interface CommonProps {
     amount?: number;
-    legends?: (Legends | LegendProps)[];
+    date?: string;
+    legends?: Legends[];
     category_guid?: string;
     data_series?: DataSeries | DataSet[];
+    transaction_guids?: string[];
+    account_guids?: string[];
+    primary_transaction_guid?: string;
 }
 export interface BarChartBlockData {
     average_amount?: number;
@@ -122,4 +126,15 @@ export type InsightTransaction = Pick<Transaction, 'amount'> & Partial<Pick<Tran
 export interface CategoryTransactionsBlockData {
     primary_transaction?: InsightTransaction;
 }
+export interface TransactionDetailsBlockData {
+    /**
+     * Explicit subject of the details drawer. Optional: the block falls back to
+     * `beat.primary_transaction_guid`, then `beat.transaction_guids[0]`.
+     */
+    transaction_guid?: string;
+    /** `TopActions` member names, e.g. `['Category', 'Date', 'Memo']`. Omit for the defaults. */
+    top_actions?: string[];
+    /** `BottomActions` member names, e.g. `['MerchantBudget', 'HideTransaction']`. Omit for defaults. */
+    bottom_actions?: string[];
+}
 export {};

package/dist/core/types/InsightsInstanceSlotData.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"InsightsInstanceSlotData.es.js","names":[],"sources":["../../../src/core/types/InsightsInstanceSlotData.ts"],"sourcesContent":["import type { DataSeries, Legends } from '../../core'\nimport type { Transaction } from './Transaction'\n\nexport interface InsightsInstanceSlotData\n  extends\n    Partial<BarChartBlockData>,\n    Partial<BudgetBlockData>,\n    Partial<DonutChartBlockData>,\n    Partial<DoubleProgressBarBlockData>,\n    Partial<ImageBlockData>,\n    Partial<AccountBlockData>,\n    Partial<SaveExtraBlockData>,\n    Partial<StepChartBlockData>,\n    Partial<SVGImageBlockData>,\n    Partial<CategoryTransactionsBlockData>,\n    Partial<AccountSwitchBlockData>,\n    Partial<CommonProps> {}\n\n//when any of the type is used more than one times, we can use the common props\ninterface CommonProps {\n  amount?: number\n  legends?: (Legends | LegendProps)[]\n  category_guid?: string\n  data_series?: DataSeries | DataSet[]\n}\n\n//BarChart Block\nexport interface BarChartBlockData {\n  average_amount?: number\n  ariaLabel?: string\n}\n\n//DonutChart Block\ninterface Main {\n  value: string\n  value_type: string\n  label: string\n}\nexport interface DonutChartBlockData {\n  main: Main\n}\n\n//DoubleBarChart Block\n// TODO : This has to be revisited again to update the below types based on API response once we have the final shape of the data_series for double bar chart from BE\nexport interface LegendProps extends Legends {\n  amount: number\n  formattedAmount: string\n  label: string\n  color?: string\n}\n\nexport interface DataSet extends DataSeries {\n  ariaLabelComparison: string\n  ariaLabelMain: string\n  comparison: number\n  formattedComparison: string\n  formattedMain: string\n  label: string\n  main: number\n}\n\n//DoubleProgressBar Block\n\ninterface DoubleProgressBarProps {\n  label: string\n  value: number\n}\nexport interface DoubleProgressBarBlockData {\n  doubleProgressBar: {\n    previous: DoubleProgressBarProps\n    latest: DoubleProgressBarProps\n  }\n}\n\n//Image Block\nexport interface ImageBlockData {\n  image: string\n}\n\n//Account Block\nexport interface AccountBlockData {\n  sub_text: string\n  institution_guid?: string\n  institution_name?: string\n  icon_name?: string\n  /** Header bar text (standard card), or the colored category strip label (deposit cards). */\n  header_text?: string\n  // Deposit variants (Unified Deposit, Unified Deposit Emergency Fund, Savings Account Deposit)\n  /** Merchant guid — renders a real merchant logo in the deposit card when present. */\n  merchant_guid?: string\n  /** Merchant display name — logo alt text and the payer line under the amount. */\n  merchant_name?: string\n  /** Secondary label beside the amount, e.g. `On {date}, you saved` or `Balance as of MM/DD/YY`. */\n  label?: string\n}\n\nexport interface SaveExtraBlockData {\n  /** Styled segments `[lead-in, amount digits, trailing copy]`, e.g. `['Save an extra', '100', 'to help your funds grow']`. */\n  primary_text?: string[]\n  /** Styled segments `[projected balance, caption]`, e.g. `['$8,313.87', 'After payday & projected expenses']`. */\n  secondary_text?: string[]\n  /** MakeTransfer drilldown: available balance (both variants). */\n  available_balance?: number\n  /** SAVE_ENOUGH_TO_LIVE_ON: average monthly spend. */\n  avg_monthly_spend?: number\n  /** SAVE_ENOUGH_TO_LIVE_ON: how long the balance lasts, overlaid on the timeline SVG (e.g. \"2 months, 11 days\"). */\n  time_period?: string\n  /** SAVE_AN_EXTRA_100: upcoming expenses (the \"Expenses\" figure). */\n  upcoming_expenses?: number\n  /** SAVE_AN_EXTRA_100: total remaining after expenses. */\n  total_remaining?: number\n  /** SAVE_ENOUGH_TO_LIVE_ON: date for the \"Your available balances as of {date}\" line. */\n  date?: string\n}\n\n//AccountSwitch Block\nexport interface AccountSwitchBlockData {\n  discovered_institution_guid: string\n  discovered_institution_name: string\n  held_institution_guid: string\n  held_institution_name: string\n  is_connected: boolean\n}\n\n// StepChart Block\nexport interface StepChartBlockData {\n  completed_steps: number\n  label_1: string\n  label_2?: string\n}\n\n//Budgets Blocks\nexport enum BudgetTierType {\n  LOW_BUDGET_TIER = 'LOW',\n  MEDIUM_BUDGET_TIER = 'MEDIUM',\n  OFF_TRACK_BUDGET_TIER = 'OFF_TRACK',\n}\n\nexport type BudgetTierValue = `${BudgetTierType}`\n\nexport interface BudgetLocalizedPayload {\n  primary_text?: string\n  amount_left_label?: string\n  spent_label?: string\n  budgeted_label?: string\n}\n\nexport interface BudgetBlockData {\n  budget_percent: number\n  budget_tier: BudgetTierValue\n  category_guid?: string\n  merchant_guid?: string\n  spent_amount: number\n  budgeted_amount: number\n  localized_payload: BudgetLocalizedPayload\n}\n\nexport interface SVGImageBlockData {\n  isCIBC?: boolean\n}\n\nexport type InsightTransaction = Pick<Transaction, 'amount'> &\n  Partial<Pick<Transaction, 'category_guid' | 'date' | 'description' | 'merchant_guid'>> & {\n    merchant_name?: string\n  }\n\nexport interface CategoryTransactionsBlockData {\n  primary_transaction?: InsightTransaction\n}\n"],"mappings":"AAoIA,IAAY,IAAL,0BAAA,GAAA;AACL,SAAA,EAAA,kBAAA,OACA,EAAA,qBAAA,UACA,EAAA,wBAAA;AACF,GAAA,CAAA,CAAA"}
+{"version":3,"file":"InsightsInstanceSlotData.es.js","names":[],"sources":["../../../src/core/types/InsightsInstanceSlotData.ts"],"sourcesContent":["import type { DataSeries, Legends } from '../../core'\nimport type { Transaction } from './Transaction'\n\nexport interface InsightsInstanceSlotData\n  extends\n    Partial<BarChartBlockData>,\n    Partial<BudgetBlockData>,\n    Partial<DonutChartBlockData>,\n    Partial<DoubleProgressBarBlockData>,\n    Partial<ImageBlockData>,\n    Partial<AccountBlockData>,\n    Partial<SaveExtraBlockData>,\n    Partial<StepChartBlockData>,\n    Partial<SVGImageBlockData>,\n    Partial<CategoryTransactionsBlockData>,\n    Partial<AccountSwitchBlockData>,\n    Partial<TransactionDetailsBlockData>,\n    Partial<CommonProps> {}\n\n//when any of the type is used more than one times, we can use the common props\ninterface CommonProps {\n  amount?: number\n  date?: string\n  legends?: Legends[]\n  category_guid?: string\n  data_series?: DataSeries | DataSet[]\n  transaction_guids?: string[]\n  account_guids?: string[]\n  primary_transaction_guid?: string\n}\n\n//BarChart Block\nexport interface BarChartBlockData {\n  average_amount?: number\n  ariaLabel?: string\n}\n\n//DonutChart Block\ninterface Main {\n  value: string\n  value_type: string\n  label: string\n}\nexport interface DonutChartBlockData {\n  main: Main\n}\n\n//DoubleBarChart Block\n// TODO : This has to be revisited again to update the below types based on API response once we have the final shape of the data_series for double bar chart from BE\nexport interface LegendProps extends Legends {\n  amount: number\n  formattedAmount: string\n  label: string\n  color?: string\n}\n\nexport interface DataSet extends DataSeries {\n  ariaLabelComparison: string\n  ariaLabelMain: string\n  comparison: number\n  formattedComparison: string\n  formattedMain: string\n  label: string\n  main: number\n}\n\n//DoubleProgressBar Block\n\ninterface DoubleProgressBarProps {\n  label: string\n  value: number\n}\nexport interface DoubleProgressBarBlockData {\n  doubleProgressBar: {\n    previous: DoubleProgressBarProps\n    latest: DoubleProgressBarProps\n  }\n}\n\n//Image Block\nexport interface ImageBlockData {\n  image: string\n}\n\n//Account Block\nexport interface AccountBlockData {\n  sub_text: string\n  institution_guid?: string\n  institution_name?: string\n  icon_name?: string\n  /** Header bar text (standard card), or the colored category strip label (deposit cards). */\n  header_text?: string\n  // Deposit variants (Unified Deposit, Unified Deposit Emergency Fund, Savings Account Deposit)\n  /** Merchant guid — renders a real merchant logo in the deposit card when present. */\n  merchant_guid?: string\n  /** Merchant display name — logo alt text and the payer line under the amount. */\n  merchant_name?: string\n  /** Secondary label beside the amount, e.g. `On {date}, you saved` or `Balance as of MM/DD/YY`. */\n  label?: string\n}\n\nexport interface SaveExtraBlockData {\n  /** Styled segments `[lead-in, amount digits, trailing copy]`, e.g. `['Save an extra', '100', 'to help your funds grow']`. */\n  primary_text?: string[]\n  /** Styled segments `[projected balance, caption]`, e.g. `['$8,313.87', 'After payday & projected expenses']`. */\n  secondary_text?: string[]\n  /** MakeTransfer drilldown: available balance (both variants). */\n  available_balance?: number\n  /** SAVE_ENOUGH_TO_LIVE_ON: average monthly spend. */\n  avg_monthly_spend?: number\n  /** SAVE_ENOUGH_TO_LIVE_ON: how long the balance lasts, overlaid on the timeline SVG (e.g. \"2 months, 11 days\"). */\n  time_period?: string\n  /** SAVE_AN_EXTRA_100: upcoming expenses (the \"Expenses\" figure). */\n  upcoming_expenses?: number\n  /** SAVE_AN_EXTRA_100: total remaining after expenses. */\n  total_remaining?: number\n  /** SAVE_ENOUGH_TO_LIVE_ON: date for the \"Your available balances as of {date}\" line. */\n  date?: string\n}\n\n//AccountSwitch Block\nexport interface AccountSwitchBlockData {\n  discovered_institution_guid: string\n  discovered_institution_name: string\n  held_institution_guid: string\n  held_institution_name: string\n  is_connected: boolean\n}\n\n// StepChart Block\nexport interface StepChartBlockData {\n  completed_steps: number\n  label_1: string\n  label_2?: string\n}\n\n//Budgets Blocks\nexport enum BudgetTierType {\n  LOW_BUDGET_TIER = 'LOW',\n  MEDIUM_BUDGET_TIER = 'MEDIUM',\n  OFF_TRACK_BUDGET_TIER = 'OFF_TRACK',\n}\n\nexport type BudgetTierValue = `${BudgetTierType}`\n\nexport interface BudgetLocalizedPayload {\n  primary_text?: string\n  amount_left_label?: string\n  spent_label?: string\n  budgeted_label?: string\n}\n\nexport interface BudgetBlockData {\n  budget_percent: number\n  budget_tier: BudgetTierValue\n  category_guid?: string\n  merchant_guid?: string\n  spent_amount: number\n  budgeted_amount: number\n  localized_payload: BudgetLocalizedPayload\n}\n\nexport interface SVGImageBlockData {\n  isCIBC?: boolean\n}\n\nexport type InsightTransaction = Pick<Transaction, 'amount'> &\n  Partial<Pick<Transaction, 'category_guid' | 'date' | 'description' | 'merchant_guid'>> & {\n    merchant_name?: string\n  }\n\nexport interface CategoryTransactionsBlockData {\n  primary_transaction?: InsightTransaction\n}\n\n// TransactionDetails Action Block\nexport interface TransactionDetailsBlockData {\n  /**\n   * Explicit subject of the details drawer. Optional: the block falls back to\n   * `beat.primary_transaction_guid`, then `beat.transaction_guids[0]`.\n   */\n  transaction_guid?: string\n  /** `TopActions` member names, e.g. `['Category', 'Date', 'Memo']`. Omit for the defaults. */\n  top_actions?: string[]\n  /** `BottomActions` member names, e.g. `['MerchantBudget', 'HideTransaction']`. Omit for defaults. */\n  bottom_actions?: string[]\n}\n"],"mappings":"AAyIA,IAAY,IAAL,0BAAA,GAAA;AACL,SAAA,EAAA,kBAAA,OACA,EAAA,qBAAA,UACA,EAAA,wBAAA;AACF,GAAA,CAAA,CAAA"}

package/dist/core/types/localization/InsightsFeedCopy.d.ts

@@ -48,9 +48,22 @@ export interface MakeTransferCopy {
     increment_aria_label: string;
     decrement_aria_label: string;
 }
+export interface TransactionHistoryBlock {
+    category_spend_drawer_title: string;
+    monthly_spend_comparison_drawer_title: string;
+    savings_account_balances_summary_drawer_title: string;
+    upcoming_bill_drawer_title: string;
+    monthly_spend_to_income_drawer_title: string;
+    monthly_debt_to_income_drawer_title: string;
+    monthly_savings_to_income_drawer_title: string;
+    cost_living_to_income_drawer_title: string;
+    non_essential_category_summary_drawer_title: string;
+    monthly_deposit_summary_drawer_title: string;
+}
 export interface InsightsFeedCopy {
     general: GeneralInsightsFeedCopy;
     settings_menu: SettingsMenuCopy;
     make_transfer: MakeTransferCopy;
+    transaction_history_block: TransactionHistoryBlock;
 }
 export {};

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

@@ -1 +1,3 @@
+import { Transaction } from '../core';
 export declare const formatValueByType: (value: number, type: string, format: string) => string;
+export declare const selectTransactionsByGuids: (detailedTransactions: Transaction[], guids: string[] | undefined) => Transaction[];

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

@@ -1,7 +1,12 @@
-import { formatCurrency as e } from "../core/utils/NumberFormatting.es.js";
-var f = (r, t, n) => t === "amount" ? e(r, n) : t === "percent" ? `${r}%` : String(r);
+import { formatCurrency as i } from "../core/utils/NumberFormatting.es.js";
+var u = (r, t, e) => t === "amount" ? i(r, e) : t === "percent" ? `${r}%` : String(r), a = (r, t) => {
+  if (!t?.length) return [];
+  const e = new Set(t);
+  return r.filter((n) => e.has(n.guid));
+};
 export {
-  f as formatValueByType
+  u as formatValueByType,
+  a as selectTransactionsByGuids
 };
 
 //# sourceMappingURL=CommonUtils.es.js.map

package/dist/insights-v2/CommonUtils.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommonUtils.es.js","names":[],"sources":["../../src/insights-v2/CommonUtils.ts"],"sourcesContent":["import { formatCurrency } from '../core/utils/NumberFormatting'\n\nexport const formatValueByType = (value: number, type: string, format: string): string => {\n  if (type === 'amount') return formatCurrency(value, format)\n  if (type === 'percent') return `${value}%`\n  return String(value)\n}\n"],"mappings":";AAEA,IAAa,IAAA,CAAqB,GAAe,GAAc,MACzD,MAAS,WAAiB,EAAe,GAAO,CAAM,IACtD,MAAS,YAAkB,GAAG,CAAA,MAC3B,OAAO,CAAK"}
+{"version":3,"file":"CommonUtils.es.js","names":[],"sources":["../../src/insights-v2/CommonUtils.ts"],"sourcesContent":["import type { Transaction } from '../core'\nimport { formatCurrency } from '../core/utils/NumberFormatting'\n\nexport const formatValueByType = (value: number, type: string, format: string): string => {\n  if (type === 'amount') return formatCurrency(value, format)\n  if (type === 'percent') return `${value}%`\n  return String(value)\n}\n\nexport const selectTransactionsByGuids = (\n  detailedTransactions: Transaction[],\n  guids: string[] | undefined,\n): Transaction[] => {\n  if (!guids?.length) return []\n  const guidSet = new Set(guids)\n  return detailedTransactions.filter((transaction) => guidSet.has(transaction.guid))\n}\n"],"mappings":";AAGA,IAAa,IAAA,CAAqB,GAAe,GAAc,MACzD,MAAS,WAAiB,EAAe,GAAO,CAAM,IACtD,MAAS,YAAkB,GAAG,CAAA,MAC3B,OAAO,CAAK,GAGR,IAAA,CACX,GACA,MACkB;AAClB,MAAI,CAAC,GAAO,OAAQ,QAAO,CAAC;AAC5B,QAAM,IAAU,IAAI,IAAI,CAAK;AAC7B,SAAO,EAAqB,OAAA,CAAQ,MAAgB,EAAQ,IAAI,EAAY,IAAI,CAAC;AACnF"}

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.d.ts

@@ -0,0 +1,13 @@
+import { ActionBlockProps } from '../../mappings/blocks';
+/**
+ * Single-transaction drawer content. The detail rendering and inline editing (category picker, date,
+ * memo, tags, split/hide/merchant-budget) all live in the shared `TransactionDetails` component from
+ * the transactions module — this block's job is only to resolve *which* transaction and *which*
+ * actions, then hand off.
+ *
+ * `observer` is required: the resolved transaction comes from TransactionStore, and `usePrepare` may
+ * still be loading it when this first renders. Without it the drawer would stay on the loader.
+ */
+export declare const TransactionDetailsBlock: (({ beat, }: ActionBlockProps) => import("react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js

@@ -0,0 +1,24 @@
+import { useGlobalCopyStore as e } from "../../../common/context/hooks.es.js";
+import s from "../../../common/components/Loader.es.js";
+import c from "../../../transactions/components/shared/TransactionDetails.es.js";
+import { useTransactionDetailsBlock as p } from "./useTransactionDetailsBlock.es.js";
+import { observer as f } from "mobx-react-lite";
+import l from "@mui/material/Stack";
+import { Text as u } from "@mxenabled/mxui";
+import { jsx as o } from "react/jsx-runtime";
+var v = f(function({ beat: t }) {
+  const { common: i } = e(), { bottomActions: n, isLoading: m, topActions: a, transaction: r } = p(t);
+  return m ? /* @__PURE__ */ o(s, {}) : r ? /* @__PURE__ */ o(c, {
+    bottomActions: n,
+    topActions: a,
+    transaction: r
+  }) : /* @__PURE__ */ o(l, {
+    sx: { p: 24 },
+    children: /* @__PURE__ */ o(u, { children: i.error_message })
+  });
+});
+export {
+  v as TransactionDetailsBlock
+};
+
+//# sourceMappingURL=TransactionDetailsBlock.es.js.map

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionDetailsBlock.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.tsx"],"sourcesContent":["import Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\nimport { observer } from 'mobx-react-lite'\n\nimport { Loader, useGlobalCopyStore } from '../../../common'\nimport TransactionDetails from '../../../transactions/components/shared/TransactionDetails'\nimport type { ActionBlockProps } from '../../mappings/blocks'\n\nimport { useTransactionDetailsBlock } from './useTransactionDetailsBlock'\n\n/**\n * Single-transaction drawer content. The detail rendering and inline editing (category picker, date,\n * memo, tags, split/hide/merchant-budget) all live in the shared `TransactionDetails` component from\n * the transactions module — this block's job is only to resolve *which* transaction and *which*\n * actions, then hand off.\n *\n * `observer` is required: the resolved transaction comes from TransactionStore, and `usePrepare` may\n * still be loading it when this first renders. Without it the drawer would stay on the loader.\n */\nexport const TransactionDetailsBlock = observer(function TransactionDetailsBlock({\n  beat,\n}: ActionBlockProps) {\n  const { common: commonCopy } = useGlobalCopyStore()\n  const { bottomActions, isLoading, topActions, transaction } = useTransactionDetailsBlock(beat)\n\n  if (isLoading) return <Loader />\n\n  // Loading finished and the guid still resolves to nothing — a stale beat pointing at a deleted or\n  // out-of-window transaction. Mirrors ActionBlockLayer's unknown-block branch rather than rendering\n  // an empty drawer.\n  if (!transaction) {\n    return (\n      <Stack sx={{ p: 24 }}>\n        <Text>{commonCopy.error_message}</Text>\n      </Stack>\n    )\n  }\n\n  return (\n    <TransactionDetails\n      bottomActions={bottomActions}\n      topActions={topActions}\n      transaction={transaction}\n    />\n  )\n})\n"],"mappings":";;;;;;;;AAoBA,IAAa,IAA0B,EAAS,SAAiC,EAC/E,MAAA,EAAA,GACmB;AACnB,QAAM,EAAE,QAAQ,EAAA,IAAe,EAAmB,GAC5C,EAAE,eAAA,GAAe,WAAA,GAAW,YAAA,GAAY,aAAA,EAAA,IAAgB,EAA2B,CAAI;AAE7F,SAAI,IAAkB,gBAAA,EAAC,GAAD,CAAS,CAAA,IAK1B,IASH,gBAAA,EAAC,GAAD;AAAA,IACiB,eAAA;AAAA,IACH,YAAA;AAAA,IACC,aAAA;AAAA,EACd,CAAA,IAXC,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAE,GAAG,GAAG;AAAA,IACjB,UAAA,gBAAA,EAAC,GAAD,EAAA,UAAO,EAAW,cAAoB,CAAA;AAAA,EACjC,CAAA;AAWb,CAAC"}

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

@@ -0,0 +1,3 @@
+export * from './TransactionDetailsBlock';
+export * from './useTransactionDetailsBlock';
+export * from './useTransactionDetailsPrepare';

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/transactionDetailsActions.d.ts

@@ -0,0 +1,3 @@
+import { BottomActions, TopActions } from '../../../transactions/constants/Actions';
+export declare const resolveTopActions: (names?: string[]) => TopActions[];
+export declare const resolveBottomActions: (names?: string[]) => BottomActions[];

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/transactionDetailsActions.es.js

@@ -0,0 +1,18 @@
+import { BottomActions as t, DEFAULT_BOTTOM_ACTIONS as i, DEFAULT_TOP_ACTIONS as c, TopActions as r } from "../../../transactions/constants/Actions.es.js";
+var s = {
+  Category: r.Category,
+  Date: r.Date,
+  Memo: r.Memo,
+  Tags: r.Tags
+}, A = {
+  MerchantBudget: t.MerchantBudget,
+  SplitTransaction: t.SplitTransaction,
+  HideTransaction: t.HideTransaction,
+  MerchantLogo: t.MerchantLogo
+}, e = (o, T, n) => o ? o.map((a) => T[a]).filter((a) => a !== void 0) : n, O = (o) => e(o, s, c), _ = (o) => e(o, A, i);
+export {
+  _ as resolveBottomActions,
+  O as resolveTopActions
+};
+
+//# sourceMappingURL=transactionDetailsActions.es.js.map

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/transactionDetailsActions.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transactionDetailsActions.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionDetailsBlock/transactionDetailsActions.ts"],"sourcesContent":["import {\n  BottomActions,\n  DEFAULT_BOTTOM_ACTIONS,\n  DEFAULT_TOP_ACTIONS,\n  TopActions,\n} from '../../../transactions/constants/Actions'\n\n/**\n * The backend sends action names as strings on `instance_slot_data`; `TransactionDetails` takes the\n * numeric enums. Keep the lookup keyed by the enum's own member names so adding a member to\n * `Actions.ts` is picked up here without a second edit.\n *\n * Unknown names are dropped rather than throwing: a beat configured against a newer ditto config\n * than the bundle should render with the actions it *does* understand, not blow up the drawer.\n */\nconst TOP_ACTION_BY_NAME: Record<string, TopActions> = {\n  Category: TopActions.Category,\n  Date: TopActions.Date,\n  Memo: TopActions.Memo,\n  Tags: TopActions.Tags,\n}\n\nconst BOTTOM_ACTION_BY_NAME: Record<string, BottomActions> = {\n  MerchantBudget: BottomActions.MerchantBudget,\n  SplitTransaction: BottomActions.SplitTransaction,\n  HideTransaction: BottomActions.HideTransaction,\n  MerchantLogo: BottomActions.MerchantLogo,\n}\n\nconst resolve = <T>(names: string[] | undefined, lookup: Record<string, T>, fallback: T[]): T[] => {\n  // `undefined` means \"not configured\" -> defaults. An explicit empty array means \"no actions\",\n  // which is a legitimate per-beat choice (a read-only details view) and must not fall back.\n  if (!names) return fallback\n\n  return names.map((name) => lookup[name]).filter((action): action is T => action !== undefined)\n}\n\nexport const resolveTopActions = (names?: string[]): TopActions[] =>\n  resolve(names, TOP_ACTION_BY_NAME, DEFAULT_TOP_ACTIONS)\n\nexport const resolveBottomActions = (names?: string[]): BottomActions[] =>\n  resolve(names, BOTTOM_ACTION_BY_NAME, DEFAULT_BOTTOM_ACTIONS)\n"],"mappings":";AAeA,IAAM,IAAiD;AAAA,EACrD,UAAU,EAAW;AAAA,EACrB,MAAM,EAAW;AAAA,EACjB,MAAM,EAAW;AAAA,EACjB,MAAM,EAAW;AACnB,GAEM,IAAuD;AAAA,EAC3D,gBAAgB,EAAc;AAAA,EAC9B,kBAAkB,EAAc;AAAA,EAChC,iBAAiB,EAAc;AAAA,EAC/B,cAAc,EAAc;AAC9B,GAEM,IAAA,CAAc,GAA6B,GAA2B,MAGrE,IAEE,EAAM,IAAA,CAAK,MAAS,EAAO,CAAA,CAAK,EAAE,OAAA,CAAQ,MAAwB,MAAW,MAAS,IAF1E,GAKR,IAAA,CAAqB,MAChC,EAAQ,GAAO,GAAoB,CAAmB,GAE3C,IAAA,CAAwB,MACnC,EAAQ,GAAO,GAAuB,CAAsB"}

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsBlock.d.ts

@@ -0,0 +1,31 @@
+import { Beat, Transaction } from '../../../core';
+import { BottomActions, TopActions } from '../../../transactions/constants/Actions';
+interface TransactionDetailsBlockState {
+    bottomActions: BottomActions[];
+    /** True while the store is still loading; the block shows a loader instead of an empty state. */
+    isLoading: boolean;
+    topActions: TopActions[];
+    /** `undefined` once loading finishes means the transaction could not be resolved. */
+    transaction?: Transaction;
+}
+/**
+ * Resolves which transaction this drawer is about, and which inline actions it offers.
+ *
+ * Resolution order is deliberate:
+ *  1. `instance_slot_data.transaction_guid` — the beat explicitly naming its subject.
+ *  2. `beat.primary_transaction_guid` — the standard beat-level pointer.
+ *  3. `beat.transaction_guids[0]` — last resort for beats that only carry the list.
+ *
+ * The guid is then looked up in `transactionStore.detailedTransactions` rather than used directly,
+ * because `TransactionDetails` needs the *detailed* shape (account + category + taggings joined in)
+ * and edits must write through to the same store object the rest of the app renders. `buildDetailed
+ * Transactions` inside the store is this repo's equivalent of pulse's `buildTransactionDetails`.
+ *
+ * `beat.primary_transaction` is the fallback of last resort: it is a payload snapshot, not a store
+ * object, so inline edits against it would not propagate. Preferring it over a store hit would make
+ * editing silently no-op, which is why it is only used when the store genuinely has nothing — and
+ * only when it is a snapshot of the *same* transaction the guid resolved to (or when no guid
+ * resolved at all). A snapshot of some other transaction is not an answer to this question.
+ */
+export declare const useTransactionDetailsBlock: (beat: Beat) => TransactionDetailsBlockState;
+export {};

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsBlock.es.js

@@ -0,0 +1,16 @@
+import { useTransactionStore as e } from "../../../common/context/hooks.es.js";
+import { resolveBottomActions as p, resolveTopActions as m } from "./transactionDetailsActions.es.js";
+var g = (o) => {
+  const { detailedTransactions: a, isTransactionDataLoaded: i } = e(), s = o.insights_payload?.instance_slot_data ?? {}, t = s.transaction_guid ?? o.primary_transaction_guid ?? o.transaction_guids?.[0], r = t ? a.find((d) => d.guid === t) : void 0, n = o.primary_transaction, c = !t || n?.guid === t;
+  return {
+    bottomActions: p(s.bottom_actions),
+    isLoading: !i,
+    topActions: m(s.top_actions),
+    transaction: r ?? (c ? n : void 0)
+  };
+};
+export {
+  g as useTransactionDetailsBlock
+};
+
+//# sourceMappingURL=useTransactionDetailsBlock.es.js.map

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsBlock.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTransactionDetailsBlock.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsBlock.ts"],"sourcesContent":["import { useTransactionStore } from '../../../common'\nimport type { Beat, Transaction } from '../../../core'\nimport type { TransactionDetailsBlockData } from '../../../core/types/InsightsInstanceSlotData'\nimport type { BottomActions, TopActions } from '../../../transactions/constants/Actions'\n\nimport { resolveBottomActions, resolveTopActions } from './transactionDetailsActions'\n\ninterface TransactionDetailsBlockState {\n  bottomActions: BottomActions[]\n  /** True while the store is still loading; the block shows a loader instead of an empty state. */\n  isLoading: boolean\n  topActions: TopActions[]\n  /** `undefined` once loading finishes means the transaction could not be resolved. */\n  transaction?: Transaction\n}\n\n/**\n * Resolves which transaction this drawer is about, and which inline actions it offers.\n *\n * Resolution order is deliberate:\n *  1. `instance_slot_data.transaction_guid` — the beat explicitly naming its subject.\n *  2. `beat.primary_transaction_guid` — the standard beat-level pointer.\n *  3. `beat.transaction_guids[0]` — last resort for beats that only carry the list.\n *\n * The guid is then looked up in `transactionStore.detailedTransactions` rather than used directly,\n * because `TransactionDetails` needs the *detailed* shape (account + category + taggings joined in)\n * and edits must write through to the same store object the rest of the app renders. `buildDetailed\n * Transactions` inside the store is this repo's equivalent of pulse's `buildTransactionDetails`.\n *\n * `beat.primary_transaction` is the fallback of last resort: it is a payload snapshot, not a store\n * object, so inline edits against it would not propagate. Preferring it over a store hit would make\n * editing silently no-op, which is why it is only used when the store genuinely has nothing — and\n * only when it is a snapshot of the *same* transaction the guid resolved to (or when no guid\n * resolved at all). A snapshot of some other transaction is not an answer to this question.\n */\nexport const useTransactionDetailsBlock = (beat: Beat): TransactionDetailsBlockState => {\n  const { detailedTransactions, isTransactionDataLoaded } = useTransactionStore()\n\n  const slotData = (beat.insights_payload?.instance_slot_data ?? {}) as TransactionDetailsBlockData\n\n  const guid =\n    slotData.transaction_guid ?? beat.primary_transaction_guid ?? beat.transaction_guids?.[0]\n\n  const fromStore = guid\n    ? detailedTransactions.find((transaction) => transaction.guid === guid)\n    : undefined\n\n  // The snapshot is only a valid answer for the guid we actually resolved. When a beat names its\n  // subject via instance_slot_data (or transaction_guids[0]) and that guid misses in the store,\n  // falling back unconditionally would render a *different* transaction's details — and inline\n  // edits would then be made against the wrong subject. Match on guid, or accept the snapshot only\n  // when no guid resolved at all.\n  const snapshot = beat.primary_transaction\n  const snapshotMatches = !guid || snapshot?.guid === guid\n\n  return {\n    bottomActions: resolveBottomActions(slotData.bottom_actions),\n    isLoading: !isTransactionDataLoaded,\n    topActions: resolveTopActions(slotData.top_actions),\n    transaction: fromStore ?? (snapshotMatches ? snapshot : undefined),\n  }\n}\n"],"mappings":";;AAmCA,IAAa,IAAA,CAA8B,MAA6C;AACtF,QAAM,EAAE,sBAAA,GAAsB,yBAAA,EAAA,IAA4B,EAAoB,GAExE,IAAY,EAAK,kBAAkB,sBAAsB,CAAC,GAE1D,IACJ,EAAS,oBAAoB,EAAK,4BAA4B,EAAK,oBAAoB,CAAA,GAEnF,IAAY,IACd,EAAqB,KAAA,CAAM,MAAgB,EAAY,SAAS,CAAI,IACpE,QAOE,IAAW,EAAK,qBAChB,IAAkB,CAAC,KAAQ,GAAU,SAAS;AAEpD,SAAO;AAAA,IACL,eAAe,EAAqB,EAAS,cAAc;AAAA,IAC3D,WAAW,CAAC;AAAA,IACZ,YAAY,EAAkB,EAAS,WAAW;AAAA,IAClD,aAAa,MAAc,IAAkB,IAAW;AAAA,EAC1D;AACF"}

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.d.ts

@@ -0,0 +1,15 @@
+import { ActionBlockProps } from '../../mappings/blocks';
+/**
+ * Open-time data guarantee for the transaction-details drawer. Wired as the block's `usePrepare`,
+ * so `ActionBlockLayer` runs it once each time a CTA opens the drawer (`ActionBlockRunner` mounts on
+ * open and unmounts on close).
+ *
+ * A beat can be rendered in a feed long before the transactions module has ever loaded — the feed
+ * does not depend on TransactionStore — so `detailedTransactions` is frequently empty at open time.
+ * `loadTransactionData` also pulls the accounts and categories that `buildDetailedTransactions`
+ * joins against, which is why it is preferred over the narrower `loadTransactions`.
+ *
+ * Guarded on `isTransactionDataLoaded` so re-opening the drawer does not refetch, and the store's
+ * own in-flight flags make a concurrent call a no-op.
+ */
+export declare const useTransactionDetailsPrepare: (_props: ActionBlockProps) => void;

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js

@@ -0,0 +1,13 @@
+import { useTransactionStore as r } from "../../../common/context/hooks.es.js";
+import t from "react";
+var n = (e) => {
+  const { isTransactionDataLoaded: a, loadTransactionData: o } = r();
+  t.useEffect(() => {
+    a || o();
+  }, []);
+};
+export {
+  n as useTransactionDetailsPrepare
+};
+
+//# sourceMappingURL=useTransactionDetailsPrepare.es.js.map

package/dist/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTransactionDetailsPrepare.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.ts"],"sourcesContent":["import React from 'react'\n\nimport { useTransactionStore } from '../../../common'\nimport type { ActionBlockProps } from '../../mappings/blocks'\n\n/**\n * Open-time data guarantee for the transaction-details drawer. Wired as the block's `usePrepare`,\n * so `ActionBlockLayer` runs it once each time a CTA opens the drawer (`ActionBlockRunner` mounts on\n * open and unmounts on close).\n *\n * A beat can be rendered in a feed long before the transactions module has ever loaded — the feed\n * does not depend on TransactionStore — so `detailedTransactions` is frequently empty at open time.\n * `loadTransactionData` also pulls the accounts and categories that `buildDetailedTransactions`\n * joins against, which is why it is preferred over the narrower `loadTransactions`.\n *\n * Guarded on `isTransactionDataLoaded` so re-opening the drawer does not refetch, and the store's\n * own in-flight flags make a concurrent call a no-op.\n */\nexport const useTransactionDetailsPrepare = (_props: ActionBlockProps) => {\n  const { isTransactionDataLoaded, loadTransactionData } = useTransactionStore()\n\n  React.useEffect(() => {\n    if (!isTransactionDataLoaded) void loadTransactionData()\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n}\n"],"mappings":";;AAkBA,IAAa,IAAA,CAAgC,MAA6B;AACxE,QAAM,EAAE,yBAAA,GAAyB,qBAAA,EAAA,IAAwB,EAAoB;AAE7E,EAAA,EAAM,UAAA,MAAgB;AACpB,IAAK,KAAyB,EAAyB;AAAA,EAEzD,GAAG,CAAC,CAAC;AACP"}

package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionDrillDown.d.ts

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+import { Transaction } from '../../../core';
+interface TabItem {
+    label: string;
+    ariaLabel?: string;
+}
+interface TransactionDrillDownProps {
+    ariaLabel?: string;
+    heading?: string;
+    subHeadingText?: string;
+    icon?: React.ReactNode;
+    tabs?: TabItem[];
+    selectedIndex: number;
+    top: React.ReactNode;
+    onSelectionChange?: (selectedIndex: number) => void;
+    transactionFilter?: (selectedIndex: number) => (transaction: Transaction) => boolean;
+    baseTransactions?: Transaction[];
+}
+export declare const TransactionDrillDown: (({ ariaLabel, heading, subHeadingText, icon, tabs, selectedIndex, top, onSelectionChange, transactionFilter, baseTransactions, }: TransactionDrillDownProps) => import("react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};
+export default TransactionDrillDown;

package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionDrillDown.es.js

@@ -0,0 +1,108 @@
+import { useGlobalCopyStore as W, useGlobalUiStore as $, useTransactionStore as j } from "../../../common/context/hooks.es.js";
+import { exportTransactionsToCSV as k } from "../../../core/utils/TransactionUtils.es.js";
+import G from "../../../common/components/Loader.es.js";
+import P from "../../../transactions/components/shared/TransactionList.es.js";
+import "react";
+import { observer as A } from "mobx-react-lite";
+import c from "@mui/material/Stack";
+import { H3 as E, Text as d } from "@mxenabled/mxui";
+import N from "@mui/material/Button";
+import { Icon as R } from "@mxenabled/mx-icons";
+import { jsx as r, jsxs as o } from "react/jsx-runtime";
+import p from "@mui/material/Box";
+import U from "@mui/material/Tab";
+import V from "@mui/material/Tabs";
+var u = "transaction-drill-down-panel", v = (m) => `transaction-details-tab-${m}`, ar = A(function({ ariaLabel: T, heading: i, subHeadingText: n, icon: y, tabs: b, selectedIndex: e, top: C, onSelectionChange: g, transactionFilter: f, baseTransactions: _ }) {
+  const { transactions: l } = W(), { isCopyLoaded: w } = $(), { sortedTransactionsWithSplits: D, tags: S, detailedTransactions: L } = j();
+  if (!w) return /* @__PURE__ */ r(G, {});
+  const s = !!b?.length, B = T ?? l.transactions_title, I = (t, a) => {
+    g?.(a);
+  }, h = f ? (_ ?? L).filter(f(e)) : void 0, x = h ?? D;
+  return /* @__PURE__ */ o(p, {
+    sx: {
+      bgcolor: "background.paper",
+      width: "100%"
+    },
+    children: [s && /* @__PURE__ */ r(V, {
+      "aria-label": B,
+      onChange: I,
+      value: e,
+      variant: "fullWidth",
+      children: b.map((t, a) => /* @__PURE__ */ r(U, {
+        "aria-controls": u,
+        "aria-label": t.ariaLabel,
+        id: v(a),
+        label: t.label,
+        sx: {
+          minWidth: "auto",
+          px: 0
+        }
+      }, `${t.label}-${a}`))
+    }), /* @__PURE__ */ o(p, {
+      "aria-labelledby": s ? v(e) : void 0,
+      id: u,
+      role: s ? "tabpanel" : void 0,
+      children: [
+        (i || n) && /* @__PURE__ */ o(c, {
+          sx: {
+            gap: 4,
+            pt: 16,
+            px: 24
+          },
+          children: [i && /* @__PURE__ */ r(E, { children: i }), n && /* @__PURE__ */ o(c, {
+            sx: {
+              alignItems: "center",
+              flexDirection: "row",
+              gap: 8
+            },
+            children: [y, /* @__PURE__ */ r(d, {
+              textTransform: "uppercase",
+              variant: "body2",
+              children: n
+            })]
+          })]
+        }),
+        /* @__PURE__ */ r(p, {
+          sx: { pt: 16 },
+          children: C
+        }),
+        /* @__PURE__ */ o(c, {
+          sx: {
+            alignItems: "center",
+            borderBottomColor: "divider",
+            borderBottomStyle: "solid",
+            borderBottomWidth: 1,
+            flexDirection: "row",
+            justifyContent: "space-between",
+            pb: 4,
+            pt: 16,
+            px: 24
+          },
+          children: [/* @__PURE__ */ r(d, {
+            bold: !0,
+            variant: "body1",
+            children: l.transactions_title
+          }), x.length > 0 && /* @__PURE__ */ r(N, {
+            onClick: () => {
+              k(x, S);
+            },
+            startIcon: /* @__PURE__ */ r(R, { name: "ios_share" }),
+            sx: { height: 28 },
+            children: /* @__PURE__ */ r(d, {
+              bold: !0,
+              variant: "body2",
+              children: l.export_csv_btn
+            })
+          })]
+        }),
+        /* @__PURE__ */ r(P, { transaction: h })
+      ]
+    })]
+  });
+});
+export {
+  ar as TransactionDrillDown,
+  ar as default
+};
+
+//# sourceMappingURL=TransactionDrillDown.es.js.map

package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionDrillDown.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionDrillDown.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionDrillDown.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\nimport { observer } from 'mobx-react-lite'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { H3, Text } from '@mxenabled/mxui'\n\nimport { Loader, useGlobalCopyStore, useGlobalUiStore, useTransactionStore } from '../../../common'\nimport type { Transaction } from '../../../core'\nimport { exportTransactionsToCSV } from '../../../core/utils/TransactionUtils'\nimport { TransactionList } from '../../../transactions'\n\ninterface TabItem {\n  label: string\n  ariaLabel?: string\n}\n\nconst PANEL_ID = 'transaction-drill-down-panel'\nconst tabId = (index: number) => `transaction-details-tab-${index}`\n\ninterface TransactionDrillDownProps {\n  ariaLabel?: string\n  heading?: string\n  subHeadingText?: string\n  icon?: React.ReactNode\n  tabs?: TabItem[]\n  selectedIndex: number\n  top: React.ReactNode\n  onSelectionChange?: (selectedIndex: number) => void\n  transactionFilter?: (selectedIndex: number) => (transaction: Transaction) => boolean\n  baseTransactions?: Transaction[]\n}\n\nexport const TransactionDrillDown = observer(function TransactionDrillDown({\n  ariaLabel,\n  heading,\n  subHeadingText,\n  icon,\n  tabs,\n  selectedIndex,\n  top,\n  onSelectionChange,\n  transactionFilter,\n  baseTransactions,\n}: TransactionDrillDownProps) {\n  const { transactions: transactionsCopy } = useGlobalCopyStore()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { sortedTransactionsWithSplits, tags, detailedTransactions } = useTransactionStore()\n\n  if (!isCopyLoaded) return <Loader />\n\n  const hasTabs = !!tabs?.length\n  const tablistLabel = ariaLabel ?? transactionsCopy.transactions_title\n\n  const handlePrimaryChange = (_event: React.SyntheticEvent, newValue: number) => {\n    onSelectionChange?.(newValue)\n  }\n\n  const filteredTransactions = transactionFilter\n    ? (baseTransactions ?? detailedTransactions).filter(transactionFilter(selectedIndex))\n    : undefined\n\n  const exportTransactions = filteredTransactions ?? sortedTransactionsWithSplits\n\n  return (\n    <Box sx={{ bgcolor: 'background.paper', width: '100%' }}>\n      {hasTabs && (\n        <Tabs\n          aria-label={tablistLabel}\n          onChange={handlePrimaryChange}\n          value={selectedIndex}\n          variant=\"fullWidth\"\n        >\n          {tabs!.map((tab, index) => (\n            <Tab\n              aria-controls={PANEL_ID}\n              aria-label={tab.ariaLabel}\n              id={tabId(index)}\n              key={`${tab.label}-${index}`}\n              label={tab.label}\n              sx={{ minWidth: 'auto', px: 0 }}\n            />\n          ))}\n        </Tabs>\n      )}\n\n      <Box\n        aria-labelledby={hasTabs ? tabId(selectedIndex) : undefined}\n        id={PANEL_ID}\n        role={hasTabs ? 'tabpanel' : undefined}\n      >\n        {(heading || subHeadingText) && (\n          <Stack sx={{ gap: 4, pt: 16, px: 24 }}>\n            {heading && <H3>{heading}</H3>}\n            {subHeadingText && (\n              <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n                {icon}\n                <Text textTransform=\"uppercase\" variant=\"body2\">\n                  {subHeadingText}\n                </Text>\n              </Stack>\n            )}\n          </Stack>\n        )}\n\n        <Box sx={{ pt: 16 }}>{top}</Box>\n\n        <Stack\n          sx={{\n            alignItems: 'center',\n            borderBottomColor: 'divider',\n            borderBottomStyle: 'solid',\n            borderBottomWidth: 1,\n            flexDirection: 'row',\n            justifyContent: 'space-between',\n            pb: 4,\n            pt: 16,\n            px: 24,\n          }}\n        >\n          <Text bold={true} variant=\"body1\">\n            {transactionsCopy.transactions_title}\n          </Text>\n          {exportTransactions.length > 0 && (\n            <Button\n              onClick={() => {\n                exportTransactionsToCSV(exportTransactions, tags)\n              }}\n              startIcon={<Icon name=\"ios_share\" />}\n              sx={{ height: 28 }}\n            >\n              <Text bold={true} variant=\"body2\">\n                {transactionsCopy.export_csv_btn}\n              </Text>\n            </Button>\n          )}\n        </Stack>\n\n        <TransactionList transaction={filteredTransactions} />\n      </Box>\n    </Box>\n  )\n})\n\nexport default TransactionDrillDown\n"],"mappings":";;;;;;;;;;;;;;AAsBA,IAAM,IAAW,gCACX,IAAA,CAAS,MAAkB,2BAA2B,CAAA,IAe/C,KAAuB,EAAS,SAA8B,EACzE,WAAA,GACA,SAAA,GACA,gBAAA,GACA,MAAA,GACA,MAAA,GACA,eAAA,GACA,KAAA,GACA,mBAAA,GACA,mBAAA,GACA,kBAAA,EAAA,GAC4B;AAC5B,QAAM,EAAE,cAAc,EAAA,IAAqB,EAAmB,GACxD,EAAE,cAAA,EAAA,IAAiB,EAAiB,GACpC,EAAE,8BAAA,GAA8B,MAAA,GAAM,sBAAA,EAAA,IAAyB,EAAoB;AAEzF,MAAI,CAAC,EAAc,QAAO,gBAAA,EAAC,GAAD,CAAS,CAAA;AAEnC,QAAM,IAAU,CAAC,CAAC,GAAM,QAClB,IAAe,KAAa,EAAiB,oBAE7C,IAAA,CAAuB,GAA8B,MAAqB;AAC9E,IAAA,IAAoB,CAAQ;AAAA,EAC9B,GAEM,IAAuB,KACxB,KAAoB,GAAsB,OAAO,EAAkB,CAAa,CAAC,IAClF,QAEE,IAAqB,KAAwB;AAEnD,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,IAAI;AAAA,MAAE,SAAS;AAAA,MAAoB,OAAO;AAAA,IAAO;AAAA,IAAtD,UAAA,CACG,KACC,gBAAA,EAAC,GAAD;AAAA,MACE,cAAY;AAAA,MACZ,UAAU;AAAA,MACV,OAAO;AAAA,MACP,SAAQ;AAAA,MAEP,UAAA,EAAM,IAAA,CAAK,GAAK,MACf,gBAAA,EAAC,GAAD;AAAA,QACE,iBAAe;AAAA,QACf,cAAY,EAAI;AAAA,QAChB,IAAI,EAAM,CAAK;AAAA,QAEf,OAAO,EAAI;AAAA,QACX,IAAI;AAAA,UAAE,UAAU;AAAA,UAAQ,IAAI;AAAA,QAAE;AAAA,MAC/B,GAHM,GAAG,EAAI,KAAA,IAAS,CAAA,EAGtB,CACF;AAAA,IACG,CAAA,GAGR,gBAAA,EAAC,GAAD;AAAA,MACE,mBAAiB,IAAU,EAAM,CAAa,IAAI;AAAA,MAClD,IAAI;AAAA,MACJ,MAAM,IAAU,aAAa;AAAA,MAH/B,UAAA;AAAA,SAKI,KAAW,MACX,gBAAA,EAAC,GAAD;AAAA,UAAO,IAAI;AAAA,YAAE,KAAK;AAAA,YAAG,IAAI;AAAA,YAAI,IAAI;AAAA,UAAG;AAAA,UAApC,UAAA,CACG,KAAW,gBAAA,EAAC,GAAD,EAAA,UAAK,EAAY,CAAA,GAC5B,KACC,gBAAA,EAAC,GAAD;AAAA,YAAO,IAAI;AAAA,cAAE,YAAY;AAAA,cAAU,eAAe;AAAA,cAAO,KAAK;AAAA,YAAE;AAAA,YAAhE,UAAA,CACG,GACD,gBAAA,EAAC,GAAD;AAAA,cAAM,eAAc;AAAA,cAAY,SAAQ;AAAA,cACrC,UAAA;AAAA,YACG,CAAA,CACD;AAAA,UAEJ,CAAA,CAAA;AAAA;QAGT,gBAAA,EAAC,GAAD;AAAA,UAAK,IAAI,EAAE,IAAI,GAAG;AAAA,UAAI,UAAA;AAAA,QAAS,CAAA;AAAA,QAE/B,gBAAA,EAAC,GAAD;AAAA,UACE,IAAI;AAAA,YACF,YAAY;AAAA,YACZ,mBAAmB;AAAA,YACnB,mBAAmB;AAAA,YACnB,mBAAmB;AAAA,YACnB,eAAe;AAAA,YACf,gBAAgB;AAAA,YAChB,IAAI;AAAA,YACJ,IAAI;AAAA,YACJ,IAAI;AAAA,UACN;AAAA,UAXF,UAAA,CAaE,gBAAA,EAAC,GAAD;AAAA,YAAM,MAAM;AAAA,YAAM,SAAQ;AAAA,YACvB,UAAA,EAAiB;AAAA,UACd,CAAA,GACL,EAAmB,SAAS,KAC3B,gBAAA,EAAC,GAAD;AAAA,YACE,SAAA,MAAe;AACb,cAAA,EAAwB,GAAoB,CAAI;AAAA,YAClD;AAAA,YACA,WAAW,gBAAA,EAAC,GAAD,EAAM,MAAK,YAAa,CAAA;AAAA,YACnC,IAAI,EAAE,QAAQ,GAAG;AAAA,YAEjB,UAAA,gBAAA,EAAC,GAAD;AAAA,cAAM,MAAM;AAAA,cAAM,SAAQ;AAAA,cACvB,UAAA,EAAiB;AAAA,YACd,CAAA;AAAA,UACA,CAAA,CAEL;AAAA;QAEP,gBAAA,EAAC,GAAD,EAAiB,aAAa,EAAuB,CAAA;AAAA,MAClD;AAAA,IACF,CAAA,CAAA;AAAA;AAET,CAAC"}

package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.d.ts

@@ -0,0 +1,8 @@
+import { Beat } from '../../../core';
+interface TransactionHistoryProp {
+    beat: Beat;
+}
+export declare const TransactionHistoryBlock: (({ beat }: TransactionHistoryProp) => import("react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};
+export {};

package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js

@@ -0,0 +1,89 @@
+import { useInsightsV2Store as E } from "../../../common/context/hooks.es.js";
+import { formatCurrency as M } from "../../../core/utils/NumberFormatting.es.js";
+import { BarChartV2 as N } from "../../components/chartblocks/BarchartV2.es.js";
+import { EmptyBarChart as P } from "../../components/chartblocks/EmptyBarChart.es.js";
+import { TransactionDrillDown as R } from "./TransactionDrillDown.es.js";
+import { useTransactionHistory as q } from "./useTransactionHistory.es.js";
+import { getDefaultSelection as z, getDrillDownConfig as J, getFlattenedDataSeries as O, toStoreFilter as Q } from "./utils.es.js";
+import { useLayoutEffect as U, useState as W } from "react";
+import { observer as X } from "mobx-react-lite";
+import { jsx as m } from "react/jsx-runtime";
+import { useTheme as Y } from "@mui/material/styles";
+var ct = X(({ beat: e }) => {
+  const g = Y(), { instanceSlotData: a, beatTransactions: n, primaryTransaction: T, spendCategoryGuids: u, allAccountGuids: p, categoryName: C, displayedDateRange: l, transactionStore: v } = q(e), { actionDrawer: h } = E(), { insights_payload: y } = e, D = h.trigger === "secondaryCta" ? y?.secondary_cta?.variant : y?.primary_cta?.variant, { top: c, filterMode: i, header: S, colors: x, filterStrategy: L } = J(D ?? ""), { dataSeries: s, chartData: o, comparisonBars: B } = O({
+    data: a?.data_series,
+    ariaLabel: a?.ariaLabel ?? "",
+    top: c,
+    beatTransactions: n,
+    payload: a
+  }), { chartBarIndex: I, subTabIndex: _ } = z({
+    chartTabCount: o.length,
+    comparisonTabCount: B.length,
+    actionDrawer: h,
+    beatGuid: e.guid
+  }), [r, b] = W(I), f = (t) => L({
+    beat: e,
+    beatTransactions: n,
+    dataSeries: s,
+    selectedIndex: t,
+    subIndex: _,
+    isLastTab: t === s.length - 1,
+    instanceSlotData: a,
+    spendCategoryGuids: u,
+    displayedDateRange: l
+  }), G = n.map((t) => t.guid).join(","), A = u.join(","), F = p.join(",");
+  U(() => {
+    i !== "store" || !s.length || v.setFilter(Q(f(r), {
+      allAccountGuids: p,
+      displayedDateRange: l
+    }));
+  }, [
+    e.guid,
+    r,
+    i,
+    s.length,
+    a,
+    l,
+    A,
+    F,
+    G
+  ]);
+  const d = S?.({
+    htmlTitle: e.html_title,
+    primaryTransaction: T,
+    categoryName: C,
+    selectedDate: o[r]?.date ?? void 0
+  }), j = x(g, a?.category_guid), [H, w] = (a?.legends ?? []).map((t) => t.label), K = i === "local" ? (t) => f(t).custom ?? (() => !0) : void 0, V = i === "local" ? n : void 0, k = c === "singleBar" || c === "upcomingBill" ? o.length ? /* @__PURE__ */ m(N, {
+    amounts: {
+      average: a?.average_amount,
+      formattedAverage: M(a?.average_amount ?? 0, "0,0.00")
+    },
+    color: j[0] ?? g.palette.primary.main,
+    data: o,
+    legendPosition: "top",
+    monthlyAmountLabel: H,
+    onBarClick: b,
+    selectedTabIndex: r,
+    trendAmountLabel: w
+  }) : /* @__PURE__ */ m(P, {}) : null;
+  return /* @__PURE__ */ m(R, {
+    ariaLabel: a?.ariaLabel,
+    baseTransactions: V,
+    heading: d?.heading,
+    icon: d?.icon,
+    onSelectionChange: b,
+    selectedIndex: r,
+    subHeadingText: d?.subHeadingText,
+    tabs: o.map((t) => ({
+      ariaLabel: t.ariaLabel,
+      label: t.label
+    })),
+    top: k,
+    transactionFilter: K
+  });
+});
+export {
+  ct as TransactionHistoryBlock
+};
+
+//# sourceMappingURL=TransactionHistoryBlock.es.js.map