gloomberb 0.9.2 → 0.9.3

package/src/cli/registry.ts

@@ -1,9 +1,17 @@
 import type { AppConfig } from "../types/config";
-import type { CliCommandContext, CliCommandDef, CliDispatchResult, GloomPlugin } from "../types/plugin";
+import type {
+  CliCommandContext,
+  CliCommandDef,
+  CliDispatchResult,
+  GloomPlugin,
+  PluginCliCommandDescriptor,
+} from "../types/plugin";
 import type { LoadedExternalPlugin } from "../plugins/loader";
 import { getPluginCatalog } from "../plugins/catalog";
-import { initConfigData, initMarketData } from "./context";
+import { initCliServices, initConfigData, initMarketData } from "./context";
 import { closeAndFail, fail } from "./errors";
+import { DEFAULT_CLI_OPTIONS, type CliGlobalOptions } from "./options";
+import { printCliResult } from "./result";
 import {
   cliStyles,
   colorBySign,
@@ -26,6 +34,8 @@ export interface CliCommandRegistry {
   lookup: ReadonlyMap<string, RegisteredCliCommand>;
   config: AppConfig | null;
   plugins: GloomPlugin[];
+  externalPlugins: LoadedExternalPlugin[];
+  descriptors: Array<{ pluginId: string; descriptor: PluginCliCommandDescriptor }>;
 }
 
 interface BuildCliCommandRegistryOptions {
@@ -61,6 +71,19 @@ function getCommandUsageLabel(command: CliCommandDef): string {
   return command.help?.usage?.[0] ?? command.name;
 }
 
+function descriptorToCommand(descriptor: PluginCliCommandDescriptor): CliCommandDef | null {
+  if (!descriptor.execute) return null;
+  return {
+    name: descriptor.name,
+    aliases: descriptor.aliases,
+    description: descriptor.summary,
+    help: descriptor.examples?.length
+      ? { usage: descriptor.examples }
+      : undefined,
+    execute: descriptor.execute,
+  };
+}
+
 function renderHelpSections(registry: CliCommandRegistry): string[] {
   const lines: string[] = [];
 
@@ -149,6 +172,7 @@ export function buildCliCommandRegistry({
   }
 
   const loadablePlugins: GloomPlugin[] = [];
+  const descriptors: Array<{ pluginId: string; descriptor: PluginCliCommandDescriptor }> = [];
   for (const entry of catalog) {
     if (entry.error) {
       registryLog.warn(`Skipping external plugin "${entry.plugin.id}" for CLI registration.`, {
@@ -161,6 +185,11 @@ export function buildCliCommandRegistry({
     for (const command of entry.plugin.cliCommands ?? []) {
       registerCommand(command, entry.plugin.id, "plugin");
     }
+    for (const descriptor of entry.plugin.cli?.commands ?? []) {
+      descriptors.push({ pluginId: entry.plugin.id, descriptor });
+      const command = descriptorToCommand(descriptor);
+      if (command) registerCommand(command, entry.plugin.id, "plugin");
+    }
   }
 
   const commands = allCommands.filter((entry) => (
@@ -180,14 +209,25 @@ export function buildCliCommandRegistry({
     lookup,
     config,
     plugins: loadablePlugins,
+    externalPlugins,
+    descriptors,
   };
 }
 
-export function createCliCommandContext(ownerId: string, plugins: GloomPlugin[]): CliCommandContext {
+export function createCliCommandContext(
+  ownerId: string,
+  registryOrPlugins: Pick<CliCommandRegistry, "plugins" | "externalPlugins"> | GloomPlugin[],
+  cliOptions: CliGlobalOptions = DEFAULT_CLI_OPTIONS,
+): CliCommandContext {
+  const registry = Array.isArray(registryOrPlugins)
+    ? { plugins: registryOrPlugins, externalPlugins: [] }
+    : registryOrPlugins;
   return {
     initConfigData,
-    initMarketData: () => initMarketData({ plugins }),
-    plugins,
+    initMarketData: () => initMarketData({ plugins: registry.plugins }),
+    initServices: () => initCliServices({ externalPlugins: registry.externalPlugins }),
+    cliOptions,
+    plugins: registry.plugins,
     fail,
     closeAndFail,
     output: {
@@ -197,6 +237,7 @@ export function createCliCommandContext(ownerId: string, plugins: GloomPlugin[])
       renderStat,
       renderTable,
     },
+    printResult: (result, options) => printCliResult(result, cliOptions, options),
     log: debugLog.createLogger(ownerId === "core" ? "cli" : ownerId),
   };
 }

package/src/cli/result.test.ts

@@ -0,0 +1,82 @@
+import { describe, expect, test } from "bun:test";
+import { serializeCliError, serializeCliResult } from "./result";
+import type { CliGlobalOptions } from "./options";
+
+const baseOptions: CliGlobalOptions = {
+  format: "text",
+  quiet: false,
+  color: null,
+  refresh: false,
+  dryRun: false,
+  yes: false,
+};
+
+describe("serializeCliResult", () => {
+  test("renders limited JSON result envelopes", () => {
+    const output = serializeCliResult(
+      { data: [{ symbol: "AAPL" }, { symbol: "MSFT" }] },
+      { ...baseOptions, format: "json", limit: 1 },
+    );
+    expect(JSON.parse(output)).toEqual({
+      ok: true,
+      data: [{ symbol: "AAPL" }],
+    });
+  });
+
+  test("includes display column metadata in JSON envelopes", () => {
+    const output = serializeCliResult(
+      { data: [{ quote: { symbol: "AAPL", price: 123 } }] },
+      { ...baseOptions, format: "json" },
+      {
+        rows: (data) => data.map((row) => row.quote),
+        columns: [
+          { key: "symbol", header: "Symbol" },
+          { key: "price", header: "Last", align: "right" },
+        ],
+      },
+    );
+    expect(JSON.parse(output)).toEqual({
+      ok: true,
+      data: [{ quote: { symbol: "AAPL", price: 123 } }],
+      columns: [
+        { key: "symbol", header: "Symbol" },
+        { key: "price", header: "Last", align: "right" },
+      ],
+    });
+  });
+
+  test("renders CSV with provided column order", () => {
+    const output = serializeCliResult(
+      { data: [{ symbol: "AAPL", name: "Apple, Inc." }] },
+      { ...baseOptions, format: "csv" },
+      {
+        columns: [
+          { key: "symbol", header: "Symbol" },
+          { key: "name", header: "Name" },
+        ],
+      },
+    );
+    expect(output).toBe('Symbol,Name\nAAPL,"Apple, Inc."');
+  });
+
+  test("renders NDJSON rows", () => {
+    const output = serializeCliResult(
+      { data: [{ symbol: "AAPL" }, { symbol: "MSFT" }] },
+      { ...baseOptions, format: "ndjson" },
+    );
+    expect(output).toBe('{"symbol":"AAPL"}\n{"symbol":"MSFT"}');
+  });
+});
+
+describe("serializeCliError", () => {
+  test("renders stable structured errors for JSON", () => {
+    const output = serializeCliError(
+      { code: "auth_required", message: "Sign in first.", retryable: true },
+      { ...baseOptions, format: "json" },
+    );
+    expect(JSON.parse(output)).toEqual({
+      ok: false,
+      error: { code: "auth_required", message: "Sign in first.", retryable: true },
+    });
+  });
+});

package/src/cli/result.ts

@@ -0,0 +1,149 @@
+import type { CliGlobalOptions } from "./options";
+import { renderTable, type CliTableColumn } from "../utils/cli-output";
+
+export interface CliResult<T = unknown> {
+  data: T;
+  metadata?: Record<string, unknown>;
+  warnings?: string[];
+}
+
+export interface CliErrorObject {
+  code: string;
+  message: string;
+  details?: unknown;
+  retryable?: boolean;
+}
+
+export interface CliResultColumn<Row = Record<string, unknown>> extends CliTableColumn {
+  key: string;
+  value?: (row: Row) => unknown;
+}
+
+export interface CliResultRenderOptions<T = unknown, Row = Record<string, unknown>> {
+  text?: (data: T) => string;
+  columns?: CliResultColumn<Row>[];
+  rows?: (data: T) => Row[];
+}
+
+interface CliResultJsonEnvelope<T> extends CliResult<T> {
+  ok: true;
+  columns?: Array<Pick<CliResultColumn, "key" | "header" | "align" | "width">>;
+}
+
+function applyLimit<T>(data: T, limit?: number): T {
+  if (!Array.isArray(data) || limit == null) return data;
+  return data.slice(0, limit) as T;
+}
+
+function asRows<T, Row>(data: T, limit?: number, rows?: (data: T) => Row[]): Row[] {
+  const resolvedRows = rows ? rows(data) : (Array.isArray(data) ? data : [data]) as Row[];
+  return limit == null ? resolvedRows : resolvedRows.slice(0, limit);
+}
+
+function normalizeCell(value: unknown): string {
+  if (value == null) return "";
+  if (value instanceof Date) return value.toISOString();
+  if (typeof value === "object") return JSON.stringify(value);
+  return String(value);
+}
+
+function inferColumns(rows: Record<string, unknown>[]): CliResultColumn<Record<string, unknown>>[] {
+  const keys = new Set<string>();
+  for (const row of rows) {
+    if (row && typeof row === "object" && !Array.isArray(row)) {
+      for (const key of Object.keys(row)) keys.add(key);
+    }
+  }
+  return [...keys].map((key) => ({ key, header: key }));
+}
+
+function csvEscape(value: string): string {
+  if (!/[",\n\r]/.test(value)) return value;
+  return `"${value.replace(/"/g, '""')}"`;
+}
+
+function serializeColumns<Row>(columns?: CliResultColumn<Row>[]) {
+  return columns?.map((column) => ({
+    key: column.key,
+    header: column.header,
+    ...(column.align ? { align: column.align } : {}),
+    ...(column.width ? { width: column.width } : {}),
+  }));
+}
+
+function renderCsv<Row extends Record<string, unknown>>(
+  rows: Row[],
+  columns?: CliResultColumn<Row>[],
+): string {
+  const resolvedColumns = columns && columns.length > 0
+    ? columns
+    : inferColumns(rows as Record<string, unknown>[]) as CliResultColumn<Row>[];
+  const header = resolvedColumns.map((column) => csvEscape(column.header)).join(",");
+  const body = rows.map((row) => resolvedColumns
+    .map((column) => csvEscape(normalizeCell(column.value ? column.value(row) : row[column.key])))
+    .join(","));
+  return [header, ...body].join("\n");
+}
+
+function renderTextTable<Row extends Record<string, unknown>>(
+  rows: Row[],
+  columns?: CliResultColumn<Row>[],
+): string {
+  const resolvedColumns = columns && columns.length > 0
+    ? columns
+    : inferColumns(rows as Record<string, unknown>[]) as CliResultColumn<Row>[];
+  return renderTable(
+    resolvedColumns.map((column) => ({
+      header: column.header,
+      align: column.align,
+      width: column.width,
+    })),
+    rows.map((row) => resolvedColumns.map((column) => normalizeCell(column.value ? column.value(row) : row[column.key]))),
+  );
+}
+
+export function serializeCliResult<T, Row extends Record<string, unknown> = Record<string, unknown>>(
+  result: CliResult<T>,
+  options: CliGlobalOptions,
+  renderOptions: CliResultRenderOptions<T, Row> = {},
+): string {
+  if (options.format === "json") {
+    const columns = serializeColumns(renderOptions.columns);
+    const envelope: CliResultJsonEnvelope<T> = {
+      ok: true,
+      ...result,
+      data: applyLimit(result.data, options.limit),
+      ...(columns?.length ? { columns } : {}),
+    };
+    return JSON.stringify(envelope, null, 2);
+  }
+
+  const rows = asRows(result.data, options.limit, renderOptions.rows);
+  if (options.format === "ndjson") {
+    return rows.map((row) => JSON.stringify(row)).join("\n");
+  }
+  if (options.format === "csv") {
+    return renderCsv(rows as Row[], renderOptions.columns);
+  }
+  if (renderOptions.text) {
+    return renderOptions.text(result.data);
+  }
+  return renderTextTable(rows as Row[], renderOptions.columns);
+}
+
+export function printCliResult<T, Row extends Record<string, unknown> = Record<string, unknown>>(
+  result: CliResult<T>,
+  options: CliGlobalOptions,
+  renderOptions: CliResultRenderOptions<T, Row> = {},
+): void {
+  if (options.quiet && options.format === "text") return;
+  const output = serializeCliResult(result, options, renderOptions);
+  if (output) console.log(output);
+}
+
+export function serializeCliError(error: CliErrorObject, options: CliGlobalOptions): string {
+  if (options.format === "json" || options.format === "ndjson") {
+    return JSON.stringify({ ok: false, error }, null, options.format === "json" ? 2 : 0);
+  }
+  return error.details == null ? error.message : `${error.message}\n${String(error.details)}`;
+}

package/src/cli/types.ts

@@ -2,6 +2,7 @@ import type { AppConfig } from "../types/config";
 import { AppPersistence } from "../data/app-persistence";
 import { TickerRepository } from "../data/ticker-repository";
 import { AssetDataRouter } from "../sources/provider-router";
+import type { AppServices } from "../core/app-services";
 
 export type ConfigContext = {
   config: AppConfig;
@@ -13,3 +14,13 @@ export type ConfigContext = {
 export type MarketContext = ConfigContext & {
   dataProvider: AssetDataRouter;
 };
+
+export type CliServicesContext = {
+  config: AppConfig;
+  dataDir: string;
+  services: AppServices;
+  dataProvider: AssetDataRouter;
+  persistence: AppPersistence;
+  store: TickerRepository;
+  destroy(): void;
+};

package/src/cli.test.ts

@@ -22,6 +22,7 @@ const originalHome = process.env.HOME;
 
 afterEach(async () => {
   process.env.HOME = originalHome;
+  process.exitCode = 0;
   await Promise.all(tempDirs.splice(0).map((dir) => rm(dir, { recursive: true, force: true })));
 });
 
@@ -96,12 +97,12 @@ async function captureConsole<T>(fn: () => Promise<T> | T): Promise<{ result: T;
   }
 }
 
-async function captureConsoleFailure(fn: () => Promise<unknown> | unknown): Promise<{ stdout: string; stderr: string; error: unknown }> {
+async function captureConsoleFailure(fn: () => Promise<unknown> | unknown): Promise<{ stdout: string; stderr: string; exitCode: string | number | undefined }> {
   const logs: string[] = [];
   const errors: string[] = [];
   const originalLog = console.log;
   const originalError = console.error;
-  const originalExit = process.exit;
+  const originalExitCode = process.exitCode;
 
   console.log = (...args: unknown[]) => {
     logs.push(args.map(String).join(" "));
@@ -109,23 +110,22 @@ async function captureConsoleFailure(fn: () => Promise<unknown> | unknown): Prom
   console.error = (...args: unknown[]) => {
     errors.push(args.map(String).join(" "));
   };
-  process.exit = ((code?: number) => {
-    throw new Error(`process.exit:${code ?? 0}`);
-  }) as typeof process.exit;
+  process.exitCode = undefined;
 
   try {
     await fn();
-    throw new Error("Expected command to fail.");
-  } catch (error) {
+    if (process.exitCode == null || process.exitCode === 0) {
+      throw new Error("Expected command to fail.");
+    }
     return {
       stdout: logs.join("\n"),
       stderr: errors.join("\n"),
-      error,
+      exitCode: process.exitCode,
     };
   } finally {
     console.log = originalLog;
     console.error = originalError;
-    process.exit = originalExit;
+    process.exitCode = originalExitCode ?? 0;
   }
 }
 
@@ -226,7 +226,7 @@ describe("CLI portfolio commands", () => {
     });
 
     const result = await captureConsoleFailure(() => runCli(["portfolio", "create", "Research"]));
-    expect(String(result.error)).toContain("process.exit:1");
+    expect(result.exitCode).toBe(1);
     expect(result.stderr).toContain('Portfolio "Research" already exists.');
   });
 
@@ -370,7 +370,7 @@ describe("CLI portfolio commands", () => {
     });
 
     const result = await captureConsoleFailure(() => runCli(["portfolio", "add", "IBKR Account", "NVDA"]));
-    expect(String(result.error)).toContain("process.exit:1");
+    expect(result.exitCode).toBe(1);
     expect(result.stderr).toContain('Portfolio "IBKR Account" is broker-managed and cannot be modified manually.');
   });
 });

package/src/components/chart/comparison-stock-chart/interactions.ts

@@ -28,6 +28,7 @@ import {
   resolveCursorMotionKind,
   type ChartMouseEvent,
   type DisplayCursorState,
+  type MouseInteractionEvent,
 } from "../core/pointer";
 import type {
   ComparisonChartSeries,
@@ -48,6 +49,7 @@ interface UseComparisonChartPointerInteractionsOptions {
   chartWidth: number;
   commitSelectionCursor: (next: { cursorX: number | null; cursorY: number | null }) => void;
   expandBufferRange: (action: PendingExpansionAction) => boolean;
+  focusPaneForMouseInteraction: (event: MouseInteractionEvent | null | undefined) => void;
   mouseCrosshairDisabledRef: MutableRefObject<boolean>;
   plotRef: RefObject<BoxRenderable | null>;
   pointCount: number;
@@ -65,6 +67,7 @@ export function useComparisonChartPointerInteractions({
   chartWidth,
   commitSelectionCursor,
   expandBufferRange,
+  focusPaneForMouseInteraction,
   mouseCrosshairDisabledRef,
   plotRef,
   pointCount,
@@ -113,13 +116,14 @@ export function useComparisonChartPointerInteractions({
 
   const handlePlotDown = useCallback((event: ChartMouseEvent) => {
     consumeChartMouseEvent(event);
+    focusPaneForMouseInteraction(null);
     mouseCrosshairDisabledRef.current = false;
     if (!syncPointerCursor(event)) return;
     dragRef.current = {
       startGlobalX: getGlobalMouseX(event, renderer),
       startWindow: visibleDateWindow,
     };
-  }, [mouseCrosshairDisabledRef, renderer, syncPointerCursor, visibleDateWindow]);
+  }, [focusPaneForMouseInteraction, mouseCrosshairDisabledRef, renderer, syncPointerCursor, visibleDateWindow]);
 
   const handlePlotDrag = useCallback((event: ChartMouseEvent) => {
     consumeChartMouseEvent(event);
@@ -147,6 +151,7 @@ export function useComparisonChartPointerInteractions({
 
   const handlePlotScroll = useCallback((event: ChartMouseEvent) => {
     consumeChartMouseEvent(event);
+    focusPaneForMouseInteraction(null);
     const direction = event.scroll?.direction;
     if (!direction) return;
     const scrollPan = consumeScrollPanMovement(
@@ -179,6 +184,7 @@ export function useComparisonChartPointerInteractions({
     chartWidth,
     dateBounds,
     expandBufferRange,
+    focusPaneForMouseInteraction,
     scrollPanCellRemainderRef,
     series,
     seriesDates,

package/src/components/chart/comparison-stock-chart/legend.tsx

@@ -1,11 +1,13 @@
 import type { ComparisonChartProjection } from "../comparison/data";
 import { PriceReturnTable, type PriceReturnTableRow } from "../../price-performance";
 import type { PriceReturnField } from "../../../market-data/performance";
+import type { MouseInteractionEvent } from "../core/pointer";
 
 interface ComparisonChartLegendProps {
   legendActiveIndex: number | null;
   legendItemWidth: number;
   legendRows: number;
+  onFocusInteraction: (event: MouseInteractionEvent | null | undefined) => void;
   onOpenSymbol: (symbol: string) => void;
   onSelectSymbol: (symbol: string) => void;
   performanceBySymbol: ReadonlyMap<string, PriceReturnField[]>;
@@ -36,6 +38,7 @@ export function ComparisonChartLegend({
   legendActiveIndex,
   legendItemWidth,
   legendRows,
+  onFocusInteraction,
   onOpenSymbol,
   onSelectSymbol,
   performanceBySymbol,
@@ -61,6 +64,7 @@ export function ComparisonChartLegend({
   return (
     <PriceReturnTable
       height={legendRows}
+      onFocusInteraction={onFocusInteraction}
       onOpenSymbol={onOpenSymbol}
       onSelectSymbol={onSelectSymbol}
       rows={rows}

package/src/components/chart/comparison-stock-chart/render-data.ts

@@ -3,7 +3,8 @@ import {
   DEFAULT_LIVE_CHART_REFRESH_INTERVAL_MS,
   useChartQueries,
 } from "../../../market-data/hooks";
-import { buildChartKey } from "../../../market-data/selectors";
+import type { ChartRequest, InstrumentRef } from "../../../market-data/request-types";
+import { buildChartKey, resolveEntryData } from "../../../market-data/selectors";
 import { getSharedMarketData } from "../../../plugins/registry";
 import { blendHex, colors, getComparisonSeriesColor } from "../../../theme/colors";
 import type { BrokerContractRef } from "../../../types/instrument";
@@ -24,6 +25,8 @@ import type {
   ComparisonChartViewState,
 } from "../core/types";
 
+const COMPARISON_PERFORMANCE_RANGE = "5Y" as const;
+
 export interface ComparisonChartSymbolSource {
   symbol: string;
   currency: string | undefined;
@@ -40,6 +43,16 @@ interface UseComparisonChartRenderDataOptions {
   viewState: ComparisonChartViewState;
 }
 
+function instrumentFromSymbolSource(source: ComparisonChartSymbolSource): InstrumentRef {
+  return {
+    symbol: source.symbol,
+    exchange: source.exchange,
+    brokerId: source.brokerId,
+    brokerInstanceId: source.brokerInstanceId,
+    instrument: source.instrument,
+  };
+}
+
 export function useComparisonChartRenderData({
   symbolSources,
   viewState,
@@ -143,21 +156,25 @@ export function useComparisonChartRenderData({
   );
   const chartRequests = useMemo(() => (
     symbolSources.map((source) => ({
-      instrument: {
-        symbol: source.symbol,
-        exchange: source.exchange,
-        brokerId: source.brokerId,
-        brokerInstanceId: source.brokerInstanceId,
-        instrument: source.instrument,
-      },
+      instrument: instrumentFromSymbolSource(source),
       bufferRange: viewState.bufferRange,
       granularity: effectiveResolution === "auto" ? "range" as const : "resolution" as const,
       resolution: effectiveResolution === "auto" ? undefined : effectiveResolution,
     }))
   ), [effectiveResolution, symbolSources, viewState.bufferRange]);
+  const performanceRequests = useMemo<ChartRequest[]>(() => (
+    symbolSources.map((source) => ({
+      instrument: instrumentFromSymbolSource(source),
+      bufferRange: COMPARISON_PERFORMANCE_RANGE,
+      granularity: "range",
+    }))
+  ), [symbolSources]);
   const chartEntries = useChartQueries(chartRequests, {
     refreshIntervalMs: DEFAULT_LIVE_CHART_REFRESH_INTERVAL_MS,
   });
+  const performanceEntries = useChartQueries(performanceRequests, {
+    refreshIntervalMs: DEFAULT_LIVE_CHART_REFRESH_INTERVAL_MS,
+  });
   const entryStates = useMemo(() => chartRequests.map((request) => (
     resolveChartBodyState(chartEntries.get(buildChartKey(request)), (value) => Array.isArray(value) && value.length > 0, "No chart data yet.")
   )), [chartEntries, chartRequests]);
@@ -182,6 +199,17 @@ export function useComparisonChartRenderData({
       points,
     };
   }), [chartEntries, chartRequests, symbolSources]);
+  const performanceHistoryBySymbol = useMemo(() => {
+    const bySymbol = new Map<string, PricePoint[]>();
+    symbolSources.forEach((source, index) => {
+      const request = performanceRequests[index];
+      const history = request ? resolveEntryData(performanceEntries.get(buildChartKey(request))) : null;
+      if (history?.length) {
+        bySymbol.set(source.symbol, history);
+      }
+    });
+    return bySymbol;
+  }, [performanceEntries, performanceRequests, symbolSources]);
 
   return {
     availableManualResolutions,
@@ -192,6 +220,7 @@ export function useComparisonChartRenderData({
     isUpdating,
     resolutionChips,
     selectionSupportMap,
+    performanceHistoryBySymbol,
     series,
     supportMap,
   };

package/src/components/chart/comparison-stock-chart/selection-runtime.ts

@@ -1,6 +1,7 @@
-import { useEffect, useRef, type Dispatch, type MutableRefObject, type SetStateAction } from "react";
+import { useCallback, useEffect, useRef, type Dispatch, type MutableRefObject, type SetStateAction } from "react";
 import type { BoxRenderable, NativeRendererHost } from "../../../ui";
-import { buildDisplayCursorState } from "../core/pointer";
+import { useAppDispatch, usePaneInstanceId } from "../../../state/app/context";
+import { buildDisplayCursorState, type MouseInteractionEvent } from "../core/pointer";
 import type { ComparisonChartViewState } from "../core/types";
 import { useChartDisplayCursor, useChartDisplayCursorLayoutRemap } from "../display-cursor";
 import { clamp } from "./helpers";
@@ -10,6 +11,7 @@ interface UseComparisonChartSelectionRuntimeOptions {
   chartWidth: number;
   cursorX: number | null;
   cursorY: number | null;
+  focused: boolean;
   renderer: NativeRendererHost;
   setViewState: Dispatch<SetStateAction<ComparisonChartViewState>>;
   symbols: string[];
@@ -20,6 +22,7 @@ export function useComparisonChartSelectionRuntime({
   chartWidth,
   cursorX: viewCursorX,
   cursorY: viewCursorY,
+  focused,
   renderer,
   setViewState,
   symbols,
@@ -28,6 +31,7 @@ export function useComparisonChartSelectionRuntime({
   displayCursor: ReturnType<typeof useChartDisplayCursor>["displayCursor"];
   displayCursorX: number | null;
   displayCursorY: number | null;
+  focusPaneForMouseInteraction: (event: MouseInteractionEvent | null | undefined) => void;
   mouseCrosshairDisabledRef: MutableRefObject<boolean>;
   plotRef: MutableRefObject<BoxRenderable | null>;
   scrollPanCellRemainderRef: MutableRefObject<number>;
@@ -35,6 +39,8 @@ export function useComparisonChartSelectionRuntime({
   setSelectedSymbol: (symbol: string) => void;
   updateDisplayCursorTarget: ReturnType<typeof useChartDisplayCursor>["updateDisplayCursorTarget"];
 } {
+  const dispatch = useAppDispatch();
+  const paneId = usePaneInstanceId();
   const plotRef = useRef<BoxRenderable | null>(null);
   const mouseCrosshairDisabledRef = useRef(false);
   const scrollPanCellRemainderRef = useRef(0);
@@ -52,6 +58,16 @@ export function useComparisonChartSelectionRuntime({
   const displayCursorX = displayCursor.cellX !== null ? clamp(displayCursor.cellX, 0, chartWidth - 1) : null;
   const displayCursorY = displayCursor.cellY !== null ? clamp(displayCursor.cellY, 0, chartHeight - 1) : null;
 
+  const focusPaneForMouseInteraction = useCallback((
+    event: MouseInteractionEvent | null | undefined,
+  ) => {
+    event?.stopPropagation?.();
+    event?.preventDefault?.();
+    if (!focused) {
+      dispatch({ type: "FOCUS_PANE", paneId });
+    }
+  }, [dispatch, focused, paneId]);
+
   const setSelectedSymbol = (symbol: string) => {
     setViewState((current) => (
       current.selectedSymbol === symbol
@@ -101,6 +117,7 @@ export function useComparisonChartSelectionRuntime({
     displayCursor,
     displayCursorX,
     displayCursorY,
+    focusPaneForMouseInteraction,
     mouseCrosshairDisabledRef,
     plotRef,
     scrollPanCellRemainderRef,