@mx-cartographer/experiences 9.6.2 → 9.6.4

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## [9.6.3] - 10-12-2026
+
+- **ADDED** - `upcoming_bill_block`, `savings_opportunity_block` and `upcoming_subscription_block` component blocks, registered through `BlockType`, the `blocks` registry and the shared `createVariantBlock` dispatcher so a beat's `instance_slot.block` resolves to the matching content card inside `BaseLayout`. Each reuses its already-built content component (`UpcomingBillCard`, `SavingsOpportunityCard`, `SubscriptionHeroCard`) unmodified. `SavingsOpportunityBlock` ships all six Figma states (`{generic, savings, specific} × {safety_net_not_set, safety_net_set}`); `SavingsSafetyNetSet` is the only variant without a secondary CTA. `UpcomingSubscriptionBlock`'s `View Details` secondary CTA wires to the already-registered `recurring_transaction_block` drilldown via `primary_repeating_transaction_guid`. Mock payloads, beats fixtures and Storybook stories for each (WEC-1890).
+
 ## [9.6.2] - 10-12-2026
 
 - **CHANGED** - `AccountSwitchBlock` reads its per-variant props from a new `layout.ts` keyed by `instance_slot.variant` (`account_connect`, `account_connected`, `switch_direct_deposit`), so Switch Direct Deposit's pending state shares the block with Discovered Accounts. `account_connect` now renders the Figma blue slot gradient; unknown variants fall back to it (WEC-1891)

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

@@ -222,8 +222,11 @@ export declare const BlockType: {
     readonly DoubleBarChartBlock: "double_bar_chart_block";
     readonly DoubleProgressBarBlock: "double_progress_bar_block";
     readonly SaveExtraBlock: "save_extra_block";
+    readonly SavingsOpportunityBlock: "savings_opportunity_block";
     readonly StepChartBlock: "step_chart_block";
     readonly SVGImageBlock: "svg_image_block";
+    readonly UpcomingBillBlock: "upcoming_bill_block";
+    readonly UpcomingSubscriptionBlock: "upcoming_subscription_block";
     readonly WithdrawalBlock: "withdrawal_block";
 };
 export type BlockType = (typeof BlockType)[keyof typeof BlockType];
@@ -278,4 +281,21 @@ export interface InstanceSlot {
     status_text?: string;
     institution_guid?: string;
     institution_name?: string;
+    /** Dollar amount (unformatted); the block formats it as currency. */
+    amount?: number;
+    /** Merchant guid used to render the inline / hero logo via `LogoFromGuid` (`MCH-...`). */
+    merchant_guid?: string;
+    /** Merchant display name — shown as logo alt text and as the merchant/hero label. */
+    merchant_name?: string;
+    /** Due date of the projected bill in ISO form (e.g. `2025-10-30`). */
+    due_date?: string;
+    /** Caption shown above the amount, e.g. `Save an extra` or `Potential savings`. */
+    label?: string;
+    /**
+     * Whether to render the green gradient slot behind the coupon. Defaults to true. Backend sends
+     * `false` when the coupon is embedded in a parent surface that supplies its own background.
+     */
+    slot?: boolean;
+    /** Billing cadence word that trails the price, e.g. `month` or `year`. */
+    cadence?: string;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"Insights.es.js","names":[],"sources":["../../../src/core/types/Insights.ts"],"sourcesContent":["// ============ Core InsightsV2 Types ============\n\nimport { InsightsInstanceSlotData } from './InsightsInstanceSlotData'\n\nexport interface ThemedSVGImageProps {\n  divProps?: React.HTMLAttributes<HTMLDivElement>\n  image: React.ComponentType<React.SVGProps<SVGSVGElement>>\n  isMini?: boolean\n}\n\n/**\n * Emitted by a block when the user drills into a specific datum (e.g. clicks a\n * chart bar). Named fields rather than positional args so blocks with differing\n * shapes can extend this without the call sites transposing values.\n */\nexport interface DrilldownPayload {\n  chartBarIndex: number\n  tabIndex?: number\n  transaction_guid?: string\n  block?: string\n}\n\n/**\n * Which envelope a beat was fetched with. `embedded` (the transaction-row pill + details-drawer\n * card) and `notification` are V2 additions; a surface asks for one with `widget_type=` on the fetch.\n */\nexport type WidgetType = 'full' | 'mini' | 'micro' | 'embedded' | 'notification'\n\n/**\n * V2: the transaction-row tag, its own small section of the `embedded` envelope (the same grammar\n * as `description` / `footer`, with room for a tone or an icon later). Omitted for an insight that\n * tags no transaction row. It deliberately is *not* `short_title`, which stays a per-variant\n * attribute with a second consumer (the bank-holiday sub-header).\n */\nexport interface Pill {\n  text: string\n}\n\n/**\n * V2: facts a drilldown shows that the card does not (e.g. the account number for the Transaction\n * Details drawer). A flat hash shared by every CTA of the card, omitted when the insight has none.\n * Never carries copy or user actions (memo, tags, hide, flag come from the transaction store).\n */\nexport type DrilldownData = Record<string, string | number | boolean | null>\n\nexport interface InsightsPayload {\n  widget_type: WidgetType\n  instance_slot: InstanceSlot\n  /**\n   * V1 only. The v2 contract carries everything a block needs on `instance_slot.data`,\n   * and omits this key entirely (see the LargeTransactionV2 payload). Blocks that still require it\n   * get it as a required field through `BlockProps`, which re-declares it.\n   */\n  instance_slot_data?: InsightsInstanceSlotData\n  description: Description\n  primary_cta?: PrimaryCTA\n  secondary_cta?: SecondaryCTA\n  title?: string\n  sub_title?: Subtitle\n  /**\n   * V2 rename of `sub_title`: a flat string, with the logo promoted to the payload-level `logo`\n   * field below. `sub_title` wins when both are present.\n   */\n  subtitle?: string\n  /** V2: header logo paired with the flat `subtitle`: an entity guid or a status icon (`LogoRef`). */\n  logo?: LogoRef\n  /** V2: which design branch the backend picked (e.g. `no_merchant`). */\n  variant?: string\n  /** V2, `embedded` envelope only: the transaction-row pill. */\n  pill?: Pill\n  /** V2: drilldown-only facts, e.g. `{ account_number: 'XXXXXXXX043' }`. */\n  drilldown_data?: DrilldownData\n  footer?: Footer\n  // TODO: Add in_description_cta to insights_payload from backend\n  guid: string\n  user_guid: string\n  client_guid?: string\n  /** Template name, e.g. `LargeTransactionV2`. */\n  template?: string\n  revision?: number\n  /** Unix seconds. */\n  created_at?: number\n  /** Unix seconds. */\n  updated_at?: number\n  /** Unix seconds. */\n  active_at?: number\n  displayed_at?: number | null\n  dismissed_at: number | null\n  cta_clicked_at?: number | null\n  has_been_displayed?: boolean\n  is_dismissed: boolean\n  is_deleted?: boolean\n  is_hidden_by_system?: boolean\n  is_obsolete?: boolean\n  is_refreshable?: boolean\n  is_sampled?: boolean\n  is_zero_state?: boolean\n  status?: string | null\n  /**\n   * V2 (LargeTransactionV2 onward): the entities the beat is about, carried on the payload so\n   * action blocks do not have to reach back out to the beat envelope.\n   */\n  primary_account_guid?: string | null\n  primary_transaction_guid?: string | null\n  primary_category_guid?: string | null\n  primary_merchant_guid?: string | null\n  /**\n   * V2: the repeating transaction a subscription beat is about (Upcoming Subscription, Subscription\n   * Price Increase). Read by `recurring_transaction_block`, see\n   * `actionBlocks/RecurringTransactionBlock/subscriptionBeats.ts`.\n   */\n  primary_repeating_transaction_guid?: string | null\n}\n\nexport interface Legends {\n  label: string\n  value: number\n  additional_value?: number\n  additional_value_type?: string\n  value_type?: string\n}\n\nexport interface Logo {\n  category_guid?: string\n  category_name?: string\n  institution_guid?: string\n  institution_name?: string\n  logo_color?: string\n  logo_name?: string\n  merchant_guid?: string\n  merchant_name?: string\n}\n\nexport interface Subtitle {\n  logo?: Logo\n  text: string\n}\n\n/**\n * A V2 logo, shared by the header (`InsightsPayload.logo`) and every instance-slot row. It takes\n * one of two shapes:\n *\n * - **Entity**: `guid`, whose prefix (`INS-` / `MCH-` / `CAT-`) picks the logo component, plus an\n *   optional `fallback_guid` for when that component's asset cannot load. Today that is the\n *   category behind an `MCH-` guid, which `MerchantLogo` shows as a tile when the merchant image\n *   is missing.\n * - **Status icon**: `icon` (an mx-icons name, e.g. `warning`) and `color` (a theme palette path,\n *   e.g. `error.main`), for subheaders that show a state rather than an entity (V1's\n *   `logo_name` / `logo_color`).\n *\n * `alt` is the accessible name for either shape. A logo sends one shape; if it sends both, `icon`\n * wins, as `logo_name` does in V1's `SubHeader`.\n */\nexport interface LogoRef {\n  alt?: string\n  color?: string\n  fallback_guid?: string\n  guid?: string\n  icon?: string\n}\n\nexport interface CategoryLogo {\n  category_guid: string\n  category_name: string\n}\n\nexport interface MerchantLogo {\n  merchant_guid: string\n  merchant_name: string\n}\n\nexport interface InstitutionLogo {\n  institution_guid: string\n  institution_name: string\n}\n\nexport interface Description {\n  text: string\n  html_text: string\n}\n\n/**\n * Post message a CTA press sends to the host, resolved by the backend for the beat's current\n * state. Absent/null = the backend has not described one: the frontend uses the template's\n * interim `ctaPostMessages` entry if there is one, else sends no message. `payload` carries only\n * beat-specific extras; the frontend always adds `beat_guid`, `beat_template`, `user_guid` and\n * `action_string`.\n */\nexport interface CtaPostMessageMetadata {\n  /** Post message event; defaults to `beat/cta`. */\n  event?: string | null\n  /** Operation the host should perform, e.g. `op_1`, `op_2`, `op_3`. Defaults to `op_1`. */\n  action?: string | null\n  /** Beat-specific fields merged into the message metadata (account ids, amounts, ...). */\n  payload?: Record<string, unknown> | null\n}\n\nexport interface PrimaryCTA {\n  label: string\n  block: string\n  variant?: string | null\n  /**\n   * What pressing the CTA does beyond opening its block, named by the backend (ditto\n   * `primary_cta_action`, passed through by tupac). Looked up in `insights-v2/ctaActions`;\n   * null / absent / unknown means the CTA only opens its block or posts its message.\n   */\n  action_key?: string | null\n  metadata?: CtaPostMessageMetadata | null\n}\n\nexport interface SecondaryCTA {\n  label: string\n  block: string\n  variant?: string | null\n  /** See `PrimaryCTA.action_key` (ditto `secondary_cta_action`). */\n  action_key?: string | null\n  metadata?: CtaPostMessageMetadata | null\n}\n\nexport interface Footer {\n  /** V1: a pre-formatted date string. */\n  date?: string\n  /**\n   * The account label, on both V1 and V2. The backend resolves the plurality: one account sends\n   * its name (e.g. `Epic Bank`), several send a localized count (e.g. `2 Accounts`), none sends\n   * nothing. There is deliberately no separate `accounts` key — see tupac's `footer_account_label`.\n   */\n  account?: string\n  /**\n   * V2 (LargeTransactionV2 onward): unix seconds, formatted by `Footer` for display.\n   * Replaces `date`; `date` wins when a beat somehow sends both.\n   */\n  timestamp?: number\n}\n\n// ============ Instance Slot Types ============\n// Values are the snake_case block names the backend sends on a beat's instance slot; the PascalCase\n// keys stay as friendly references (e.g. BlockType.BarChartBlock === 'bar_chart_block').\nexport const BlockType = {\n  AccountBlock: 'account_block',\n  AccountSwitchBlock: 'account_switch_block',\n  BarChartBlock: 'bar_chart_block',\n  BudgetBlock: 'budget_block',\n  ImageBlock: 'image_block',\n  TransactionBlock: 'transaction_block',\n  DonutChartBlock: 'donut_chart_block',\n  DoubleBarChartBlock: 'double_bar_chart_block',\n  DoubleProgressBarBlock: 'double_progress_bar_block',\n  SaveExtraBlock: 'save_extra_block',\n  StepChartBlock: 'step_chart_block',\n  SVGImageBlock: 'svg_image_block',\n  WithdrawalBlock: 'withdrawal_block',\n} as const\n\nexport type BlockType = (typeof BlockType)[keyof typeof BlockType]\n\n/**\n * A pre-localized row on a V2 instance slot. The backend resolves the copy and formatting; the\n * logo is a `LogoRef` (an entity guid or a status icon, see `logoFromRef`).\n */\nexport interface InstanceSlotRow {\n  amount?: number\n  logo?: LogoRef\n  primary_text?: string\n  secondary_text?: string\n}\n\n/**\n * V2: the slots a block's variant filled, keyed by slot name; ditto owns the names and omits any\n * slot it has no value for (`lib/ditto/blocks/<block>.yml`). Read with `slot()`, which names the\n * kind the caller expects.\n */\nexport interface InstanceSlotData {\n  [slot: string]: unknown\n}\n\n/**\n * Reads one slot off a block's `data`; undefined when ditto did not fill it.\n *\n * The caller names the kind, because the slot's kind lives in the block's ditto schema and not\n * here — a block fills slots with whatever its card needs, so no fixed list of kinds would hold\n * (`account_switch_block` alone carries a boolean and `budget_block` a nested object).\n */\nexport const slot = <T = unknown>(\n  data: InstanceSlotData | undefined,\n  name: string,\n): T | undefined => data?.[name] as T | undefined\n\n/**\n * V2: which block renders this beat's content, and what it renders.\n *\n * `block` is optional: a beat whose template has no ditto config arrives as an empty `{}` and the\n * card renders its copy and CTAs alone, so a reader cannot assume a block is named. One interface\n * with `block` optional rather than a union with `Record<string, never>`, which TypeScript absorbs\n * — that union left `block` reading as required and typed a promise it did not keep.\n *\n * `variant` is optional for the same reason — the empty `{}` carries neither. Every ditto beat\n * file that names a block also names a variant, so a *filled* slot always has one; ditto drops a\n * nil variant rather than sending null, which is why the type is `string | null | undefined`.\n */\nexport interface InstanceSlot {\n  block?: BlockType\n  variant?: string | null\n  /** The slots this block's variant declares in ditto. */\n  data?: InstanceSlotData\n  // Direct Deposit block (Set Up Direct Deposit, Switch Direct Deposit, Missing\n  // Interest Rate): account facts carried flat on the slot, beside `data`.\n  /** Primary line on the hero card, e.g. \"Epic Bank Checking, *1234\". */\n  account_name?: string\n  /** Secondary line beneath the name, e.g. \"Checking Account\" / \"Credit Card\". */\n  account_type?: string\n  /** Status pill label, e.g. \"Direct Deposit Not Set Up\" / \"Interest Rate: 19.99% APR\". */\n  status_text?: string\n  institution_guid?: string\n  institution_name?: string\n}\n"],"mappings":"AA2RA,IAAa,IAAA,CACX,GACA,MACkB,IAAO,CAAA"}
+{"version":3,"file":"Insights.es.js","names":[],"sources":["../../../src/core/types/Insights.ts"],"sourcesContent":["// ============ Core InsightsV2 Types ============\n\nimport { InsightsInstanceSlotData } from './InsightsInstanceSlotData'\n\nexport interface ThemedSVGImageProps {\n  divProps?: React.HTMLAttributes<HTMLDivElement>\n  image: React.ComponentType<React.SVGProps<SVGSVGElement>>\n  isMini?: boolean\n}\n\n/**\n * Emitted by a block when the user drills into a specific datum (e.g. clicks a\n * chart bar). Named fields rather than positional args so blocks with differing\n * shapes can extend this without the call sites transposing values.\n */\nexport interface DrilldownPayload {\n  chartBarIndex: number\n  tabIndex?: number\n  transaction_guid?: string\n  block?: string\n}\n\n/**\n * Which envelope a beat was fetched with. `embedded` (the transaction-row pill + details-drawer\n * card) and `notification` are V2 additions; a surface asks for one with `widget_type=` on the fetch.\n */\nexport type WidgetType = 'full' | 'mini' | 'micro' | 'embedded' | 'notification'\n\n/**\n * V2: the transaction-row tag, its own small section of the `embedded` envelope (the same grammar\n * as `description` / `footer`, with room for a tone or an icon later). Omitted for an insight that\n * tags no transaction row. It deliberately is *not* `short_title`, which stays a per-variant\n * attribute with a second consumer (the bank-holiday sub-header).\n */\nexport interface Pill {\n  text: string\n}\n\n/**\n * V2: facts a drilldown shows that the card does not (e.g. the account number for the Transaction\n * Details drawer). A flat hash shared by every CTA of the card, omitted when the insight has none.\n * Never carries copy or user actions (memo, tags, hide, flag come from the transaction store).\n */\nexport type DrilldownData = Record<string, string | number | boolean | null>\n\nexport interface InsightsPayload {\n  widget_type: WidgetType\n  instance_slot: InstanceSlot\n  /**\n   * V1 only. The v2 contract carries everything a block needs on `instance_slot.data`,\n   * and omits this key entirely (see the LargeTransactionV2 payload). Blocks that still require it\n   * get it as a required field through `BlockProps`, which re-declares it.\n   */\n  instance_slot_data?: InsightsInstanceSlotData\n  description: Description\n  primary_cta?: PrimaryCTA\n  secondary_cta?: SecondaryCTA\n  title?: string\n  sub_title?: Subtitle\n  /**\n   * V2 rename of `sub_title`: a flat string, with the logo promoted to the payload-level `logo`\n   * field below. `sub_title` wins when both are present.\n   */\n  subtitle?: string\n  /** V2: header logo paired with the flat `subtitle`: an entity guid or a status icon (`LogoRef`). */\n  logo?: LogoRef\n  /** V2: which design branch the backend picked (e.g. `no_merchant`). */\n  variant?: string\n  /** V2, `embedded` envelope only: the transaction-row pill. */\n  pill?: Pill\n  /** V2: drilldown-only facts, e.g. `{ account_number: 'XXXXXXXX043' }`. */\n  drilldown_data?: DrilldownData\n  footer?: Footer\n  // TODO: Add in_description_cta to insights_payload from backend\n  guid: string\n  user_guid: string\n  client_guid?: string\n  /** Template name, e.g. `LargeTransactionV2`. */\n  template?: string\n  revision?: number\n  /** Unix seconds. */\n  created_at?: number\n  /** Unix seconds. */\n  updated_at?: number\n  /** Unix seconds. */\n  active_at?: number\n  displayed_at?: number | null\n  dismissed_at: number | null\n  cta_clicked_at?: number | null\n  has_been_displayed?: boolean\n  is_dismissed: boolean\n  is_deleted?: boolean\n  is_hidden_by_system?: boolean\n  is_obsolete?: boolean\n  is_refreshable?: boolean\n  is_sampled?: boolean\n  is_zero_state?: boolean\n  status?: string | null\n  /**\n   * V2 (LargeTransactionV2 onward): the entities the beat is about, carried on the payload so\n   * action blocks do not have to reach back out to the beat envelope.\n   */\n  primary_account_guid?: string | null\n  primary_transaction_guid?: string | null\n  primary_category_guid?: string | null\n  primary_merchant_guid?: string | null\n  /**\n   * V2: the repeating transaction a subscription beat is about (Upcoming Subscription, Subscription\n   * Price Increase). Read by `recurring_transaction_block`, see\n   * `actionBlocks/RecurringTransactionBlock/subscriptionBeats.ts`.\n   */\n  primary_repeating_transaction_guid?: string | null\n}\n\nexport interface Legends {\n  label: string\n  value: number\n  additional_value?: number\n  additional_value_type?: string\n  value_type?: string\n}\n\nexport interface Logo {\n  category_guid?: string\n  category_name?: string\n  institution_guid?: string\n  institution_name?: string\n  logo_color?: string\n  logo_name?: string\n  merchant_guid?: string\n  merchant_name?: string\n}\n\nexport interface Subtitle {\n  logo?: Logo\n  text: string\n}\n\n/**\n * A V2 logo, shared by the header (`InsightsPayload.logo`) and every instance-slot row. It takes\n * one of two shapes:\n *\n * - **Entity**: `guid`, whose prefix (`INS-` / `MCH-` / `CAT-`) picks the logo component, plus an\n *   optional `fallback_guid` for when that component's asset cannot load. Today that is the\n *   category behind an `MCH-` guid, which `MerchantLogo` shows as a tile when the merchant image\n *   is missing.\n * - **Status icon**: `icon` (an mx-icons name, e.g. `warning`) and `color` (a theme palette path,\n *   e.g. `error.main`), for subheaders that show a state rather than an entity (V1's\n *   `logo_name` / `logo_color`).\n *\n * `alt` is the accessible name for either shape. A logo sends one shape; if it sends both, `icon`\n * wins, as `logo_name` does in V1's `SubHeader`.\n */\nexport interface LogoRef {\n  alt?: string\n  color?: string\n  fallback_guid?: string\n  guid?: string\n  icon?: string\n}\n\nexport interface CategoryLogo {\n  category_guid: string\n  category_name: string\n}\n\nexport interface MerchantLogo {\n  merchant_guid: string\n  merchant_name: string\n}\n\nexport interface InstitutionLogo {\n  institution_guid: string\n  institution_name: string\n}\n\nexport interface Description {\n  text: string\n  html_text: string\n}\n\n/**\n * Post message a CTA press sends to the host, resolved by the backend for the beat's current\n * state. Absent/null = the backend has not described one: the frontend uses the template's\n * interim `ctaPostMessages` entry if there is one, else sends no message. `payload` carries only\n * beat-specific extras; the frontend always adds `beat_guid`, `beat_template`, `user_guid` and\n * `action_string`.\n */\nexport interface CtaPostMessageMetadata {\n  /** Post message event; defaults to `beat/cta`. */\n  event?: string | null\n  /** Operation the host should perform, e.g. `op_1`, `op_2`, `op_3`. Defaults to `op_1`. */\n  action?: string | null\n  /** Beat-specific fields merged into the message metadata (account ids, amounts, ...). */\n  payload?: Record<string, unknown> | null\n}\n\nexport interface PrimaryCTA {\n  label: string\n  block: string\n  variant?: string | null\n  /**\n   * What pressing the CTA does beyond opening its block, named by the backend (ditto\n   * `primary_cta_action`, passed through by tupac). Looked up in `insights-v2/ctaActions`;\n   * null / absent / unknown means the CTA only opens its block or posts its message.\n   */\n  action_key?: string | null\n  metadata?: CtaPostMessageMetadata | null\n}\n\nexport interface SecondaryCTA {\n  label: string\n  block: string\n  variant?: string | null\n  /** See `PrimaryCTA.action_key` (ditto `secondary_cta_action`). */\n  action_key?: string | null\n  metadata?: CtaPostMessageMetadata | null\n}\n\nexport interface Footer {\n  /** V1: a pre-formatted date string. */\n  date?: string\n  /**\n   * The account label, on both V1 and V2. The backend resolves the plurality: one account sends\n   * its name (e.g. `Epic Bank`), several send a localized count (e.g. `2 Accounts`), none sends\n   * nothing. There is deliberately no separate `accounts` key — see tupac's `footer_account_label`.\n   */\n  account?: string\n  /**\n   * V2 (LargeTransactionV2 onward): unix seconds, formatted by `Footer` for display.\n   * Replaces `date`; `date` wins when a beat somehow sends both.\n   */\n  timestamp?: number\n}\n\n// ============ Instance Slot Types ============\n// Values are the snake_case block names the backend sends on a beat's instance slot; the PascalCase\n// keys stay as friendly references (e.g. BlockType.BarChartBlock === 'bar_chart_block').\nexport const BlockType = {\n  AccountBlock: 'account_block',\n  AccountSwitchBlock: 'account_switch_block',\n  BarChartBlock: 'bar_chart_block',\n  BudgetBlock: 'budget_block',\n  ImageBlock: 'image_block',\n  TransactionBlock: 'transaction_block',\n  DonutChartBlock: 'donut_chart_block',\n  DoubleBarChartBlock: 'double_bar_chart_block',\n  DoubleProgressBarBlock: 'double_progress_bar_block',\n  SaveExtraBlock: 'save_extra_block',\n  SavingsOpportunityBlock: 'savings_opportunity_block',\n  StepChartBlock: 'step_chart_block',\n  SVGImageBlock: 'svg_image_block',\n  UpcomingBillBlock: 'upcoming_bill_block',\n  UpcomingSubscriptionBlock: 'upcoming_subscription_block',\n  WithdrawalBlock: 'withdrawal_block',\n} as const\n\nexport type BlockType = (typeof BlockType)[keyof typeof BlockType]\n\n/**\n * A pre-localized row on a V2 instance slot. The backend resolves the copy and formatting; the\n * logo is a `LogoRef` (an entity guid or a status icon, see `logoFromRef`).\n */\nexport interface InstanceSlotRow {\n  amount?: number\n  logo?: LogoRef\n  primary_text?: string\n  secondary_text?: string\n}\n\n/**\n * V2: the slots a block's variant filled, keyed by slot name; ditto owns the names and omits any\n * slot it has no value for (`lib/ditto/blocks/<block>.yml`). Read with `slot()`, which names the\n * kind the caller expects.\n */\nexport interface InstanceSlotData {\n  [slot: string]: unknown\n}\n\n/**\n * Reads one slot off a block's `data`; undefined when ditto did not fill it.\n *\n * The caller names the kind, because the slot's kind lives in the block's ditto schema and not\n * here — a block fills slots with whatever its card needs, so no fixed list of kinds would hold\n * (`account_switch_block` alone carries a boolean and `budget_block` a nested object).\n */\nexport const slot = <T = unknown>(\n  data: InstanceSlotData | undefined,\n  name: string,\n): T | undefined => data?.[name] as T | undefined\n\n/**\n * V2: which block renders this beat's content, and what it renders.\n *\n * `block` is optional: a beat whose template has no ditto config arrives as an empty `{}` and the\n * card renders its copy and CTAs alone, so a reader cannot assume a block is named. One interface\n * with `block` optional rather than a union with `Record<string, never>`, which TypeScript absorbs\n * — that union left `block` reading as required and typed a promise it did not keep.\n *\n * `variant` is optional for the same reason — the empty `{}` carries neither. Every ditto beat\n * file that names a block also names a variant, so a *filled* slot always has one; ditto drops a\n * nil variant rather than sending null, which is why the type is `string | null | undefined`.\n */\nexport interface InstanceSlot {\n  block?: BlockType\n  variant?: string | null\n  /** The slots this block's variant declares in ditto. */\n  data?: InstanceSlotData\n  // Direct Deposit block (Set Up Direct Deposit, Switch Direct Deposit, Missing\n  // Interest Rate): account facts carried flat on the slot, beside `data`.\n  /** Primary line on the hero card, e.g. \"Epic Bank Checking, *1234\". */\n  account_name?: string\n  /** Secondary line beneath the name, e.g. \"Checking Account\" / \"Credit Card\". */\n  account_type?: string\n  /** Status pill label, e.g. \"Direct Deposit Not Set Up\" / \"Interest Rate: 19.99% APR\". */\n  status_text?: string\n  institution_guid?: string\n  institution_name?: string\n  // Shared across multiple V2 component blocks:\n  //   `amount` — UpcomingBillBlock (projected bill), SavingsOpportunityBlock (coupon),\n  //              UpcomingSubscriptionBlock (price per cadence).\n  //   `merchant_guid` / `merchant_name` — UpcomingBillBlock (bill row logo + name),\n  //              UpcomingSubscriptionBlock (hero logo + name).\n  /** Dollar amount (unformatted); the block formats it as currency. */\n  amount?: number\n  /** Merchant guid used to render the inline / hero logo via `LogoFromGuid` (`MCH-...`). */\n  merchant_guid?: string\n  /** Merchant display name — shown as logo alt text and as the merchant/hero label. */\n  merchant_name?: string\n  // Upcoming Bill block (Projected Bill Payment): the block derives the Sun→Sat week strip\n  // around `due_date` at render time.\n  /** Due date of the projected bill in ISO form (e.g. `2025-10-30`). */\n  due_date?: string\n  // Savings Opportunity block (Save An Extra, Potential Savings, Embedded): purely data-driven\n  // coupon card. Backend sends the caption and the amount, plus `slot` to toggle the green\n  // gradient background when the card is embedded in a parent surface that supplies its own.\n  /** Caption shown above the amount, e.g. `Save an extra` or `Potential savings`. */\n  label?: string\n  /**\n   * Whether to render the green gradient slot behind the coupon. Defaults to true. Backend sends\n   * `false` when the coupon is embedded in a parent surface that supplies its own background.\n   */\n  slot?: boolean\n  // Upcoming Subscription block: billing cadence for the price pill (`${amount} / ${cadence}`).\n  /** Billing cadence word that trails the price, e.g. `month` or `year`. */\n  cadence?: string\n}\n"],"mappings":"AA8RA,IAAa,IAAA,CACX,GACA,MACkB,IAAO,CAAA"}

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.d.ts

@@ -0,0 +1,18 @@
+import { InsightsPayload } from '../../../../core';
+interface SavingsOpportunityBlockProps {
+    payload: InsightsPayload;
+    beatGuid?: string;
+}
+/**
+ * Savings Opportunity component block (Figma frame 1276-45997). Reads `amount`, `label`, and
+ * `slot` off `instance_slot` (V2 flat shape — no `instance_slot_data`), and renders the shared
+ * `SavingsOpportunityCard` wrapped in the standard content-section padding.
+ *
+ * Wrapped in `createVariantBlock` so an added design branch is a new registry entry rather than a
+ * rewrite of dispatch logic. Six variants are defined today, formed by
+ * `{generic, savings, specific} × {safety_net_not_set, safety_net_set}`; copy/CTA differences
+ * live in the payload, not here. An unknown variant degrades to the default
+ * (`generic_safety_net_not_set`).
+ */
+declare const SavingsOpportunityBlock: ({ payload, beatGuid }: SavingsOpportunityBlockProps) => import("react/jsx-runtime").JSX.Element;
+export default SavingsOpportunityBlock;

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js

@@ -0,0 +1,33 @@
+import { formatCurrency as m } from "../../../../core/utils/NumberFormatting.es.js";
+import { createVariantBlock as p } from "../../createVariantBlock.es.js";
+import l from "../../../components/SavingsOpportunityCard.es.js";
+import { savingsOpportunityVariant as c } from "./layout.es.js";
+import v from "@mui/material/Stack";
+import { jsx as o } from "react/jsx-runtime";
+var u = (r) => {
+  const { instance_slot: t } = r, { amount: a, label: i, slot: s } = t, e = s ?? !0;
+  return /* @__PURE__ */ o(v, {
+    sx: { px: 16 },
+    children: /* @__PURE__ */ o(l, {
+      amount: m(a ?? 0, "0,0.00"),
+      label: i ?? "",
+      slot: e
+    })
+  });
+}, n = ({ payload: r }) => u(r), y = ({ payload: r, beatGuid: t }) => {
+  const a = r.instance_slot.variant ?? void 0;
+  return /* @__PURE__ */ o(f, {
+    beatGuid: t,
+    payload: r,
+    variant: a
+  });
+}, f = p({
+  variants: Object.fromEntries(Object.values(c).map((r) => [r, n])),
+  fallback: n,
+  name: "SavingsOpportunityBlock"
+});
+export {
+  y as default
+};
+
+//# sourceMappingURL=SavingsOpportunityBlock.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SavingsOpportunityBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.tsx"],"sourcesContent":["import Stack from '@mui/material/Stack'\n\nimport type { InsightsPayload } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\n\nimport SavingsOpportunityCard from '../../../components/SavingsOpportunityCard'\nimport { createVariantBlock } from '../../createVariantBlock'\n\nimport { savingsOpportunityVariant, type SavingsOpportunityVariant } from './layout'\n\ninterface SavingsOpportunityBlockProps {\n  payload: InsightsPayload\n  beatGuid?: string\n}\n\nconst renderCard = (payload: InsightsPayload) => {\n  const { instance_slot } = payload\n  const { amount, label, slot } = instance_slot\n\n  // Backend-sent `slot` wins; defaults to true so a payload that omits it still shows the gradient.\n  const resolvedSlot = slot ?? true\n\n  return (\n    <Stack sx={{ px: 16 }}>\n      <SavingsOpportunityCard\n        amount={formatCurrency(amount ?? 0, '0,0.00')}\n        label={label ?? ''}\n        slot={resolvedSlot}\n      />\n    </Stack>\n  )\n}\n\n// All six variants ({generic, savings, specific} × {safety_net_not_set, safety_net_set}) share\n// identical card visuals — copy/CTA differences live in the payload. We register the same\n// renderer under every key so the dispatcher still fires on each known variant (and a non-\n// registered backend variant hits the fallback with the standard dev warning from createVariantBlock).\nconst SavingsOpportunityVariantCard = ({ payload }: SavingsOpportunityBlockProps) =>\n  renderCard(payload)\n\n/**\n * Savings Opportunity component block (Figma frame 1276-45997). Reads `amount`, `label`, and\n * `slot` off `instance_slot` (V2 flat shape — no `instance_slot_data`), and renders the shared\n * `SavingsOpportunityCard` wrapped in the standard content-section padding.\n *\n * Wrapped in `createVariantBlock` so an added design branch is a new registry entry rather than a\n * rewrite of dispatch logic. Six variants are defined today, formed by\n * `{generic, savings, specific} × {safety_net_not_set, safety_net_set}`; copy/CTA differences\n * live in the payload, not here. An unknown variant degrades to the default\n * (`generic_safety_net_not_set`).\n */\nconst SavingsOpportunityBlock = ({ payload, beatGuid }: SavingsOpportunityBlockProps) => {\n  const variant = payload.instance_slot.variant ?? undefined\n  return <Variants beatGuid={beatGuid} payload={payload} variant={variant} />\n}\n\nconst Variants = createVariantBlock<SavingsOpportunityBlockProps>({\n  variants: Object.fromEntries(\n    Object.values(savingsOpportunityVariant).map((v) => [v, SavingsOpportunityVariantCard]),\n  ) as Record<SavingsOpportunityVariant, typeof SavingsOpportunityVariantCard>,\n  fallback: SavingsOpportunityVariantCard,\n  name: 'SavingsOpportunityBlock',\n})\n\nexport default SavingsOpportunityBlock\n"],"mappings":";;;;;;AAeA,IAAM,IAAA,CAAc,MAA6B;AAC/C,QAAM,EAAE,eAAA,EAAA,IAAkB,GACpB,EAAE,QAAA,GAAQ,OAAA,GAAO,MAAA,EAAA,IAAS,GAG1B,IAAe,KAAQ;AAE7B,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAE,IAAI,GAAG;AAAA,IAClB,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,QAAQ,EAAe,KAAU,GAAG,QAAQ;AAAA,MAC5C,OAAO,KAAS;AAAA,MAChB,MAAM;AAAA,IACP,CAAA;AAAA,EACI,CAAA;AAEX,GAMM,IAAA,CAAiC,EAAE,SAAA,EAAA,MACvC,EAAW,CAAO,GAad,IAAA,CAA2B,EAAE,SAAA,GAAS,UAAA,EAAA,MAA6C;AACvF,QAAM,IAAU,EAAQ,cAAc,WAAW;AACjD,SAAO,gBAAA,EAAC,GAAD;AAAA,IAAoB,UAAA;AAAA,IAAmB,SAAA;AAAA,IAAkB,SAAA;AAAA,EAAU,CAAA;AAC5E,GAEM,IAAW,EAAiD;AAAA,EAChE,UAAU,OAAO,YACf,OAAO,OAAO,CAAyB,EAAE,IAAA,CAAK,MAAM,CAAC,GAAG,CAA6B,CAAC,CACxF;AAAA,EACA,UAAU;AAAA,EACV,MAAM;AACR,CAAC"}

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/index.d.ts

@@ -0,0 +1 @@
+export { default as SavingsOpportunityBlock } from './SavingsOpportunityBlock';

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/layout.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Design branches of the Savings Opportunity component block (Figma frame 1276-45997).
+ *
+ * Six variants formed by the backend axis `{generic, savings, specific} × {safety_net_not_set,
+ * safety_net_set}`. All six share the same card visuals (title, subtitle, label, amount, green
+ * gradient slot); the differentiators live in the payload — description text, primary CTA label,
+ * and whether a secondary CTA is present. The slot visual is backend-controlled via the flat
+ * `slot` field on `instance_slot` (defaults to true), so no per-variant layout map is needed.
+ */
+export declare const savingsOpportunityVariant: {
+    readonly GenericSafetyNetNotSet: "generic_safety_net_not_set";
+    readonly SavingsSafetyNetNotSet: "savings_safety_net_not_set";
+    readonly SpecificSafetyNetNotSet: "specific_safety_net_not_set";
+    readonly GenericSafetyNetSet: "generic_safety_net_set";
+    readonly SavingsSafetyNetSet: "savings_safety_net_set";
+    readonly SpecificSafetyNetSet: "specific_safety_net_set";
+};
+export type SavingsOpportunityVariant = (typeof savingsOpportunityVariant)[keyof typeof savingsOpportunityVariant];

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/layout.es.js

@@ -0,0 +1,13 @@
+var e = {
+  GenericSafetyNetNotSet: "generic_safety_net_not_set",
+  SavingsSafetyNetNotSet: "savings_safety_net_not_set",
+  SpecificSafetyNetNotSet: "specific_safety_net_not_set",
+  GenericSafetyNetSet: "generic_safety_net_set",
+  SavingsSafetyNetSet: "savings_safety_net_set",
+  SpecificSafetyNetSet: "specific_safety_net_set"
+};
+export {
+  e as savingsOpportunityVariant
+};
+
+//# sourceMappingURL=layout.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/layout.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/SavingsOpportunityBlock/layout.ts"],"sourcesContent":["/**\n * Design branches of the Savings Opportunity component block (Figma frame 1276-45997).\n *\n * Six variants formed by the backend axis `{generic, savings, specific} × {safety_net_not_set,\n * safety_net_set}`. All six share the same card visuals (title, subtitle, label, amount, green\n * gradient slot); the differentiators live in the payload — description text, primary CTA label,\n * and whether a secondary CTA is present. The slot visual is backend-controlled via the flat\n * `slot` field on `instance_slot` (defaults to true), so no per-variant layout map is needed.\n */\nexport const savingsOpportunityVariant = {\n  GenericSafetyNetNotSet: 'generic_safety_net_not_set',\n  SavingsSafetyNetNotSet: 'savings_safety_net_not_set',\n  SpecificSafetyNetNotSet: 'specific_safety_net_not_set',\n  GenericSafetyNetSet: 'generic_safety_net_set',\n  SavingsSafetyNetSet: 'savings_safety_net_set',\n  SpecificSafetyNetSet: 'specific_safety_net_set',\n} as const\n\nexport type SavingsOpportunityVariant =\n  (typeof savingsOpportunityVariant)[keyof typeof savingsOpportunityVariant]\n"],"mappings":"AASA,IAAa,IAA4B;AAAA,EACvC,wBAAwB;AAAA,EACxB,wBAAwB;AAAA,EACxB,yBAAyB;AAAA,EACzB,qBAAqB;AAAA,EACrB,qBAAqB;AAAA,EACrB,sBAAsB;AACxB"}

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.d.ts

@@ -0,0 +1,53 @@
+import { InsightsPayload } from '../../../../core';
+import { UpcomingBillDay } from '../../../components/UpcomingBillCard';
+interface UpcomingBillBlockProps {
+    payload: InsightsPayload;
+    beatGuid?: string;
+}
+type SevenDays = [
+    UpcomingBillDay,
+    UpcomingBillDay,
+    UpcomingBillDay,
+    UpcomingBillDay,
+    UpcomingBillDay,
+    UpcomingBillDay,
+    UpcomingBillDay
+];
+/**
+ * Parse an ISO `YYYY-MM-DD` into a local-time Date, dodging the UTC-midnight parse
+ * that `new Date('2025-10-30')` performs (which drifts a day in negative offsets).
+ * Any other string shape (full ISO datetime) falls through to the native parser.
+ *
+ * Returns `null` for anything that doesn't resolve to a valid Date — including a
+ * `YYYY-MM-DD`-shaped string whose year/month/day segments produce `Invalid Date`
+ * (e.g. `'2026-13-40'`) and arbitrary strings the native parser rejects. Callers
+ * must handle `null` so a bad backend value cannot propagate `NaN` into the UI
+ * via `getDay()` and render `NaN` day numbers.
+ */
+export declare const parseDueDate: (iso: string) => Date | null;
+/**
+ * Build the Sun→Sat week around a due date with the due day marked `highlighted`.
+ * Column index is the local day-of-week (0=Sun..6=Sat) so the strip always lines up
+ * under the weekday labels regardless of which weekday the bill lands on.
+ */
+export declare const buildWeekStrip: (dueDate: Date) => SevenDays;
+/**
+ * Upcoming Bill component block (Figma: "Full | Upcoming Bill"). Reads `due_date`,
+ * `amount` and merchant facts off `instance_slot` (V2 flat shape — no
+ * `instance_slot_data`), derives the Sun→Sat week around the due date, and renders
+ * the shared `UpcomingBillCard`.
+ *
+ * Wrapped in `createVariantBlock` from day one so an added design branch is a new
+ * registry entry, not a rewrite of dispatch logic. Today only
+ * `projected_bill_payment` is defined; an unknown variant degrades to it.
+ *
+ * Degraded-date rendering: if `due_date` is missing or doesn't parse to a valid
+ * Date (e.g. `'2026-13-40'`, `''`, an unparseable arbitrary string), the card
+ * still renders — merchant row + amount — but with a neutral current-week strip
+ * (no highlighted cell). `UpcomingBillCard` requires a 7-tuple `days` prop so we
+ * cannot omit the strip without modifying the shared component; the "no highlighted
+ * cell" fallback keeps the useful info visible without pretending today is the
+ * due day.
+ */
+declare const UpcomingBillBlock: ({ payload, beatGuid }: UpcomingBillBlockProps) => import("react/jsx-runtime").JSX.Element;
+export default UpcomingBillBlock;

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js

@@ -0,0 +1,79 @@
+import { formatCurrency as u } from "../../../../core/utils/NumberFormatting.es.js";
+import { createVariantBlock as d } from "../../createVariantBlock.es.js";
+import g from "../../../components/LogoFromGuid.es.js";
+import D from "../../../components/UpcomingBillCard.es.js";
+import { upcomingBillVariant as p } from "./layout.es.js";
+import f from "@mui/material/Stack";
+import { jsx as l } from "react/jsx-runtime";
+var s = [
+  "Sun",
+  "Mon",
+  "Tue",
+  "Wed",
+  "Thu",
+  "Fri",
+  "Sat"
+], h = (t) => {
+  const a = /^(\d{4})-(\d{2})-(\d{2})$/.exec(t);
+  if (a) {
+    const [, o, n, r] = a, i = new Date(Number(o), Number(n) - 1, Number(r));
+    return Number.isNaN(i.getTime()) ? null : i;
+  }
+  const e = new Date(t);
+  return Number.isNaN(e.getTime()) ? null : e;
+}, v = (t) => {
+  const a = t.getDay(), e = new Date(t);
+  return e.setDate(t.getDate() - a), s.map((o, n) => {
+    const r = new Date(e);
+    r.setDate(e.getDate() + n);
+    const i = {
+      label: o,
+      date: String(r.getDate())
+    };
+    return n === a && (i.highlighted = !0), i;
+  });
+}, y = () => {
+  const t = /* @__PURE__ */ new Date(), a = t.getDay(), e = new Date(t);
+  return e.setDate(t.getDate() - a), s.map((o, n) => {
+    const r = new Date(e);
+    return r.setDate(e.getDate() + n), {
+      label: o,
+      date: String(r.getDate())
+    };
+  });
+}, m = ({ payload: t }) => {
+  const { instance_slot: a } = t, { amount: e, due_date: o, merchant_guid: n, merchant_name: r } = a, i = o ? h(o) : null, c = i ? v(i) : y();
+  return /* @__PURE__ */ l(f, {
+    sx: { px: 16 },
+    children: /* @__PURE__ */ l(D, {
+      amount: u(e ?? 0, "0,0.00"),
+      days: c,
+      logo: n ? /* @__PURE__ */ l(g, {
+        logo: {
+          alt: r ?? "",
+          guid: n
+        },
+        size: 24
+      }) : null,
+      merchantName: r ?? ""
+    })
+  });
+}, P = ({ payload: t, beatGuid: a }) => {
+  const e = t.instance_slot.variant ?? void 0;
+  return /* @__PURE__ */ l(B, {
+    beatGuid: a,
+    payload: t,
+    variant: e
+  });
+}, B = d({
+  variants: { [p.ProjectedBillPayment]: m },
+  fallback: m,
+  name: "UpcomingBillBlock"
+});
+export {
+  v as buildWeekStrip,
+  P as default,
+  h as parseDueDate
+};
+
+//# sourceMappingURL=UpcomingBillBlock.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpcomingBillBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.tsx"],"sourcesContent":["import Stack from '@mui/material/Stack'\n\nimport type { InsightsPayload } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\n\nimport LogoFromGuid from '../../../components/LogoFromGuid'\nimport UpcomingBillCard, { type UpcomingBillDay } from '../../../components/UpcomingBillCard'\nimport { createVariantBlock } from '../../createVariantBlock'\n\nimport { upcomingBillVariant } from './layout'\n\ninterface UpcomingBillBlockProps {\n  payload: InsightsPayload\n  beatGuid?: string\n}\n\nconst DAY_LABELS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] as const\ntype SevenDays = [\n  UpcomingBillDay,\n  UpcomingBillDay,\n  UpcomingBillDay,\n  UpcomingBillDay,\n  UpcomingBillDay,\n  UpcomingBillDay,\n  UpcomingBillDay,\n]\n\n/**\n * Parse an ISO `YYYY-MM-DD` into a local-time Date, dodging the UTC-midnight parse\n * that `new Date('2025-10-30')` performs (which drifts a day in negative offsets).\n * Any other string shape (full ISO datetime) falls through to the native parser.\n *\n * Returns `null` for anything that doesn't resolve to a valid Date — including a\n * `YYYY-MM-DD`-shaped string whose year/month/day segments produce `Invalid Date`\n * (e.g. `'2026-13-40'`) and arbitrary strings the native parser rejects. Callers\n * must handle `null` so a bad backend value cannot propagate `NaN` into the UI\n * via `getDay()` and render `NaN` day numbers.\n */\nexport const parseDueDate = (iso: string): Date | null => {\n  const dateOnly = /^(\\d{4})-(\\d{2})-(\\d{2})$/.exec(iso)\n  if (dateOnly) {\n    const [, y, m, d] = dateOnly\n    const parsed = new Date(Number(y), Number(m) - 1, Number(d))\n    return Number.isNaN(parsed.getTime()) ? null : parsed\n  }\n  const parsed = new Date(iso)\n  return Number.isNaN(parsed.getTime()) ? null : parsed\n}\n\n/**\n * Build the Sun→Sat week around a due date with the due day marked `highlighted`.\n * Column index is the local day-of-week (0=Sun..6=Sat) so the strip always lines up\n * under the weekday labels regardless of which weekday the bill lands on.\n */\nexport const buildWeekStrip = (dueDate: Date): SevenDays => {\n  const dow = dueDate.getDay()\n  const sunday = new Date(dueDate)\n  sunday.setDate(dueDate.getDate() - dow)\n\n  const days = DAY_LABELS.map((label, idx): UpcomingBillDay => {\n    const cell = new Date(sunday)\n    cell.setDate(sunday.getDate() + idx)\n    const day: UpcomingBillDay = { label, date: String(cell.getDate()) }\n    if (idx === dow) day.highlighted = true\n    return day\n  })\n\n  return days as unknown as SevenDays\n}\n\n/**\n * Build the current Sun→Sat week with NO cell highlighted. Used as the degraded\n * strip when `due_date` is missing or unparseable — the card still renders\n * (merchant row with name + amount) but the strip has no \"due day\" callout.\n */\nconst buildUnhighlightedCurrentWeek = (): SevenDays => {\n  const base = new Date()\n  const dow = base.getDay()\n  const sunday = new Date(base)\n  sunday.setDate(base.getDate() - dow)\n\n  const days = DAY_LABELS.map((label, idx): UpcomingBillDay => {\n    const cell = new Date(sunday)\n    cell.setDate(sunday.getDate() + idx)\n    return { label, date: String(cell.getDate()) }\n  })\n\n  return days as unknown as SevenDays\n}\n\nconst ProjectedBillPaymentVariant = ({ payload }: UpcomingBillBlockProps) => {\n  const { instance_slot } = payload\n  const { amount, due_date, merchant_guid, merchant_name } = instance_slot\n\n  // Both missing and malformed `due_date` degrade to the same \"no highlighted cell\" case —\n  // we never want to silently show today's week as if it were due today. UpcomingBillCard\n  // requires a 7-tuple, so we still render a neutral current-week strip so the merchant row\n  // (name + amount) stays visible. Returning null would hide the whole insight for just a\n  // bad date, which costs the user more information than it saves.\n  const parsed = due_date ? parseDueDate(due_date) : null\n  const days = parsed ? buildWeekStrip(parsed) : buildUnhighlightedCurrentWeek()\n\n  return (\n    <Stack sx={{ px: 16 }}>\n      <UpcomingBillCard\n        amount={formatCurrency(amount ?? 0, '0,0.00')}\n        days={days}\n        logo={\n          merchant_guid ? (\n            <LogoFromGuid logo={{ alt: merchant_name ?? '', guid: merchant_guid }} size={24} />\n          ) : null\n        }\n        merchantName={merchant_name ?? ''}\n      />\n    </Stack>\n  )\n}\n\n/**\n * Upcoming Bill component block (Figma: \"Full | Upcoming Bill\"). Reads `due_date`,\n * `amount` and merchant facts off `instance_slot` (V2 flat shape — no\n * `instance_slot_data`), derives the Sun→Sat week around the due date, and renders\n * the shared `UpcomingBillCard`.\n *\n * Wrapped in `createVariantBlock` from day one so an added design branch is a new\n * registry entry, not a rewrite of dispatch logic. Today only\n * `projected_bill_payment` is defined; an unknown variant degrades to it.\n *\n * Degraded-date rendering: if `due_date` is missing or doesn't parse to a valid\n * Date (e.g. `'2026-13-40'`, `''`, an unparseable arbitrary string), the card\n * still renders — merchant row + amount — but with a neutral current-week strip\n * (no highlighted cell). `UpcomingBillCard` requires a 7-tuple `days` prop so we\n * cannot omit the strip without modifying the shared component; the \"no highlighted\n * cell\" fallback keeps the useful info visible without pretending today is the\n * due day.\n */\nconst UpcomingBillBlock = ({ payload, beatGuid }: UpcomingBillBlockProps) => {\n  const variant = payload.instance_slot.variant ?? undefined\n  return <Variants beatGuid={beatGuid} payload={payload} variant={variant} />\n}\n\nconst Variants = createVariantBlock<UpcomingBillBlockProps>({\n  variants: {\n    [upcomingBillVariant.ProjectedBillPayment]: ProjectedBillPaymentVariant,\n  },\n  fallback: ProjectedBillPaymentVariant,\n  name: 'UpcomingBillBlock',\n})\n\nexport default UpcomingBillBlock\n"],"mappings":";;;;;;;AAgBA,IAAM,IAAa;AAAA,EAAC;AAAA,EAAO;AAAA,EAAO;AAAA,EAAO;AAAA,EAAO;AAAA,EAAO;AAAA,EAAO;AAAK,GAsBtD,IAAA,CAAgB,MAA6B;AACxD,QAAM,IAAW,4BAA4B,KAAK,CAAG;AACrD,MAAI,GAAU;AACZ,UAAM,CAAA,EAAG,GAAG,GAAG,CAAA,IAAK,GACd,IAAS,IAAI,KAAK,OAAO,CAAC,GAAG,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,CAAC;AAC3D,WAAO,OAAO,MAAM,EAAO,QAAQ,CAAC,IAAI,OAAO;AAAA,EACjD;AACA,QAAM,IAAS,IAAI,KAAK,CAAG;AAC3B,SAAO,OAAO,MAAM,EAAO,QAAQ,CAAC,IAAI,OAAO;AACjD,GAOa,IAAA,CAAkB,MAA6B;AAC1D,QAAM,IAAM,EAAQ,OAAO,GACrB,IAAS,IAAI,KAAK,CAAO;AAC/B,SAAA,EAAO,QAAQ,EAAQ,QAAQ,IAAI,CAAG,GAEzB,EAAW,IAAA,CAAK,GAAO,MAAyB;AAC3D,UAAM,IAAO,IAAI,KAAK,CAAM;AAC5B,IAAA,EAAK,QAAQ,EAAO,QAAQ,IAAI,CAAG;AACnC,UAAM,IAAuB;AAAA,MAAE,OAAA;AAAA,MAAO,MAAM,OAAO,EAAK,QAAQ,CAAC;AAAA,IAAE;AACnE,WAAI,MAAQ,MAAK,EAAI,cAAc,KAC5B;AAAA,EACT,CAEO;AACT,GAOM,IAAA,MAAiD;AACrD,QAAM,IAAO,oBAAI,KAAK,GAChB,IAAM,EAAK,OAAO,GAClB,IAAS,IAAI,KAAK,CAAI;AAC5B,SAAA,EAAO,QAAQ,EAAK,QAAQ,IAAI,CAAG,GAEtB,EAAW,IAAA,CAAK,GAAO,MAAyB;AAC3D,UAAM,IAAO,IAAI,KAAK,CAAM;AAC5B,WAAA,EAAK,QAAQ,EAAO,QAAQ,IAAI,CAAG,GAC5B;AAAA,MAAE,OAAA;AAAA,MAAO,MAAM,OAAO,EAAK,QAAQ,CAAC;AAAA,IAAE;AAAA,EAC/C,CAEO;AACT,GAEM,IAAA,CAA+B,EAAE,SAAA,EAAA,MAAsC;AAC3E,QAAM,EAAE,eAAA,EAAA,IAAkB,GACpB,EAAE,QAAA,GAAQ,UAAA,GAAU,eAAA,GAAe,eAAA,EAAA,IAAkB,GAOrD,IAAS,IAAW,EAAa,CAAQ,IAAI,MAC7C,IAAO,IAAS,EAAe,CAAM,IAAI,EAA8B;AAE7E,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAE,IAAI,GAAG;AAAA,IAClB,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,QAAQ,EAAe,KAAU,GAAG,QAAQ;AAAA,MACtC,MAAA;AAAA,MACN,MACE,IACE,gBAAA,EAAC,GAAD;AAAA,QAAc,MAAM;AAAA,UAAE,KAAK,KAAiB;AAAA,UAAI,MAAM;AAAA,QAAc;AAAA,QAAG,MAAM;AAAA,MAAK,CAAA,IAChF;AAAA,MAEN,cAAc,KAAiB;AAAA,IAChC,CAAA;AAAA,EACI,CAAA;AAEX,GAoBM,IAAA,CAAqB,EAAE,SAAA,GAAS,UAAA,EAAA,MAAuC;AAC3E,QAAM,IAAU,EAAQ,cAAc,WAAW;AACjD,SAAO,gBAAA,EAAC,GAAD;AAAA,IAAoB,UAAA;AAAA,IAAmB,SAAA;AAAA,IAAkB,SAAA;AAAA,EAAU,CAAA;AAC5E,GAEM,IAAW,EAA2C;AAAA,EAC1D,UAAU,EAAA,CACP,EAAoB,oBAAA,GAAuB,EAC9C;AAAA,EACA,UAAU;AAAA,EACV,MAAM;AACR,CAAC"}

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/index.d.ts

@@ -0,0 +1 @@
+export { default as UpcomingBillBlock } from './UpcomingBillBlock';

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/layout.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Design branches of the Upcoming Bill component block.
+ *
+ * - `ProjectedBillPayment` — the only variant today (Figma: "Full | Upcoming Bill"):
+ *   week strip + merchant row + amount.
+ *
+ * Scaffolded through `createVariantBlock` so adding a future design branch is a new
+ * registry entry rather than editing dispatch logic.
+ */
+export declare const upcomingBillVariant: {
+    readonly ProjectedBillPayment: "projected_bill_payment";
+};
+export type UpcomingBillVariant = (typeof upcomingBillVariant)[keyof typeof upcomingBillVariant];

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/layout.es.js

@@ -0,0 +1,6 @@
+var e = { ProjectedBillPayment: "projected_bill_payment" };
+export {
+  e as upcomingBillVariant
+};
+
+//# sourceMappingURL=layout.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/layout.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/UpcomingBillBlock/layout.ts"],"sourcesContent":["/**\n * Design branches of the Upcoming Bill component block.\n *\n * - `ProjectedBillPayment` — the only variant today (Figma: \"Full | Upcoming Bill\"):\n *   week strip + merchant row + amount.\n *\n * Scaffolded through `createVariantBlock` so adding a future design branch is a new\n * registry entry rather than editing dispatch logic.\n */\nexport const upcomingBillVariant = {\n  ProjectedBillPayment: 'projected_bill_payment',\n} as const\n\nexport type UpcomingBillVariant = (typeof upcomingBillVariant)[keyof typeof upcomingBillVariant]\n"],"mappings":"AASA,IAAa,IAAsB,EACjC,sBAAsB,yBACxB"}

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.d.ts

@@ -0,0 +1,23 @@
+import { InsightsPayload } from '../../../../core';
+interface UpcomingSubscriptionBlockProps {
+    payload: InsightsPayload;
+    beatGuid?: string;
+}
+export declare const BACKDROP_TILES: {
+    size: number;
+    opacity: number;
+    left: number;
+    top: number;
+}[];
+/**
+ * Upcoming Subscription component block (Figma: "Full | Upcoming Subscription"). Reads
+ * `amount`, `cadence`, and merchant facts off `instance_slot` (V2 flat shape — no
+ * `instance_slot_data`) and renders the shared `SubscriptionHeroCard` with the scattered
+ * faded-logo backdrop.
+ *
+ * Wrapped in `createVariantBlock` from day one so an added design branch is a new registry
+ * entry, not a rewrite of dispatch logic. Today only `upcoming_subscription` is defined; an
+ * unknown variant degrades to it.
+ */
+declare const UpcomingSubscriptionBlock: ({ payload, beatGuid }: UpcomingSubscriptionBlockProps) => import("react/jsx-runtime").JSX.Element;
+export default UpcomingSubscriptionBlock;

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js

@@ -0,0 +1,143 @@
+import { formatCurrency as d } from "../../../../core/utils/NumberFormatting.es.js";
+import { createVariantBlock as y } from "../../createVariantBlock.es.js";
+import l from "../../../components/LogoFromGuid.es.js";
+import g from "../../../components/SubscriptionHeroCard.es.js";
+import { upcomingSubscriptionVariant as b } from "./layout.es.js";
+import x from "@mui/material/Stack";
+import { jsx as o } from "react/jsx-runtime";
+import m from "@mui/material/Box";
+var h = [
+  {
+    size: 51,
+    opacity: 0.5,
+    left: 6.9,
+    top: -13.7
+  },
+  {
+    size: 51,
+    opacity: 0.5,
+    left: 82.8,
+    top: 75.9
+  },
+  {
+    size: 33,
+    opacity: 0.35,
+    left: 15.9,
+    top: 35.7
+  },
+  {
+    size: 33,
+    opacity: 0.35,
+    left: -5,
+    top: 57.1
+  },
+  {
+    size: 33,
+    opacity: 0.35,
+    left: 9.3,
+    top: 89.8
+  },
+  {
+    size: 33,
+    opacity: 0.35,
+    left: 96,
+    top: 48.8
+  },
+  {
+    size: 33,
+    opacity: 0.35,
+    left: 69.7,
+    top: -9.3
+  },
+  {
+    size: 26,
+    opacity: 0.25,
+    left: 33.1,
+    top: 76.4
+  },
+  {
+    size: 26,
+    opacity: 0.25,
+    left: 0.6,
+    top: 24.8
+  },
+  {
+    size: 26,
+    opacity: 0.25,
+    left: 94.1,
+    top: 5.5
+  },
+  {
+    size: 26,
+    opacity: 0.25,
+    left: 75.4,
+    top: 27.5
+  },
+  {
+    size: 16,
+    opacity: 0.1,
+    left: 59.7,
+    top: 88.8
+  },
+  {
+    size: 16,
+    opacity: 0.1,
+    left: 72.3,
+    top: 57.9
+  }
+], f = ({ payload: i }) => {
+  const { instance_slot: a } = i, { amount: p, cadence: r, merchant_guid: c, merchant_name: n } = a, e = c ? {
+    alt: n ?? "",
+    guid: c
+  } : null, s = d(p ?? 0, "0,0.00"), u = r ? `${s} / ${r}` : s, z = e ? /* @__PURE__ */ o(m, {
+    "aria-hidden": !0,
+    "data-testid": "upcoming-subscription-backdrop",
+    children: h.map((t) => /* @__PURE__ */ o(m, {
+      sx: {
+        alignItems: "center",
+        display: "flex",
+        height: t.size,
+        justifyContent: "center",
+        left: `${t.left}%`,
+        opacity: t.opacity,
+        position: "absolute",
+        top: `${t.top}%`,
+        width: t.size
+      },
+      children: /* @__PURE__ */ o(l, {
+        logo: e,
+        size: t.size
+      })
+    }, `${t.size}-${t.left}-${t.top}`))
+  }) : null;
+  return /* @__PURE__ */ o(x, {
+    sx: { px: 16 },
+    children: /* @__PURE__ */ o(g, {
+      backdrop: z,
+      logo: e ? /* @__PURE__ */ o(l, {
+        logo: e,
+        size: 64
+      }) : null,
+      name: n ?? "",
+      price: u,
+      sx: { px: 0 }
+    })
+  });
+}, j = ({ payload: i, beatGuid: a }) => {
+  const p = i.instance_slot.variant ?? void 0;
+  return /* @__PURE__ */ o(v, {
+    beatGuid: a,
+    payload: i,
+    variant: p
+  });
+}, v = y({
+  variants: { [b.UpcomingSubscription]: f },
+  fallback: f,
+  name: "UpcomingSubscriptionBlock"
+});
+export {
+  h as BACKDROP_TILES,
+  j as default
+};
+
+//# sourceMappingURL=UpcomingSubscriptionBlock.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpcomingSubscriptionBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport type { InsightsPayload } from '../../../../core'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\n\nimport LogoFromGuid from '../../../components/LogoFromGuid'\nimport SubscriptionHeroCard from '../../../components/SubscriptionHeroCard'\nimport { createVariantBlock } from '../../createVariantBlock'\n\nimport { upcomingSubscriptionVariant } from './layout'\n\ninterface UpcomingSubscriptionBlockProps {\n  payload: InsightsPayload\n  beatGuid?: string\n}\n\n// Fixed tile positions for the scattered merchant-logo backdrop. Each cell sits over the\n// 320x182-ish hero slot in CSS percentages; the card's `overflow: hidden` clips any that fall\n// partly off-frame, which matches the Figma design.\nexport const BACKDROP_TILES: { size: number; opacity: number; left: number; top: number }[] = [\n  { size: 51, opacity: 0.5, left: 6.9, top: -13.7 },\n  { size: 51, opacity: 0.5, left: 82.8, top: 75.9 },\n  { size: 33, opacity: 0.35, left: 15.9, top: 35.7 },\n  { size: 33, opacity: 0.35, left: -5.0, top: 57.1 },\n  { size: 33, opacity: 0.35, left: 9.3, top: 89.8 },\n  { size: 33, opacity: 0.35, left: 96.0, top: 48.8 },\n  { size: 33, opacity: 0.35, left: 69.7, top: -9.3 },\n  { size: 26, opacity: 0.25, left: 33.1, top: 76.4 },\n  { size: 26, opacity: 0.25, left: 0.6, top: 24.8 },\n  { size: 26, opacity: 0.25, left: 94.1, top: 5.5 },\n  { size: 26, opacity: 0.25, left: 75.4, top: 27.5 },\n  { size: 16, opacity: 0.1, left: 59.7, top: 88.8 },\n  { size: 16, opacity: 0.1, left: 72.3, top: 57.9 },\n]\n\nconst UpcomingSubscriptionVariant = ({ payload }: UpcomingSubscriptionBlockProps) => {\n  const { instance_slot } = payload\n  const { amount, cadence, merchant_guid, merchant_name } = instance_slot\n\n  const logoRef = merchant_guid ? { alt: merchant_name ?? '', guid: merchant_guid } : null\n  const amountText = formatCurrency(amount ?? 0, '0,0.00')\n  const price = cadence ? `${amountText} / ${cadence}` : amountText\n\n  const backdrop = logoRef ? (\n    // Defensive: SubscriptionHeroCard already wraps `backdrop` in an aria-hidden container, but\n    // we mark the inner cluster aria-hidden too so AT skips the 13 tiles even if the shared\n    // card's wrapper is refactored.\n    <Box aria-hidden={true} data-testid=\"upcoming-subscription-backdrop\">\n      {BACKDROP_TILES.map((t) => (\n        <Box\n          key={`${t.size}-${t.left}-${t.top}`}\n          sx={{\n            alignItems: 'center',\n            display: 'flex',\n            height: t.size,\n            justifyContent: 'center',\n            left: `${t.left}%`,\n            opacity: t.opacity,\n            position: 'absolute',\n            top: `${t.top}%`,\n            width: t.size,\n          }}\n        >\n          <LogoFromGuid logo={logoRef} size={t.size} />\n        </Box>\n      ))}\n    </Box>\n  ) : null\n\n  return (\n    <Stack sx={{ px: 16 }}>\n      <SubscriptionHeroCard\n        backdrop={backdrop}\n        logo={logoRef ? <LogoFromGuid logo={logoRef} size={64} /> : null}\n        name={merchant_name ?? ''}\n        price={price}\n        sx={{ px: 0 }}\n      />\n    </Stack>\n  )\n}\n\n/**\n * Upcoming Subscription component block (Figma: \"Full | Upcoming Subscription\"). Reads\n * `amount`, `cadence`, and merchant facts off `instance_slot` (V2 flat shape — no\n * `instance_slot_data`) and renders the shared `SubscriptionHeroCard` with the scattered\n * faded-logo backdrop.\n *\n * Wrapped in `createVariantBlock` from day one so an added design branch is a new registry\n * entry, not a rewrite of dispatch logic. Today only `upcoming_subscription` is defined; an\n * unknown variant degrades to it.\n */\nconst UpcomingSubscriptionBlock = ({ payload, beatGuid }: UpcomingSubscriptionBlockProps) => {\n  const variant = payload.instance_slot.variant ?? undefined\n  return <Variants beatGuid={beatGuid} payload={payload} variant={variant} />\n}\n\nconst Variants = createVariantBlock<UpcomingSubscriptionBlockProps>({\n  variants: {\n    [upcomingSubscriptionVariant.UpcomingSubscription]: UpcomingSubscriptionVariant,\n  },\n  fallback: UpcomingSubscriptionVariant,\n  name: 'UpcomingSubscriptionBlock',\n})\n\nexport default UpcomingSubscriptionBlock\n"],"mappings":";;;;;;;;AAoBA,IAAa,IAAiF;AAAA,EAC5F;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAK,MAAM;AAAA,IAAK,KAAK;AAAA,EAAM;AAAA,EAChD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAK,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EAChD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EACjD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EACjD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAK,KAAK;AAAA,EAAK;AAAA,EAChD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EACjD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EACjD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EACjD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAK,KAAK;AAAA,EAAK;AAAA,EAChD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAI;AAAA,EAChD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAM,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EACjD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAK,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAAA,EAChD;AAAA,IAAE,MAAM;AAAA,IAAI,SAAS;AAAA,IAAK,MAAM;AAAA,IAAM,KAAK;AAAA,EAAK;AAClD,GAEM,IAAA,CAA+B,EAAE,SAAA,EAAA,MAA8C;AACnF,QAAM,EAAE,eAAA,EAAA,IAAkB,GACpB,EAAE,QAAA,GAAQ,SAAA,GAAS,eAAA,GAAe,eAAA,EAAA,IAAkB,GAEpD,IAAU,IAAgB;AAAA,IAAE,KAAK,KAAiB;AAAA,IAAI,MAAM;AAAA,EAAc,IAAI,MAC9E,IAAa,EAAe,KAAU,GAAG,QAAQ,GACjD,IAAQ,IAAU,GAAG,CAAA,MAAgB,CAAA,KAAY,GAEjD,IAAW,IAIf,gBAAA,EAAC,GAAD;AAAA,IAAK,eAAa;AAAA,IAAM,eAAY;AAAA,IACjC,UAAA,EAAe,IAAA,CAAK,MACnB,gBAAA,EAAC,GAAD;AAAA,MAEE,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,SAAS;AAAA,QACT,QAAQ,EAAE;AAAA,QACV,gBAAgB;AAAA,QAChB,MAAM,GAAG,EAAE,IAAA;AAAA,QACX,SAAS,EAAE;AAAA,QACX,UAAU;AAAA,QACV,KAAK,GAAG,EAAE,GAAA;AAAA,QACV,OAAO,EAAE;AAAA,MACX;AAAA,MAEA,UAAA,gBAAA,EAAC,GAAD;AAAA,QAAc,MAAM;AAAA,QAAS,MAAM,EAAE;AAAA,MAAO,CAAA;AAAA,IACzC,GAdE,GAAG,EAAE,IAAA,IAAQ,EAAE,IAAA,IAAQ,EAAE,GAAA,EAc3B,CACN;AAAA,EACE,CAAA,IACH;AAEJ,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAE,IAAI,GAAG;AAAA,IAClB,UAAA,gBAAA,EAAC,GAAD;AAAA,MACY,UAAA;AAAA,MACV,MAAM,IAAU,gBAAA,EAAC,GAAD;AAAA,QAAc,MAAM;AAAA,QAAS,MAAM;AAAA,MAAK,CAAA,IAAI;AAAA,MAC5D,MAAM,KAAiB;AAAA,MAChB,OAAA;AAAA,MACP,IAAI,EAAE,IAAI,EAAE;AAAA,IACb,CAAA;AAAA,EACI,CAAA;AAEX,GAYM,IAAA,CAA6B,EAAE,SAAA,GAAS,UAAA,EAAA,MAA+C;AAC3F,QAAM,IAAU,EAAQ,cAAc,WAAW;AACjD,SAAO,gBAAA,EAAC,GAAD;AAAA,IAAoB,UAAA;AAAA,IAAmB,SAAA;AAAA,IAAkB,SAAA;AAAA,EAAU,CAAA;AAC5E,GAEM,IAAW,EAAmD;AAAA,EAClE,UAAU,EAAA,CACP,EAA4B,oBAAA,GAAuB,EACtD;AAAA,EACA,UAAU;AAAA,EACV,MAAM;AACR,CAAC"}

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/index.d.ts

@@ -0,0 +1 @@
+export { default as UpcomingSubscriptionBlock } from './UpcomingSubscriptionBlock';

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/layout.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Design branches of the Upcoming Subscription component block.
+ *
+ * - `UpcomingSubscription` — the only variant today (Figma: "Full | Upcoming Subscription"):
+ *   64px hero merchant logo + name (h2) + price pill, over a scattered faded-logo backdrop.
+ *
+ * Scaffolded through `createVariantBlock` so adding a future design branch is a new registry entry
+ * rather than editing dispatch logic.
+ */
+export declare const upcomingSubscriptionVariant: {
+    readonly UpcomingSubscription: "upcoming_subscription";
+};
+export type UpcomingSubscriptionVariant = (typeof upcomingSubscriptionVariant)[keyof typeof upcomingSubscriptionVariant];

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/layout.es.js

@@ -0,0 +1,6 @@
+var i = { UpcomingSubscription: "upcoming_subscription" };
+export {
+  i as upcomingSubscriptionVariant
+};
+
+//# sourceMappingURL=layout.es.js.map

package/dist/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/layout.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/UpcomingSubscriptionBlock/layout.ts"],"sourcesContent":["/**\n * Design branches of the Upcoming Subscription component block.\n *\n * - `UpcomingSubscription` — the only variant today (Figma: \"Full | Upcoming Subscription\"):\n *   64px hero merchant logo + name (h2) + price pill, over a scattered faded-logo backdrop.\n *\n * Scaffolded through `createVariantBlock` so adding a future design branch is a new registry entry\n * rather than editing dispatch logic.\n */\nexport const upcomingSubscriptionVariant = {\n  UpcomingSubscription: 'upcoming_subscription',\n} as const\n\nexport type UpcomingSubscriptionVariant =\n  (typeof upcomingSubscriptionVariant)[keyof typeof upcomingSubscriptionVariant]\n"],"mappings":"AASA,IAAa,IAA8B,EACzC,sBAAsB,wBACxB"}

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

@@ -3,5 +3,8 @@ export * from './AccountSwitchBlock';
 export * from './DirectDepositBlock';
 export * from './BudgetBlock';
 export * from './SaveExtraBlock';
+export * from './SavingsOpportunityBlock';
 export * from './TransactionBlock';
+export * from './UpcomingBillBlock';
+export * from './UpcomingSubscriptionBlock';
 export * from './WithdrawalBlock';

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

@@ -1,119 +1,125 @@
-import o from "./components/StatusPill.es.js";
+import r from "./components/StatusPill.es.js";
 import { resolveInsightRender as m } from "./resolveInsightRender.es.js";
 import { useBeatActions as a } from "./beatActions.es.js";
 import f from "./components/BadgedTile.es.js";
 import { OverflowMenu as n } from "./components/OverflowMenu.es.js";
-import { InsightOptionsMenu as s } from "./components/InsightOptionsMenu.es.js";
-import d, { isLogoGuid as C } from "./components/LogoFromGuid.es.js";
-import B from "./components/StatusBadge.es.js";
+import { InsightOptionsMenu as l } from "./components/InsightOptionsMenu.es.js";
+import d, { isLogoGuid as g } from "./components/LogoFromGuid.es.js";
+import C from "./components/StatusBadge.es.js";
 import k from "./components/CompactInsightCard.es.js";
 import h from "./components/InsightErrorCard.es.js";
-import { BAR_CHART_VARIANTS as A, barChartVariant as b, buildChartData as T, buildDataSeries as I } from "./blocks/ChartBlocks/BarchartBlock/utils.es.js";
+import { BAR_CHART_VARIANTS as b, barChartVariant as A, buildChartData as T, buildDataSeries as I } from "./blocks/ChartBlocks/BarchartBlock/utils.es.js";
 import { BarchartBlock as v } from "./blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js";
-import { DoubleBarChartBlock as w } from "./blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
-import O from "./blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
-import P from "./blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
-import y from "./blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
+import { DoubleBarChartBlock as O } from "./blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
+import M from "./blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
+import E from "./blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
+import R from "./blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
 import V from "./blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js";
 import G from "./components/TransferLogoCard.es.js";
-import N from "./blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
-import U from "./components/AccountHeroCard.es.js";
+import _ from "./blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
+import W from "./components/AccountHeroCard.es.js";
 import q from "./components/DirectDepositCard.es.js";
 import J from "./blocks/ComponentBlocks/DirectDepositBlock/DirectDepositBlock.es.js";
 import { BudgetBlock as Q } from "./blocks/ComponentBlocks/BudgetBlock/BudgetBlock.es.js";
 import Y from "./components/SaveAnExtraCard.es.js";
 import $ from "./blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
-import or from "./components/InsightTransactionRow.es.js";
-import mr from "./components/TransactionListCard.es.js";
-import { transactionBlockVariant as ar } from "./blocks/ComponentBlocks/TransactionBlock/layout.es.js";
-import { TransactionBlock as fr } from "./blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
-import nr from "./components/WithdrawalCard.es.js";
-import sr from "./blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
-import { SVGImageBlock as dr } from "./blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
-import gr from "./components/ConnectionDetailDrillDown.es.js";
-import ur from "./components/AmountPill.es.js";
-import Sr from "./components/DesignateEmergencySavingsCard.es.js";
-import Dr from "./components/shared/StatusSnackbar.es.js";
-import br from "./components/FeedbackDialog.es.js";
-import Ir from "./components/FeedbackModal.es.js";
-import vr from "./components/SurveyModal.es.js";
-import { ErrorCard as wr } from "./components/ErrorCard.es.js";
-import { HOST_ACTIONS as Or } from "./ctaActions/hostActions.es.js";
-import { useBeatCtaActions as Pr, useCtaHandler as Rr } from "./ctaActions/useCtaAction.es.js";
-import { FeedbackBar as Fr } from "./components/FeedbackBar.es.js";
-import { DismissInsightDialog as xr } from "./components/DismissInsightDialog.es.js";
-import { HiddenConfirmationCard as _r } from "./components/HiddenConfirmationCard.es.js";
-import { LoadingCard as Wr } from "./components/LoadingCard.es.js";
-import { ObsolesceBanner as jr } from "./components/ObsolesceBanner.es.js";
-import zr from "./components/BaseLayout.es.js";
-import Kr from "./components/StatusMessageCard.es.js";
-import Xr from "./components/LogoTile.es.js";
-import Zr from "./components/LogoClusterCard.es.js";
-import ro from "./components/MerchantHighlightCard.es.js";
-import to from "./components/P2PLogoStack.es.js";
-import io from "./components/SavingsOpportunityCard.es.js";
-import po from "./components/SubscriptionHeroCard.es.js";
-import eo from "./components/UpcomingBillCard.es.js";
+import ro from "./components/SavingsOpportunityCard.es.js";
+import mo from "./blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js";
+import ao from "./components/InsightTransactionRow.es.js";
+import fo from "./components/TransactionListCard.es.js";
+import { transactionBlockVariant as no } from "./blocks/ComponentBlocks/TransactionBlock/layout.es.js";
+import { TransactionBlock as lo } from "./blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
+import go from "./components/UpcomingBillCard.es.js";
+import Co from "./blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import ko from "./components/AmountPill.es.js";
+import ho from "./components/SubscriptionHeroCard.es.js";
+import bo from "./blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js";
+import To from "./components/WithdrawalCard.es.js";
+import Lo from "./blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
+import { SVGImageBlock as Ho } from "./blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import wo from "./components/ConnectionDetailDrillDown.es.js";
+import yo from "./components/DesignateEmergencySavingsCard.es.js";
+import Po from "./components/shared/StatusSnackbar.es.js";
+import Fo from "./components/FeedbackDialog.es.js";
+import xo from "./components/FeedbackModal.es.js";
+import Uo from "./components/SurveyModal.es.js";
+import { ErrorCard as No } from "./components/ErrorCard.es.js";
+import { HOST_ACTIONS as jo } from "./ctaActions/hostActions.es.js";
+import { useBeatCtaActions as zo, useCtaHandler as Jo } from "./ctaActions/useCtaAction.es.js";
+import { FeedbackBar as Qo } from "./components/FeedbackBar.es.js";
+import { DismissInsightDialog as Yo } from "./components/DismissInsightDialog.es.js";
+import { HiddenConfirmationCard as $o } from "./components/HiddenConfirmationCard.es.js";
+import { LoadingCard as rr } from "./components/LoadingCard.es.js";
+import { ObsolesceBanner as mr } from "./components/ObsolesceBanner.es.js";
+import ar from "./components/BaseLayout.es.js";
+import fr from "./components/StatusMessageCard.es.js";
+import nr from "./components/LogoTile.es.js";
+import lr from "./components/LogoClusterCard.es.js";
+import dr from "./components/MerchantHighlightCard.es.js";
+import Br from "./components/P2PLogoStack.es.js";
 export {
   V as AccountBlock,
-  U as AccountHeroCard,
-  N as AccountSwitchBlock,
-  ur as AmountPill,
-  A as BAR_CHART_VARIANTS,
+  W as AccountHeroCard,
+  _ as AccountSwitchBlock,
+  ko as AmountPill,
+  b as BAR_CHART_VARIANTS,
   f as BadgedTile,
   v as BarchartBlock,
-  zr as BaseLayout,
+  ar as BaseLayout,
   Q as BudgetBlock,
   k as CompactInsightCard,
-  gr as ConnectionDetailDrillDown,
-  Sr as DesignateEmergencySavingsCard,
+  wo as ConnectionDetailDrillDown,
+  yo as DesignateEmergencySavingsCard,
   J as DirectDepositBlock,
   q as DirectDepositCard,
-  xr as DismissInsightDialog,
-  P as DonutChartBlock,
-  w as DoubleBarChartBlock,
-  y as DoubleProgressBarBlock,
-  wr as ErrorCard,
-  Fr as FeedbackBar,
-  br as FeedbackDialog,
-  Ir as FeedbackModal,
-  Or as HOST_ACTIONS,
-  _r as HiddenConfirmationCard,
+  Yo as DismissInsightDialog,
+  E as DonutChartBlock,
+  O as DoubleBarChartBlock,
+  R as DoubleProgressBarBlock,
+  No as ErrorCard,
+  Qo as FeedbackBar,
+  Fo as FeedbackDialog,
+  xo as FeedbackModal,
+  jo as HOST_ACTIONS,
+  $o as HiddenConfirmationCard,
   h as InsightErrorCard,
-  s as InsightOptionsMenu,
-  or as InsightTransactionRow,
-  Wr as LoadingCard,
-  Zr as LogoClusterCard,
+  l as InsightOptionsMenu,
+  ao as InsightTransactionRow,
+  rr as LoadingCard,
+  lr as LogoClusterCard,
   d as LogoFromGuid,
-  Xr as LogoTile,
-  ro as MerchantHighlightCard,
-  jr as ObsolesceBanner,
+  nr as LogoTile,
+  dr as MerchantHighlightCard,
+  mr as ObsolesceBanner,
   n as OverflowMenu,
-  to as P2PLogoStack,
-  dr as SVGImageBlock,
+  Br as P2PLogoStack,
+  Ho as SVGImageBlock,
   Y as SaveAnExtraCard,
   $ as SaveExtraBlock,
-  io as SavingsOpportunityCard,
-  B as StatusBadge,
-  Kr as StatusMessageCard,
-  o as StatusPill,
-  Dr as StatusSnackbar,
-  O as StepChartBlock,
-  po as SubscriptionHeroCard,
-  vr as SurveyModal,
-  fr as TransactionBlock,
-  mr as TransactionListCard,
+  mo as SavingsOpportunityBlock,
+  ro as SavingsOpportunityCard,
+  C as StatusBadge,
+  fr as StatusMessageCard,
+  r as StatusPill,
+  Po as StatusSnackbar,
+  M as StepChartBlock,
+  ho as SubscriptionHeroCard,
+  Uo as SurveyModal,
+  lo as TransactionBlock,
+  fo as TransactionListCard,
   G as TransferLogoCard,
-  eo as UpcomingBillCard,
-  sr as WithdrawalBlock,
-  nr as WithdrawalCard,
-  b as barChartVariant,
+  Co as UpcomingBillBlock,
+  go as UpcomingBillCard,
+  bo as UpcomingSubscriptionBlock,
+  Lo as WithdrawalBlock,
+  To as WithdrawalCard,
+  A as barChartVariant,
   T as buildChartData,
   I as buildDataSeries,
-  C as isLogoGuid,
+  g as isLogoGuid,
   m as resolveInsightRender,
-  ar as transactionBlockVariant,
+  no as transactionBlockVariant,
   a as useBeatActions,
-  Pr as useBeatCtaActions,
-  Rr as useCtaHandler
+  zo as useBeatCtaActions,
+  Jo as useCtaHandler
 };

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

@@ -2,65 +2,68 @@ import { ContactSupportActionBlock as c } from "../actionBlocks/ContactSupportAc
 import { actionBlocksKey as o } from "./actionBlocksKey.es.js";
 import { BarchartBlock as m } from "../blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js";
 import { DoubleBarChartBlock as l } from "../blocks/ChartBlocks/DoubleBarChartBlock/DoubleBarChartBlock.es.js";
-import _ from "../blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
-import p from "../blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
+import p from "../blocks/ChartBlocks/StepChartBlock/StepChartBlock.es.js";
+import _ from "../blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.es.js";
 import s from "../blocks/ChartBlocks/DoubleProgressBarBlock/DoubleProgressBarBlock.es.js";
 import C from "../blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js";
 import k from "../blocks/ComponentBlocks/AccountSwitchBlock/AccountSwitchBlock.es.js";
 import B from "../blocks/ComponentBlocks/DirectDepositBlock/DirectDepositBlock.es.js";
 import { BudgetBlock as T } from "../blocks/ComponentBlocks/BudgetBlock/BudgetBlock.es.js";
 import A from "../blocks/ComponentBlocks/SaveExtraBlock/SaveExtraBlock.es.js";
+import u from "../blocks/ComponentBlocks/SavingsOpportunityBlock/SavingsOpportunityBlock.es.js";
 import { TransactionBlock as O } from "../blocks/ComponentBlocks/TransactionBlock/TransactionBlock.es.js";
-import f from "../blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
-import u from "../blocks/ImageBlocks/ImageBlock.es.js";
-import { SVGImageBlock as N } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
-import { FeedbackModalActionBlock as I } from "../actionBlocks/FeedbackModalActionBlock.es.js";
-import { ConnectionDetailActionBlock as d } from "../actionBlocks/ConnectionDetailActionBlock.es.js";
-import { ConnectWidgetActionBlock as b } from "../actionBlocks/ConnectWidgetActionBlock.es.js";
-import { SurveyModalActionBlock as L } from "../actionBlocks/SurveyModalActionBlock.es.js";
-import { PlaceholderActionBlock as D } from "../actionBlocks/PlaceholderActionBlock.es.js";
-import { getMakeTransferDrawerTitle as P } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
-import { MakeTransferActionBlockLayer as g } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
-import { getDrawerHeaderTitle as h } from "../actionBlocks/TransactionHistoryBlock/utils.es.js";
-import { TransactionDetailsBlock as R } from "../actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js";
-import { useTransactionDetailsPrepare as a } from "../actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js";
-import { TransactionHistoryBlock as S } from "../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js";
-import { useRecurringTransactionPrepare as i } from "../actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js";
-import { RecurringTransactionBlock as K } from "../actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.es.js";
-import { TransactionListBlock as E } from "../actionBlocks/TransactionListBlock/TransactionListBlock.es.js";
-import { RemainingCashBlock as v } from "../actionBlocks/RemainingCashBlock/RemainingCashBlock.es.js";
-import { hasDrawerBlock as ko } from "./hasDrawerBlock.es.js";
-import { AmountInputModalBlock as M } from "../actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js";
+import f from "../blocks/ComponentBlocks/UpcomingBillBlock/UpcomingBillBlock.es.js";
+import N from "../blocks/ComponentBlocks/UpcomingSubscriptionBlock/UpcomingSubscriptionBlock.es.js";
+import b from "../blocks/ComponentBlocks/WithdrawalBlock/WithdrawalBlock.es.js";
+import I from "../blocks/ImageBlocks/ImageBlock.es.js";
+import { SVGImageBlock as d } from "../blocks/ImageBlocks/SVGImageBlock/SVGImageBlock.es.js";
+import { FeedbackModalActionBlock as g } from "../actionBlocks/FeedbackModalActionBlock.es.js";
+import { ConnectionDetailActionBlock as L } from "../actionBlocks/ConnectionDetailActionBlock.es.js";
+import { ConnectWidgetActionBlock as D } from "../actionBlocks/ConnectWidgetActionBlock.es.js";
+import { SurveyModalActionBlock as P } from "../actionBlocks/SurveyModalActionBlock.es.js";
+import { PlaceholderActionBlock as h } from "../actionBlocks/PlaceholderActionBlock.es.js";
+import { getMakeTransferDrawerTitle as S } from "../actionBlocks/MakeTransferActionBlock/layout.es.js";
+import { MakeTransferActionBlockLayer as R } from "../actionBlocks/MakeTransferActionBlock/MakeTransferActionBlockLayer.es.js";
+import { getDrawerHeaderTitle as K } from "../actionBlocks/TransactionHistoryBlock/utils.es.js";
+import { TransactionDetailsBlock as E } from "../actionBlocks/TransactionDetailsBlock/TransactionDetailsBlock.es.js";
+import { useTransactionDetailsPrepare as i } from "../actionBlocks/TransactionDetailsBlock/useTransactionDetailsPrepare.es.js";
+import { TransactionHistoryBlock as v } from "../actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js";
+import { useRecurringTransactionPrepare as a } from "../actionBlocks/RecurringTransactionBlock/useRecurringTransactionPrepare.es.js";
+import { RecurringTransactionBlock as M } from "../actionBlocks/RecurringTransactionBlock/RecurringTransactionBlock.es.js";
+import { TransactionListBlock as w } from "../actionBlocks/TransactionListBlock/TransactionListBlock.es.js";
+import { RemainingCashBlock as y } from "../actionBlocks/RemainingCashBlock/RemainingCashBlock.es.js";
+import { hasDrawerBlock as fo } from "./hasDrawerBlock.es.js";
+import { AmountInputModalBlock as U } from "../actionBlocks/AmountInputModalBlock/AmountInputModalBlock.es.js";
 var r = (e) => {
-}, To = {
+}, bo = {
   [o.PLACEHOLDER_ACTION_BLOCK]: {
-    Component: D,
+    Component: h,
     usePrepare: r,
     title: () => "Action Block Layer Drilldown"
   },
   [o.MAKE_TRANSFER_ACTION_BLOCK]: {
-    Component: g,
+    Component: R,
     usePrepare: r,
-    title: P
+    title: S
   },
   [o.TRANSCATION_HISTORY_ACTION_BLOCK]: {
-    Component: S,
+    Component: v,
     usePrepare: r,
-    title: h
+    title: K
   },
   [o.TRANSACTION_DETAILS_ACTION_BLOCK]: {
-    Component: R,
-    usePrepare: a,
+    Component: E,
+    usePrepare: i,
     title: () => "Transaction Details"
   },
   [o.RECURRING_TRANSACTION_ACTION_BLOCK]: {
-    Component: K,
-    usePrepare: i,
+    Component: M,
+    usePrepare: a,
     title: (e, t) => t.recurring?.expense_details ?? ""
   },
   [o.REMAINING_CASH_ACTION_BLOCK]: {
-    Component: v,
-    usePrepare: i,
+    Component: y,
+    usePrepare: a,
     title: (e, t) => t.insights_feed?.remaining_cash?.title ?? ""
   },
   [o.CONTACT_SUPPORT_ACTION_BLOCK]: {
@@ -69,54 +72,57 @@ var r = (e) => {
     title: (e, t) => t.help?.request_support ?? ""
   },
   [o.FEEDBACK_MODAL_ACTION_BLOCK]: {
-    Component: I,
+    Component: g,
     usePrepare: r,
     presentation: "modal"
   },
   [o.CONNECTION_DETAIL_ACTION_BLOCK]: {
-    Component: d,
+    Component: L,
     usePrepare: r,
     title: (e, t) => t.insights_feed?.connection_details?.connection_details_drawer_title ?? ""
   },
   [o.CONNECT_WIDGET_ACTION_BLOCK]: {
-    Component: b,
+    Component: D,
     usePrepare: r
   },
   [o.SURVEY_MODAL_ACTION_BLOCK]: {
-    Component: L,
+    Component: P,
     usePrepare: r,
     presentation: "modal"
   },
   [o.TRANSACTION_LIST_ACTION_BLOCK]: {
-    Component: E,
-    usePrepare: a,
+    Component: w,
+    usePrepare: i,
     title: (e, t, n) => n?.insights_payload?.title ?? ""
   },
   [o.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {
-    Component: M,
+    Component: U,
     presentation: "modal",
     usePrepare: r
   }
-}, Ao = {
+}, Io = {
   account_block: C,
   account_switch_block: k,
   direct_deposit_block: B,
   bar_chart_block: m,
   budget_block: T,
-  donut_chart_block: p,
+  donut_chart_block: _,
   double_bar_chart_block: l,
   double_progress_bar_block: s,
-  image_block: u,
+  image_block: I,
   save_extra_block: A,
-  step_chart_block: _,
-  svg_image_block: N,
-  withdrawal_block: f,
+  savings_opportunity_block: u,
+  step_chart_block: p,
+  svg_image_block: d,
+  upcoming_bill_block: f,
+  upcoming_subscription_block: N,
+  withdrawal_block: b,
   transaction_block: O
 };
 export {
-  To as actionBlocks,
-  Ao as blocks,
-  ko as hasDrawerBlock
+  bo as actionBlocks,
+  Io as blocks,
+  fo 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  DirectDepositBlock,\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 { FeedbackModalActionBlock } from '../actionBlocks/FeedbackModalActionBlock'\nimport { ConnectionDetailActionBlock } from '../actionBlocks/ConnectionDetailActionBlock'\nimport { ConnectWidgetActionBlock } from '../actionBlocks/ConnectWidgetActionBlock'\nimport { SurveyModalActionBlock } from '../actionBlocks/SurveyModalActionBlock'\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'\nimport { TransactionListBlock } from '../actionBlocks/TransactionListBlock'\nimport { RemainingCashBlock } from '../actionBlocks/RemainingCashBlock'\nimport { AmountInputModalBlock } from '../actionBlocks/AmountInputModalBlock'\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// Re-exported so existing `hasDrawerBlock` imports from this module keep working.\nexport { hasDrawerBlock } from './hasDrawerBlock'\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, with the beat available\n  // for blocks that title from beat fields (e.g. transaction-list reads insights_payload.title).\n  // Falls back to the CTA label when the resolver returns an empty string / is absent.\n  title?: (variant: string | null | undefined, copy: GlobalCopy, beat?: Beat) => string\n  // 'drawer' (default) or 'modal' (component renders its own dialog, no Drawer wrapper).\n  presentation?: 'drawer' | 'modal'\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  // Remaining Cash for the Payday Cash Left Over Status beat. Store-driven: reuses the recurring\n  // loader, which also loads accounts and categories, so CashflowStore's computeds are ready.\n  [actionBlocksKey.REMAINING_CASH_ACTION_BLOCK]: {\n    Component: RemainingCashBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.insights_feed?.remaining_cash?.title ?? '',\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  [actionBlocksKey.FEEDBACK_MODAL_ACTION_BLOCK]: {\n    Component: FeedbackModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.CONNECTION_DETAIL_ACTION_BLOCK]: {\n    Component: ConnectionDetailActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) =>\n      copy.insights_feed?.connection_details?.connection_details_drawer_title ?? '',\n  },\n  // Boots MX's Connect widget (web-widget-sdk iframe) inside the action\n  // drawer; the drawer title falls back to the CTA label.\n  [actionBlocksKey.CONNECT_WIDGET_ACTION_BLOCK]: {\n    Component: ConnectWidgetActionBlock,\n    usePrepare: noop,\n  },\n  [actionBlocksKey.SURVEY_MODAL_ACTION_BLOCK]: {\n    Component: SurveyModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.TRANSACTION_LIST_ACTION_BLOCK]: {\n    Component: TransactionListBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: (_variant, _copy, beat) => beat?.insights_payload?.title ?? '',\n  },\n  // One whole-dollar setting in a dialog; the CTA variant picks which (low-balance threshold or\n  // safety net). A modal: no drawer, so no drawer title.\n  [actionBlocksKey.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {\n    Component: AmountInputModalBlock,\n    presentation: 'modal',\n    // Loads inside the block: it mounts only while open, so mounting is the open-time load.\n    usePrepare: noop,\n  },\n} as Record<string, ActionBlockEntry>\n\nexport const blocks = {\n  account_block: AccountBlock,\n  account_switch_block: AccountSwitchBlock,\n  direct_deposit_block: DirectDepositBlock,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,IAAM,IAAA,CAAQ,MAAwB;AAAC,GAsB1B,KAAe;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,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,eAAe,gBAAgB,SAAS;AAAA,EAC1E;AAAA,EAGC,CAAA,EAAgB,4BAAA,GAA+B;AAAA,IAC9C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,MAAM,mBAAmB;AAAA,EAC3D;AAAA,EACC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,8BAAA,GAAiC;AAAA,IAChD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAChB,EAAK,eAAe,oBAAoB,mCAAmC;AAAA,EAC/E;AAAA,EAGC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACC,CAAA,EAAgB,yBAAA,GAA4B;AAAA,IAC3C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,6BAAA,GAAgC;AAAA,IAC/C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,GAAO,MAAS,GAAM,kBAAkB,SAAS;AAAA,EACrE;AAAA,EAGC,CAAA,EAAgB,+BAAA,GAAkC;AAAA,IACjD,WAAW;AAAA,IACX,cAAc;AAAA,IAEd,YAAY;AAAA,EACd;AACF,GAEa,KAAS;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,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  DirectDepositBlock,\n  BarchartBlock,\n  BudgetBlock,\n  DonutChartBlock,\n  DoubleBarChartBlock,\n  DoubleProgressBarBlock,\n  SaveExtraBlock,\n  SavingsOpportunityBlock,\n  SVGImageBlock,\n  UpcomingBillBlock,\n  UpcomingSubscriptionBlock,\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 { FeedbackModalActionBlock } from '../actionBlocks/FeedbackModalActionBlock'\nimport { ConnectionDetailActionBlock } from '../actionBlocks/ConnectionDetailActionBlock'\nimport { ConnectWidgetActionBlock } from '../actionBlocks/ConnectWidgetActionBlock'\nimport { SurveyModalActionBlock } from '../actionBlocks/SurveyModalActionBlock'\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'\nimport { TransactionListBlock } from '../actionBlocks/TransactionListBlock'\nimport { RemainingCashBlock } from '../actionBlocks/RemainingCashBlock'\nimport { AmountInputModalBlock } from '../actionBlocks/AmountInputModalBlock'\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// Re-exported so existing `hasDrawerBlock` imports from this module keep working.\nexport { hasDrawerBlock } from './hasDrawerBlock'\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, with the beat available\n  // for blocks that title from beat fields (e.g. transaction-list reads insights_payload.title).\n  // Falls back to the CTA label when the resolver returns an empty string / is absent.\n  title?: (variant: string | null | undefined, copy: GlobalCopy, beat?: Beat) => string\n  // 'drawer' (default) or 'modal' (component renders its own dialog, no Drawer wrapper).\n  presentation?: 'drawer' | 'modal'\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  // Remaining Cash for the Payday Cash Left Over Status beat. Store-driven: reuses the recurring\n  // loader, which also loads accounts and categories, so CashflowStore's computeds are ready.\n  [actionBlocksKey.REMAINING_CASH_ACTION_BLOCK]: {\n    Component: RemainingCashBlock,\n    usePrepare: useRecurringTransactionPrepare,\n    title: (_variant, copy) => copy.insights_feed?.remaining_cash?.title ?? '',\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  [actionBlocksKey.FEEDBACK_MODAL_ACTION_BLOCK]: {\n    Component: FeedbackModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.CONNECTION_DETAIL_ACTION_BLOCK]: {\n    Component: ConnectionDetailActionBlock,\n    usePrepare: noop,\n    title: (_variant, copy) =>\n      copy.insights_feed?.connection_details?.connection_details_drawer_title ?? '',\n  },\n  // Boots MX's Connect widget (web-widget-sdk iframe) inside the action\n  // drawer; the drawer title falls back to the CTA label.\n  [actionBlocksKey.CONNECT_WIDGET_ACTION_BLOCK]: {\n    Component: ConnectWidgetActionBlock,\n    usePrepare: noop,\n  },\n  [actionBlocksKey.SURVEY_MODAL_ACTION_BLOCK]: {\n    Component: SurveyModalActionBlock,\n    usePrepare: noop,\n    presentation: 'modal',\n  },\n  [actionBlocksKey.TRANSACTION_LIST_ACTION_BLOCK]: {\n    Component: TransactionListBlock,\n    usePrepare: useTransactionDetailsPrepare,\n    title: (_variant, _copy, beat) => beat?.insights_payload?.title ?? '',\n  },\n  // One whole-dollar setting in a dialog; the CTA variant picks which (low-balance threshold or\n  // safety net). A modal: no drawer, so no drawer title.\n  [actionBlocksKey.AMOUNT_INPUT_MODAL_ACTION_BLOCK]: {\n    Component: AmountInputModalBlock,\n    presentation: 'modal',\n    // Loads inside the block: it mounts only while open, so mounting is the open-time load.\n    usePrepare: noop,\n  },\n} as Record<string, ActionBlockEntry>\n\nexport const blocks = {\n  account_block: AccountBlock,\n  account_switch_block: AccountSwitchBlock,\n  direct_deposit_block: DirectDepositBlock,\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  savings_opportunity_block: SavingsOpportunityBlock,\n  step_chart_block: StepChartBlock,\n  svg_image_block: SVGImageBlock,\n  upcoming_bill_block: UpcomingBillBlock,\n  upcoming_subscription_block: UpcomingSubscriptionBlock,\n  withdrawal_block: WithdrawalBlock,\n  transaction_block: TransactionBlock,\n} as Record<string, React.ComponentType<{ payload: InsightsPayload; beatGuid?: string }>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoDA,IAAM,IAAA,CAAQ,MAAwB;AAAC,GAsB1B,KAAe;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,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,eAAe,gBAAgB,SAAS;AAAA,EAC1E;AAAA,EAGC,CAAA,EAAgB,4BAAA,GAA+B;AAAA,IAC9C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAAS,EAAK,MAAM,mBAAmB;AAAA,EAC3D;AAAA,EACC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,8BAAA,GAAiC;AAAA,IAChD,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,MAChB,EAAK,eAAe,oBAAoB,mCAAmC;AAAA,EAC/E;AAAA,EAGC,CAAA,EAAgB,2BAAA,GAA8B;AAAA,IAC7C,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACC,CAAA,EAAgB,yBAAA,GAA4B;AAAA,IAC3C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACC,CAAA,EAAgB,6BAAA,GAAgC;AAAA,IAC/C,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAA,CAAQ,GAAU,GAAO,MAAS,GAAM,kBAAkB,SAAS;AAAA,EACrE;AAAA,EAGC,CAAA,EAAgB,+BAAA,GAAkC;AAAA,IACjD,WAAW;AAAA,IACX,cAAc;AAAA,IAEd,YAAY;AAAA,EACd;AACF,GAEa,KAAS;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,2BAA2B;AAAA,EAC3B,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,6BAA6B;AAAA,EAC7B,kBAAkB;AAAA,EAClB,mBAAmB;AACrB"}

package/package.json

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