gloomberb 0.6.0 → 0.7.0

package/src/renderers/opentui/image-surface.tsx

@@ -0,0 +1,266 @@
+import { createElement, forwardRef, useCallback, useEffect, useMemo, useRef, useState, type ForwardedRef } from "react";
+import {
+  computeBitmapSize,
+  intersectCellRects,
+  type CellRect,
+  type NativeChartBitmap,
+} from "../../components/chart/native/chart-rasterizer";
+import { getCachedKittySupport, ensureKittySupport } from "../../components/chart/native/kitty-support";
+import { getNativeSurfaceManager } from "../../components/chart/native/surface-manager";
+import {
+  getRenderableCellRect,
+  resolveNativeSurfaceVisibleRect,
+  type NativeSurfaceRenderableNode,
+} from "../../components/chart/native/surface-visibility";
+import { useOptionalPaneInstanceId } from "../../state/app-context";
+import { useNativeRenderer, type BoxRenderable, type ImageSurfaceProps } from "../../ui";
+import { loadOpenTuiImageBitmap } from "./image-loader";
+
+interface NativeRenderableNode extends BoxRenderable, NativeSurfaceRenderableNode {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+  parent: NativeRenderableNode | null;
+  onLifecyclePass: (() => void) | null;
+}
+
+interface SurfaceTarget {
+  rect: CellRect;
+  visibleRect: CellRect | null;
+  pixelWidth: number;
+  pixelHeight: number;
+  bitmapKey: string;
+}
+
+interface CellInsets {
+  top: number;
+  right: number;
+  bottom: number;
+  left: number;
+}
+
+let nextImageSurfaceId = 1;
+
+function assignRef(ref: ForwardedRef<unknown>, value: unknown) {
+  if (typeof ref === "function") {
+    ref(value);
+    return;
+  }
+  if (ref) {
+    (ref as { current: unknown }).current = value;
+  }
+}
+
+function readInset(value: unknown): number {
+  return typeof value === "number" && Number.isFinite(value) ? Math.max(0, Math.floor(value)) : 0;
+}
+
+function resolveInsets(props: Record<string, unknown>): CellInsets {
+  const border = props.border ? 1 : 0;
+  const padding = readInset(props.padding);
+  const paddingX = readInset(props.paddingX ?? padding);
+  const paddingY = readInset(props.paddingY ?? padding);
+  return {
+    top: border + readInset(props.paddingTop ?? paddingY),
+    right: border + readInset(props.paddingRight ?? paddingX),
+    bottom: border + readInset(props.paddingBottom ?? paddingY),
+    left: border + readInset(props.paddingLeft ?? paddingX),
+  };
+}
+
+function sameRect(left: CellRect | null, right: CellRect | null): boolean {
+  if (left === right) return true;
+  if (!left || !right) return false;
+  return left.x === right.x
+    && left.y === right.y
+    && left.width === right.width
+    && left.height === right.height;
+}
+
+function sameTarget(left: SurfaceTarget | null, right: SurfaceTarget | null): boolean {
+  if (left === right) return true;
+  if (!left || !right) return false;
+  return left.bitmapKey === right.bitmapKey
+    && left.pixelWidth === right.pixelWidth
+    && left.pixelHeight === right.pixelHeight
+    && sameRect(left.rect, right.rect)
+    && sameRect(left.visibleRect, right.visibleRect);
+}
+
+function insetRect(rect: CellRect, insets: CellInsets): CellRect | null {
+  const width = rect.width - insets.left - insets.right;
+  const height = rect.height - insets.top - insets.bottom;
+  if (width <= 0 || height <= 0) return null;
+  return {
+    x: rect.x + insets.left,
+    y: rect.y + insets.top,
+    width,
+    height,
+  };
+}
+
+export const OpenTuiImageSurface = forwardRef<unknown, ImageSurfaceProps>(function OpenTuiImageSurface(
+  { children, src, alt: _alt, objectFit = "contain", ...props },
+  forwardedRef,
+) {
+  const renderer = useNativeRenderer();
+  const paneId = useOptionalPaneInstanceId();
+  const nativeSurfaceManager = useMemo(() => getNativeSurfaceManager(renderer), [renderer]);
+  const surfaceId = useRef(`opentui-image:${nextImageSurfaceId++}`).current;
+  const renderableRef = useRef<NativeRenderableNode | null>(null);
+  const [kittySupport, setKittySupport] = useState<boolean | null>(() => getCachedKittySupport(renderer));
+  const [target, setTarget] = useState<SurfaceTarget | null>(null);
+  const [bitmapState, setBitmapState] = useState<{ key: string; bitmap: NativeChartBitmap } | null>(null);
+  const [loadFailed, setLoadFailed] = useState(false);
+  const imageSrc = typeof src === "string" ? src.trim() : "";
+  const resolvedObjectFit = objectFit === "cover" ? "cover" : "contain";
+  const insets = useMemo(() => resolveInsets(props), [
+    props.border,
+    props.padding,
+    props.paddingX,
+    props.paddingY,
+    props.paddingTop,
+    props.paddingRight,
+    props.paddingBottom,
+    props.paddingLeft,
+  ]);
+
+  const setRenderableRef = useCallback((node: unknown) => {
+    renderableRef.current = node as NativeRenderableNode | null;
+    assignRef(forwardedRef, node);
+  }, [forwardedRef]);
+
+  useEffect(() => {
+    let cancelled = false;
+    setKittySupport(getCachedKittySupport(renderer));
+    ensureKittySupport(renderer).then((supported) => {
+      if (!cancelled) setKittySupport(supported);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [renderer]);
+
+  useEffect(() => {
+    setLoadFailed(false);
+    setBitmapState(null);
+  }, [imageSrc]);
+
+  useEffect(() => {
+    const renderable = renderableRef.current;
+    if (!renderable || !imageSrc || kittySupport !== true) {
+      setTarget(null);
+      return;
+    }
+
+    let mountTimer: Timer | null = null;
+    const previousLifecyclePass = renderable.onLifecyclePass;
+    const syncTarget = () => {
+      const outerRect = getRenderableCellRect(renderable);
+      const rect = insetRect(outerRect, insets);
+      if (!rect || !renderer.resolution || renderer.terminalWidth <= 0 || renderer.terminalHeight <= 0) {
+        setTarget((current) => (current === null ? current : null));
+        return;
+      }
+
+      const outerVisibleRect = resolveNativeSurfaceVisibleRect(renderable, renderer.terminalWidth, renderer.terminalHeight);
+      const visibleRect = outerVisibleRect ? intersectCellRects(rect, outerVisibleRect) : null;
+      const bitmapSize = computeBitmapSize(rect, renderer.resolution, renderer.terminalWidth, renderer.terminalHeight);
+      const bitmapKey = `${imageSrc}\n${resolvedObjectFit}\n${bitmapSize.pixelWidth}x${bitmapSize.pixelHeight}`;
+      const nextTarget: SurfaceTarget = {
+        rect,
+        visibleRect,
+        pixelWidth: bitmapSize.pixelWidth,
+        pixelHeight: bitmapSize.pixelHeight,
+        bitmapKey,
+      };
+      setTarget((current) => (sameTarget(current, nextTarget) ? current : nextTarget));
+    };
+    const lifecyclePass = () => {
+      previousLifecyclePass?.();
+      syncTarget();
+    };
+
+    renderable.onLifecyclePass = lifecyclePass;
+    renderer.registerLifecyclePass(renderable);
+    syncTarget();
+    mountTimer = setTimeout(() => {
+      syncTarget();
+      renderer.requestRender();
+    }, 0);
+
+    return () => {
+      if (mountTimer) clearTimeout(mountTimer);
+      if (renderable.onLifecyclePass === lifecyclePass) {
+        renderable.onLifecyclePass = previousLifecyclePass;
+      }
+      renderer.unregisterLifecyclePass(renderable);
+      setTarget(null);
+    };
+  }, [imageSrc, insets, kittySupport, renderer, resolvedObjectFit]);
+
+  useEffect(() => {
+    if (!target || !imageSrc || kittySupport !== true) {
+      setBitmapState(null);
+      return;
+    }
+
+    let cancelled = false;
+    setBitmapState((current) => (current?.key === target.bitmapKey ? current : null));
+    loadOpenTuiImageBitmap(imageSrc, {
+      width: target.pixelWidth,
+      height: target.pixelHeight,
+      objectFit: resolvedObjectFit,
+    }).then((bitmap) => {
+      if (!cancelled) {
+        setLoadFailed(false);
+        setBitmapState({ key: target.bitmapKey, bitmap });
+      }
+    }).catch(() => {
+      if (!cancelled) {
+        setLoadFailed(true);
+        setBitmapState(null);
+      }
+    });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [imageSrc, kittySupport, resolvedObjectFit, target]);
+
+  useEffect(() => {
+    return () => {
+      nativeSurfaceManager.removeSurface(surfaceId);
+    };
+  }, [nativeSurfaceManager, surfaceId]);
+
+  useEffect(() => {
+    if (kittySupport !== true
+      || loadFailed
+      || !target?.visibleRect
+      || !bitmapState
+      || bitmapState.key !== target.bitmapKey) {
+      nativeSurfaceManager.removeSurface(surfaceId);
+      return;
+    }
+
+    nativeSurfaceManager.upsertSurface({
+      id: surfaceId,
+      paneId: paneId ?? "__global__",
+      rect: target.rect,
+      visibleRect: target.visibleRect,
+      bitmap: bitmapState.bitmap,
+      bitmapKey: bitmapState.key,
+    });
+    renderer.requestRender();
+  }, [bitmapState, kittySupport, loadFailed, nativeSurfaceManager, paneId, renderer, surfaceId, target]);
+
+  const showFallback = kittySupport !== true
+    || loadFailed
+    || !target
+    || !bitmapState
+    || bitmapState.key !== target.bitmapKey;
+
+  return (createElement as any)("box", { ...props, ref: setRenderableRef }, showFallback ? children : null);
+});

package/src/renderers/opentui/input-host.tsx

@@ -1,14 +1,53 @@
-import { useMemo, type ReactNode } from "react";
-import { InputHostProvider, type InputHost } from "../../react/input";
+import { useLayoutEffect, useMemo, useRef, type ReactNode } from "react";
+import { InputHostProvider, type InputHost, type KeyEventLike, type ShortcutOptions } from "../../react/input";
 import { toKeyEventLike, useKeyboard, useTerminalDimensions } from "./host";
 
+interface ShortcutEntry {
+  handlerRef: { current: (event: KeyEventLike) => void };
+  enabledRef: { current: boolean };
+  phase: NonNullable<ShortcutOptions["phase"]>;
+  order: number;
+}
+
+let nextShortcutOrder = 1;
+
 export function OpenTuiInputHostProvider({ children }: { children: ReactNode }) {
+  const shortcutsRef = useRef<ShortcutEntry[]>([]);
+  const dispatchShortcut = (event: KeyEventLike) => {
+    const shortcuts = shortcutsRef.current;
+    for (const phase of ["normal", "after"] as const) {
+      if (phase === "after" && (event.defaultPrevented || event.propagationStopped)) return;
+      for (const entry of shortcuts) {
+        if (entry.phase !== phase || !entry.enabledRef.current) continue;
+        entry.handlerRef.current(event);
+        if (event.propagationStopped) return;
+      }
+    }
+  };
+
+  useKeyboard((event) => {
+    dispatchShortcut(toKeyEventLike(event));
+  });
+
   const host = useMemo<InputHost>(() => ({
     useShortcut(handler, options) {
-      useKeyboard((event) => {
-        if (options?.enabled === false) return;
-        handler(toKeyEventLike(event));
-      });
+      const handlerRef = useRef(handler);
+      const enabledRef = useRef(options?.enabled !== false);
+      handlerRef.current = handler;
+      enabledRef.current = options?.enabled !== false;
+
+      useLayoutEffect(() => {
+        const entry: ShortcutEntry = {
+          handlerRef,
+          enabledRef,
+          phase: options?.phase ?? "normal",
+          order: nextShortcutOrder++,
+        };
+        shortcutsRef.current = [...shortcutsRef.current, entry].sort((a, b) => a.order - b.order);
+        return () => {
+          shortcutsRef.current = shortcutsRef.current.filter((current) => current !== entry);
+        };
+      }, [options?.phase, options?.scope]);
     },
     useViewport() {
       const dimensions = useTerminalDimensions();

package/src/renderers/opentui/start.tsx

@@ -34,38 +34,56 @@ export async function startOpenTuiApp(): Promise<void> {
       cliLaunchRequest = dispatchResult.request;
     }
   }
-  startMainThreadMonitor("opentui");
+  const stopMainThreadMonitor = startMainThreadMonitor("opentui");
 
-  let dataDir = await getDataDir();
-  if (!dataDir) {
-    dataDir = join(process.env.HOME || "~", ".gloomberb");
-  }
+  let host: Awaited<ReturnType<typeof createOpenTuiHost>> | null = null;
+  let exitTimer: ReturnType<typeof setTimeout> | null = null;
+  const finishProcessExit = () => {
+    stopMainThreadMonitor();
+    if (exitTimer) return;
+    exitTimer = setTimeout(() => {
+      process.exit(process.exitCode ?? 0);
+    }, 0);
+  };
+  try {
+    let dataDir = await getDataDir();
+    if (!dataDir) {
+      dataDir = join(process.env.HOME || "~", ".gloomberb");
+    }
 
-  if (!existsSync(dataDir)) {
-    mkdirSync(dataDir, { recursive: true });
-  }
+    if (!existsSync(dataDir)) {
+      mkdirSync(dataDir, { recursive: true });
+    }
 
-  const config = await measurePerfAsync("startup.opentui.init-data-dir", () => initDataDir(dataDir));
-  const host = await measurePerfAsync("startup.opentui.create-host", () => createOpenTuiHost());
+    const config = await measurePerfAsync("startup.opentui.init-data-dir", () => initDataDir(dataDir));
+    host = await measurePerfAsync("startup.opentui.create-host", () => createOpenTuiHost());
+    host.renderer.once("destroy", finishProcessExit);
 
-  host.render(
-    <UiHostProvider ui={openTuiUiHost} renderer={host.rendererHost} nativeRenderer={host.nativeRenderer}>
-      <OpenTuiInputHostProvider>
-        <ToastHostProvider host={openTuiToastHost}>
-          <OpenTuiDialogHostProvider
-            size="medium"
-            dialogOptions={{ style: { backgroundColor: colors.bg, borderColor: colors.borderFocused, borderStyle: "single", paddingX: 2, paddingY: 1 } }}
-            backdropColor="#000000"
-            backdropOpacity={0.8}
-          >
-            <App
-              config={config}
-              externalPlugins={externalPlugins}
-              cliLaunchRequest={cliLaunchRequest}
-            />
-          </OpenTuiDialogHostProvider>
-        </ToastHostProvider>
-      </OpenTuiInputHostProvider>
-    </UiHostProvider>,
-  );
+    host.render(
+      <UiHostProvider ui={openTuiUiHost} renderer={host.rendererHost} nativeRenderer={host.nativeRenderer}>
+        <OpenTuiInputHostProvider>
+          <ToastHostProvider host={openTuiToastHost}>
+            <OpenTuiDialogHostProvider
+              size="medium"
+              dialogOptions={{ style: { backgroundColor: colors.bg, borderColor: colors.borderFocused, borderStyle: "single", paddingX: 2, paddingY: 1 } }}
+              backdropColor="#000000"
+              backdropOpacity={0.8}
+            >
+              <App
+                config={config}
+                externalPlugins={externalPlugins}
+                cliLaunchRequest={cliLaunchRequest}
+              />
+            </OpenTuiDialogHostProvider>
+          </ToastHostProvider>
+        </OpenTuiInputHostProvider>
+      </UiHostProvider>,
+    );
+  } catch (error) {
+    if (exitTimer) clearTimeout(exitTimer);
+    stopMainThreadMonitor();
+    host?.renderer.off("destroy", finishProcessExit);
+    host?.destroy();
+    throw error;
+  }
 }

package/src/renderers/opentui/test-utils.tsx

@@ -1,4 +1,5 @@
 import { useMemo, type ReactNode } from "react";
+import { DialogProvider } from "@opentui-ui/dialog/react";
 import { testRender as openTuiTestRender } from "@opentui/react/test-utils";
 import { createRoot as openTuiCreateRoot, useRenderer } from "@opentui/react";
 import { UiHostProvider, type NativeRendererHost, type RendererHost } from "../../ui";
@@ -8,6 +9,22 @@ import { openTuiUiHost } from "./ui-host";
 import { OpenTuiDialogHostProvider } from "./dialog-host";
 import { openTuiToastHost } from "./toast-host";
 
+export function TestDialogProvider({ children }: { children: ReactNode }) {
+  return (
+    <DialogProvider
+      dialogOptions={{
+        style: {
+          backgroundColor: "#000000",
+          borderColor: "#ffffff",
+          borderStyle: "single",
+        },
+      }}
+    >
+      {children}
+    </DialogProvider>
+  );
+}
+
 function createTestNativeRendererHost(renderer: any): NativeRendererHost {
   if (typeof renderer.write !== "function") {
     renderer.write = (data: string | Uint8Array) => {

package/src/renderers/opentui/ui-host.tsx

@@ -3,6 +3,8 @@ import { createElement } from "react";
 import "opentui-spinner/react";
 import { TextAttributes, type UiHost, type TextProps } from "../../ui/host";
 import { renderAsciiText } from "../../ui/ascii-font";
+import { OpenTuiImageSurface } from "./image-surface";
+import { OpenTuiChartSurface } from "./chart-surface";
 
 function mapTextAttributes(appAttributes: number | undefined, props?: TextProps): number | undefined {
   const flags = typeof appAttributes === "number" ? appAttributes : 0;
@@ -42,7 +44,9 @@ function mapTextContent(content: unknown): unknown {
 
 export const openTuiUiHost: UiHost = {
   kind: "opentui",
-  capabilities: {},
+  capabilities: {
+    nativeCharts: true,
+  },
   Box: ({ children, ...props }) => <box {...props}>{children}</box>,
   Text: ({ children, ...props }) => {
     const textProps = stripTextProps(props);
@@ -65,8 +69,8 @@ export const openTuiUiHost: UiHost = {
   ScrollBox: ({ children, ...props }) => <scrollbox {...props}>{children}</scrollbox>,
   Input: ({ children, ...props }) => createElement("input" as any, props, children),
   Textarea: ({ children, ...props }) => createElement("textarea" as any, props, children),
-  ChartSurface: ({ children, bitmap: _bitmap, bitmaps: _bitmaps, crosshair: _crosshair, ...props }) => <box {...props}>{children}</box>,
-  ImageSurface: ({ children, src: _src, alt: _alt, objectFit: _objectFit, ...props }) => <box {...props}>{children}</box>,
+  ChartSurface: OpenTuiChartSurface,
+  ImageSurface: OpenTuiImageSurface,
   SpinnerMark: ({ children, ...props }) => createElement("spinner" as any, props, children),
   AsciiText: ({ text, font = "tiny", color, fg, bg, backgroundColor, selectable = false, ...props }) => {
     const resolvedColor = color ?? fg;

package/src/sources/provider-router.ts

@@ -134,10 +134,6 @@ function isIntradayRange(range: TimeRange): boolean {
   return range === "1D" || range === "1W" || range === "1M" || range === "3M";
 }
 
-function hasMeaningfulFundamentals(data: TickerFinancials | null | undefined): boolean {
-  return !!data && Object.keys(data.fundamentals ?? {}).length > 0;
-}
-
 function hasMeaningfulProfile(data: TickerFinancials | null | undefined): boolean {
   return !!data && !!(
     data.profile?.description

package/src/state/app-context.test.ts

@@ -111,6 +111,38 @@ describe("resolveTickerForPane", () => {
     )?.zIndex).toBe(21);
   });
 
+  test("raises the session-focused floating pane above tied saved z-order", () => {
+    const config = createDefaultConfig("/tmp/gloomberb-test");
+    config.layout = {
+      ...config.layout,
+      dockRoot: null,
+      floating: [
+        { instanceId: "ticker-detail:main", x: 4, y: 2, width: 60, height: 22, zIndex: 50 },
+        { instanceId: "chat:main", x: 8, y: 4, width: 48, height: 18, zIndex: 50 },
+      ],
+    };
+    config.layouts = config.layouts.map((entry, index) => (
+      index === config.activeLayoutIndex ? { ...entry, layout: cloneLayout(config.layout) } : entry
+    ));
+    const sessionSnapshot: AppSessionSnapshot = {
+      paneState: {},
+      focusedPaneId: "ticker-detail:main",
+      activePanel: "right",
+      statusBarVisible: true,
+      openPaneIds: ["ticker-detail:main", "chat:main"],
+      hydrationTargets: [],
+      exchangeCurrencies: ["USD"],
+      savedAt: Date.now(),
+    };
+
+    const state = createInitialState(config, sessionSnapshot);
+    const tickerEntry = state.config.layout.floating.find((entry) => entry.instanceId === "ticker-detail:main");
+    const chatEntry = state.config.layout.floating.find((entry) => entry.instanceId === "chat:main");
+
+    expect(tickerEntry?.zIndex).toBe(51);
+    expect((tickerEntry?.zIndex ?? 0) > (chatEntry?.zIndex ?? 0)).toBe(true);
+  });
+
   test("raises the desktop-snapshot focused floating pane during hydration", () => {
     const config = createDefaultConfig("/tmp/gloomberb-test");
     config.layout = {
@@ -455,6 +487,19 @@ describe("quote merging", () => {
 });
 
 describe("layout focus fallback", () => {
+  test("cycles backward from a stale focused pane to the last visible pane", () => {
+    const config = createDefaultConfig("/tmp/gloomberb-test");
+    const state = createInitialState(config);
+    state.focusedPaneId = "hidden:stale";
+
+    const next = appReducer(state, {
+      type: "FOCUS_PREV",
+      paneOrder: ["portfolio-list:main", "ticker-detail:main", "ticker-detail:nvda"],
+    });
+
+    expect(next.focusedPaneId).toBe("ticker-detail:nvda");
+  });
+
   test("focuses the highest remaining floating pane when the focused floating pane closes", () => {
     const config = createDefaultConfig("/tmp/gloomberb-test");
     const backgroundPane = createPaneInstance("chat", {

package/src/state/app-context.tsx

@@ -183,6 +183,10 @@ export function usePaneInstanceId(): string {
   return paneId;
 }
 
+export function useOptionalPaneInstanceId(): string | null {
+  return useContext(PaneContext);
+}
+
 export function usePaneInstance(): PaneInstanceConfig | null {
   const paneId = useContext(PaneContext);
   return useAppSelector((state) => (paneId ? findPaneInstance(state.config.layout, paneId) ?? null : null));