gloomberb 0.6.0 → 0.7.0

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

@@ -27,7 +27,7 @@ import {
   getKeyboardPanCellCount,
   resolveDragPanOffset,
 } from "./chart-scroll";
-import { getVisibleWindow, projectChartData, resolveBarSize, resolveStableOhlcProjectionOptions, type ProjectedChartPoint } from "./chart-data";
+import { projectChartData, resolveBarSize, resolveStableOhlcProjectionOptions, type ProjectedChartPoint } from "./chart-data";
 import {
   buildPresetDateWindow,
   buildVisibleDateWindow,
@@ -110,7 +110,6 @@ import {
 } from "./chart-types";
 import {
   computeBitmapSize,
-  intersectCellRects,
   renderNativeChartBase,
   renderNativeCrosshairOverlay,
   type CellRect,
@@ -121,8 +120,14 @@ import { ensureKittySupport, getCachedKittySupport } from "./native/kitty-suppor
 import { resolveChartRendererState } from "./native/renderer-selection";
 import { getNativeSurfaceManager } from "./native/surface-manager";
 import { syncCachedNativeSurface } from "./native/surface-sync";
+import {
+  getRenderableCellRect,
+  resolveNativeSurfaceVisibleRect,
+  type NativeSurfaceRenderableNode,
+} from "./native/surface-visibility";
 import type { PricePoint, TickerFinancials } from "../../types/financials";
 import type { TickerRecord } from "../../types/ticker";
+import { TimeAxisLabel } from "./time-axis-label";
 
 const MODE_CHIPS: Record<ChartRenderMode, string> = {
   area: "A",
@@ -169,7 +174,6 @@ interface StockChartProps {
 }
 
 interface ResolvedStockChartProps extends StockChartProps {
-  symbol: string | null;
   ticker: TickerRecord | null;
   financials: TickerFinancials | null;
 }
@@ -275,14 +279,6 @@ interface DisplayCursorState {
   pixelY: number | null;
 }
 
-interface RenderableNode {
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  parent: RenderableNode | null;
-}
-
 const EMPTY_DISPLAY_CURSOR: DisplayCursorState = {
   cellX: null,
   cellY: null,
@@ -522,41 +518,6 @@ function resolveCursorMotionKind(
     : "cell";
 }
 
-function extractCellRect(renderable: RenderableNode): CellRect {
-  return {
-    x: renderable.x,
-    y: renderable.y,
-    width: renderable.width,
-    height: renderable.height,
-  };
-}
-
-function resolveVisibleRect(
-  renderable: RenderableNode | null,
-  terminalWidth: number,
-  terminalHeight: number,
-): CellRect | null {
-  if (!renderable) return null;
-
-  let visible: CellRect = {
-    x: 0,
-    y: 0,
-    width: terminalWidth,
-    height: terminalHeight,
-  };
-  let current: RenderableNode | null = renderable;
-
-  while (current) {
-    const currentRect = extractCellRect(current);
-    const nextVisible = intersectCellRects(visible, currentRect);
-    if (!nextVisible) return null;
-    visible = nextVisible;
-    current = current.parent;
-  }
-
-  return visible;
-}
-
 function buildBlankPlotLines(width: number, height: number): string[] {
   return Array.from({ length: height }, () => " ".repeat(width));
 }
@@ -765,14 +726,6 @@ function isSeriesAcceptedForRequest(
   return windowPoints.length >= minimumPointCount;
 }
 
-function canRenderAutoViewForWindow(
-  render: AutoRenderedView | null,
-  requestedWindow: DateWindowRange | null | undefined,
-): render is AutoRenderedView {
-  if (!render || !requestedWindow?.start || !requestedWindow.end) return false;
-  return getWindowPoints(render.data, requestedWindow).length > 0;
-}
-
 export function resolveAutoDisplayState(options: {
   shouldUseRenderedAutoView: boolean;
   renderedAutoView: AutoRenderedView | null;
@@ -811,13 +764,6 @@ export function resolveAutoDisplayState(options: {
   };
 }
 
-export function resolveVisibleChartDateWindow(
-  points: readonly Pick<PricePoint, "date">[],
-  preferredWindow: DateWindowRange | null | undefined,
-): DateWindowRange | null {
-  return getDateWindowBounds(getPointDates(points)) ?? preferredWindow ?? null;
-}
-
 function buildDateWindowFromIndices(dates: readonly Date[], startIdx: number, endIdx: number): DateWindowRange | null {
   if (dates.length === 0 || endIdx <= startIdx) return null;
   return {
@@ -1469,8 +1415,8 @@ function buildIndicatorProjectionKey(options: {
 }
 
 export function StockChart(props: StockChartProps) {
-  const { symbol, ticker, financials } = usePaneTicker();
-  return <ResolvedStockChart {...props} symbol={symbol} ticker={ticker} financials={financials} />;
+  const { ticker, financials } = usePaneTicker();
+  return <ResolvedStockChart {...props} ticker={ticker} financials={financials} />;
 }
 
 export const ResolvedStockChart = memo(function ResolvedStockChart({
@@ -1487,7 +1433,6 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
   showVolume: showVolumeOverride,
   footerControls,
   footerHints,
-  symbol,
   ticker,
   financials,
 }: ResolvedStockChartProps) {
@@ -1553,6 +1498,7 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
   const lastCanvasBaseBitmapRef = useRef<{ key: string; bitmap: NativeChartBitmap } | null>(null);
   const displayCursorRef = useRef<DisplayCursorState>(EMPTY_DISPLAY_CURSOR);
   const targetCursorRef = useRef<DisplayCursorState>(EMPTY_DISPLAY_CURSOR);
+  const mouseCrosshairDisabledRef = useRef(false);
   const cursorMotionKindRef = useRef<ChartCursorMotionKind>("discrete");
   const animationFrameRef = useRef<number | null>(null);
   const pendingCanonicalResetRef = useRef(1);
@@ -2945,6 +2891,11 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
     if (!interactive) return;
 
     switch (key) {
+      case "escape":
+        mouseCrosshairDisabledRef.current = true;
+        updateDisplayCursorTarget(EMPTY_DISPLAY_CURSOR, "discrete");
+        commitSelectionCursor({ cursorX: null, cursorY: null });
+        return;
       case "left":
         if (event.shift) {
           if (effectiveResolution === "auto") {
@@ -2962,6 +2913,7 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
             return { ...cleared, panOffset: current.panOffset + panStep };
           });
         } else {
+          mouseCrosshairDisabledRef.current = false;
           cursorMotionKindRef.current = "discrete";
           const pointCount = projection.points.length;
           const currentIndex = pointCount <= 0
@@ -3013,6 +2965,7 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
             return cleared.panOffset === nextPanOffset ? cleared : { ...cleared, panOffset: nextPanOffset };
           });
         } else {
+          mouseCrosshairDisabledRef.current = false;
           cursorMotionKindRef.current = "discrete";
           const pointCount = projection.points.length;
           const currentIndex = pointCount <= 0
@@ -3097,6 +3050,19 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
     colors: chartColors,
     timeAxisDates,
   }), [axisMode, chartColors, chartHeight, chartWidth, compact, projection.effectiveMode, projection.points, selectionCursorX, selectionCursorY, showVolume, timeAxisDates, volumeHeight]);
+  const displayScene = useMemo(() => buildChartScene(projection.points, {
+    width: chartWidth,
+    height: chartHeight,
+    showVolume: showVolume && !compact,
+    volumeHeight,
+    cursorX: displayCursorX,
+    cursorY: displayCursorY,
+    mode: projection.effectiveMode,
+    axisMode,
+    colors: chartColors,
+    timeAxisDates,
+    indicators,
+  }), [axisMode, chartColors, chartHeight, chartWidth, compact, displayCursorX, displayCursorY, indicators, projection.effectiveMode, projection.points, showVolume, timeAxisDates, volumeHeight]);
   const snappedSelectionCursorX = selectionScene
     ? getPointTerminalColumn(selectionScene.activeIdx, projection.points.length, chartWidth, projection.effectiveMode)
     : null;
@@ -3236,8 +3202,9 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
 
     const syncPlacement = () => {
       if (effectiveRenderer !== "kitty" || !rendererState.nativeReady || !plotRef.current) return;
-      const rect = extractCellRect(plotRef.current);
-      const visibleRect = resolveVisibleRect(plotRef.current, renderer.terminalWidth, renderer.terminalHeight);
+      const plot = plotRef.current as NativeSurfaceRenderableNode;
+      const rect = getRenderableCellRect(plot);
+      const visibleRect = resolveNativeSurfaceVisibleRect(plot, renderer.terminalWidth, renderer.terminalHeight);
       const previous = lastNativeGeometryRef.current;
       if (previous
         && previous.rect.x === rect.x
@@ -3292,8 +3259,9 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
       return;
     }
 
-    const plotRect = extractCellRect(plotRef.current);
-    const visibleRect = resolveVisibleRect(plotRef.current, renderer.terminalWidth, renderer.terminalHeight);
+    const plot = plotRef.current as NativeSurfaceRenderableNode;
+    const plotRect = getRenderableCellRect(plot);
+    const visibleRect = resolveNativeSurfaceVisibleRect(plot, renderer.terminalWidth, renderer.terminalHeight);
     const bitmapSize = computeBitmapSize(plotRect, renderer.resolution, renderer.terminalWidth, renderer.terminalHeight);
     const bitmapKey = buildNativeBitmapKey(
       projection.points.length,
@@ -3364,8 +3332,9 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
       return;
     }
 
-    const plotRect = extractCellRect(plotRef.current);
-    const visibleRect = resolveVisibleRect(plotRef.current, renderer.terminalWidth, renderer.terminalHeight);
+    const plot = plotRef.current as NativeSurfaceRenderableNode;
+    const plotRect = getRenderableCellRect(plot);
+    const visibleRect = resolveNativeSurfaceVisibleRect(plot, renderer.terminalWidth, renderer.terminalHeight);
     const bitmapSize = computeBitmapSize(plotRect, renderer.resolution, renderer.terminalWidth, renderer.terminalHeight);
     const renderablePixelSize = getRenderablePixelSize(plotRef.current, renderer);
     const overlayPixelX = scaleLocalPixelCoordinate(
@@ -3455,6 +3424,8 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
     : null;
   const isUpdating = !compact && (renderBodyState.updating || boundsBodyState.updating);
   const timeAxisLabel = selectionScene?.timeLabels ?? staticResult.timeLabels;
+  const cursorTimeAxisColumn = hasDisplayCursor ? displayScene?.cursorColumn ?? null : null;
+  const cursorTimeAxisDate = hasDisplayCursor ? displayScene?.dateAtCursor ?? null : null;
   const timeAxisBox = (
     <Box
       height={1}
@@ -3462,7 +3433,14 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
       overflow="hidden"
       data-gloom-role="chart-time-axis"
     >
-      <Text fg={colors.textDim} style={{ whiteSpace: "pre" }}>{timeAxisLabel}</Text>
+      <TimeAxisLabel
+        timeLabels={timeAxisLabel}
+        width={chartWidth}
+        cursorColumn={cursorTimeAxisColumn}
+        cursorDate={cursorTimeAxisDate}
+        dates={timeAxisDates}
+        cursorColor={chartColors.crosshairColor}
+      />
     </Box>
   );
   const chartFooterHints = useMemo<PaneHint[]>(() => {
@@ -3609,6 +3587,7 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
 
   const handlePlotMove = (event: ChartMouseEvent) => {
     if (!interactive || compact) return;
+    if (mouseCrosshairDisabledRef.current) return;
     const localPointer = getLocalPlotPointer(event, plotRef.current, renderer);
     if (!localPointer) return;
     const selectionCursor = resolveSelectionCursor(localPointer, projection.points.length, chartWidth, projection.effectiveMode);
@@ -3630,6 +3609,7 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
     if (compact) return;
     if (!interactive) onActivate?.();
     focusPaneForMouseInteraction(event);
+    mouseCrosshairDisabledRef.current = false;
     const localPointer = getLocalPlotPointer(event, plotRef.current, renderer);
     if (!localPointer) return;
     const selectionCursor = resolveSelectionCursor(localPointer, projection.points.length, chartWidth, projection.effectiveMode);
@@ -3654,6 +3634,7 @@ export const ResolvedStockChart = memo(function ResolvedStockChart({
 
   const handlePlotDrag = (event: ChartMouseEvent) => {
     if (compact || (!interactive && !dragRef.current)) return;
+    if (mouseCrosshairDisabledRef.current && !dragRef.current) return;
     const localPointer = getLocalPlotPointer(event, plotRef.current, renderer);
     if (localPointer) {
       const selectionCursor = resolveSelectionCursor(localPointer, projection.points.length, chartWidth, projection.effectiveMode);

package/src/components/chart/time-axis-label.tsx

@@ -0,0 +1,43 @@
+import { useMemo } from "react";
+import { Span, Text } from "../../ui";
+import { colors } from "../../theme/colors";
+import { buildCursorTimeAxisSegments } from "./chart-renderer";
+
+interface TimeAxisLabelProps {
+  timeLabels: string;
+  width: number;
+  cursorColumn: number | null;
+  cursorDate: Date | string | number | null;
+  dates: Array<Date | string | number>;
+  cursorColor: string;
+}
+
+export function TimeAxisLabel({
+  timeLabels,
+  width,
+  cursorColumn,
+  cursorDate,
+  dates,
+  cursorColor,
+}: TimeAxisLabelProps) {
+  const segments = useMemo(() => buildCursorTimeAxisSegments({
+    timeLabels,
+    width,
+    cursorColumn,
+    cursorDate,
+    dates,
+  }), [cursorColumn, cursorDate, dates, timeLabels, width]);
+
+  return (
+    <Text style={{ whiteSpace: "pre" }}>
+      {segments.map((segment, index) => (
+        <Span
+          key={index}
+          fg={segment.highlighted ? cursorColor : colors.textDim}
+        >
+          {segment.text}
+        </Span>
+      ))}
+    </Text>
+  );
+}

package/src/components/command-bar/command-bar.test.tsx

@@ -1,7 +1,6 @@
 import { afterEach, describe, expect, test } from "bun:test";
 import { act, useReducer } from "react";
-import { testRender } from "../../renderers/opentui/test-utils";
-import { DialogProvider } from "@opentui-ui/dialog/react";
+import { TestDialogProvider, testRender } from "../../renderers/opentui/test-utils";
 import { CommandBar } from "./command-bar";
 import { AppContext, type AppState, appReducer, createInitialState, getEffectiveThemeId } from "../../state/app-context";
 import { createTestDataProvider } from "../../test-support/data-provider";
@@ -213,9 +212,9 @@ function makePluginRegistry(hasPaneSettings: (paneId: string) => boolean = () =>
     getPluginPaneTemplateIds: () => [],
     hasPaneSettings,
     events: { emit: () => {} },
-    hideWidget: () => {},
+    hidePane: () => {},
     pinTicker: () => {},
-    showWidget: () => {},
+    showPane: () => {},
     updateLayoutFn: () => {},
     getTermSizeFn: () => ({ width: 80, height: 24 }),
     notify: () => {},
@@ -304,7 +303,7 @@ function CommandBarHarness({
 
   return (
     <AppContext value={{ state: currentState, dispatch: currentDispatch }}>
-      <DialogProvider dialogOptions={{ style: { backgroundColor: "#000000", borderColor: "#ffffff", borderStyle: "single" } }}>
+      <TestDialogProvider>
         {live && <text>{`theme:${getEffectiveThemeId(currentState)}`}</text>}
         {showQueryState && <text>{`query:${currentState.commandBarQuery}`}</text>}
         {currentState.commandBarOpen && (
@@ -316,7 +315,7 @@ function CommandBarHarness({
             onCheckForUpdates={onCheckForUpdates}
           />
         )}
-      </DialogProvider>
+      </TestDialogProvider>
     </AppContext>
   );
 }
@@ -740,7 +739,12 @@ describe("CommandBar", () => {
     expect(frame).toContain("Commands");
     expect(frame).toContain("TH");
     expect(frame).toContain("Themes");
-    expect(frame).toMatchSnapshot();
+    expect(frame).toContain("Amber");
+    expect(frame).toContain("Paper");
+    expect(frame).toContain("GitHub Light");
+    expect(frame).toContain("Solarized Light");
+    expect(frame).toContain("Gruvbox Light");
+    expect(frame).toContain("Nord Light");
   });
 
   test("renders plugin toggle state", async () => {
@@ -2197,6 +2201,50 @@ describe("CommandBar", () => {
     expect(frame).toContain("AAPL,");
   });
 
+  test("CMP with one resolved ticker opens inline completion instead of creating a one-symbol chart", async () => {
+    const created: Array<{ templateId: string; options?: Record<string, unknown> }> = [];
+
+    testSetup = await testRender(<CommandBarHarness
+      query="CMP AMD"
+      extraTickers={[makeTicker("AMD", "Advanced Micro Devices")]}
+      configurePluginRegistry={(pluginRegistry) => {
+        (pluginRegistry.panes as Map<string, any>).set("comparison-chart", {
+          id: "comparison-chart",
+          name: "Comparison Chart",
+          component: () => null,
+          defaultPosition: "right",
+        });
+        (pluginRegistry.paneTemplates as Map<string, any>).set("comparison-chart-pane", {
+          id: "comparison-chart-pane",
+          paneId: "comparison-chart",
+          label: "Comparison Chart",
+          description: "Compare multiple symbols in one pane",
+          shortcut: { prefix: "CMP", argPlaceholder: "tickers", argKind: "ticker-list" },
+          wizard: [{ key: "tickers", label: "Tickers", type: "text" }],
+          canCreate: (_context: unknown, options?: { symbols?: string[] | null }) => !options?.symbols || options.symbols.length >= 2,
+        });
+        pluginRegistry.createPaneFromTemplateAsyncFn = async (templateId, options) => {
+          created.push({ templateId, options });
+        };
+      }}
+    />, {
+      width: 100,
+      height: 20,
+    });
+
+    await testSetup.renderOnce();
+    await act(async () => {
+      testSetup!.mockInput.pressEnter();
+      await Bun.sleep(0);
+      await testSetup!.renderOnce();
+    });
+
+    const frame = await waitForFrameToContain("Tickers");
+    expect(created).toEqual([]);
+    expect(frame).toContain("Comparison Chart");
+    expect(frame).toContain("AMD");
+  });
+
   test("AI <prompt> opens the inline workflow and prefills the textarea prompt", async () => {
     const created: Array<{ templateId: string; options?: Record<string, unknown> }> = [];
 
@@ -2608,7 +2656,15 @@ describe("CommandBar", () => {
   });
 
   test("matches the direct help command", async () => {
-    testSetup = await testRender(<CommandBarHarness query="help" />, {
+    const openedPanes: string[] = [];
+    testSetup = await testRender(<CommandBarHarness
+      query="help"
+      configurePluginRegistry={(pluginRegistry) => {
+        pluginRegistry.showPane = (paneId: string) => {
+          openedPanes.push(paneId);
+        };
+      }}
+    />, {
       width: 80,
       height: 18,
     });
@@ -2618,6 +2674,13 @@ describe("CommandBar", () => {
     const frame = testSetup.captureCharFrame();
     expect(frame).toContain("Help");
     expect(frame).toContain("Navigation");
+
+    await act(async () => {
+      testSetup!.mockInput.pressEnter();
+      await testSetup!.renderOnce();
+    });
+
+    expect(openedPanes).toEqual(["help"]);
   });
 
   test("skips pane templates whose canCreate throws", async () => {