@mx-cartographer/experiences 9.4.65 → 9.4.67

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## [9.4.67] - 10-08-2026
+
+- **FIXED** - Trends tabular view shows the shared zero-state message instead of the grid's default "No rows" when a table is empty MEW-4097
+
+## [9.4.66] - 10-08-2026
+
+- **ADDED** - `recurring_transaction_block` (Recurring Transaction) action block: opens the Expense Details drawer for one recurring subscription, shared by the Upcoming Subscription and Subscription Price Increase beats. The drawer content is the recurring module's `RecurringTransactionDetails` (merchant, amount, next due date, schedule, account/category, past activity, mark as paid/unpaid, delete), so the block only resolves *which* subscription and hands off, as `TransactionDetailsBlock` does. The subscription is `primary_repeating_transaction_guid` (V2 payload, then the legacy beat envelope), else the beat's primary transaction is walked to the repeating transaction it is linked to. `usePrepare` loads recurring data on open through `loadRepeatingTransactionData`; when nothing resolves the drawer shows `recurring.no_activities`, never the generic error; when the open-time load fails it shows the feed's `ErrorCard` with a Try Again retry instead of an endless loader. The shared transaction filter is restored on close only if the details view actually narrowed it. (WEC-1428)
+- **ADDED** - `InsightsPayload.primary_repeating_transaction_guid` and `Beat.primary_repeating_transaction_guid` (legacy pulse envelope). (WEC-1428)
+- **ADDED** - Mock subscription beats (`mock/BlockBeatsData/RecurringTransactionBeats.ts`, pointing at the mock Netflix subscription), `InsightsV2/ActionBlock/RecurringTransactionBlock` stories, and `docs/action-blocks/` (index + block doc). (WEC-1428)
+
 ## [9.4.65] - 10-08-2026
 
 - **ADDED** - Insights V2 CTA action layer (`src/insights-v2/ctaActions`): a card CTA whose backend-named `action_key` (ditto `*_cta_action`, passed through by tupac on `primary_cta` / `secondary_cta`) has a registered step runs that step first: a typed store handler, `onSuccess` effects (`refreshBeat`), a client-only disable (`disabledWhen`), then its drawer or message. No key, or an unknown key, keeps the default (drawer if the CTA has a block, else post). First key: `dismiss_beat` (ConnectDiscoveredAccounts). Per-beat `ctaStatus` and `beatContext` on `InsightsV2Store`; `useBeatCtaActions` for the card and `useCtaHandler` for saves inside a drawer (WEC-1852)

package/dist/{transactions/components/shared/transactionlist → common/components}/ZeroState.es.js

@@ -1,20 +1,22 @@
-import { useGlobalCopyStore as n } from "../../../../common/context/hooks.es.js";
+import { useGlobalCopyStore as i } from "../context/hooks.es.js";
 import "react";
-import { observer as i } from "mobx-react-lite";
-import c from "@mui/material/Stack";
+import { observer as n } from "mobx-react-lite";
+import s from "@mui/material/Stack";
 import { Text as o } from "@mxenabled/mxui";
-import { Receipt as s } from "@mxenabled/mx-icons";
+import { Receipt as c } from "@mxenabled/mx-icons";
 import { jsx as t, jsxs as m } from "react/jsx-runtime";
-var p = ({ showIcon: e = !0, showSubtitle: a = !0 }) => {
-  const { transactions: r } = n();
-  return /* @__PURE__ */ m(c, {
+var l = ({ showIcon: e = !0, showSubtitle: a = !0 }) => {
+  const { transactions: r } = i();
+  return /* @__PURE__ */ m(s, {
     alignItems: "center",
     gap: 12,
     height: "auto",
     mb: 24,
     mt: 24,
+    role: "status",
     children: [
-      e && /* @__PURE__ */ t(s, {
+      e && /* @__PURE__ */ t(c, {
+        "aria-hidden": "true",
         color: "action",
         sx: { fontSize: 32 }
       }),
@@ -31,7 +33,7 @@ var p = ({ showIcon: e = !0, showSubtitle: a = !0 }) => {
       })
     ]
   });
-}, v = i(p);
+}, v = n(l);
 export {
   v as default
 };

package/dist/common/components/ZeroState.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ZeroState.es.js","names":[],"sources":["../../../src/common/components/ZeroState.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { Receipt as ReceiptOutlinedIcon } from '@mxenabled/mx-icons'\n\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../context'\n\ninterface ZeroStateProps {\n  showIcon?: boolean\n  showSubtitle?: boolean\n}\n\nconst ZeroState: React.FC<ZeroStateProps> = ({ showIcon = true, showSubtitle = true }) => {\n  const { transactions: copy } = useGlobalCopyStore()\n\n  return (\n    <Stack alignItems=\"center\" gap={12} height=\"auto\" mb={24} mt={24} role=\"status\">\n      {showIcon && <ReceiptOutlinedIcon aria-hidden=\"true\" color=\"action\" sx={{ fontSize: 32 }} />}\n      <Text bold={true} color=\"text.secondary\" variant=\"body2\">\n        {copy.zero_state_no_transactions}\n      </Text>\n      {showSubtitle && (\n        <Text color=\"text.secondary\" variant=\"caption\">\n          {copy.zero_state_there_are_no_transactions}\n        </Text>\n      )}\n    </Stack>\n  )\n}\n\nexport default observer(ZeroState)\n"],"mappings":";;;;;;;AAgBA,IAAM,IAAA,CAAuC,EAAE,UAAA,IAAW,IAAM,cAAA,IAAe,GAAA,MAAW;AACxF,QAAM,EAAE,cAAc,EAAA,IAAS,EAAmB;AAElD,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,YAAW;AAAA,IAAS,KAAK;AAAA,IAAI,QAAO;AAAA,IAAO,IAAI;AAAA,IAAI,IAAI;AAAA,IAAI,MAAK;AAAA,IAAvE,UAAA;AAAA,MACG,KAAY,gBAAA,EAAC,GAAD;AAAA,QAAqB,eAAY;AAAA,QAAO,OAAM;AAAA,QAAS,IAAI,EAAE,UAAU,GAAG;AAAA,MAAI,CAAA;AAAA,MAC3F,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAM;AAAA,QAAM,OAAM;AAAA,QAAiB,SAAQ;AAAA,QAC9C,UAAA,EAAK;AAAA,MACF,CAAA;AAAA,MACL,KACC,gBAAA,EAAC,GAAD;AAAA,QAAM,OAAM;AAAA,QAAiB,SAAQ;AAAA,QAClC,UAAA,EAAK;AAAA,MACF,CAAA;AAAA,IAEH;AAAA;AAEX,GAEA,IAAe,EAAS,CAAS"}

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

@@ -19,6 +19,7 @@ export { default as SelectionBox } from './SelectionBox';
 export { default as TabContentContainer } from './TabContentContainer';
 export { default as IconBacking } from './IconBacking';
 export { default as DataRow } from './DataRow';
+export { default as ZeroState } from './ZeroState';
 export { default as InformationTooltip } from './InformationTooltip';
 export { ConnectCard } from './ConnectCard';
 export { CurrencyText } from './CurrencyText';

package/dist/common/index.es.js

@@ -2,11 +2,11 @@ import { buildDynamicCopy as r, buildPluralCopy as t } from "../core/utils/Local
 import m, { CalendarSelectionTypes as i } from "./components/calendar/Calendar.es.js";
 import a from "./components/charts/StatusBar.es.js";
 import p from "./components/charts/Donut.es.js";
-import f from "./hooks/useAccountDisplayName.es.js";
+import u from "./hooks/useAccountDisplayName.es.js";
 import { useCombineEvents as C, useCombinePageviews as S } from "./hooks/useCombineEvents.es.js";
 import { GlobalDataContext as c, GlobalDataProvider as T } from "./context/GlobalDataProvider.es.js";
 import { WidgetContainerContext as E, WidgetContainerProvider as D } from "./context/WidgetContainerProvider.es.js";
-import { useAccountStore as _, useActionContext as N, useAppConfig as A, useBudgetsStore as y, useCashflowStore as P, useCategoryStore as b, useDebtStore as O, useError as G, useEvent as W, useFinstrongStore as L, useGlobalCopyStore as R, useGlobalStore as U, useGlobalUiStore as v, useGoalStore as B, useHelpStore as h, useHoldingStore as w, useInsightsV2Store as x, useLoad as M, useMerchantStore as Y, useNetWorthStore as H, useNotificationStore as F, usePageView as z, useRecurringTransactionsStore as V, useSettingsStore as k, useTransactionStore as q, useTrendsStore as K, useUserStore as Z, useWidgetContainerProvider as j } from "./context/hooks.es.js";
+import { useAccountStore as _, useActionContext as N, useAppConfig as A, useBudgetsStore as y, useCashflowStore as P, useCategoryStore as b, useDebtStore as O, useError as G, useEvent as W, useFinstrongStore as L, useGlobalCopyStore as R, useGlobalStore as U, useGlobalUiStore as v, useGoalStore as B, useHelpStore as h, useHoldingStore as w, useInsightsV2Store as x, useLoad as M, useMerchantStore as Y, useNetWorthStore as H, useNotificationStore as F, usePageView as z, useRecurringTransactionsStore as V, useSettingsStore as Z, useTransactionStore as k, useTrendsStore as q, useUserStore as K, useWidgetContainerProvider as j } from "./context/hooks.es.js";
 import { useInsightsEnabled as Q } from "./hooks/useInsightsEnabled.es.js";
 import { useScreenSize as $ } from "./hooks/useScreenSize.es.js";
 import ro from "./hooks/usePrevious.es.js";
@@ -14,7 +14,7 @@ import { useWidgetHeaderStyles as eo } from "./hooks/useWidgetHeaderStyles.es.js
 import { useWidgetLoadTimer as io } from "./hooks/useWidgetLoadTimer.es.js";
 import ao from "./components/dialog/Dialog.es.js";
 import po from "./components/drawer/Drawer.es.js";
-import fo from "./components/daterangeselector/DateRangeSelector.es.js";
+import uo from "./components/daterangeselector/DateRangeSelector.es.js";
 import { ANALYTICS_EVENTS as Co } from "./constants/Analytics.es.js";
 import { CONNECTIONS_WIDGET_ID as go, CONNECT_WIDGET_ID as co, MemberConnectionStatus as To } from "./constants/Connect.es.js";
 import { formatCurrency as Do, formatOrdinal as Io, formatPercentage as _o, generateEqualIntervals as No, getCurrencyCodes as Ao, getPluralRules as yo } from "../core/utils/NumberFormatting.es.js";
@@ -25,8 +25,8 @@ import { LOADING_STATUS as Bo } from "./constants/SpendingPlan.es.js";
 import { DEFAULT_DONUT_SIZE as wo, DEFAULT_STROKE_WIDTH as xo } from "./constants/Donut.es.js";
 import { Sizes as Yo, TOUCH_TARGET as Ho } from "./constants/Sizes.es.js";
 import zo from "./components/donuts/MultiSegmentDonut.es.js";
-import ko from "./components/donuts/SingleSegmentDonut.es.js";
-import Ko from "./components/ErrorBoundary.es.js";
+import Zo from "./components/donuts/SingleSegmentDonut.es.js";
+import qo from "./components/ErrorBoundary.es.js";
 import jo from "./components/Error.es.js";
 import Qo from "./components/MicroWidgetContainer.es.js";
 import $o from "./components/MiniWidgetContainer.es.js";
@@ -35,57 +35,58 @@ import er from "./components/Loader.es.js";
 import { WidgetContainer as ir } from "./components/WidgetContainer.es.js";
 import ar from "./components/ConnectDrawer.es.js";
 import pr from "./components/CurrencyDialog.es.js";
-import fr from "./components/CurrencyInput.es.js";
+import ur from "./components/CurrencyInput.es.js";
 import Cr from "./components/ResponsiveButton.es.js";
 import gr from "./components/SearchBox.es.js";
 import Tr from "./components/SelectionBox.es.js";
 import Er from "./components/TabContentContainer.es.js";
 import Ir from "./components/IconBacking.es.js";
 import Nr from "./components/DataRow.es.js";
-import yr from "./components/InformationTooltip.es.js";
-import { ConnectCard as br } from "./components/ConnectCard.es.js";
-import { CurrencyText as Gr } from "./components/CurrencyText.es.js";
-import { EmptyState as Lr } from "./components/EmptyState.es.js";
-import { ListItemAction as Ur } from "./components/ListItemAction.es.js";
-import { ListItemRow as Br } from "./components/ListItemRow.es.js";
-import { ListItemWrapper as wr } from "./components/ListItemWrapper.es.js";
-import { Select as Mr } from "./components/Select.es.js";
-import { ToggleButtonListItem as Hr } from "./components/listitems/ToggleButtonListItem.es.js";
-import { ToggleListItem as zr } from "./components/listitems/ToggleListItem.es.js";
-import { analyticsSession as kr } from "./utils/Analytics.es.js";
-import { getClientComponentOverrides as Kr, getClientCustomizations as Zr, getClientPaletteOptions as jr, getClientTheme as Jr } from "./utils/Theme.es.js";
+import yr from "./components/ZeroState.es.js";
+import br from "./components/InformationTooltip.es.js";
+import { ConnectCard as Gr } from "./components/ConnectCard.es.js";
+import { CurrencyText as Lr } from "./components/CurrencyText.es.js";
+import { EmptyState as Ur } from "./components/EmptyState.es.js";
+import { ListItemAction as Br } from "./components/ListItemAction.es.js";
+import { ListItemRow as wr } from "./components/ListItemRow.es.js";
+import { ListItemWrapper as Mr } from "./components/ListItemWrapper.es.js";
+import { Select as Hr } from "./components/Select.es.js";
+import { ToggleButtonListItem as zr } from "./components/listitems/ToggleButtonListItem.es.js";
+import { ToggleListItem as Zr } from "./components/listitems/ToggleListItem.es.js";
+import { analyticsSession as qr } from "./utils/Analytics.es.js";
+import { getClientComponentOverrides as jr, getClientCustomizations as Jr, getClientPaletteOptions as Qr, getClientTheme as Xr } from "./utils/Theme.es.js";
 export {
   Co as ANALYTICS_EVENTS,
   go as CONNECTIONS_WIDGET_ID,
   co as CONNECT_WIDGET_ID,
   m as Calendar,
   i as CalendarSelectionTypes,
-  br as ConnectCard,
+  Gr as ConnectCard,
   ar as ConnectDrawer,
   pr as CurrencyDialog,
-  fr as CurrencyInput,
-  Gr as CurrencyText,
+  ur as CurrencyInput,
+  Lr as CurrencyText,
   wo as DEFAULT_DONUT_SIZE,
   xo as DEFAULT_STROKE_WIDTH,
   Nr as DataRow,
-  fo as DateRangeSelector,
+  uo as DateRangeSelector,
   ao as Dialog,
   p as Donut,
   po as Drawer,
-  Lr as EmptyState,
+  Ur as EmptyState,
   jo as Error,
-  Ko as ErrorBoundary,
+  qo as ErrorBoundary,
   rr as GlobalAccountFilter,
   c as GlobalDataContext,
   T as GlobalDataProvider,
   bo as GlobalStore,
   Go as INCOME_ACCOUNT_TYPES,
   Ir as IconBacking,
-  yr as InformationTooltip,
+  br as InformationTooltip,
   Bo as LOADING_STATUS,
-  Ur as ListItemAction,
-  Br as ListItemRow,
-  wr as ListItemWrapper,
+  Br as ListItemAction,
+  wr as ListItemRow,
+  Mr as ListItemWrapper,
   er as Loader,
   To as MemberConnectionStatus,
   Qo as MicroWidgetContainer,
@@ -96,32 +97,33 @@ export {
   Cr as ResponsiveButton,
   Lo as SPENDING_ACCOUNT_TYPES,
   gr as SearchBox,
-  Mr as Select,
+  Hr as Select,
   Tr as SelectionBox,
-  ko as SingleSegmentDonut,
+  Zo as SingleSegmentDonut,
   Yo as Sizes,
   a as StatusBar,
   Ho as TOUCH_TARGET,
   Er as TabContentContainer,
-  Hr as ToggleButtonListItem,
-  zr as ToggleListItem,
+  zr as ToggleButtonListItem,
+  Zr as ToggleListItem,
   ir as WidgetContainer,
   E as WidgetContainerContext,
   D as WidgetContainerProvider,
-  kr as analyticsSession,
+  yr as ZeroState,
+  qr as analyticsSession,
   r as buildDynamicCopy,
   t as buildPluralCopy,
   Do as formatCurrency,
   Io as formatOrdinal,
   _o as formatPercentage,
   No as generateEqualIntervals,
-  Kr as getClientComponentOverrides,
-  Zr as getClientCustomizations,
-  jr as getClientPaletteOptions,
-  Jr as getClientTheme,
+  jr as getClientComponentOverrides,
+  Jr as getClientCustomizations,
+  Qr as getClientPaletteOptions,
+  Xr as getClientTheme,
   Ao as getCurrencyCodes,
   yo as getPluralRules,
-  f as useAccountDisplayName,
+  u as useAccountDisplayName,
   _ as useAccountStore,
   N as useActionContext,
   A as useAppConfig,
@@ -150,10 +152,10 @@ export {
   ro as usePrevious,
   V as useRecurringTransactionsStore,
   $ as useScreenSize,
-  k as useSettingsStore,
-  q as useTransactionStore,
-  K as useTrendsStore,
-  Z as useUserStore,
+  Z as useSettingsStore,
+  k as useTransactionStore,
+  q as useTrendsStore,
+  K as useUserStore,
   j as useWidgetContainerProvider,
   eo as useWidgetHeaderStyles,
   io as useWidgetLoadTimer

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

@@ -42,6 +42,8 @@ export interface Beat {
     primary_category_guid?: string | null;
     primary_goal_guid?: string | null;
     primary_merchant_guid?: string | null;
+    /** Legacy pulse envelope: the subscription an Upcoming Subscription beat is about. */
+    primary_repeating_transaction_guid?: string | null;
     primary_scheduled_payment_guid?: string | null;
     primary_transaction?: Transaction;
     primary_transaction_guid?: string | null;

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

@@ -1 +1 @@
-{"version":3,"file":"Beat.es.js","names":[],"sources":["../../../src/core/types/Beat.ts"],"sourcesContent":["import { Account } from './Account'\nimport { InsightsPayload } from './Insights'\nimport { Transaction } from './Transaction'\n\nexport interface Beat {\n  account_guids: string[] | []\n  active_at?: string | number\n  associated_transaction_guid?: string | null\n  call_to_action?: string | null\n  category_guids?: string[] | []\n  created_at?: string | number\n  cta_clicked_at?: number | null\n  data_series: DataSeries\n  description?: string\n  digest?: string\n  dismissed_at?: number | null\n  displayed_at?: string | null\n  errors?: any\n  guid: string\n  has_been_displayed: boolean\n  html_description?: string\n  html_in_description_cta?: string\n  html_micro_call_to_action?: string\n  html_micro_description?: string\n  html_micro_title?: string\n  html_short_title?: string\n  html_title: string\n  icon_color?: string | null\n  icon_type?: number | null\n  in_description_cta?: string | null\n  is_dismissed: boolean\n  is_obsolete: boolean\n  is_refreshable: boolean\n  is_sampled: boolean\n  merchant_guids: string[] | []\n  metadata?: string | null\n  micro_call_to_action?: string | null\n  micro_description?: string | null\n  micro_title?: string | null\n  payload: any\n  primary_account?: Account\n  primary_account_guid?: string | null\n  primary_category_guid?: string | null\n  primary_goal_guid?: string | null\n  primary_merchant_guid?: string | null\n  primary_scheduled_payment_guid?: string | null\n  primary_transaction?: Transaction\n  primary_transaction_guid?: string | null\n  power_action_completed_at?: string | null\n  power_action_has_been_completed?: boolean\n  scheduled_payment_guids: string[] | []\n  short_title?: string | null\n  supporting_action?: string | null\n  template: string\n  title: string\n  transaction_guids: string[] | []\n  transactions?: Transaction[]\n  user_guid: string\n  user_verification: UserVerification\n\n  // Added for UI: optional institution info for displaying logos\n  institutionGuid?: string | null\n  institutionName?: string | null\n\n  insights_payload?: InsightsPayload\n  /**\n   * Written by firefly, never by a template: true when the insight's Insights 2.0 flag is on (or\n   * the envelope is present). It gates which renderer draws the beat — see `resolveInsightRender`.\n   * Absent on an older firefly or on cortex, which renders the legacy path unchanged.\n   */\n  is_insights_v2?: boolean\n}\n\nexport interface DataSeries {\n  names?: string[]\n  types?: string[]\n  data?: any[]\n}\n\nexport enum UserVerification {\n  UNKNOWN = 0,\n  CORRECT = 1,\n  INCORRECT = 2,\n}\n"],"mappings":"AA+EA,IAAY,IAAL,0BAAA,GAAA;AACL,SAAA,EAAA,EAAA,UAAA,CAAA,IAAA,WACA,EAAA,EAAA,UAAA,CAAA,IAAA,WACA,EAAA,EAAA,YAAA,CAAA,IAAA;AACF,GAAA,CAAA,CAAA"}
+{"version":3,"file":"Beat.es.js","names":[],"sources":["../../../src/core/types/Beat.ts"],"sourcesContent":["import { Account } from './Account'\nimport { InsightsPayload } from './Insights'\nimport { Transaction } from './Transaction'\n\nexport interface Beat {\n  account_guids: string[] | []\n  active_at?: string | number\n  associated_transaction_guid?: string | null\n  call_to_action?: string | null\n  category_guids?: string[] | []\n  created_at?: string | number\n  cta_clicked_at?: number | null\n  data_series: DataSeries\n  description?: string\n  digest?: string\n  dismissed_at?: number | null\n  displayed_at?: string | null\n  errors?: any\n  guid: string\n  has_been_displayed: boolean\n  html_description?: string\n  html_in_description_cta?: string\n  html_micro_call_to_action?: string\n  html_micro_description?: string\n  html_micro_title?: string\n  html_short_title?: string\n  html_title: string\n  icon_color?: string | null\n  icon_type?: number | null\n  in_description_cta?: string | null\n  is_dismissed: boolean\n  is_obsolete: boolean\n  is_refreshable: boolean\n  is_sampled: boolean\n  merchant_guids: string[] | []\n  metadata?: string | null\n  micro_call_to_action?: string | null\n  micro_description?: string | null\n  micro_title?: string | null\n  payload: any\n  primary_account?: Account\n  primary_account_guid?: string | null\n  primary_category_guid?: string | null\n  primary_goal_guid?: string | null\n  primary_merchant_guid?: string | null\n  /** Legacy pulse envelope: the subscription an Upcoming Subscription beat is about. */\n  primary_repeating_transaction_guid?: string | null\n  primary_scheduled_payment_guid?: string | null\n  primary_transaction?: Transaction\n  primary_transaction_guid?: string | null\n  power_action_completed_at?: string | null\n  power_action_has_been_completed?: boolean\n  scheduled_payment_guids: string[] | []\n  short_title?: string | null\n  supporting_action?: string | null\n  template: string\n  title: string\n  transaction_guids: string[] | []\n  transactions?: Transaction[]\n  user_guid: string\n  user_verification: UserVerification\n\n  // Added for UI: optional institution info for displaying logos\n  institutionGuid?: string | null\n  institutionName?: string | null\n\n  insights_payload?: InsightsPayload\n  /**\n   * Written by firefly, never by a template: true when the insight's Insights 2.0 flag is on (or\n   * the envelope is present). It gates which renderer draws the beat — see `resolveInsightRender`.\n   * Absent on an older firefly or on cortex, which renders the legacy path unchanged.\n   */\n  is_insights_v2?: boolean\n}\n\nexport interface DataSeries {\n  names?: string[]\n  types?: string[]\n  data?: any[]\n}\n\nexport enum UserVerification {\n  UNKNOWN = 0,\n  CORRECT = 1,\n  INCORRECT = 2,\n}\n"],"mappings":"AAiFA,IAAY,IAAL,0BAAA,GAAA;AACL,SAAA,EAAA,EAAA,UAAA,CAAA,IAAA,WACA,EAAA,EAAA,UAAA,CAAA,IAAA,WACA,EAAA,EAAA,YAAA,CAAA,IAAA;AACF,GAAA,CAAA,CAAA"}

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

@@ -95,6 +95,12 @@ export interface InsightsPayload {
     primary_transaction_guid?: string | null;
     primary_category_guid?: string | null;
     primary_merchant_guid?: string | null;
+    /**
+     * V2: the repeating transaction a subscription beat is about (Upcoming Subscription, Subscription
+     * Price Increase). Read by `recurring_transaction_block`, see
+     * `actionBlocks/RecurringTransactionBlock/subscriptionBeats.ts`.
+     */
+    primary_repeating_transaction_guid?: string | null;
 }
 export interface Legends {
     label: string;

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

@@ -0,0 +1,17 @@
+import { ActionBlockProps } from '../../mappings/blocks';
+/**
+ * Expense Details drawer content for one recurring subscription (WEC-1428), shared by the Upcoming
+ * Subscription (WEC-1469) and Subscription Price Increase (WEC-1470) beats.
+ *
+ * The detail rendering (merchant header, next-due card, account/category/schedule rows, past
+ * activity, mark-as-paid/unpaid, delete) all lives in the recurring module's
+ * `RecurringTransactionDetails`, the same component behind the recurring widget's Expense Details
+ * drawer. This block's job is only to resolve *which* subscription (`subscriptionBeats.ts`) and hand
+ * off, exactly as `TransactionDetailsBlock` does with `TransactionDetails`.
+ *
+ * `observer` is required: the resolved subscription comes from RecurringTransactionsStore, and
+ * `usePrepare` may still be loading it when this first renders.
+ */
+export declare const RecurringTransactionBlock: (({ beat, }: ActionBlockProps) => import("react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};

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

@@ -0,0 +1,39 @@
+import { useGlobalCopyStore as R, useInsightsV2Store as g, useTransactionStore as T } from "../../../common/context/hooks.es.js";
+import v from "../../../common/components/Loader.es.js";
+import { RecurringTransactionDetails as x } from "../../../recurringtransactions/components/RecurringTransactionDetails.es.js";
+import { ErrorCard as y } from "../../components/ErrorCard.es.js";
+import { useRecurringTransactionBlock as D } from "./useRecurringTransactionBlock.es.js";
+import { useRecurringTransactionLoad as L } from "./useRecurringTransactionPrepare.es.js";
+import r from "react";
+import { observer as B } from "mobx-react-lite";
+import { Text as E } from "@mxenabled/mxui";
+import { jsx as t } from "react/jsx-runtime";
+var O = B(function({ beat: f }) {
+  const { closeActionDrawer: l } = g(), { recurring: m } = R(), { filter: d, setFilter: n } = T(), { hasLoadError: i, isLoading: c, repeatingTransaction: o } = D(f), p = L(), e = r.useRef(null);
+  e.current === null && (e.current = { ...d });
+  const s = r.useRef(n), a = r.useRef(!1), u = !c && !i && o !== void 0;
+  return s.current = n, r.useEffect(() => {
+    u && (a.current = !0);
+  }, [u]), r.useEffect(() => () => {
+    a.current && e.current && s.current(e.current);
+  }, []), c ? /* @__PURE__ */ t(v, {}) : i ? /* @__PURE__ */ t(y, { onRetry: () => {
+    p();
+  } }) : o ? /* @__PURE__ */ t(x, {
+    onDeleted: l,
+    recurringTransaction: o,
+    selectedRecurrence: null
+  }) : /* @__PURE__ */ t(E, {
+    color: "text.secondary",
+    sx: {
+      m: 24,
+      textAlign: "center"
+    },
+    variant: "body1",
+    children: m.no_activities
+  });
+});
+export {
+  O as RecurringTransactionBlock
+};
+
+//# sourceMappingURL=RecurringTransactionBlock.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RecurringTransactionBlock.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '@mxenabled/mxui'\nimport { observer } from 'mobx-react-lite'\n\nimport {\n  Loader,\n  useGlobalCopyStore,\n  useInsightsV2Store,\n  useTransactionStore,\n} from '../../../common'\nimport type { TransactionFilter } from '../../../core/stores/TransactionStore'\nimport { RecurringTransactionDetails } from '../../../recurringtransactions/components/RecurringTransactionDetails'\nimport { ErrorCard } from '../../components/ErrorCard'\nimport type { ActionBlockProps } from '../../mappings/blocks'\n\nimport { useRecurringTransactionBlock } from './useRecurringTransactionBlock'\nimport { useRecurringTransactionLoad } from './useRecurringTransactionPrepare'\n\n/**\n * Expense Details drawer content for one recurring subscription (WEC-1428), shared by the Upcoming\n * Subscription (WEC-1469) and Subscription Price Increase (WEC-1470) beats.\n *\n * The detail rendering (merchant header, next-due card, account/category/schedule rows, past\n * activity, mark-as-paid/unpaid, delete) all lives in the recurring module's\n * `RecurringTransactionDetails`, the same component behind the recurring widget's Expense Details\n * drawer. This block's job is only to resolve *which* subscription (`subscriptionBeats.ts`) and hand\n * off, exactly as `TransactionDetailsBlock` does with `TransactionDetails`.\n *\n * `observer` is required: the resolved subscription comes from RecurringTransactionsStore, and\n * `usePrepare` may still be loading it when this first renders.\n */\nexport const RecurringTransactionBlock = observer(function RecurringTransactionBlock({\n  beat,\n}: ActionBlockProps) {\n  const { closeActionDrawer } = useInsightsV2Store()\n  const { recurring: copy } = useGlobalCopyStore()\n  const { filter, setFilter } = useTransactionStore()\n  const { hasLoadError, isLoading, repeatingTransaction } = useRecurringTransactionBlock(beat)\n  const retryLoad = useRecurringTransactionLoad()\n\n  // `RecurringTransactionDetails` narrows the shared `TransactionStore.filter` to this one\n  // subscription (90-day window + guid predicate) and never restores it. Inside the recurring widget\n  // that is fine, but a Transactions widget on the same page would be left showing only this\n  // subscription's charges after the drawer closes. The runner mounts this block on open and\n  // unmounts it on close, so the filter is put back on unmount, with two guards:\n  //  - the snapshot is taken BY VALUE on the first render (the store's `filter` is a live observable\n  //    object, so holding the reference would hold whatever it was later changed to);\n  //  - the restore only runs if the details view actually mounted. While loading, on a failed load\n  //    or when nothing resolved, this block changed nothing and must not overwrite a filter some\n  //    other widget may have set in the meantime.\n  const filterBeforeOpen = React.useRef<TransactionFilter | null>(null)\n\n  if (filterBeforeOpen.current === null) filterBeforeOpen.current = { ...filter }\n\n  const setFilterRef = React.useRef(setFilter)\n  const didRenderDetails = React.useRef(false)\n  const isDetailsRendered = !isLoading && !hasLoadError && repeatingTransaction !== undefined\n\n  setFilterRef.current = setFilter\n\n  React.useEffect(() => {\n    if (isDetailsRendered) didRenderDetails.current = true\n  }, [isDetailsRendered])\n\n  React.useEffect(\n    () => () => {\n      if (didRenderDetails.current && filterBeforeOpen.current) {\n        setFilterRef.current(filterBeforeOpen.current)\n      }\n    },\n    [],\n  )\n\n  if (isLoading) return <Loader />\n\n  // The open-time load finished without data (API failure, reported through the store). Offer the\n  // feed's standard error card with a retry rather than leaving the loader up forever.\n  if (hasLoadError) return <ErrorCard onRetry={() => void retryLoad()} />\n\n  // Loading finished and the beat still resolves to nothing (deleted, never detected, or a beat that\n  // names none). Say so in the recurring module's own words rather than the generic error drawer.\n  if (!repeatingTransaction) {\n    return (\n      <Text color=\"text.secondary\" sx={{ m: 24, textAlign: 'center' }} variant=\"body1\">\n        {copy.no_activities}\n      </Text>\n    )\n  }\n\n  return (\n    <RecurringTransactionDetails\n      // Deleting the subscription from inside the drawer leaves nothing to show; close it, as the\n      // recurring widget's own drawer does.\n      onDeleted={closeActionDrawer}\n      recurringTransaction={repeatingTransaction}\n      // No specific occurrence was tapped (the CTA opens the subscription itself), so the next-due\n      // card falls back to the subscription's next upcoming date.\n      selectedRecurrence={null}\n    />\n  )\n})\n"],"mappings":";;;;;;;;;;AAgCA,IAAa,IAA4B,EAAS,SAAmC,EACnF,MAAA,EAAA,GACmB;AACnB,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAmB,GAC3C,EAAE,WAAW,EAAA,IAAS,EAAmB,GACzC,EAAE,QAAA,GAAQ,WAAA,EAAA,IAAc,EAAoB,GAC5C,EAAE,cAAA,GAAc,WAAA,GAAW,sBAAA,EAAA,IAAyB,EAA6B,CAAI,GACrF,IAAY,EAA4B,GAYxC,IAAmB,EAAM,OAAiC,IAAI;AAEpE,EAAI,EAAiB,YAAY,SAAM,EAAiB,UAAU,EAAE,GAAG,EAAO;AAE9E,QAAM,IAAe,EAAM,OAAO,CAAS,GACrC,IAAmB,EAAM,OAAO,EAAK,GACrC,IAAoB,CAAC,KAAa,CAAC,KAAgB,MAAyB;AAiBlF,SAfA,EAAa,UAAU,GAEvB,EAAM,UAAA,MAAgB;AACpB,IAAI,MAAmB,EAAiB,UAAU;AAAA,EACpD,GAAG,CAAC,CAAiB,CAAC,GAEtB,EAAM,UAAA,MAAA,MACQ;AACV,IAAI,EAAiB,WAAW,EAAiB,WAC/C,EAAa,QAAQ,EAAiB,OAAO;AAAA,EAEjD,GACA,CAAC,CACH,GAEI,IAAkB,gBAAA,EAAC,GAAD,CAAS,CAAA,IAI3B,IAAqB,gBAAA,EAAC,GAAD,EAAW,SAAA,MAAA;AAAe,IAAK,EAAU;AAAA,IAAI,CAAA,IAIjE,IASH,gBAAA,EAAC,GAAD;AAAA,IAGE,WAAW;AAAA,IACX,sBAAsB;AAAA,IAGtB,oBAAoB;AAAA,EACrB,CAAA,IAfC,gBAAA,EAAC,GAAD;AAAA,IAAM,OAAM;AAAA,IAAiB,IAAI;AAAA,MAAE,GAAG;AAAA,MAAI,WAAW;AAAA,IAAS;AAAA,IAAG,SAAQ;AAAA,IACtE,UAAA,EAAK;AAAA,EACF,CAAA;AAeZ,CAAC"}

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

@@ -0,0 +1,2 @@
+export { RecurringTransactionBlock } from './RecurringTransactionBlock';
+export { useRecurringTransactionPrepare } from './useRecurringTransactionPrepare';

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/subscriptionBeats.d.ts

@@ -0,0 +1,19 @@
+import { Beat, RepeatingTransaction, Transaction } from '../../../core';
+interface SubscriptionContext {
+    /** `recurringTransactionsStore.repeatingTransactions`, with linked transactions when augmented. */
+    repeatingTransactions: RepeatingTransaction[];
+    /** `transactionStore.transactions`, consulted to walk a transaction to its repeating transaction. */
+    transactions: Transaction[];
+}
+/**
+ * Which repeating transaction the beat is about, or `undefined` if it cannot tell.
+ *
+ * The direct pointer wins: V2 carries `primary_repeating_transaction_guid` on the payload beside the
+ * other `primary_*` guids, and the legacy pulse envelope carries it on the beat (Upcoming
+ * Subscription, WEC-1469). Failing that, the beat's primary transaction is walked to the repeating
+ * transaction it is linked to (Subscription Price Increase, WEC-1470, whose pulse fixture names only
+ * `primary_transaction`): the hydrated `beat.primary_transaction` first, then the transaction store,
+ * then each repeating transaction's own linked `transactions`.
+ */
+export declare const resolveSubscriptionGuid: (beat: Beat, { repeatingTransactions, transactions }: SubscriptionContext) => string | undefined;
+export {};

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/subscriptionBeats.es.js

@@ -0,0 +1,12 @@
+var s = (i, { repeatingTransactions: t, transactions: o }) => {
+  const a = i.insights_payload?.primary_repeating_transaction_guid || i.primary_repeating_transaction_guid;
+  if (a) return a;
+  const r = i.insights_payload?.primary_transaction_guid || i.primary_transaction?.guid || i.primary_transaction_guid;
+  if (r)
+    return (i.primary_transaction?.guid === r ? i.primary_transaction : void 0)?.repeating_transaction_guid || o.find((n) => n.guid === r)?.repeating_transaction_guid || t.find((n) => n.transactions?.some((d) => d.guid === r))?.guid || void 0;
+};
+export {
+  s as resolveSubscriptionGuid
+};
+
+//# sourceMappingURL=subscriptionBeats.es.js.map

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/subscriptionBeats.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"subscriptionBeats.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/RecurringTransactionBlock/subscriptionBeats.ts"],"sourcesContent":["import type { Beat, RepeatingTransaction, Transaction } from '../../../core'\n\ninterface SubscriptionContext {\n  /** `recurringTransactionsStore.repeatingTransactions`, with linked transactions when augmented. */\n  repeatingTransactions: RepeatingTransaction[]\n  /** `transactionStore.transactions`, consulted to walk a transaction to its repeating transaction. */\n  transactions: Transaction[]\n}\n\n/**\n * Which repeating transaction the beat is about, or `undefined` if it cannot tell.\n *\n * The direct pointer wins: V2 carries `primary_repeating_transaction_guid` on the payload beside the\n * other `primary_*` guids, and the legacy pulse envelope carries it on the beat (Upcoming\n * Subscription, WEC-1469). Failing that, the beat's primary transaction is walked to the repeating\n * transaction it is linked to (Subscription Price Increase, WEC-1470, whose pulse fixture names only\n * `primary_transaction`): the hydrated `beat.primary_transaction` first, then the transaction store,\n * then each repeating transaction's own linked `transactions`.\n */\nexport const resolveSubscriptionGuid = (\n  beat: Beat,\n  { repeatingTransactions, transactions }: SubscriptionContext,\n): string | undefined => {\n  const direct =\n    beat.insights_payload?.primary_repeating_transaction_guid ||\n    beat.primary_repeating_transaction_guid\n\n  if (direct) return direct\n\n  const transactionGuid =\n    beat.insights_payload?.primary_transaction_guid ||\n    beat.primary_transaction?.guid ||\n    beat.primary_transaction_guid\n\n  if (!transactionGuid) return undefined\n\n  const snapshot =\n    beat.primary_transaction?.guid === transactionGuid ? beat.primary_transaction : undefined\n\n  return (\n    snapshot?.repeating_transaction_guid ||\n    transactions.find((transaction) => transaction.guid === transactionGuid)\n      ?.repeating_transaction_guid ||\n    repeatingTransactions.find((repeating) =>\n      repeating.transactions?.some((transaction) => transaction.guid === transactionGuid),\n    )?.guid ||\n    undefined\n  )\n}\n"],"mappings":"AAmBA,IAAa,IAAA,CACX,GACA,EAAE,uBAAA,GAAuB,cAAA,EAAA,MACF;AACvB,QAAM,IACJ,EAAK,kBAAkB,sCACvB,EAAK;AAEP,MAAI,EAAQ,QAAO;AAEnB,QAAM,IACJ,EAAK,kBAAkB,4BACvB,EAAK,qBAAqB,QAC1B,EAAK;AAEP,MAAK;AAKL,YAFE,EAAK,qBAAqB,SAAS,IAAkB,EAAK,sBAAsB,SAGtE,8BACV,EAAa,KAAA,CAAM,MAAgB,EAAY,SAAS,CAAe,GACnE,8BACJ,EAAsB,KAAA,CAAM,MAC1B,EAAU,cAAc,KAAA,CAAM,MAAgB,EAAY,SAAS,CAAe,CACpF,GAAG,QACH;AAEJ"}

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionBlock.d.ts

@@ -0,0 +1,23 @@
+import { Beat, RepeatingTransaction } from '../../../core';
+export interface RecurringTransactionBlockState {
+    /** True when the open-time load finished without leaving the store loaded; the block offers a retry. */
+    hasLoadError: boolean;
+    /** True until the recurring store has loaded; the block shows a loader instead of an empty state. */
+    isLoading: boolean;
+    /** `undefined` once loading finishes means the subscription could not be resolved. */
+    repeatingTransaction?: RepeatingTransaction;
+}
+/**
+ * Resolves which repeating transaction this drawer is about.
+ *
+ * The guid comes from the beat (`resolveSubscriptionGuid`), then is looked up in
+ * `RecurringTransactionsStore` rather than rebuilt from the beat, because the Expense Details view
+ * edits (payment schedule, mark as paid, delete) must write through to the same store object the
+ * recurring widget renders.
+ *
+ * `detailedRepeatingTransactions` joins the account and linked transactions in, but it is empty until
+ * the transaction store has loaded (see `augmentRepeatingTransactions`). The raw record is the
+ * fallback so a subscription the store has is never reported missing just because transactions are
+ * still on their way.
+ */
+export declare const useRecurringTransactionBlock: (beat: Beat) => RecurringTransactionBlockState;

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionBlock.es.js

@@ -0,0 +1,21 @@
+import { useActionContext as p, useRecurringTransactionsStore as T, useTransactionStore as f } from "../../../common/context/hooks.es.js";
+import { resolveSubscriptionGuid as l } from "./subscriptionBeats.es.js";
+var L = (s) => {
+  const { detailedRepeatingTransactions: e, isDataLoaded: o, repeatingTransactions: r } = T(), { transactions: c } = f(), t = p()?.recurringLoadFailed === !0 && !o, i = l(s, {
+    repeatingTransactions: r,
+    transactions: c
+  }), a = (u) => u.find((g) => g.guid === i), n = i ? a(r) : void 0, d = n ? a(e) ?? {
+    ...n,
+    transactions: n.transactions ?? []
+  } : void 0;
+  return {
+    hasLoadError: t,
+    isLoading: !o && !t,
+    repeatingTransaction: d
+  };
+};
+export {
+  L as useRecurringTransactionBlock
+};
+
+//# sourceMappingURL=useRecurringTransactionBlock.es.js.map

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionBlock.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRecurringTransactionBlock.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionBlock.ts"],"sourcesContent":["import {\n  useActionContext,\n  useRecurringTransactionsStore,\n  useTransactionStore,\n} from '../../../common'\nimport type { Beat, RepeatingTransaction } from '../../../core'\n\nimport { resolveSubscriptionGuid } from './subscriptionBeats'\nimport type { RecurringTransactionActionContext } from './useRecurringTransactionPrepare'\n\nexport interface RecurringTransactionBlockState {\n  /** True when the open-time load finished without leaving the store loaded; the block offers a retry. */\n  hasLoadError: boolean\n  /** True until the recurring store has loaded; the block shows a loader instead of an empty state. */\n  isLoading: boolean\n  /** `undefined` once loading finishes means the subscription could not be resolved. */\n  repeatingTransaction?: RepeatingTransaction\n}\n\n/**\n * Resolves which repeating transaction this drawer is about.\n *\n * The guid comes from the beat (`resolveSubscriptionGuid`), then is looked up in\n * `RecurringTransactionsStore` rather than rebuilt from the beat, because the Expense Details view\n * edits (payment schedule, mark as paid, delete) must write through to the same store object the\n * recurring widget renders.\n *\n * `detailedRepeatingTransactions` joins the account and linked transactions in, but it is empty until\n * the transaction store has loaded (see `augmentRepeatingTransactions`). The raw record is the\n * fallback so a subscription the store has is never reported missing just because transactions are\n * still on their way.\n */\nexport const useRecurringTransactionBlock = (beat: Beat): RecurringTransactionBlockState => {\n  const { detailedRepeatingTransactions, isDataLoaded, repeatingTransactions } =\n    useRecurringTransactionsStore()\n  const { transactions } = useTransactionStore()\n  // The failure flag is per drawer session and only cleared by an explicit retry, but the store is\n  // shared: another widget on the page (e.g. Recurring Transactions on a dashboard) may load it\n  // successfully while this drawer is still open. Data that has since arrived wins over the flag.\n  const loadFailed =\n    useActionContext<RecurringTransactionActionContext>()?.recurringLoadFailed === true\n  const hasLoadError = loadFailed && !isDataLoaded\n\n  const guid = resolveSubscriptionGuid(beat, { repeatingTransactions, transactions })\n\n  const findByGuid = (list: RepeatingTransaction[]) =>\n    list.find((repeating) => repeating.guid === guid)\n\n  const raw = guid ? findByGuid(repeatingTransactions) : undefined\n  const repeatingTransaction = raw\n    ? (findByGuid(detailedRepeatingTransactions) ?? {\n        ...raw,\n        transactions: raw.transactions ?? [],\n      })\n    : undefined\n\n  return { hasLoadError, isLoading: !isDataLoaded && !hasLoadError, repeatingTransaction }\n}\n"],"mappings":";;AAgCA,IAAa,IAAA,CAAgC,MAA+C;AAC1F,QAAM,EAAE,+BAAA,GAA+B,cAAA,GAAc,uBAAA,EAAA,IACnD,EAA8B,GAC1B,EAAE,cAAA,EAAA,IAAiB,EAAoB,GAMvC,IADJ,EAAoD,GAAG,wBAAwB,MAC9C,CAAC,GAE9B,IAAO,EAAwB,GAAM;AAAA,IAAE,uBAAA;AAAA,IAAuB,cAAA;AAAA,EAAa,CAAC,GAE5E,IAAA,CAAc,MAClB,EAAK,KAAA,CAAM,MAAc,EAAU,SAAS,CAAI,GAE5C,IAAM,IAAO,EAAW,CAAqB,IAAI,QACjD,IAAuB,IACxB,EAAW,CAA6B,KAAK;AAAA,IAC5C,GAAG;AAAA,IACH,cAAc,EAAI,gBAAgB,CAAC;AAAA,EACrC,IACA;AAEJ,SAAO;AAAA,IAAE,cAAA;AAAA,IAAc,WAAW,CAAC,KAAgB,CAAC;AAAA,IAAc,sBAAA;AAAA,EAAqB;AACzF"}

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.d.ts

@@ -0,0 +1,25 @@
+import { ActionBlockProps } from '../../mappings/blocks';
+/** The key this block layers onto the drawer's action context when its open-time load fails. */
+export interface RecurringTransactionActionContext {
+    recurringLoadFailed?: boolean;
+}
+/**
+ * Runs the recurring widget's loader and records whether it left the store loaded.
+ *
+ * `RecurringTransactionsStore` swallows API failures into `captureError`, so on a failed request
+ * `isDataLoaded` simply stays false and nothing else changes. Left alone, that would keep the block
+ * on its loader forever. This is the one place that turns the outcome into a flag the block can
+ * render an error state (with retry) from. The flag lives on the drawer's action context, which is
+ * per drawer session: a new open starts clean.
+ */
+export declare const useRecurringTransactionLoad: () => () => Promise<void>;
+/**
+ * Open-time data guarantee for the Expense Details drawer. Wired as the block's `usePrepare`, so
+ * `ActionBlockLayer` runs it once each time a CTA opens the drawer.
+ *
+ * A beat is rendered in the feed long before the recurring module has loaded, so the store is
+ * usually cold at open time. The loader is the recurring widget's own (accounts, categories and
+ * transactions first, then repeating transactions). Guarded on `isDataLoaded` so re-opening does
+ * not refetch, and on a ref so a failed load does not refire on every render (retry is explicit).
+ */
+export declare const useRecurringTransactionPrepare: (_props: ActionBlockProps) => void;

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js

@@ -0,0 +1,24 @@
+import { useInsightsV2Store as o, useRecurringTransactionsStore as s } from "../../../common/context/hooks.es.js";
+import e from "react";
+var c = () => {
+  const a = s(), { setActionContext: r } = o();
+  return e.useCallback(async () => {
+    r({ recurringLoadFailed: !1 });
+    try {
+      await a.loadRepeatingTransactionData();
+    } catch {
+    }
+    a.isDataLoaded || r({ recurringLoadFailed: !0 });
+  }, [a, r]);
+}, d = (a) => {
+  const { isDataLoaded: r } = s(), t = c(), n = e.useRef(!1);
+  e.useEffect(() => {
+    n.current || r || (n.current = !0, t());
+  }, [r, t]);
+};
+export {
+  c as useRecurringTransactionLoad,
+  d as useRecurringTransactionPrepare
+};
+
+//# sourceMappingURL=useRecurringTransactionPrepare.es.js.map

package/dist/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRecurringTransactionPrepare.es.js","names":[],"sources":["../../../../src/insights-v2/actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.ts"],"sourcesContent":["import React from 'react'\n\nimport { useInsightsV2Store, useRecurringTransactionsStore } from '../../../common'\nimport type { ActionBlockProps } from '../../mappings/blocks'\n\n/** The key this block layers onto the drawer's action context when its open-time load fails. */\nexport interface RecurringTransactionActionContext {\n  recurringLoadFailed?: boolean\n}\n\n/**\n * Runs the recurring widget's loader and records whether it left the store loaded.\n *\n * `RecurringTransactionsStore` swallows API failures into `captureError`, so on a failed request\n * `isDataLoaded` simply stays false and nothing else changes. Left alone, that would keep the block\n * on its loader forever. This is the one place that turns the outcome into a flag the block can\n * render an error state (with retry) from. The flag lives on the drawer's action context, which is\n * per drawer session: a new open starts clean.\n */\nexport const useRecurringTransactionLoad = () => {\n  const recurringTransactionsStore = useRecurringTransactionsStore()\n  const { setActionContext } = useInsightsV2Store()\n\n  return React.useCallback(async () => {\n    setActionContext({ recurringLoadFailed: false })\n\n    try {\n      await recurringTransactionsStore.loadRepeatingTransactionData()\n    } catch {\n      // Already reported through the store's captureError; the flag below is the UI signal.\n    }\n\n    if (!recurringTransactionsStore.isDataLoaded) setActionContext({ recurringLoadFailed: true })\n  }, [recurringTransactionsStore, setActionContext])\n}\n\n/**\n * Open-time data guarantee for the Expense Details drawer. Wired as the block's `usePrepare`, so\n * `ActionBlockLayer` runs it once each time a CTA opens the drawer.\n *\n * A beat is rendered in the feed long before the recurring module has loaded, so the store is\n * usually cold at open time. The loader is the recurring widget's own (accounts, categories and\n * transactions first, then repeating transactions). Guarded on `isDataLoaded` so re-opening does\n * not refetch, and on a ref so a failed load does not refire on every render (retry is explicit).\n */\nexport const useRecurringTransactionPrepare = (_props: ActionBlockProps) => {\n  const { isDataLoaded } = useRecurringTransactionsStore()\n  const load = useRecurringTransactionLoad()\n  const hasStarted = React.useRef(false)\n\n  React.useEffect(() => {\n    if (hasStarted.current || isDataLoaded) return\n\n    hasStarted.current = true\n    void load()\n  }, [isDataLoaded, load])\n}\n"],"mappings":";;AAmBA,IAAa,IAAA,MAAoC;AAC/C,QAAM,IAA6B,EAA8B,GAC3D,EAAE,kBAAA,EAAA,IAAqB,EAAmB;AAEhD,SAAO,EAAM,YAAY,YAAY;AACnC,IAAA,EAAiB,EAAE,qBAAqB,GAAM,CAAC;AAE/C,QAAI;AACF,YAAM,EAA2B,6BAA6B;AAAA,IAChE,QAAQ;AAAA,IAER;AAEA,IAAK,EAA2B,gBAAc,EAAiB,EAAE,qBAAqB,GAAK,CAAC;AAAA,EAC9F,GAAG,CAAC,GAA4B,CAAgB,CAAC;AACnD,GAWa,IAAA,CAAkC,MAA6B;AAC1E,QAAM,EAAE,cAAA,EAAA,IAAiB,EAA8B,GACjD,IAAO,EAA4B,GACnC,IAAa,EAAM,OAAO,EAAK;AAErC,EAAA,EAAM,UAAA,MAAgB;AACpB,IAAI,EAAW,WAAW,MAE1B,EAAW,UAAU,IACrB,EAAU;AAAA,EACZ,GAAG,CAAC,GAAc,CAAI,CAAC;AACzB"}

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

@@ -3,14 +3,14 @@ import { BeatActionsProvider as R } from "../beatActions.es.js";
 import { isContactSupportCtaDisabled as H } from "../actionBlocks/ContactSupportActionBlock.es.js";
 import { logoFromRef as M } from "./shared/EntityLogo.es.js";
 import { actionBlocksKey as P } from "../mappings/actionBlocksKey.es.js";
-import { blocks as U } from "../mappings/blocks.es.js";
-import j from "./Footer.es.js";
-import z from "./Header.es.js";
-import { FeedbackBar as G } from "./FeedbackBar.es.js";
-import K from "./FeedbackDialog.es.js";
-import { DismissInsightDialog as X } from "./DismissInsightDialog.es.js";
-import { HiddenConfirmationCard as V } from "./HiddenConfirmationCard.es.js";
-import { ErrorCard as W } from "./ErrorCard.es.js";
+import { ErrorCard as U } from "./ErrorCard.es.js";
+import { blocks as j } from "../mappings/blocks.es.js";
+import z from "./Footer.es.js";
+import G from "./Header.es.js";
+import { FeedbackBar as K } from "./FeedbackBar.es.js";
+import X from "./FeedbackDialog.es.js";
+import { DismissInsightDialog as V } from "./DismissInsightDialog.es.js";
+import { HiddenConfirmationCard as W } from "./HiddenConfirmationCard.es.js";
 import { LoadingCard as Y } from "./LoadingCard.es.js";
 import { ObsolesceBanner as q } from "./ObsolesceBanner.es.js";
 import { ActionBlockLayer as J } from "../actionBlocks/ActionBlockLayer.es.js";
@@ -43,7 +43,7 @@ var so = {}, no = {
   textTransform: "none"
 }, Ro = $(({ beat: t, beatActions: s = so, obsolete: c, isLoading: x = !1, isError: _ = !1 }) => {
   const v = N(), { config: S } = E(), o = Z(t, s), { runCta: T, primary: C, secondary: g } = Q(t, s, t.insights_payload?.primary_cta, t.insights_payload?.secondary_cta);
-  if (_) return /* @__PURE__ */ i(W, {});
+  if (_) return /* @__PURE__ */ i(U, {});
   const e = t.insights_payload;
   if (!e || o.cardState === "dismissed") return null;
   const { instance_slot: B, primary_cta: r, secondary_cta: n, sub_title: O, title: D, widget_type: L, guid: I, dismissed_at: F } = e, { block: A } = B, w = O ?? (e.subtitle ? {
@@ -57,13 +57,13 @@ var so = {}, no = {
       }
       await T(f, u);
     }
-  }, k = U[A], d = L === "mini", m = v.insights_feed?.general, p = c?.state === "not_refreshable" && !F && !!m;
+  }, k = j[A], d = L === "mini", m = v.insights_feed?.general, p = c?.state === "not_refreshable" && !F && !!m;
   return /* @__PURE__ */ i(R, {
     value: o.wrappedActions,
     children: /* @__PURE__ */ a(b, {
       sx: { mb: 16 },
       children: [
-        o.cardState === "confirming" ? /* @__PURE__ */ i(V, {
+        o.cardState === "confirming" ? /* @__PURE__ */ i(W, {
           onClose: o.collapseConfirmation,
           onLeaveFeedback: o.openHideSurvey,
           onUndo: o.undoDismiss
@@ -79,7 +79,7 @@ var so = {}, no = {
           } },
           children: [
             p && /* @__PURE__ */ i(ro, { sx: no }),
-            /* @__PURE__ */ i(z, {
+            /* @__PURE__ */ i(G, {
               isMini: d,
               subtitle: w,
               title: D ?? ""
@@ -136,19 +136,19 @@ var so = {}, no = {
                 children: n.label
               })]
             }),
-            /* @__PURE__ */ i(G, {
+            /* @__PURE__ */ i(K, {
               onTellUsMore: o.openRatingSurvey,
               show: o.isFeedbackBarShown
             })
           ]
         })] }),
         /* @__PURE__ */ i(J, { beat: t }),
-        /* @__PURE__ */ i(X, {
+        /* @__PURE__ */ i(V, {
           isOpen: o.isDismissOpen,
           onClose: o.closeDismissDialog,
           onDismiss: o.confirmDismiss
         }),
-        o.isSurveyOpen && /* @__PURE__ */ i(K, {
+        o.isSurveyOpen && /* @__PURE__ */ i(X, {
           characterLimitLabel: o.survey.characterLimitLabel,
           closeAriaLabel: o.survey.closeAriaLabel,
           isOpen: !0,
@@ -161,7 +161,7 @@ var so = {}, no = {
           secondaryText: o.survey.backText,
           title: o.survey.title
         }),
-        o.cardState === "visible" && e.footer && /* @__PURE__ */ i(j, { footer: e.footer })
+        o.cardState === "visible" && e.footer && /* @__PURE__ */ i(z, { footer: e.footer })
       ]
     })
   });

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

@@ -29,11 +29,11 @@ import { SVGImageBlock as pr } from "./blocks/ImageBlocks/SVGImageBlock/SVGImage
 import er from "./components/AccountHeroCard.es.js";
 import sr from "./components/AmountPill.es.js";
 import lr from "./components/DesignateEmergencySavingsCard.es.js";
-import { FeedbackBar as Cr } from "./components/FeedbackBar.es.js";
-import Br from "./components/FeedbackDialog.es.js";
-import { DismissInsightDialog as hr } from "./components/DismissInsightDialog.es.js";
-import { HiddenConfirmationCard as Sr } from "./components/HiddenConfirmationCard.es.js";
-import { ErrorCard as Tr } from "./components/ErrorCard.es.js";
+import { ErrorCard as Cr } from "./components/ErrorCard.es.js";
+import { FeedbackBar as Br } from "./components/FeedbackBar.es.js";
+import hr from "./components/FeedbackDialog.es.js";
+import { DismissInsightDialog as Sr } from "./components/DismissInsightDialog.es.js";
+import { HiddenConfirmationCard as Tr } from "./components/HiddenConfirmationCard.es.js";
 import { LoadingCard as Dr } from "./components/LoadingCard.es.js";
 import { ObsolesceBanner as Lr } from "./components/ObsolesceBanner.es.js";
 import { HOST_ACTIONS as vr } from "./ctaActions/hostActions.es.js";
@@ -59,15 +59,15 @@ export {
   U as BudgetBlock,
   h as CompactInsightCard,
   lr as DesignateEmergencySavingsCard,
-  hr as DismissInsightDialog,
+  Sr as DismissInsightDialog,
   R as DonutChartBlock,
   O as DoubleBarChartBlock,
   V as DoubleProgressBarBlock,
-  Tr as ErrorCard,
-  Cr as FeedbackBar,
-  Br as FeedbackDialog,
+  Cr as ErrorCard,
+  Br as FeedbackBar,
+  hr as FeedbackDialog,
   vr as HOST_ACTIONS,
-  Sr as HiddenConfirmationCard,
+  Tr as HiddenConfirmationCard,
   S as InsightErrorCard,
   c as InsightOptionsMenu,
   Q as InsightTransactionRow,

package/dist/insights-v2/mappings/actionBlocksKey.d.ts

@@ -4,4 +4,5 @@ export declare const actionBlocksKey: {
     TRANSCATION_HISTORY_ACTION_BLOCK: string;
     TRANSACTION_DETAILS_ACTION_BLOCK: string;
     CONTACT_SUPPORT_ACTION_BLOCK: string;
+    RECURRING_TRANSACTION_ACTION_BLOCK: string;
 };

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

@@ -3,7 +3,8 @@ var _ = {
   MAKE_TRANSFER_ACTION_BLOCK: "make_transfer",
   TRANSCATION_HISTORY_ACTION_BLOCK: "transaction_history_block",
   TRANSACTION_DETAILS_ACTION_BLOCK: "transaction_details_block",
-  CONTACT_SUPPORT_ACTION_BLOCK: "contact_support_block"
+  CONTACT_SUPPORT_ACTION_BLOCK: "contact_support_block",
+  RECURRING_TRANSACTION_ACTION_BLOCK: "recurring_transaction_block"
 };
 export {
   _ as actionBlocksKey

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

@@ -1 +1 @@
-{"version":3,"file":"actionBlocksKey.es.js","names":[],"sources":["../../../src/insights-v2/mappings/actionBlocksKey.ts"],"sourcesContent":["// Keys for the drawer drilldown registry in `blocks.ts`, extracted into their own module.\n//\n// Why: chart blocks (e.g. BarchartBlock, DoubleBarChartBlock) need\n// `TRANSCATION_HISTORY_ACTION_BLOCK` to tag a chart bar's drilldown context, but they are\n// themselves re-exported through `../blocks` -> `mappings/blocks.ts` imports from that same\n// barrel to build its `blocks` registry. Importing the key straight from `mappings/blocks.ts`\n// closed that loop into a circular import: evaluating `mappings/blocks.ts` pulled in the\n// `blocks` barrel, which (before it got to `ComponentBlocks`/`AccountBlock`) loaded\n// `BarchartBlock`, which imported back into the still-initializing `mappings/blocks.ts` —\n// tripping a \"Cannot access 'AccountBlock' before initialization\" TDZ error in Storybook/Vite.\n//\n// Keeping the keys here (no dependency on `mappings/blocks.ts`) lets chart blocks reference\n// them without re-entering that module.\n//\n// Names follow ditto: its registry ends every CTA block in `_block` and the V2 envelope copies those\n// names verbatim (`transaction_details_block`, `contact_support_block`). `make_transfer` is a legacy\n// name that stays as an alias until the last legacy payload is gone.\nexport const actionBlocksKey = {\n  PLACEHOLDER_ACTION_BLOCK: 'PlaceholderActionBlock',\n  MAKE_TRANSFER_ACTION_BLOCK: 'make_transfer',\n  TRANSCATION_HISTORY_ACTION_BLOCK: 'transaction_history_block',\n  TRANSACTION_DETAILS_ACTION_BLOCK: 'transaction_details_block',\n  CONTACT_SUPPORT_ACTION_BLOCK: 'contact_support_block',\n}\n"],"mappings":"AAiBA,IAAa,IAAkB;AAAA,EAC7B,0BAA0B;AAAA,EAC1B,4BAA4B;AAAA,EAC5B,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,8BAA8B;AAChC"}
+{"version":3,"file":"actionBlocksKey.es.js","names":[],"sources":["../../../src/insights-v2/mappings/actionBlocksKey.ts"],"sourcesContent":["// Keys for the drawer drilldown registry in `blocks.ts`, extracted into their own module.\n//\n// Why: chart blocks (e.g. BarchartBlock, DoubleBarChartBlock) need\n// `TRANSCATION_HISTORY_ACTION_BLOCK` to tag a chart bar's drilldown context, but they are\n// themselves re-exported through `../blocks` -> `mappings/blocks.ts` imports from that same\n// barrel to build its `blocks` registry. Importing the key straight from `mappings/blocks.ts`\n// closed that loop into a circular import: evaluating `mappings/blocks.ts` pulled in the\n// `blocks` barrel, which (before it got to `ComponentBlocks`/`AccountBlock`) loaded\n// `BarchartBlock`, which imported back into the still-initializing `mappings/blocks.ts` —\n// tripping a \"Cannot access 'AccountBlock' before initialization\" TDZ error in Storybook/Vite.\n//\n// Keeping the keys here (no dependency on `mappings/blocks.ts`) lets chart blocks reference\n// them without re-entering that module.\n//\n// Names follow ditto: its registry ends every CTA block in `_block` and the V2 envelope copies those\n// names verbatim (`transaction_details_block`, `contact_support_block`). `make_transfer` is a legacy\n// name that stays as an alias until the last legacy payload is gone.\nexport const actionBlocksKey = {\n  PLACEHOLDER_ACTION_BLOCK: 'PlaceholderActionBlock',\n  MAKE_TRANSFER_ACTION_BLOCK: 'make_transfer',\n  TRANSCATION_HISTORY_ACTION_BLOCK: 'transaction_history_block',\n  TRANSACTION_DETAILS_ACTION_BLOCK: 'transaction_details_block',\n  CONTACT_SUPPORT_ACTION_BLOCK: 'contact_support_block',\n  RECURRING_TRANSACTION_ACTION_BLOCK: 'recurring_transaction_block',\n}\n"],"mappings":"AAiBA,IAAa,IAAkB;AAAA,EAC7B,0BAA0B;AAAA,EAC1B,4BAA4B;AAAA,EAC5B,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,8BAA8B;AAAA,EAC9B,oCAAoC;AACtC"}

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

@@ -1,78 +1,85 @@
 import { ContactSupportActionBlock as a } from "../actionBlocks/ContactSupportActionBlock.es.js";
-import { actionBlocksKey as o } from "./actionBlocksKey.es.js";
+import { actionBlocksKey as r } from "./actionBlocksKey.es.js";
 import { BarchartBlock as c } from "../blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js";
-import { DoubleBarChartBlock as l } from "../blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
-import i from "../blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
+import { DoubleBarChartBlock as i } from "../blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
+import l from "../blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
 import m from "../blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
 import n from "../blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
 import p from "../blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js";
 import _ from "../blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
-import { BudgetBlock as k } from "../blocks/ComponentBlocks/BudgetBlock/BudgetBlock.es.js";
-import s from "../blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
+import { BudgetBlock as s } from "../blocks/ComponentBlocks/BudgetBlock/BudgetBlock.es.js";
+import k from "../blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
 import { TransactionBlock as B } from "../blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
 import C from "../blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
-import f from "../blocks/ImageBlocks/ImageBlock.es.js";
-import { SVGImageBlock as u } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
-import { PlaceholderActionBlock as T } from "../actionBlocks/PlaceholderActionBlock.es.js";
-import { getMakeTransferDrawerTitle as b } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
-import { MakeTransferActionBlockLayer as A } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
+import u from "../blocks/ImageBlocks/ImageBlock.es.js";
+import { SVGImageBlock as T } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import { PlaceholderActionBlock as f } from "../actionBlocks/PlaceholderActionBlock.es.js";
+import { getMakeTransferDrawerTitle as A } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
+import { MakeTransferActionBlockLayer as b } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
 import { getDrawerHeaderTitle as O } from "../actionBlocks/TransactionHistoryBlock/utils.es.js";
-import { TransactionDetailsBlock as h } from "../actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js";
-import { useTransactionDetailsPrepare as d } from "../actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js";
-import { TransactionHistoryBlock as L } from "../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js";
-var t = (e) => {
-}, N = /* @__PURE__ */ new Set([
+import { TransactionDetailsBlock as N } from "../actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js";
+import { useTransactionDetailsPrepare as h } from "../actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js";
+import { TransactionHistoryBlock as d } from "../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js";
+import { useRecurringTransactionPrepare as g } from "../actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js";
+import { RecurringTransactionBlock as I } from "../actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.es.js";
+var e = (t) => {
+}, L = /* @__PURE__ */ new Set([
   "",
   "null",
   "undefined"
-]), j = (e) => {
-  const r = e?.trim().toLowerCase();
-  return !!r && !N.has(r);
-}, J = {
-  [o.PLACEHOLDER_ACTION_BLOCK]: {
-    Component: T,
-    usePrepare: t,
+]), Z = (t) => {
+  const o = t?.trim().toLowerCase();
+  return !!o && !L.has(o);
+}, $ = {
+  [r.PLACEHOLDER_ACTION_BLOCK]: {
+    Component: f,
+    usePrepare: e,
     title: () => "Action Block Layer Drilldown"
   },
-  [o.MAKE_TRANSFER_ACTION_BLOCK]: {
-    Component: A,
-    usePrepare: t,
-    title: b
+  [r.MAKE_TRANSFER_ACTION_BLOCK]: {
+    Component: b,
+    usePrepare: e,
+    title: A
   },
-  [o.TRANSCATION_HISTORY_ACTION_BLOCK]: {
-    Component: L,
-    usePrepare: t,
+  [r.TRANSCATION_HISTORY_ACTION_BLOCK]: {
+    Component: d,
+    usePrepare: e,
     title: O
   },
-  [o.TRANSACTION_DETAILS_ACTION_BLOCK]: {
-    Component: h,
-    usePrepare: d,
+  [r.TRANSACTION_DETAILS_ACTION_BLOCK]: {
+    Component: N,
+    usePrepare: h,
     title: () => "Transaction Details"
   },
-  [o.CONTACT_SUPPORT_ACTION_BLOCK]: {
+  [r.RECURRING_TRANSACTION_ACTION_BLOCK]: {
+    Component: I,
+    usePrepare: g,
+    title: (t, o) => o.recurring?.expense_details ?? ""
+  },
+  [r.CONTACT_SUPPORT_ACTION_BLOCK]: {
     Component: a,
-    usePrepare: t,
-    title: (e, r) => r.help?.request_support ?? ""
+    usePrepare: e,
+    title: (t, o) => o.help?.request_support ?? ""
   }
-}, Q = {
+}, oo = {
   account_block: p,
   account_switch_block: _,
   bar_chart_block: c,
-  budget_block: k,
+  budget_block: s,
   donut_chart_block: m,
-  double_bar_chart_block: l,
+  double_bar_chart_block: i,
   double_progress_bar_block: n,
-  image_block: f,
-  save_extra_block: s,
-  step_chart_block: i,
-  svg_image_block: u,
+  image_block: u,
+  save_extra_block: k,
+  step_chart_block: l,
+  svg_image_block: T,
   withdrawal_block: C,
   transaction_block: B
 };
 export {
-  J as actionBlocks,
-  Q as blocks,
-  j as hasDrawerBlock
+  $ as actionBlocks,
+  oo as blocks,
+  Z as hasDrawerBlock
 };
 
 //# sourceMappingURL=blocks.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"blocks.es.js","names":[],"sources":["../../../src/insights-v2/mappings/blocks.ts"],"sourcesContent":["import {\n  AccountBlock,\n  AccountSwitchBlock,\n  BarchartBlock,\n  BudgetBlock,\n  DonutChartBlock,\n  DoubleBarChartBlock,\n  DoubleProgressBarBlock,\n  SaveExtraBlock,\n  SVGImageBlock,\n  WithdrawalBlock,\n  TransactionBlock,\n} from '../blocks'\nimport StepChartBlock from '../blocks/ChartBlocks/StepChartBlock'\nimport ImageBlock from '../blocks/ImageBlocks/ImageBlock'\n\nimport type { Beat, GlobalCopy, InsightsPayload } from '../../core'\nimport { ContactSupportActionBlock } from '../actionBlocks/ContactSupportActionBlock'\nimport { PlaceholderActionBlock } from '../actionBlocks/PlaceholderActionBlock'\nimport { MakeTransferActionBlockLayer } from '../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer'\nimport { getMakeTransferDrawerTitle } from '../actionBlocks/MakeTransferActionBlock/layout'\nimport { TransactionHistoryBlock } from '../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock'\nimport { getDrawerHeaderTitle } from '../actionBlocks/TransactionHistoryBlock/utils'\nimport {\n  TransactionDetailsBlock,\n  useTransactionDetailsPrepare,\n} from '../actionBlocks/TransactionDetailsBlock'\n// Keys live in ./actionBlocksKey (imported directly by chart blocks/tests too) to avoid a\n// circular import between this module and the chart blocks — see that file for details.\nimport { actionBlocksKey } from './actionBlocksKey'\n\n// Drilldown indexes are not passed down: action blocks read them from\n// InsightsV2Store (useInsightsV2Store().actionDrawer).\nexport interface ActionBlockProps {\n  beat: Beat\n}\n\nconst noop = (_: ActionBlockProps) => {}\n\n// A CTA opens a drawer only when it carries a real `block`. The backend may send\n// an empty/absent block (or the literal strings \"null\"/\"undefined\") for CTAs\n// that trigger something else (e.g. a postMessage) instead of a drilldown.\nconst NON_BLOCK_VALUES = new Set(['', 'null', 'undefined'])\nexport const hasDrawerBlock = (block?: string | null): boolean => {\n  const normalized = block?.trim().toLowerCase()\n  return !!normalized && !NON_BLOCK_VALUES.has(normalized)\n}\n\nexport interface ActionBlockEntry {\n  Component: React.ComponentType<ActionBlockProps>\n  usePrepare: (props: ActionBlockProps) => void // required; default to noop in each entry\n  // Resolves the drawer title from the clicked CTA's variant + copy (e.g.\n  // MakeTransfer reads its variant title from layout.ts). Falls back to the CTA label.\n  title?: (variant: string | null | undefined, copy: GlobalCopy) => string\n}\n\n// Registry of drawer drilldowns, keyed by the `block` name the backend sends\n// on a beat's CTA. To add one: create a component taking ActionBlockProps,\n// read the clicked indexes from useInsightsV2Store().actionDrawer, and\n// register it here. Add\n// `usePrepare` when the block needs to load data before rendering.\n\nexport const actionBlocks = {\n  [actionBlocksKey.PLACEHOLDER_ACTION_BLOCK]: {\n    Component: PlaceholderActionBlock,\n    usePrepare: noop,\n    title: () => 'Action Block Layer Drilldown',\n  },\n  [actionBlocksKey.MAKE_TRANSFER_ACTION_BLOCK]: {\n    Component: MakeTransferActionBlockLayer,\n    usePrepare: noop,\n    title: getMakeTransferDrawerTitle,\n  },\n  [actionBlocksKey.TRANSCATION_HISTORY_ACTION_BLOCK]: {\n    Component: TransactionHistoryBlock,\n    usePrepare: noop,\n    title: getDrawerHeaderTitle,\n  },\n  [actionBlocksKey.TRANSACTION_DETAILS_ACTION_BLOCK]: {\n    Component: TransactionDetailsBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: () => 'Transaction Details',\n  },\n  // The block renders its own drawer (the help module's RequestSupport) on top of the action\n  // drawer, so the action drawer's title is the CTA label.\n  [actionBlocksKey.CONTACT_SUPPORT_ACTION_BLOCK]: {\n    Component: ContactSupportActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) => copy.help?.request_support ?? '',\n  },\n} as Record<string, ActionBlockEntry>\n\nexport const blocks = {\n  account_block: AccountBlock,\n  account_switch_block: AccountSwitchBlock,\n  bar_chart_block: BarchartBlock,\n  budget_block: BudgetBlock,\n  donut_chart_block: DonutChartBlock,\n  double_bar_chart_block: DoubleBarChartBlock,\n  double_progress_bar_block: DoubleProgressBarBlock,\n  image_block: ImageBlock,\n  save_extra_block: SaveExtraBlock,\n  step_chart_block: StepChartBlock,\n  svg_image_block: SVGImageBlock,\n  withdrawal_block: WithdrawalBlock,\n  transaction_block: TransactionBlock,\n} as Record<string, React.ComponentType<{ payload: InsightsPayload; beatGuid?: string }>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqCA,IAAM,IAAA,CAAQ,MAAwB;AAAC,GAKjC,IAAmB,oBAAI,IAAI;AAAA,EAAC;AAAA,EAAI;AAAA,EAAQ;AAAW,CAAC,GAC7C,IAAA,CAAkB,MAAmC;AAChE,QAAM,IAAa,GAAO,KAAK,EAAE,YAAY;AAC7C,SAAO,CAAC,CAAC,KAAc,CAAC,EAAiB,IAAI,CAAU;AACzD,GAgBa,IAAe;AAAA,EACzB,CAAA,EAAgB,wBAAA,GAA2B;AAAA,IAC1C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EACC,CAAA,EAAgB,0BAAA,GAA6B;AAAA,IAC5C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EAGC,CAAA,EAAgB,4BAAA,GAA+B;AAAA,IAC9C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,MAAM,mBAAmB;AAAA,EAC3D;AACF,GAEa,IAAS;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,mBAAmB;AACrB"}
+{"version":3,"file":"blocks.es.js","names":[],"sources":["../../../src/insights-v2/mappings/blocks.ts"],"sourcesContent":["import {\n  AccountBlock,\n  AccountSwitchBlock,\n  BarchartBlock,\n  BudgetBlock,\n  DonutChartBlock,\n  DoubleBarChartBlock,\n  DoubleProgressBarBlock,\n  SaveExtraBlock,\n  SVGImageBlock,\n  WithdrawalBlock,\n  TransactionBlock,\n} from '../blocks'\nimport StepChartBlock from '../blocks/ChartBlocks/StepChartBlock'\nimport ImageBlock from '../blocks/ImageBlocks/ImageBlock'\n\nimport type { Beat, GlobalCopy, InsightsPayload } from '../../core'\nimport { ContactSupportActionBlock } from '../actionBlocks/ContactSupportActionBlock'\nimport { PlaceholderActionBlock } from '../actionBlocks/PlaceholderActionBlock'\nimport { MakeTransferActionBlockLayer } from '../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer'\nimport { getMakeTransferDrawerTitle } from '../actionBlocks/MakeTransferActionBlock/layout'\nimport { TransactionHistoryBlock } from '../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock'\nimport { getDrawerHeaderTitle } from '../actionBlocks/TransactionHistoryBlock/utils'\nimport {\n  TransactionDetailsBlock,\n  useTransactionDetailsPrepare,\n} from '../actionBlocks/TransactionDetailsBlock'\nimport {\n  RecurringTransactionBlock,\n  useRecurringTransactionPrepare,\n} from '../actionBlocks/RecurringTransactionBlock'\n// Keys live in ./actionBlocksKey (imported directly by chart blocks/tests too) to avoid a\n// circular import between this module and the chart blocks — see that file for details.\nimport { actionBlocksKey } from './actionBlocksKey'\n\n// Drilldown indexes are not passed down: action blocks read them from\n// InsightsV2Store (useInsightsV2Store().actionDrawer).\nexport interface ActionBlockProps {\n  beat: Beat\n}\n\nconst noop = (_: ActionBlockProps) => {}\n\n// A CTA opens a drawer only when it carries a real `block`. The backend may send\n// an empty/absent block (or the literal strings \"null\"/\"undefined\") for CTAs\n// that trigger something else (e.g. a postMessage) instead of a drilldown.\nconst NON_BLOCK_VALUES = new Set(['', 'null', 'undefined'])\nexport const hasDrawerBlock = (block?: string | null): boolean => {\n  const normalized = block?.trim().toLowerCase()\n  return !!normalized && !NON_BLOCK_VALUES.has(normalized)\n}\n\nexport interface ActionBlockEntry {\n  Component: React.ComponentType<ActionBlockProps>\n  usePrepare: (props: ActionBlockProps) => void // required; default to noop in each entry\n  // Resolves the drawer title from the clicked CTA's variant + copy (e.g.\n  // MakeTransfer reads its variant title from layout.ts). Falls back to the CTA label.\n  title?: (variant: string | null | undefined, copy: GlobalCopy) => string\n}\n\n// Registry of drawer drilldowns, keyed by the `block` name the backend sends\n// on a beat's CTA. To add one: create a component taking ActionBlockProps,\n// read the clicked indexes from useInsightsV2Store().actionDrawer, and\n// register it here. Add\n// `usePrepare` when the block needs to load data before rendering.\n\nexport const actionBlocks = {\n  [actionBlocksKey.PLACEHOLDER_ACTION_BLOCK]: {\n    Component: PlaceholderActionBlock,\n    usePrepare: noop,\n    title: () => 'Action Block Layer Drilldown',\n  },\n  [actionBlocksKey.MAKE_TRANSFER_ACTION_BLOCK]: {\n    Component: MakeTransferActionBlockLayer,\n    usePrepare: noop,\n    title: getMakeTransferDrawerTitle,\n  },\n  [actionBlocksKey.TRANSCATION_HISTORY_ACTION_BLOCK]: {\n    Component: TransactionHistoryBlock,\n    usePrepare: noop,\n    title: getDrawerHeaderTitle,\n  },\n  [actionBlocksKey.TRANSACTION_DETAILS_ACTION_BLOCK]: {\n    Component: TransactionDetailsBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: () => 'Transaction Details',\n  },\n  // Expense Details for one recurring subscription. Which subscription a beat names is resolved in\n  // `RecurringTransactionBlock/subscriptionBeats.ts`, not through this registry.\n  [actionBlocksKey.RECURRING_TRANSACTION_ACTION_BLOCK]: {\n    Component: RecurringTransactionBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.recurring?.expense_details ?? '',\n  },\n  // The block renders its own drawer (the help module's RequestSupport) on top of the action\n  // drawer, so the action drawer's title is the CTA label.\n  [actionBlocksKey.CONTACT_SUPPORT_ACTION_BLOCK]: {\n    Component: ContactSupportActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) => copy.help?.request_support ?? '',\n  },\n} as Record<string, ActionBlockEntry>\n\nexport const blocks = {\n  account_block: AccountBlock,\n  account_switch_block: AccountSwitchBlock,\n  bar_chart_block: BarchartBlock,\n  budget_block: BudgetBlock,\n  donut_chart_block: DonutChartBlock,\n  double_bar_chart_block: DoubleBarChartBlock,\n  double_progress_bar_block: DoubleProgressBarBlock,\n  image_block: ImageBlock,\n  save_extra_block: SaveExtraBlock,\n  step_chart_block: StepChartBlock,\n  svg_image_block: SVGImageBlock,\n  withdrawal_block: WithdrawalBlock,\n  transaction_block: TransactionBlock,\n} as Record<string, React.ComponentType<{ payload: InsightsPayload; beatGuid?: string }>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyCA,IAAM,IAAA,CAAQ,MAAwB;AAAC,GAKjC,IAAmB,oBAAI,IAAI;AAAA,EAAC;AAAA,EAAI;AAAA,EAAQ;AAAW,CAAC,GAC7C,IAAA,CAAkB,MAAmC;AAChE,QAAM,IAAa,GAAO,KAAK,EAAE,YAAY;AAC7C,SAAO,CAAC,CAAC,KAAc,CAAC,EAAiB,IAAI,CAAU;AACzD,GAgBa,IAAe;AAAA,EACzB,CAAA,EAAgB,wBAAA,GAA2B;AAAA,IAC1C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EACC,CAAA,EAAgB,0BAAA,GAA6B;AAAA,IAC5C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACC,CAAA,EAAgB,gCAAA,GAAmC;AAAA,IAClD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,MAAa;AAAA,EACf;AAAA,EAGC,CAAA,EAAgB,kCAAA,GAAqC;AAAA,IACpD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,WAAW,mBAAmB;AAAA,EAChE;AAAA,EAGC,CAAA,EAAgB,4BAAA,GAA+B;AAAA,IAC9C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,MAAM,mBAAmB;AAAA,EAC3D;AACF,GAEa,KAAS;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,mBAAmB;AACrB"}

package/dist/transactions/components/shared/TransactionList.es.js

@@ -2,10 +2,10 @@ import { useEvent as z, useTransactionStore as N } from "../../../common/context
 import { ANALYTICS_EVENTS as O } from "../../../common/constants/Analytics.es.js";
 import { fromUnixUTCToDayOfWeekAndDate as H } from "../../../core/utils/DateUtil.es.js";
 import U from "../../../common/components/Loader.es.js";
-import { useTransactionsUiStore as k } from "../../context/hooks.es.js";
-import W from "./transactionlist/TransactionRow.es.js";
-import j from "../../../common/components/SubheaderRow.es.js";
-import w from "./transactionlist/ZeroState.es.js";
+import k from "../../../common/components/ZeroState.es.js";
+import { useTransactionsUiStore as W } from "../../context/hooks.es.js";
+import j from "./transactionlist/TransactionRow.es.js";
+import w from "../../../common/components/SubheaderRow.es.js";
 import { hasInsetBorder as B, shouldShowDate as T } from "../../utils/Transactions.es.js";
 import i from "react";
 import { observer as G } from "mobx-react-lite";
@@ -17,7 +17,7 @@ import { useVirtualizer as K } from "@tanstack/react-virtual";
 var _ = 65, v = 32, M = ({ bgcolor: x, filter: s, height: E = "calc(100dvh - 36px)", loader: I = /* @__PURE__ */ o(U, {
   label: "Loading",
   size: 40
-}), onClick: f, showInsights: d = !1, showLoader: l = !1, transaction: p, width: g = "100%", zeroState: A = /* @__PURE__ */ o(w, {}) }) => {
+}), onClick: f, showInsights: d = !1, showLoader: l = !1, transaction: p, width: g = "100%", zeroState: A = /* @__PURE__ */ o(k, {}) }) => {
   const { isLoading: c, sortedTransactions: m } = N(), e = i.useMemo(() => {
     const t = s ? m.filter(s) : m;
     return p ?? t;
@@ -25,7 +25,7 @@ var _ = 65, v = 32, M = ({ bgcolor: x, filter: s, height: E = "calc(100dvh - 36p
     m,
     s,
     p
-  ]), { clearExpandedSplits: C, setShowInsights: R, toggleSplit: b } = k(), { onEvent: D } = z(), L = (t) => {
+  ]), { clearExpandedSplits: C, setShowInsights: R, toggleSplit: b } = W(), { onEvent: D } = z(), L = (t) => {
     const r = e.find((a) => a.guid === t);
     if (r?.has_been_split) {
       b(r.guid);
@@ -71,11 +71,11 @@ var _ = 65, v = 32, M = ({ bgcolor: x, filter: s, height: E = "calc(100dvh - 36p
                 bgcolor: "background.paper"
               },
               children: [
-                a && /* @__PURE__ */ o(j, {
+                a && /* @__PURE__ */ o(w, {
                   bgcolor: x,
                   children: H(r.date)
                 }),
-                /* @__PURE__ */ o(W, {
+                /* @__PURE__ */ o(j, {
                   component: "div",
                   ...f && { onClick: L },
                   transaction: r

package/dist/transactions/components/shared/TransactionList.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionList.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionList.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { useVirtualizer } from '@tanstack/react-virtual'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\n\nimport { ANALYTICS_EVENTS, Loader, useEvent } from '../../../common'\nimport { type Transaction } from '../../../core'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\nimport { useTransactionStore } from '../../../common'\n\nimport SubheaderRow from '../../../common/components/SubheaderRow'\nimport TransactionRow from './transactionlist/TransactionRow'\nimport ZeroState from './transactionlist/ZeroState'\n\nimport { hasInsetBorder, shouldShowDate } from '../../utils/Transactions'\nimport { fromUnixUTCToDayOfWeekAndDate } from '../../../core/utils/DateUtil'\n\nconst ROW_HEIGHT = 65\nconst DATE_ROW_HEIGHT = 32\n\nexport interface TransactionListProps {\n  bgcolor?: string\n  filter?: (t: Transaction) => boolean\n  height?: number | string\n  loader?: React.JSX.Element\n  onClick?: (guid: string) => void\n  showInsights?: boolean\n  showLoader?: boolean\n  transaction?: Transaction[]\n  width?: number | string\n  zeroState?: React.JSX.Element\n}\n\nconst TransactionList: React.FC<TransactionListProps> = ({\n  bgcolor,\n  filter,\n  height = 'calc(100dvh - 36px)',\n  loader = <Loader label=\"Loading\" size={40} />,\n  onClick,\n  showInsights = false,\n  showLoader = false,\n  transaction,\n  width = '100%',\n  zeroState = <ZeroState />,\n}) => {\n  const { isLoading, sortedTransactions: allTransactions } = useTransactionStore()\n  const transactions = React.useMemo(() => {\n    const updatedTransactions = filter ? allTransactions.filter(filter) : allTransactions\n    return transaction ?? updatedTransactions\n  }, [allTransactions, filter, transaction])\n\n  const { clearExpandedSplits, setShowInsights, toggleSplit } = useTransactionsUiStore()\n  const { onEvent } = useEvent()\n\n  const handleClick = (guid: string) => {\n    const transaction = transactions.find((t) => t.guid === guid)\n\n    if (transaction?.has_been_split) {\n      toggleSplit(transaction.guid)\n      return\n    }\n\n    onEvent(ANALYTICS_EVENTS.ACCOUNT_DETAILS_CLICK_TRANSACTION, {\n      account_guid: transaction?.account_guid,\n      transaction_guid: guid,\n    })\n    onClick?.(guid)\n  }\n\n  const parentRef = React.useRef<HTMLDivElement>(null)\n  const rowVirtualizer = useVirtualizer({\n    count: transactions.length,\n    getScrollElement: () => parentRef.current,\n    estimateSize: (i) => ROW_HEIGHT + (shouldShowDate(i, transactions) ? DATE_ROW_HEIGHT : 0),\n    overscan: 5,\n  })\n\n  React.useEffect(() => rowVirtualizer.measure(), [transactions])\n  React.useEffect(() => setShowInsights(showInsights), [showInsights])\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  return (\n    <List component=\"div\" role=\"list\" sx={{ width: width }}>\n      <Box height={height} overflow=\"auto\" ref={parentRef} role=\"presentation\" width={width}>\n        <Box\n          height={\n            // set the height to auto when there are no transactions so the zero state isn't set to 0\n            rowVirtualizer.getVirtualItems().length === 0 ? 'auto' : rowVirtualizer.getTotalSize()\n          }\n          position=\"relative\"\n          role=\"presentation\"\n          width=\"100%\"\n        >\n          {(isLoading || showLoader) && loader}\n          {!isLoading && !showLoader && rowVirtualizer.getVirtualItems().length === 0 && zeroState}\n          {!isLoading &&\n            !showLoader &&\n            rowVirtualizer.getVirtualItems().length > 0 &&\n            rowVirtualizer.getVirtualItems().map((row) => {\n              const transaction = transactions[row.index]\n              const showDate = shouldShowDate(row.index, transactions)\n              const isInset = hasInsetBorder(row.index, transactions)\n              const rowHeight = ROW_HEIGHT + (showDate ? DATE_ROW_HEIGHT : 0)\n\n              return (\n                <Box\n                  key={transaction.guid}\n                  role=\"listitem\"\n                  sx={{\n                    height: rowHeight,\n                    position: 'absolute',\n                    transform: `translateY(${row.start}px)`,\n                    width: '100%',\n                    bgcolor: 'background.paper',\n                  }}\n                >\n                  {showDate && (\n                    <SubheaderRow bgcolor={bgcolor}>\n                      {fromUnixUTCToDayOfWeekAndDate(transaction.date)}\n                    </SubheaderRow>\n                  )}\n                  <TransactionRow\n                    component=\"div\"\n                    {...(onClick && { onClick: handleClick })}\n                    transaction={transaction}\n                  />\n                  <Divider sx={{ ml: isInset ? 68 : 0 }} />\n                </Box>\n              )\n            })}\n        </Box>\n      </Box>\n    </List>\n  )\n}\n\nexport default observer(TransactionList)\n"],"mappings":"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"}
+{"version":3,"file":"TransactionList.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionList.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { useVirtualizer } from '@tanstack/react-virtual'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\n\nimport { ANALYTICS_EVENTS, Loader, useEvent, ZeroState } from '../../../common'\nimport { type Transaction } from '../../../core'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\nimport { useTransactionStore } from '../../../common'\n\nimport SubheaderRow from '../../../common/components/SubheaderRow'\nimport TransactionRow from './transactionlist/TransactionRow'\n\nimport { hasInsetBorder, shouldShowDate } from '../../utils/Transactions'\nimport { fromUnixUTCToDayOfWeekAndDate } from '../../../core/utils/DateUtil'\n\nconst ROW_HEIGHT = 65\nconst DATE_ROW_HEIGHT = 32\n\nexport interface TransactionListProps {\n  bgcolor?: string\n  filter?: (t: Transaction) => boolean\n  height?: number | string\n  loader?: React.JSX.Element\n  onClick?: (guid: string) => void\n  showInsights?: boolean\n  showLoader?: boolean\n  transaction?: Transaction[]\n  width?: number | string\n  zeroState?: React.JSX.Element\n}\n\nconst TransactionList: React.FC<TransactionListProps> = ({\n  bgcolor,\n  filter,\n  height = 'calc(100dvh - 36px)',\n  loader = <Loader label=\"Loading\" size={40} />,\n  onClick,\n  showInsights = false,\n  showLoader = false,\n  transaction,\n  width = '100%',\n  zeroState = <ZeroState />,\n}) => {\n  const { isLoading, sortedTransactions: allTransactions } = useTransactionStore()\n  const transactions = React.useMemo(() => {\n    const updatedTransactions = filter ? allTransactions.filter(filter) : allTransactions\n    return transaction ?? updatedTransactions\n  }, [allTransactions, filter, transaction])\n\n  const { clearExpandedSplits, setShowInsights, toggleSplit } = useTransactionsUiStore()\n  const { onEvent } = useEvent()\n\n  const handleClick = (guid: string) => {\n    const transaction = transactions.find((t) => t.guid === guid)\n\n    if (transaction?.has_been_split) {\n      toggleSplit(transaction.guid)\n      return\n    }\n\n    onEvent(ANALYTICS_EVENTS.ACCOUNT_DETAILS_CLICK_TRANSACTION, {\n      account_guid: transaction?.account_guid,\n      transaction_guid: guid,\n    })\n    onClick?.(guid)\n  }\n\n  const parentRef = React.useRef<HTMLDivElement>(null)\n  const rowVirtualizer = useVirtualizer({\n    count: transactions.length,\n    getScrollElement: () => parentRef.current,\n    estimateSize: (i) => ROW_HEIGHT + (shouldShowDate(i, transactions) ? DATE_ROW_HEIGHT : 0),\n    overscan: 5,\n  })\n\n  React.useEffect(() => rowVirtualizer.measure(), [transactions])\n  React.useEffect(() => setShowInsights(showInsights), [showInsights])\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  return (\n    <List component=\"div\" role=\"list\" sx={{ width: width }}>\n      <Box height={height} overflow=\"auto\" ref={parentRef} role=\"presentation\" width={width}>\n        <Box\n          height={\n            // set the height to auto when there are no transactions so the zero state isn't set to 0\n            rowVirtualizer.getVirtualItems().length === 0 ? 'auto' : rowVirtualizer.getTotalSize()\n          }\n          position=\"relative\"\n          role=\"presentation\"\n          width=\"100%\"\n        >\n          {(isLoading || showLoader) && loader}\n          {!isLoading && !showLoader && rowVirtualizer.getVirtualItems().length === 0 && zeroState}\n          {!isLoading &&\n            !showLoader &&\n            rowVirtualizer.getVirtualItems().length > 0 &&\n            rowVirtualizer.getVirtualItems().map((row) => {\n              const transaction = transactions[row.index]\n              const showDate = shouldShowDate(row.index, transactions)\n              const isInset = hasInsetBorder(row.index, transactions)\n              const rowHeight = ROW_HEIGHT + (showDate ? DATE_ROW_HEIGHT : 0)\n\n              return (\n                <Box\n                  key={transaction.guid}\n                  role=\"listitem\"\n                  sx={{\n                    height: rowHeight,\n                    position: 'absolute',\n                    transform: `translateY(${row.start}px)`,\n                    width: '100%',\n                    bgcolor: 'background.paper',\n                  }}\n                >\n                  {showDate && (\n                    <SubheaderRow bgcolor={bgcolor}>\n                      {fromUnixUTCToDayOfWeekAndDate(transaction.date)}\n                    </SubheaderRow>\n                  )}\n                  <TransactionRow\n                    component=\"div\"\n                    {...(onClick && { onClick: handleClick })}\n                    transaction={transaction}\n                  />\n                  <Divider sx={{ ml: isInset ? 68 : 0 }} />\n                </Box>\n              )\n            })}\n        </Box>\n      </Box>\n    </List>\n  )\n}\n\nexport default observer(TransactionList)\n"],"mappings":"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"}

package/dist/trends/components/trendstable/TrendsTable.es.js

@@ -1,42 +1,46 @@
-import { CategoryGuidToName as m } from "../../../core/constants/Category.es.js";
-import { useEvent as g } from "../../../common/context/hooks.es.js";
+import { CategoryGuidToName as g } from "../../../core/constants/Category.es.js";
+import { useEvent as f } from "../../../common/context/hooks.es.js";
 import { ANALYTICS_EVENTS as b } from "../../../common/constants/Analytics.es.js";
-import { TRENDS_ANALYTICS_METADATA as f } from "../../constants/TrendsWidget.es.js";
-import { AccessibleSortIcon as p } from "./AccessibleSortIcon.es.js";
-import { jsx as T } from "react/jsx-runtime";
+import p from "../../../common/components/ZeroState.es.js";
+import { TRENDS_ANALYTICS_METADATA as T } from "../../constants/TrendsWidget.es.js";
+import { AccessibleSortIcon as y } from "./AccessibleSortIcon.es.js";
+import { jsx as d } from "react/jsx-runtime";
 import { useTheme as _ } from "@mui/material/styles";
-import { DataGridPro as y } from "@mui/x-data-grid-pro";
-var t = (e) => e.id !== "total" && !e.isParent, D = ({ columns: e, onRowClick: i, rows: d, totalRow: a }) => {
-  const l = _(), { onEvent: u } = g(), n = l.palette.mode === "light", c = !!i, s = (r) => {
-    t(r) && (i?.(r.category_guid), u(b.TRENDS_CLICK_LIST_ITEM, {
-      ...f,
-      listItem: m[r.category_guid] ?? r.category,
-      destination: r.top_level_category_guid === r.category_guid ? "drill_down" : "drawer"
+import { DataGridPro as v } from "@mui/x-data-grid-pro";
+var S = () => /* @__PURE__ */ d(p, {}), t = (r) => r.id !== "total" && !r.isParent, M = ({ columns: r, onRowClick: i, rows: a, totalRow: n }) => {
+  const u = _(), { onEvent: c } = f(), s = u.palette.mode === "light", m = !!i, l = (e) => {
+    t(e) && (i?.(e.category_guid), c(b.TRENDS_CLICK_LIST_ITEM, {
+      ...T,
+      listItem: g[e.category_guid] ?? e.category,
+      destination: e.top_level_category_guid === e.category_guid ? "drill_down" : "drawer"
     }));
   };
-  return /* @__PURE__ */ T(y, {
+  return /* @__PURE__ */ d(v, {
     autoHeight: !0,
-    columns: e,
+    columns: r,
     disableColumnFilter: !0,
     disableColumnMenu: !0,
-    getRowClassName: (r) => t(r.row) ? "" : "trends-row-static",
+    getRowClassName: (e) => t(e.row) ? "" : "trends-row-static",
     hideFooter: !0,
     initialState: { sorting: { sortModel: [{
       field: "category",
       sort: "asc"
     }] } },
-    onCellKeyDown: (r, o) => {
-      o.key !== "Enter" && o.key !== " " || t(r.row) && (o.preventDefault(), s(r.row));
+    onCellKeyDown: (e, o) => {
+      o.key !== "Enter" && o.key !== " " || t(e.row) && (o.preventDefault(), l(e.row));
     },
-    onRowClick: (r) => s(r.row),
-    pinnedRows: { bottom: a ? [a] : [] },
+    onRowClick: (e) => l(e.row),
+    pinnedRows: { bottom: n && a.length > 0 ? [n] : [] },
     rowHeight: 64,
-    rows: d,
+    rows: a,
     slotProps: { baseIconButton: {
       color: "secondary",
       sx: { ml: 8 }
     } },
-    slots: { columnHeaderSortIcon: p },
+    slots: {
+      columnHeaderSortIcon: y,
+      noRowsOverlay: S
+    },
     sortingOrder: ["asc", "desc"],
     sx: {
       borderColor: "divider",
@@ -44,17 +48,17 @@ var t = (e) => e.id !== "total" && !e.isParent, D = ({ columns: e, onRowClick: i
       borderStyle: "solid",
       borderRadius: 2,
       "& .MuiDataGrid-columnHeaders": {
-        bgcolor: n ? "neutral.50" : "neutral.800",
+        bgcolor: s ? "neutral.50" : "neutral.800",
         borderBottom: "none"
       },
-      "& .trends-table-header": { bgcolor: n ? "neutral.50" : "neutral.800" },
-      "& .MuiDataGrid-row": { cursor: c ? "pointer" : "default" },
+      "& .trends-table-header": { bgcolor: s ? "neutral.50" : "neutral.800" },
+      "& .MuiDataGrid-row": { cursor: m ? "pointer" : "default" },
       "& .trends-row-static": { cursor: "default" }
     }
   });
 };
 export {
-  D as TrendsTable
+  M as TrendsTable
 };
 
 //# sourceMappingURL=TrendsTable.es.js.map

package/dist/trends/components/trendstable/TrendsTable.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrendsTable.es.js","names":[],"sources":["../../../../src/trends/components/trendstable/TrendsTable.tsx"],"sourcesContent":["import { ANALYTICS_EVENTS, useEvent } from '../../../common'\nimport { CategoryGuidToName } from '../../../core/constants'\nimport { TRENDS_ANALYTICS_METADATA } from '../../constants/TrendsWidget'\nimport { DataGridPro, GridColDef } from '@mui/x-data-grid-pro'\nimport { useTheme } from '@mui/material/styles'\nimport { TrendsTableRow } from '../../utils/TrendsTable'\nimport { AccessibleSortIcon } from './AccessibleSortIcon'\n\ninterface TrendsTableProps {\n  columns: GridColDef[]\n  onRowClick?: (category: string) => void\n  rows: TrendsTableRow[]\n  totalRow?: TrendsTableRow\n}\n\n// The pinned total row and the synthetic \"General [Parent]\" row (isParent: true,\n// only present in a drilled-in table) are summaries, not navigation destinations.\nconst isRowNavigable = (row: TrendsTableRow) => row.id !== 'total' && !row.isParent\n\nexport const TrendsTable = ({ columns, onRowClick, rows, totalRow }: TrendsTableProps) => {\n  const theme = useTheme()\n  const { onEvent } = useEvent()\n  const isLightMode = theme.palette.mode === 'light'\n  const isRowInteractive = Boolean(onRowClick)\n\n  // Shared by pointer and keyboard activation; non-navigable rows are dropped so\n  // neither path acts on them.\n  const activateRow = (row: TrendsTableRow) => {\n    if (!isRowNavigable(row)) return\n    onRowClick?.(row.category_guid)\n    onEvent(ANALYTICS_EVENTS.TRENDS_CLICK_LIST_ITEM, {\n      ...TRENDS_ANALYTICS_METADATA,\n      // Fall back to the row's display name for user-created categories, which\n      // are absent from the static default-category map.\n      listItem: CategoryGuidToName[row.category_guid] ?? row.category,\n      // A top-level row (guid is its own top level) drills down; a sub-category\n      // row opens the drawer.\n      destination: row.top_level_category_guid === row.category_guid ? 'drill_down' : 'drawer',\n    })\n  }\n\n  return (\n    <DataGridPro\n      // autoHeight sizes the grid to its content instead of measuring a flex\n      // parent. The parent is an overflow:auto Stack with no fixed height, so the\n      // default virtualized layout makes x-data-grid's useGridDimensions loop on\n      // its own ResizeObserver measurement (a feedback loop that spikes to React's\n      // \"Maximum update depth exceeded\" under a starved CI worker in jsdom). Content\n      // sizing removes the measurement feedback and is correct for this unbounded,\n      // page-scrolling table.\n      autoHeight={true}\n      columns={columns}\n      disableColumnFilter={true}\n      disableColumnMenu={true}\n      getRowClassName={(params) => (isRowNavigable(params.row) ? '' : 'trends-row-static')}\n      hideFooter={true}\n      initialState={{ sorting: { sortModel: [{ field: 'category', sort: 'asc' }] } }}\n      onCellKeyDown={(params, event) => {\n        // Rows are reachable only by grid cell navigation, so Enter/Space on a\n        // cell is the keyboard equivalent of clicking the row. Guard before\n        // preventDefault so a non-navigable row keeps the grid's native key\n        // handling instead of being swallowed with no action. Space would\n        // otherwise scroll the grid.\n        if (event.key !== 'Enter' && event.key !== ' ') return\n        if (!isRowNavigable(params.row)) return\n        event.preventDefault()\n        activateRow(params.row)\n      }}\n      onRowClick={(r) => activateRow(r.row)}\n      pinnedRows={{\n        bottom: totalRow ? [totalRow] : [],\n      }}\n      rowHeight={64}\n      rows={rows}\n      slotProps={{ baseIconButton: { color: 'secondary', sx: { ml: 8 } } }}\n      slots={{ columnHeaderSortIcon: AccessibleSortIcon }}\n      sortingOrder={['asc', 'desc']}\n      sx={{\n        borderColor: 'divider',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        borderRadius: 2,\n        '& .MuiDataGrid-columnHeaders': {\n          bgcolor: isLightMode ? 'neutral.50' : 'neutral.800',\n          borderBottom: 'none',\n        },\n        '& .trends-table-header': {\n          bgcolor: isLightMode ? 'neutral.50' : 'neutral.800',\n        },\n        '& .MuiDataGrid-row': { cursor: isRowInteractive ? 'pointer' : 'default' },\n        // getRowClassName stamps trends-row-static on every non-navigable row,\n        // including the pinned total row.\n        '& .trends-row-static': { cursor: 'default' },\n      }}\n    />\n  )\n}\n"],"mappings":";;;;;;;;AAiBA,IAAM,IAAA,CAAkB,MAAwB,EAAI,OAAO,WAAW,CAAC,EAAI,UAE9D,IAAA,CAAe,EAAE,SAAA,GAAS,YAAA,GAAY,MAAA,GAAM,UAAA,EAAA,MAAiC;AACxF,QAAM,IAAQ,EAAS,GACjB,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,IAAc,EAAM,QAAQ,SAAS,SACrC,IAAmB,EAAQ,GAI3B,IAAA,CAAe,MAAwB;AAC3C,IAAK,EAAe,CAAG,MACvB,IAAa,EAAI,aAAa,GAC9B,EAAQ,EAAiB,wBAAwB;AAAA,MAC/C,GAAG;AAAA,MAGH,UAAU,EAAmB,EAAI,aAAA,KAAkB,EAAI;AAAA,MAGvD,aAAa,EAAI,4BAA4B,EAAI,gBAAgB,eAAe;AAAA,IAClF,CAAC;AAAA,EACH;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAQE,YAAY;AAAA,IACH,SAAA;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,iBAAA,CAAkB,MAAY,EAAe,EAAO,GAAG,IAAI,KAAK;AAAA,IAChE,YAAY;AAAA,IACZ,cAAc,EAAE,SAAS,EAAE,WAAW,CAAC;AAAA,MAAE,OAAO;AAAA,MAAY,MAAM;AAAA,IAAM,CAAC,EAAE,EAAE;AAAA,IAC7E,eAAA,CAAgB,GAAQ,MAAU;AAMhC,MAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,OACtC,EAAe,EAAO,GAAG,MAC9B,EAAM,eAAe,GACrB,EAAY,EAAO,GAAG;AAAA,IACxB;AAAA,IACA,YAAA,CAAa,MAAM,EAAY,EAAE,GAAG;AAAA,IACpC,YAAY,EACV,QAAQ,IAAW,CAAC,CAAQ,IAAI,CAAC,EACnC;AAAA,IACA,WAAW;AAAA,IACL,MAAA;AAAA,IACN,WAAW,EAAE,gBAAgB;AAAA,MAAE,OAAO;AAAA,MAAa,IAAI,EAAE,IAAI,EAAE;AAAA,IAAE,EAAE;AAAA,IACnE,OAAO,EAAE,sBAAsB,EAAmB;AAAA,IAClD,cAAc,CAAC,OAAO,MAAM;AAAA,IAC5B,IAAI;AAAA,MACF,aAAa;AAAA,MACb,aAAa;AAAA,MACb,aAAa;AAAA,MACb,cAAc;AAAA,MACd,gCAAgC;AAAA,QAC9B,SAAS,IAAc,eAAe;AAAA,QACtC,cAAc;AAAA,MAChB;AAAA,MACA,0BAA0B,EACxB,SAAS,IAAc,eAAe,cACxC;AAAA,MACA,sBAAsB,EAAE,QAAQ,IAAmB,YAAY,UAAU;AAAA,MAGzE,wBAAwB,EAAE,QAAQ,UAAU;AAAA,IAC9C;AAAA,EACD,CAAA;AAEL"}
+{"version":3,"file":"TrendsTable.es.js","names":[],"sources":["../../../../src/trends/components/trendstable/TrendsTable.tsx"],"sourcesContent":["import { ANALYTICS_EVENTS, useEvent, ZeroState } from '../../../common'\nimport { CategoryGuidToName } from '../../../core/constants'\nimport { TRENDS_ANALYTICS_METADATA } from '../../constants/TrendsWidget'\nimport { DataGridPro, GridColDef } from '@mui/x-data-grid-pro'\nimport { useTheme } from '@mui/material/styles'\nimport { TrendsTableRow } from '../../utils/TrendsTable'\nimport { AccessibleSortIcon } from './AccessibleSortIcon'\n\n// The grid's default no-rows overlay is a bare \"No rows\". Render the same shared\n// zero state the app's other empty lists use instead. Wrapped because the\n// slot's prop type doesn't match ZeroState's; positioning is handled by the\n// grid's own overlay wrapper.\nconst TrendsTableNoRowsOverlay = () => <ZeroState />\n\ninterface TrendsTableProps {\n  columns: GridColDef[]\n  onRowClick?: (category: string) => void\n  rows: TrendsTableRow[]\n  totalRow?: TrendsTableRow\n}\n\n// The pinned total row and the synthetic \"General [Parent]\" row (isParent: true,\n// only present in a drilled-in table) are summaries, not navigation destinations.\nconst isRowNavigable = (row: TrendsTableRow) => row.id !== 'total' && !row.isParent\n\nexport const TrendsTable = ({ columns, onRowClick, rows, totalRow }: TrendsTableProps) => {\n  const theme = useTheme()\n  const { onEvent } = useEvent()\n  const isLightMode = theme.palette.mode === 'light'\n  const isRowInteractive = Boolean(onRowClick)\n\n  // Shared by pointer and keyboard activation; non-navigable rows are dropped so\n  // neither path acts on them.\n  const activateRow = (row: TrendsTableRow) => {\n    if (!isRowNavigable(row)) return\n    onRowClick?.(row.category_guid)\n    onEvent(ANALYTICS_EVENTS.TRENDS_CLICK_LIST_ITEM, {\n      ...TRENDS_ANALYTICS_METADATA,\n      // Fall back to the row's display name for user-created categories, which\n      // are absent from the static default-category map.\n      listItem: CategoryGuidToName[row.category_guid] ?? row.category,\n      // A top-level row (guid is its own top level) drills down; a sub-category\n      // row opens the drawer.\n      destination: row.top_level_category_guid === row.category_guid ? 'drill_down' : 'drawer',\n    })\n  }\n\n  return (\n    <DataGridPro\n      // autoHeight sizes the grid to its content instead of measuring a flex\n      // parent. The parent is an overflow:auto Stack with no fixed height, so the\n      // default virtualized layout makes x-data-grid's useGridDimensions loop on\n      // its own ResizeObserver measurement (a feedback loop that spikes to React's\n      // \"Maximum update depth exceeded\" under a starved CI worker in jsdom). Content\n      // sizing removes the measurement feedback and is correct for this unbounded,\n      // page-scrolling table.\n      autoHeight={true}\n      columns={columns}\n      disableColumnFilter={true}\n      disableColumnMenu={true}\n      getRowClassName={(params) => (isRowNavigable(params.row) ? '' : 'trends-row-static')}\n      hideFooter={true}\n      initialState={{ sorting: { sortModel: [{ field: 'category', sort: 'asc' }] } }}\n      onCellKeyDown={(params, event) => {\n        // Rows are reachable only by grid cell navigation, so Enter/Space on a\n        // cell is the keyboard equivalent of clicking the row. Guard before\n        // preventDefault so a non-navigable row keeps the grid's native key\n        // handling instead of being swallowed with no action. Space would\n        // otherwise scroll the grid.\n        if (event.key !== 'Enter' && event.key !== ' ') return\n        if (!isRowNavigable(params.row)) return\n        event.preventDefault()\n        activateRow(params.row)\n      }}\n      onRowClick={(r) => activateRow(r.row)}\n      pinnedRows={{\n        // A pinned \"Total $0.00\" is meaningless with no rows above it, and while it\n        // is present the grid suppresses the no-rows overlay entirely. Drop it so the\n        // empty table shows the zero state instead.\n        bottom: totalRow && rows.length > 0 ? [totalRow] : [],\n      }}\n      rowHeight={64}\n      rows={rows}\n      slotProps={{ baseIconButton: { color: 'secondary', sx: { ml: 8 } } }}\n      slots={{\n        columnHeaderSortIcon: AccessibleSortIcon,\n        noRowsOverlay: TrendsTableNoRowsOverlay,\n      }}\n      sortingOrder={['asc', 'desc']}\n      sx={{\n        borderColor: 'divider',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        borderRadius: 2,\n        '& .MuiDataGrid-columnHeaders': {\n          bgcolor: isLightMode ? 'neutral.50' : 'neutral.800',\n          borderBottom: 'none',\n        },\n        '& .trends-table-header': {\n          bgcolor: isLightMode ? 'neutral.50' : 'neutral.800',\n        },\n        '& .MuiDataGrid-row': { cursor: isRowInteractive ? 'pointer' : 'default' },\n        // getRowClassName stamps trends-row-static on every non-navigable row,\n        // including the pinned total row.\n        '& .trends-row-static': { cursor: 'default' },\n      }}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AAYA,IAAM,IAAA,MAAiC,gBAAA,EAAC,GAAD,CAAY,CAAA,GAW7C,IAAA,CAAkB,MAAwB,EAAI,OAAO,WAAW,CAAC,EAAI,UAE9D,IAAA,CAAe,EAAE,SAAA,GAAS,YAAA,GAAY,MAAA,GAAM,UAAA,EAAA,MAAiC;AACxF,QAAM,IAAQ,EAAS,GACjB,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,IAAc,EAAM,QAAQ,SAAS,SACrC,IAAmB,EAAQ,GAI3B,IAAA,CAAe,MAAwB;AAC3C,IAAK,EAAe,CAAG,MACvB,IAAa,EAAI,aAAa,GAC9B,EAAQ,EAAiB,wBAAwB;AAAA,MAC/C,GAAG;AAAA,MAGH,UAAU,EAAmB,EAAI,aAAA,KAAkB,EAAI;AAAA,MAGvD,aAAa,EAAI,4BAA4B,EAAI,gBAAgB,eAAe;AAAA,IAClF,CAAC;AAAA,EACH;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAQE,YAAY;AAAA,IACH,SAAA;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,iBAAA,CAAkB,MAAY,EAAe,EAAO,GAAG,IAAI,KAAK;AAAA,IAChE,YAAY;AAAA,IACZ,cAAc,EAAE,SAAS,EAAE,WAAW,CAAC;AAAA,MAAE,OAAO;AAAA,MAAY,MAAM;AAAA,IAAM,CAAC,EAAE,EAAE;AAAA,IAC7E,eAAA,CAAgB,GAAQ,MAAU;AAMhC,MAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,OACtC,EAAe,EAAO,GAAG,MAC9B,EAAM,eAAe,GACrB,EAAY,EAAO,GAAG;AAAA,IACxB;AAAA,IACA,YAAA,CAAa,MAAM,EAAY,EAAE,GAAG;AAAA,IACpC,YAAY,EAIV,QAAQ,KAAY,EAAK,SAAS,IAAI,CAAC,CAAQ,IAAI,CAAC,EACtD;AAAA,IACA,WAAW;AAAA,IACL,MAAA;AAAA,IACN,WAAW,EAAE,gBAAgB;AAAA,MAAE,OAAO;AAAA,MAAa,IAAI,EAAE,IAAI,EAAE;AAAA,IAAE,EAAE;AAAA,IACnE,OAAO;AAAA,MACL,sBAAsB;AAAA,MACtB,eAAe;AAAA,IACjB;AAAA,IACA,cAAc,CAAC,OAAO,MAAM;AAAA,IAC5B,IAAI;AAAA,MACF,aAAa;AAAA,MACb,aAAa;AAAA,MACb,aAAa;AAAA,MACb,cAAc;AAAA,MACd,gCAAgC;AAAA,QAC9B,SAAS,IAAc,eAAe;AAAA,QACtC,cAAc;AAAA,MAChB;AAAA,MACA,0BAA0B,EACxB,SAAS,IAAc,eAAe,cACxC;AAAA,MACA,sBAAsB,EAAE,QAAQ,IAAmB,YAAY,UAAU;AAAA,MAGzE,wBAAwB,EAAE,QAAQ,UAAU;AAAA,IAC9C;AAAA,EACD,CAAA;AAEL"}

package/package.json

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

package/dist/transactions/components/shared/transactionlist/ZeroState.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ZeroState.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactionlist/ZeroState.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { Receipt as ReceiptOutlinedIcon } from '@mxenabled/mx-icons'\n\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../../../common'\n\ninterface ZeroStateProps {\n  showIcon?: boolean\n  showSubtitle?: boolean\n}\n\nconst ZeroState: React.FC<ZeroStateProps> = ({ showIcon = true, showSubtitle = true }) => {\n  const { transactions: copy } = useGlobalCopyStore()\n\n  return (\n    <Stack alignItems=\"center\" gap={12} height=\"auto\" mb={24} mt={24}>\n      {showIcon && <ReceiptOutlinedIcon color=\"action\" sx={{ fontSize: 32 }} />}\n      <Text bold={true} color=\"text.secondary\" variant=\"body2\">\n        {copy.zero_state_no_transactions}\n      </Text>\n      {showSubtitle && (\n        <Text color=\"text.secondary\" variant=\"caption\">\n          {copy.zero_state_there_are_no_transactions}\n        </Text>\n      )}\n    </Stack>\n  )\n}\n\nexport default observer(ZeroState)\n"],"mappings":";;;;;;;AAgBA,IAAM,IAAA,CAAuC,EAAE,UAAA,IAAW,IAAM,cAAA,IAAe,GAAA,MAAW;AACxF,QAAM,EAAE,cAAc,EAAA,IAAS,EAAmB;AAElD,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,YAAW;AAAA,IAAS,KAAK;AAAA,IAAI,QAAO;AAAA,IAAO,IAAI;AAAA,IAAI,IAAI;AAAA,IAA9D,UAAA;AAAA,MACG,KAAY,gBAAA,EAAC,GAAD;AAAA,QAAqB,OAAM;AAAA,QAAS,IAAI,EAAE,UAAU,GAAG;AAAA,MAAI,CAAA;AAAA,MACxE,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAM;AAAA,QAAM,OAAM;AAAA,QAAiB,SAAQ;AAAA,QAC9C,UAAA,EAAK;AAAA,MACF,CAAA;AAAA,MACL,KACC,gBAAA,EAAC,GAAD;AAAA,QAAM,OAAM;AAAA,QAAiB,SAAQ;AAAA,QAClC,UAAA,EAAK;AAAA,MACF,CAAA;AAAA,IAEH;AAAA;AAEX,GAEA,IAAe,EAAS,CAAS"}