gloomberb 0.7.0 → 0.7.2

package/src/plugins/builtin/research/index.tsx

@@ -7,7 +7,7 @@ import {
   type DataTableColumn,
   type DataTableKeyEvent,
 } from "../../../components";
-import type { AnalystResearchData, CorporateActionsData, TickerFinancials } from "../../../types/financials";
+import type { AnalystRatingRecord, AnalystResearchData, CorporateActionsData, TickerFinancials } from "../../../types/financials";
 import type { GloomPlugin, PaneProps } from "../../../types/plugin";
 import { usePaneInstance, usePaneTicker } from "../../../state/app-context";
 import { blendHex, colors, priceColor } from "../../../theme/colors";
@@ -110,6 +110,32 @@ function ratingActionColor(action: string | undefined): string {
   return colors.textDim;
 }
 
+function formatPriceTarget(value: number | undefined, currency: string): string {
+  if (value == null) return "-";
+  return formatCurrency(value, currency)
+    .replace(/\.00\b/, "")
+    .replace(/(\.\d)0\b/, "$1");
+}
+
+function formatRatingTarget(row: AnalystResearchData["ratings"][number], currency: string): string {
+  const current = row.currentPriceTarget;
+  const prior = row.priorPriceTarget;
+  if (current == null && prior == null) return "-";
+  if (current == null) return ` ${formatPriceTarget(prior, currency)}`;
+  if (prior == null) return ` ${formatPriceTarget(current, currency)}`;
+  return ` ${formatPriceTarget(prior, currency)} → ${formatPriceTarget(current, currency)}`;
+}
+
+function ratingTargetDelta(row: AnalystResearchData["ratings"][number]): number | null {
+  if (row.currentPriceTarget == null || row.priorPriceTarget == null) return null;
+  return row.currentPriceTarget - row.priorPriceTarget;
+}
+
+function ratingTargetBackground(delta: number | null): string | undefined {
+  if (delta == null || delta === 0) return undefined;
+  return blendHex(colors.bg, delta > 0 ? colors.positive : colors.negative, 0.42);
+}
+
 function AnalystSummary({ data, width }: { data: AnalystResearchData | null; width: number }) {
   const target = data?.priceTarget;
   const upside = targetUpside(target);
@@ -170,26 +196,135 @@ function AnalystSummary({ data, width }: { data: AnalystResearchData | null; wid
   );
 }
 
-type RatingColumnId = "date" | "firm" | "action" | "current" | "prior";
+export type RatingColumnId = "date" | "firm" | "action" | "current" | "target" | "prior";
 type RatingColumn = DataTableColumn & { id: RatingColumnId };
+export type SortDirection = "asc" | "desc";
+
+export interface RatingSortPreference {
+  columnId: RatingColumnId;
+  direction: SortDirection;
+}
+
+const DEFAULT_RATING_SORT: RatingSortPreference = {
+  columnId: "date",
+  direction: "desc",
+};
+
+const DEFAULT_RATING_SORT_DIRECTIONS: Record<RatingColumnId, SortDirection> = {
+  date: "desc",
+  firm: "asc",
+  action: "asc",
+  current: "asc",
+  target: "desc",
+  prior: "asc",
+};
 
 const RATING_COLUMNS: RatingColumn[] = [
   { id: "date", label: "DATE", width: 10, align: "left" },
-  { id: "firm", label: "FIRM", width: 24, align: "left" },
-  { id: "action", label: "ACTION", width: 11, align: "left" },
-  { id: "current", label: "RATING", width: 14, align: "left" },
-  { id: "prior", label: "PRIOR", width: 14, align: "left" },
+  { id: "firm", label: "FIRM", width: 20, align: "left" },
+  { id: "action", label: "ACTION", width: 10, align: "left" },
+  { id: "current", label: "RATING", width: 13, align: "left" },
+  { id: "target", label: "TARGET", width: 13, align: "left" },
+  { id: "prior", label: "PRIOR", width: 13, align: "left" },
 ];
 
+function normalizedText(value: string | undefined): string | null {
+  const trimmed = value?.trim();
+  return trimmed ? trimmed.toLocaleLowerCase() : null;
+}
+
+function ratingTargetSortValue(row: AnalystRatingRecord): number | null {
+  return row.currentPriceTarget ?? row.priorPriceTarget ?? null;
+}
+
+function ratingSortValue(row: AnalystRatingRecord, columnId: RatingColumnId): string | number | null {
+  switch (columnId) {
+    case "date":
+      return normalizedText(row.date);
+    case "firm":
+      return normalizedText(row.firm);
+    case "action":
+      return normalizedText(row.action);
+    case "current":
+      return normalizedText(row.current);
+    case "target":
+      return ratingTargetSortValue(row);
+    case "prior":
+      return normalizedText(row.prior);
+  }
+}
+
+function compareSortValues(
+  left: string | number | null,
+  right: string | number | null,
+  direction: SortDirection,
+): number {
+  if (left == null && right == null) return 0;
+  if (left == null) return 1;
+  if (right == null) return -1;
+
+  const comparison = typeof left === "string" && typeof right === "string"
+    ? left.localeCompare(right)
+    : Number(left) - Number(right);
+  return direction === "asc" ? comparison : -comparison;
+}
+
+export function sortRatingRows<T extends AnalystRatingRecord>(
+  rows: readonly T[],
+  preference: RatingSortPreference,
+): T[] {
+  return rows
+    .map((row, index) => ({ row, index }))
+    .sort((left, right) => {
+      const primary = compareSortValues(
+        ratingSortValue(left.row, preference.columnId),
+        ratingSortValue(right.row, preference.columnId),
+        preference.direction,
+      );
+      if (primary !== 0) return primary;
+
+      const dateTieBreak = preference.columnId === "date"
+        ? 0
+        : compareSortValues(
+          ratingSortValue(left.row, "date"),
+          ratingSortValue(right.row, "date"),
+          "desc",
+        );
+      if (dateTieBreak !== 0) return dateTieBreak;
+
+      return left.index - right.index;
+    })
+    .map((entry) => entry.row);
+}
+
+export function nextRatingSortPreference(
+  current: RatingSortPreference,
+  columnId: string,
+): RatingSortPreference {
+  const typedColumnId = columnId as RatingColumnId;
+  if (current.columnId !== typedColumnId) {
+    return {
+      columnId: typedColumnId,
+      direction: DEFAULT_RATING_SORT_DIRECTIONS[typedColumnId] ?? "asc",
+    };
+  }
+  return {
+    columnId: typedColumnId,
+    direction: current.direction === "asc" ? "desc" : "asc",
+  };
+}
+
 function AnalystResearchView({ focused, width, height }: { focused: boolean; width: number; height: number }) {
   const dataProvider = useAssetData();
   const { symbol, exchange } = useSymbolBinding();
+  const [sortPreference, setSortPreference] = useState<RatingSortPreference>(DEFAULT_RATING_SORT);
   const loader = useCallback((nextSymbol: string, nextExchange: string, forceRefresh: boolean) => {
     if (!dataProvider?.getAnalystResearch) throw new Error("Analyst data unavailable");
     return dataProvider.getAnalystResearch(nextSymbol, nextExchange, forceRefresh ? { cacheMode: "refresh" } : undefined);
   }, [dataProvider]);
   const { data, loading, error, reload } = useTickerRequest<AnalystResearchData>(loader, symbol, exchange);
-  const rows = data?.ratings ?? [];
+  const rows = useMemo(() => sortRatingRows(data?.ratings ?? [], sortPreference), [data?.ratings, sortPreference]);
+  const ratingCurrency = data?.priceTarget?.currency ?? data?.currency ?? "USD";
 
   const renderCell = useCallback((
     row: AnalystResearchData["ratings"][number],
@@ -207,10 +342,20 @@ function AnalystResearchView({ focused, width, height }: { focused: boolean; wid
         return { text: row.action ?? "-", color: selectedColor ?? ratingActionColor(row.action) };
       case "current":
         return { text: row.current ?? "-", color: selectedColor ?? colors.text };
+      case "target": {
+        const delta = ratingTargetDelta(row);
+        const hasTarget = row.currentPriceTarget != null || row.priorPriceTarget != null;
+        return {
+          text: formatRatingTarget(row, ratingCurrency),
+          color: selectedColor ?? (hasTarget ? colors.textBright : colors.textDim),
+          backgroundColor: rowState.selected ? undefined : ratingTargetBackground(delta),
+          attributes: hasTarget ? TextAttributes.BOLD : undefined,
+        };
+      }
       case "prior":
         return { text: row.prior ?? "-", color: selectedColor ?? colors.textDim };
     }
-  }, []);
+  }, [ratingCurrency]);
 
   const handleKeyDown = useCallback((event: DataTableKeyEvent) => {
     if (event.name !== "r") return false;
@@ -219,6 +364,9 @@ function AnalystResearchView({ focused, width, height }: { focused: boolean; wid
     reload();
     return true;
   }, [reload]);
+  const handleHeaderClick = useCallback((columnId: string) => {
+    setSortPreference((current) => nextRatingSortPreference(current, columnId));
+  }, []);
 
   usePaneFooter("analyst-research", () => ({
     info: [
@@ -237,15 +385,14 @@ function AnalystResearchView({ focused, width, height }: { focused: boolean; wid
       onRootKeyDown={handleKeyDown}
       columns={RATING_COLUMNS}
       items={rows}
-      sortColumnId={null}
-      sortDirection="desc"
-      onHeaderClick={() => {}}
+      sortColumnId={sortPreference.columnId}
+      sortDirection={sortPreference.direction}
+      onHeaderClick={handleHeaderClick}
       getItemKey={(row, index) => `${row.date}:${row.firm}:${index}`}
       isSelected={() => false}
       onSelect={() => {}}
       renderCell={renderCell}
       emptyStateTitle={loading ? "Loading analyst data..." : error ?? "No analyst data"}
-      showHorizontalScrollbar={false}
     />
   );
 }

package/src/plugins/builtin/ticker-detail/pane.tsx

@@ -1,6 +1,6 @@
 import { Box } from "../../../ui";
 import { useShortcut } from "../../../react/input";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import type { DetailTabDef, PaneProps } from "../../../types/plugin";
 import { quoteSubscriptionTargetFromTicker } from "../../../market-data/request-types";
 import {
@@ -33,6 +33,29 @@ function sameStringSet(left: Set<string>, right: Set<string>): boolean {
   return true;
 }
 
+function registryDetailTabsSnapshot(registry: ReturnType<typeof getSharedRegistry>): string {
+  if (!registry) return "";
+  return [...registry.detailTabs.values()]
+    .map((tab) => `${tab.id}:${tab.name}:${tab.order}:${registry.getDetailTabPluginId?.(tab.id) ?? ""}`)
+    .join("\0");
+}
+
+function useRegistryDetailTabsSnapshot(registry: ReturnType<typeof getSharedRegistry>): string {
+  const subscribe = useCallback((onStoreChange: () => void) => {
+    const events = registry?.events;
+    if (!events) return () => {};
+    const unregisterRegistered = events.on("plugin:registered", onStoreChange);
+    const unregisterUnregistered = events.on("plugin:unregistered", onStoreChange);
+    return () => {
+      unregisterRegistered();
+      unregisterUnregistered();
+    };
+  }, [registry]);
+
+  const getSnapshot = useCallback(() => registryDetailTabsSnapshot(registry), [registry]);
+  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+}
+
 export function TickerDetailPane({ focused, width, height }: PaneProps) {
   const dispatch = useAppDispatch();
   const config = useAppSelector((state) => state.config);
@@ -54,6 +77,7 @@ export function TickerDetailPane({ focused, width, height }: PaneProps) {
 
   const disabledPlugins = config.disabledPlugins;
   const registry = getSharedRegistry();
+  const detailTabsSnapshot = useRegistryDetailTabsSnapshot(registry);
   const pluginTabs = useMemo<DetailTabDef[]>(() => (
     registry
       ? [...registry.detailTabs.values()].filter((tab) => {
@@ -61,7 +85,7 @@ export function TickerDetailPane({ focused, width, height }: PaneProps) {
         return !ownerId || !disabledPlugins.includes(ownerId);
       })
       : []
-  ), [disabledPlugins, registry]);
+  ), [disabledPlugins, registry, detailTabsSnapshot]);
   const allTabs = buildVisibleDetailTabs(pluginTabs, ticker, financials, {
     config,
     hasOptionsChain,
@@ -84,26 +108,17 @@ export function TickerDetailPane({ focused, width, height }: PaneProps) {
     return next;
   }, [mountedTabIds, resolvedTabId, visibleTabIds]);
 
-  const allTabsRef = useRef(allTabs);
-  allTabsRef.current = allTabs;
-
   const stateRef = useRef({
     focused,
     chartInteractive,
     pluginCaptured,
     activeTabId: resolvedTabId,
-    tabIdx: Math.max(0, allTabs.findIndex((tab) => tab.id === resolvedTabId)),
-    allTabCount: allTabs.length,
-    hideTabs: paneSettings.hideTabs,
   });
   stateRef.current = {
     focused,
     chartInteractive,
     pluginCaptured,
     activeTabId: resolvedTabId,
-    tabIdx: Math.max(0, allTabs.findIndex((tab) => tab.id === resolvedTabId)),
-    allTabCount: allTabs.length,
-    hideTabs: paneSettings.hideTabs,
   };
 
   const setChartInteractiveEager = useCallback((value: boolean) => {
@@ -162,17 +177,7 @@ export function TickerDetailPane({ focused, width, height }: PaneProps) {
       if (currentState.chartInteractive) return;
     }
 
-    if (currentState.hideTabs) return;
-
-    const tabs = allTabsRef.current;
-    if (event.name === "h" || event.name === "left") {
-      const nextIndex = Math.max(currentState.tabIdx - 1, 0);
-      setActiveTabId(tabs[nextIndex]!.id);
-    } else if (event.name === "l" || event.name === "right") {
-      const nextIndex = Math.min(currentState.tabIdx + 1, currentState.allTabCount - 1);
-      setActiveTabId(tabs[nextIndex]!.id);
-    }
-  }, [setActiveTabId, setChartInteractiveEager]);
+  }, [setChartInteractiveEager]);
 
   useShortcut(handleKeyboard);
 
@@ -196,6 +201,7 @@ export function TickerDetailPane({ focused, width, height }: PaneProps) {
           tabs={allTabs.map((tab) => ({ label: tab.name, value: tab.id }))}
           activeValue={resolvedTabId}
           onSelect={setActiveTabId}
+          focused={focused && !pluginCaptured && !(resolvedTabId === "chart" && chartInteractive)}
         />
       )}
 

package/src/plugins/builtin/ticker-detail.test.tsx

@@ -19,6 +19,7 @@ import {
   type BrokerInstanceConfig,
 } from "../../types/config";
 import { createTestPluginRuntime } from "../../test-support/plugin-runtime";
+import { EventBus } from "../event-bus";
 import type { DataProvider } from "../../types/data-provider";
 import type { TickerFinancials } from "../../types/financials";
 import type { DetailTabDef } from "../../types/plugin";
@@ -543,6 +544,43 @@ describe("TickerDetailPane", () => {
     expect(frame).not.toContain("SEC");
   });
 
+  test("refreshes plugin tabs when registration completes after the pane mounted", async () => {
+    const detailTabs = new Map<string, DetailTabDef>();
+    const events = new EventBus();
+    setSharedRegistryForTests({
+      detailTabs,
+      events,
+      getDetailTabPluginId: () => "company-research",
+    } as unknown as PluginRegistry);
+    setOptionsProvider(createProvider(false));
+
+    testSetup = await testRender(
+      <DetailHarness
+        config={createDetailConfig("AAPL")}
+        ticker={makeTicker("AAPL")}
+        financials={null}
+      />,
+      { width: 90, height: 24 },
+    );
+
+    await flushFrame();
+    expect(testSetup.captureCharFrame()).not.toContain("Analyst");
+
+    await act(async () => {
+      detailTabs.set("analyst-research", {
+        id: "analyst-research",
+        name: "Analyst",
+        order: 32,
+        component: () => <text>Analyst body</text>,
+        isVisible: ({ ticker }) => !!ticker,
+      });
+      events.emit("plugin:registered", { pluginId: "company-research" });
+    });
+    await flushFrame();
+
+    expect(testSetup.captureCharFrame()).toContain("Analyst");
+  });
+
   test("passes visible tab content height to plugin tabs", async () => {
     let receivedHeight: number | null = null;
     const probeTab: DetailTabDef["component"] = ({ height }) => {

package/src/plugins/plugin-runtime.test.tsx

@@ -20,6 +20,7 @@ import {
   usePluginPaneActions,
   usePluginPaneState,
   usePluginState,
+  usePluginTickerActions,
   useSetPluginConfigStates,
 } from "./plugin-runtime";
 
@@ -244,6 +245,39 @@ describe("plugin runtime hooks", () => {
     ]);
   });
 
+  test("scopes ticker navigation to the rendering pane", async () => {
+    const calls: string[] = [];
+    let actions: ReturnType<typeof usePluginTickerActions> | null = null;
+
+    const runtime = createTestPluginRuntime({
+      navigateTicker(symbol: string, options?: { sourcePaneId?: string | null }) {
+        calls.push(`${symbol}:${options?.sourcePaneId ?? ""}`);
+      },
+    });
+
+    function HookProbe() {
+      actions = usePluginTickerActions();
+      return <text>ticker-actions</text>;
+    }
+
+    testSetup = await testRender(
+      <PaneInstanceProvider paneId="comparison-chart:main">
+        <PluginRenderProvider pluginId="comparison-chart" runtime={runtime}>
+          <HookProbe />
+        </PluginRenderProvider>
+      </PaneInstanceProvider>,
+      { width: 40, height: 5 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
+
+    actions?.navigateTicker("MSFT");
+
+    expect(calls).toEqual(["MSFT:comparison-chart:main"]);
+  });
+
   test("exposes renderer pane actions through the plugin hook", async () => {
     const calls: string[] = [];
     let actions: ReturnType<typeof usePluginPaneActions> | null = null;

package/src/plugins/plugin-runtime.tsx

@@ -13,6 +13,7 @@ import {
   useAppDispatch,
   useAppSelector,
   useAppStateRef,
+  useOptionalPaneInstanceId,
   usePaneInstanceId,
   type PaneRuntimeState,
 } from "../state/app-context";
@@ -30,7 +31,7 @@ export interface PluginRuntimeAccess {
   syncBrokerInstance(instanceId: string): Promise<void>;
   removeBrokerInstance(instanceId: string): Promise<void>;
   pinTicker(symbol: string, options?: { floating?: boolean; paneType?: string }): void;
-  navigateTicker(symbol: string): void;
+  navigateTicker(symbol: string, options?: { sourcePaneId?: string | null }): void;
   selectTicker(symbol: string, paneId?: string): void;
   switchTab(tabId: string, paneId?: string): void;
   switchPanel(panel: "left" | "right"): void;
@@ -85,9 +86,13 @@ function usePluginRenderContext(): PluginRenderContextValue {
 
 export function usePluginTickerActions() {
   const { runtime } = usePluginRenderContext();
+  const sourcePaneId = useOptionalPaneInstanceId();
+  const navigateTicker = useCallback((symbol: string) => {
+    runtime.navigateTicker(symbol, { sourcePaneId });
+  }, [runtime, sourcePaneId]);
   return {
     pinTicker: runtime.pinTicker,
-    navigateTicker: runtime.navigateTicker,
+    navigateTicker,
   };
 }
 

package/src/plugins/prediction-markets/controller.ts

@@ -11,7 +11,6 @@ import { getAdjacentPredictionCategoryId } from "./categories";
 import { usePredictionMarketsDataState } from "./controller-data";
 import { resolvePredictionKeyboardCommand } from "./keyboard";
 import {
-  getAdjacentPredictionDetailTab,
   getAdjacentPredictionVenueScope,
   parsePredictionSearchShortcut,
   parsePredictionVenueScope,
@@ -520,20 +519,6 @@ export function usePredictionMarketsController({
           return;
         }
 
-        if (command === "previous-category") {
-          event.stopPropagation?.();
-          event.preventDefault?.();
-          setDetailTab(getAdjacentPredictionDetailTab(detailTab, "previous"));
-          return;
-        }
-
-        if (command === "next-category") {
-          event.stopPropagation?.();
-          event.preventDefault?.();
-          setDetailTab(getAdjacentPredictionDetailTab(detailTab, "next"));
-          return;
-        }
-
         return;
       }
 

package/src/plugins/prediction-markets/detail/pane.tsx

@@ -243,6 +243,7 @@ export function PredictionMarketDetailPane({
           activeValue={detailTab}
           onSelect={(value) => onDetailTabChange(value as PredictionDetailTab)}
           compact
+          focused={focused}
         />
       </Box>
 

package/src/plugins/registry.ts

@@ -141,7 +141,7 @@ export class PluginRegistry implements PluginRuntimeAccess {
   hidePaneFn: ((paneId: string) => void) = () => {};
   focusPaneFn: ((paneId: string) => void) = () => {};
   pinTickerFn: ((symbol: string, options?: { floating?: boolean; paneType?: string }) => void) = () => {};
-  navigateTickerFn: ((symbol: string) => void) = () => {};
+  navigateTickerFn: ((symbol: string, options?: { sourcePaneId?: string | null }) => void) = () => {};
   getMarketData = () => this.marketData;
   getCapability = (capabilityId: string) => this.capabilities.get(capabilityId)?.capability ?? null;
   getBrokerAdapter = (brokerType: string) => this.brokersMap.get(brokerType) ?? null;
@@ -154,8 +154,8 @@ export class PluginRegistry implements PluginRuntimeAccess {
   pinTicker = (symbol: string, options?: { floating?: boolean; paneType?: string }) => {
     this.pinTickerFn(symbol, options);
   };
-  navigateTicker = (symbol: string) => {
-    this.navigateTickerFn(symbol);
+  navigateTicker = (symbol: string, options?: { sourcePaneId?: string | null }) => {
+    this.navigateTickerFn(symbol, options);
   };
   selectTicker = (symbol: string, paneId?: string) => {
     this.selectTickerFn(symbol, paneId);

package/src/plugins/ticker-navigation.test.ts

@@ -0,0 +1,66 @@
+import { describe, expect, test } from "bun:test";
+import { createPaneInstance, type LayoutConfig, type PaneInstanceConfig } from "../types/config";
+import {
+  resolveTickerNavigationDetailPane,
+  shouldFocusTickerNavigationTarget,
+} from "./ticker-navigation";
+
+function createLayout(instances: PaneInstanceConfig[]): LayoutConfig {
+  return {
+    dockRoot: { kind: "pane", instanceId: instances[0]?.instanceId ?? "" },
+    instances,
+    floating: instances.slice(1).map((instance, index) => ({
+      instanceId: instance.instanceId,
+      x: 2 + index,
+      y: 2 + index,
+      width: 40,
+      height: 12,
+    })),
+    detached: [],
+  };
+}
+
+describe("resolveTickerNavigationDetailPane", () => {
+  test("prefers the detail pane following the pane that opened ticker navigation", () => {
+    const layout = createLayout([
+      createPaneInstance("portfolio-list", {
+        instanceId: "portfolio-list:main",
+        binding: { kind: "none" },
+      }),
+      createPaneInstance("comparison-chart", {
+        instanceId: "comparison-chart:main",
+        binding: { kind: "none" },
+      }),
+      createPaneInstance("ticker-detail", {
+        instanceId: "ticker-detail:portfolio",
+        binding: { kind: "follow", sourceInstanceId: "portfolio-list:main" },
+      }),
+      createPaneInstance("ticker-detail", {
+        instanceId: "ticker-detail:compare",
+        binding: { kind: "follow", sourceInstanceId: "comparison-chart:main" },
+      }),
+    ]);
+
+    expect(
+      resolveTickerNavigationDetailPane(layout, "comparison-chart:main")?.instanceId,
+    ).toBe("ticker-detail:compare");
+  });
+});
+
+describe("shouldFocusTickerNavigationTarget", () => {
+  test("does not focus stale async ticker navigation after the user moves to another pane", () => {
+    expect(shouldFocusTickerNavigationTarget({
+      sourcePaneId: "comparison-chart:main",
+      currentFocusedPaneId: "portfolio-list:main",
+      targetPaneId: "ticker-detail:compare",
+    })).toBe(false);
+  });
+
+  test("keeps focusing when the source pane still owns the latest interaction", () => {
+    expect(shouldFocusTickerNavigationTarget({
+      sourcePaneId: "comparison-chart:main",
+      currentFocusedPaneId: "comparison-chart:main",
+      targetPaneId: "ticker-detail:compare",
+    })).toBe(true);
+  });
+});

package/src/plugins/ticker-navigation.ts

@@ -0,0 +1,44 @@
+import { findPaneInstance, type LayoutConfig, type PaneInstanceConfig } from "../types/config";
+import { isPaneInLayout } from "./pane-manager";
+
+export function resolveTickerNavigationDetailPane(
+  layout: LayoutConfig,
+  sourcePaneId: string | null,
+): PaneInstanceConfig | null {
+  const sourceInstance = sourcePaneId ? findPaneInstance(layout, sourcePaneId) : null;
+
+  return (
+    sourceInstance?.paneId === "ticker-detail" && isPaneInLayout(layout, sourceInstance.instanceId)
+      ? sourceInstance
+      : null
+  )
+    ?? layout.instances.find((instance) =>
+      instance.paneId === "ticker-detail"
+      && instance.binding?.kind === "follow"
+      && instance.binding.sourceInstanceId === sourcePaneId
+      && isPaneInLayout(layout, instance.instanceId)
+    )
+    ?? layout.instances.find((instance) =>
+      instance.paneId === "ticker-detail"
+      && instance.binding?.kind === "follow"
+      && isPaneInLayout(layout, instance.instanceId)
+    )
+    ?? layout.instances.find((instance) =>
+      instance.paneId === "ticker-detail"
+      && isPaneInLayout(layout, instance.instanceId)
+    )
+    ?? null;
+}
+
+export function shouldFocusTickerNavigationTarget({
+  sourcePaneId,
+  currentFocusedPaneId,
+  targetPaneId,
+}: {
+  sourcePaneId: string | null;
+  currentFocusedPaneId: string | null;
+  targetPaneId: string | null;
+}): boolean {
+  if (!sourcePaneId) return true;
+  return currentFocusedPaneId === sourcePaneId || currentFocusedPaneId === targetPaneId;
+}

package/src/react/input.ts

@@ -19,7 +19,7 @@ export interface KeyEventLike {
 export interface ShortcutOptions {
   enabled?: boolean;
   scope?: string;
-  phase?: "normal" | "after";
+  phase?: "before" | "normal" | "after";
 }
 
 export interface InputHost {