gloomberb 0.9.3 → 0.9.5

package/src/components/layout/shell/cursor-occlusion.ts

@@ -0,0 +1,204 @@
+import { useEffect, useRef, type RefObject } from "react";
+import { useNativeRenderer, type NativeCursorState, type NativePostProcessFn } from "../../../ui";
+import type { FloatingRect, LayoutBounds, ResolvedPane } from "../../../plugins/pane-manager";
+import { constrainFloatingRectToBounds } from "./drag";
+
+interface VisibleFloatingPane {
+  pane: ResolvedPane;
+  rect: FloatingRect;
+}
+
+export interface ShellCursorOcclusionRect extends LayoutBounds {
+  paneId: string;
+  zIndex: number;
+}
+
+interface ResolveShellCursorOcclusionRectsOptions {
+  contentHeight: number;
+  dragFloatingRect: { paneId: string; rect: FloatingRect } | null;
+  nativePaneChrome: boolean;
+  overlayOpen: boolean;
+  transientFocusActive: boolean;
+  visibleFloatingPanes: readonly VisibleFloatingPane[];
+  width: number;
+}
+
+const MAX_RENDERABLE_ANCESTOR_DEPTH = 256;
+
+export function resolveShellCursorOcclusionRects({
+  contentHeight,
+  dragFloatingRect,
+  nativePaneChrome,
+  overlayOpen,
+  transientFocusActive,
+  visibleFloatingPanes,
+  width,
+}: ResolveShellCursorOcclusionRectsOptions): ShellCursorOcclusionRect[] {
+  if (nativePaneChrome || overlayOpen || transientFocusActive || visibleFloatingPanes.length === 0) {
+    return [];
+  }
+
+  return visibleFloatingPanes.map(({ pane, rect }) => {
+    const paneId = pane.instance.instanceId;
+    const visibleRect = dragFloatingRect?.paneId === paneId
+      ? constrainFloatingRectToBounds(dragFloatingRect.rect, width, contentHeight)
+      : rect;
+    return {
+      paneId,
+      zIndex: pane.floating?.zIndex ?? 50,
+      x: Math.floor(visibleRect.x),
+      y: Math.floor(visibleRect.y),
+      width: Math.max(0, Math.ceil(visibleRect.width)),
+      height: Math.max(0, Math.ceil(visibleRect.height)),
+    };
+  });
+}
+
+function readRenderableBounds(renderable: unknown): LayoutBounds | null {
+  if (!renderable || typeof renderable !== "object") return null;
+  const record = renderable as Record<string, unknown>;
+  const getRect = record.getBoundingClientRect;
+  if (typeof getRect === "function") {
+    const rect = getRect.call(renderable) as Partial<LayoutBounds> | null | undefined;
+    if (
+      rect
+      && typeof rect.x === "number"
+      && typeof rect.y === "number"
+      && typeof rect.width === "number"
+      && typeof rect.height === "number"
+    ) {
+      return rect as LayoutBounds;
+    }
+  }
+
+  const absoluteBounds = record.absoluteBounds as Partial<LayoutBounds> | null | undefined;
+  if (
+    absoluteBounds
+    && typeof absoluteBounds.x === "number"
+    && typeof absoluteBounds.y === "number"
+    && typeof absoluteBounds.width === "number"
+    && typeof absoluteBounds.height === "number"
+  ) {
+    return absoluteBounds as LayoutBounds;
+  }
+
+  const x = typeof record.screenX === "number"
+    ? record.screenX
+    : typeof record.absoluteX === "number"
+      ? record.absoluteX
+      : typeof record.x === "number"
+        ? record.x
+        : null;
+  const y = typeof record.screenY === "number"
+    ? record.screenY
+    : typeof record.absoluteY === "number"
+      ? record.absoluteY
+      : typeof record.y === "number"
+        ? record.y
+        : null;
+  const width = typeof record.width === "number" ? record.width : null;
+  const height = typeof record.height === "number" ? record.height : null;
+  if (x == null || y == null || width == null || height == null) return null;
+  return { x, y, width, height };
+}
+
+function readRenderablePaneId(renderable: unknown): string | null {
+  let current = renderable;
+  const seen = new Set<object>();
+  let depth = 0;
+
+  while (current && typeof current === "object" && !seen.has(current)) {
+    if (depth >= MAX_RENDERABLE_ANCESTOR_DEPTH) return null;
+    seen.add(current);
+    depth += 1;
+    const record = current as Record<string, unknown>;
+    const paneId = record["data-gloom-pane-id"];
+    if (typeof paneId === "string") return paneId;
+    current = record.parent;
+  }
+  return null;
+}
+
+function rectContainsCursor(rect: LayoutBounds, cursor: NativeCursorState): boolean {
+  return cursor.x >= rect.x
+    && cursor.x < rect.x + rect.width
+    && cursor.y >= rect.y
+    && cursor.y < rect.y + rect.height;
+}
+
+function toTerminalRect(shellBounds: LayoutBounds, rect: ShellCursorOcclusionRect): ShellCursorOcclusionRect {
+  return {
+    ...rect,
+    x: Math.floor(shellBounds.x + rect.x + 1),
+    y: Math.floor(shellBounds.y + rect.y + 1),
+  };
+}
+
+function resolveCursorOwnerZIndex(
+  cursorOwnerPaneId: string | null,
+  rects: readonly ShellCursorOcclusionRect[],
+): number {
+  if (!cursorOwnerPaneId) return Number.NEGATIVE_INFINITY;
+  return rects.find((rect) => rect.paneId === cursorOwnerPaneId)?.zIndex ?? 0;
+}
+
+function shouldHideCursor({
+  cursor,
+  cursorOwnerPaneId,
+  terminalRects,
+}: {
+  cursor: NativeCursorState;
+  cursorOwnerPaneId: string | null;
+  terminalRects: readonly ShellCursorOcclusionRect[];
+}): boolean {
+  const ownerZIndex = resolveCursorOwnerZIndex(cursorOwnerPaneId, terminalRects);
+  return terminalRects.some((rect) => {
+    if (rect.paneId === cursorOwnerPaneId) return false;
+    if (rect.zIndex <= ownerZIndex) return false;
+    return rectContainsCursor(rect, cursor);
+  });
+}
+
+export function useShellCursorOcclusionGuard({
+  occlusionRects,
+  shellRef,
+}: {
+  occlusionRects: readonly ShellCursorOcclusionRect[];
+  shellRef: RefObject<unknown>;
+}) {
+  const nativeRenderer = useNativeRenderer();
+  const stateRef = useRef({ occlusionRects, shellRef });
+  stateRef.current = { occlusionRects, shellRef };
+
+  useEffect(() => {
+    if (
+      !nativeRenderer.addPostProcessFn
+      || !nativeRenderer.removePostProcessFn
+      || !nativeRenderer.getCursorState
+      || !nativeRenderer.setCursorPosition
+    ) {
+      return;
+    }
+
+    const guardCursor: NativePostProcessFn = () => {
+      const cursor = nativeRenderer.getCursorState?.();
+      if (!cursor?.visible) return;
+      const shellBounds = readRenderableBounds(stateRef.current.shellRef.current);
+      if (!shellBounds) return;
+
+      const terminalRects = stateRef.current.occlusionRects.map((rect) => toTerminalRect(shellBounds, rect));
+      if (terminalRects.length === 0) return;
+
+      const cursorOwnerPaneId = readRenderablePaneId(nativeRenderer.currentFocusedEditor);
+      if (!shouldHideCursor({ cursor, cursorOwnerPaneId, terminalRects })) return;
+      nativeRenderer.setCursorPosition?.(0, 0, false);
+    };
+
+    nativeRenderer.addPostProcessFn(guardCursor);
+    nativeRenderer.requestRender();
+    return () => {
+      nativeRenderer.removePostProcessFn?.(guardCursor);
+      nativeRenderer.requestRender();
+    };
+  }, [nativeRenderer]);
+}

package/src/components/layout/shell/drag/runtime.ts

@@ -86,9 +86,11 @@ export interface ShellDragRuntimeState {
 
 export function useShellDragRuntimeState({
   contentHeight,
+  throttleFloatingPreview = false,
   width,
 }: {
   contentHeight: number;
+  throttleFloatingPreview?: boolean;
   width: number;
 }): ShellDragRuntimeState {
   const dragRef = useRef<DragMode | null>(null);
@@ -104,15 +106,20 @@ export function useShellDragRuntimeState({
   });
 
   const updateDragFloatingRect = useCallback((next: { paneId: string; rect: FloatingRect } | null) => {
-    pendingDragFloatingRectRef.current = next
+    const constrainedNext = next
       ? { paneId: next.paneId, rect: constrainFloatingRectToBounds(next.rect, width, contentHeight) }
       : null;
+    pendingDragFloatingRectRef.current = constrainedNext;
     if (!next) {
       setDragFloatingRect(null);
       return;
     }
+    if (!throttleFloatingPreview) {
+      setDragFloatingRect(constrainedNext);
+      return;
+    }
     flushDragFloatingRect();
-  }, [contentHeight, flushDragFloatingRect, width]);
+  }, [contentHeight, flushDragFloatingRect, throttleFloatingPreview, width]);
 
   const updateDividerPreview = useCallback((next: DividerPreviewState | null) => {
     dividerPreviewRef.current = next;

package/src/components/layout/shell/index.test.tsx

@@ -13,6 +13,7 @@ import {
 import { cloneLayout, createDefaultConfig, TICKER_RESEARCH_PANE_ID, type LayoutConfig } from "../../../types/config";
 import type { PluginRegistry } from "../../../plugins/registry";
 import type { PaneProps } from "../../../types/plugin";
+import { Textarea } from "../../../ui";
 import { Header } from "../header";
 import {
   buildNativeWindowState,
@@ -222,7 +223,7 @@ describe("Header", () => {
     );
 
     await testSetup.renderOnce();
-    const frame = testSetup.captureCharFrame();
+    const frame = testSetup!.captureCharFrame();
 
     expect(frame).toContain("v0.3.0 available");
     expect(frame).toContain("starting download");
@@ -242,7 +243,7 @@ describe("Header", () => {
     );
 
     await testSetup.renderOnce();
-    const frame = testSetup.captureCharFrame();
+    const frame = testSetup!.captureCharFrame();
 
     expect(frame).toContain("v0.3.0 available");
     expect(frame).toContain("run npm install -g gloomberb@latest");
@@ -564,6 +565,95 @@ describe("Shell", () => {
     expect(actions.some((action) => action.type === "UPDATE_LAYOUT")).toBe(false);
   });
 
+  test("updates the floating pane preview before mouse release", async () => {
+    const config = createDefaultConfig("/tmp/gloomberb-shell-live-floating-drag-test");
+    const floatingLayout = cloneLayout(config.layout);
+    floatingLayout.dockRoot = { kind: "pane", instanceId: "portfolio-list:main" };
+    floatingLayout.floating = [{ instanceId: "ticker-detail:main", x: 8, y: 2, width: 32, height: 10, zIndex: 75 }];
+    await renderShellForWindowModeTest(
+      createShellStateWithLayout(config, floatingLayout, "ticker-detail:main"),
+      { width: 80, height: 18 },
+    );
+
+    await act(async () => {
+      await testSetup!.mockMouse.pressDown(10, 3);
+      await testSetup!.renderOnce();
+      await testSetup!.mockMouse.moveTo(16, 6);
+      await testSetup!.renderOnce();
+      await testSetup!.renderOnce();
+    });
+
+    const frame = testSetup!.captureCharFrame();
+    const rows = frame.split("\n");
+    expect(rows[2]?.indexOf("┌─:: Main Portfolio") ?? -1).toBeLessThan(0);
+    expect(rows[5]?.indexOf("┌─:: Main Portfolio")).toBeGreaterThanOrEqual(14);
+
+    await act(async () => {
+      await testSetup!.mockMouse.release(16, 6);
+      await testSetup!.renderOnce();
+    });
+  });
+
+  test("keeps the focused textarea cursor visible when it is not covered", async () => {
+    const config = createDefaultConfig("/tmp/gloomberb-shell-cursor-visible-test");
+    const mainPane = requireLayoutInstance(config, "portfolio-list:main");
+    const detailPane = requireLayoutInstance(config, "ticker-detail:main");
+    const registry = createShellPluginRegistry({
+      portfolioListComponent: ({ focused, width, height }) => (
+        <Textarea
+          initialValue=""
+          focused={focused}
+          width={width}
+          height={Math.max(1, height)}
+        />
+      ),
+      tickerDetailComponent: () => <text>Chart Body</text>,
+    });
+    const layout = {
+      dockRoot: { kind: "pane" as const, instanceId: "portfolio-list:main" },
+      instances: [{ ...mainPane }, { ...detailPane }],
+      floating: [{ instanceId: "ticker-detail:main", x: 30, y: 2, width: 24, height: 8, zIndex: 75 }],
+      detached: [],
+    };
+    await renderShellForWindowModeTest(
+      createShellStateWithLayout(config, layout, "portfolio-list:main"),
+      { registry, width: 80, height: 18 },
+    );
+    await testSetup!.renderOnce();
+
+    expect(testSetup!.renderer.getCursorState().visible).toBe(true);
+  });
+
+  test("hides the textarea cursor when a higher floating pane covers it", async () => {
+    const config = createDefaultConfig("/tmp/gloomberb-shell-cursor-occlusion-test");
+    const mainPane = requireLayoutInstance(config, "portfolio-list:main");
+    const detailPane = requireLayoutInstance(config, "ticker-detail:main");
+    const registry = createShellPluginRegistry({
+      portfolioListComponent: ({ focused, width, height }) => (
+        <Textarea
+          initialValue=""
+          focused={focused}
+          width={width}
+          height={Math.max(1, height)}
+        />
+      ),
+      tickerDetailComponent: () => <text>Chart Body</text>,
+    });
+    const layout = {
+      dockRoot: { kind: "pane" as const, instanceId: "portfolio-list:main" },
+      instances: [{ ...mainPane }, { ...detailPane }],
+      floating: [{ instanceId: "ticker-detail:main", x: 0, y: 0, width: 40, height: 8, zIndex: 75 }],
+      detached: [],
+    };
+    await renderShellForWindowModeTest(
+      createShellStateWithLayout(config, layout, "portfolio-list:main"),
+      { registry, width: 80, height: 18 },
+    );
+    await testSetup!.renderOnce();
+
+    expect(testSetup!.renderer.getCursorState().visible).toBe(false);
+  });
+
   test("keeps focused pane local detail state when maximizing a floating pane", async () => {
     const config = createDefaultConfig("/tmp/gloomberb-shell-fullscreen-local-state-test");
     const detailPane = requireLayoutInstance(config, "ticker-detail:main");

package/src/components/layout/shell/index.tsx

@@ -1,4 +1,4 @@
-import { AsciiText, Box, Text, compactContextMenuItems, useContextMenu, useUiHost } from "../../../ui";
+import { AsciiText, Box, Text, compactContextMenuItems, useContextMenu, useUiHost, type BoxRenderable } from "../../../ui";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useRendererHost, useUiCapabilities } from "../../../ui";
 import { useViewport } from "../../../react/input";
@@ -61,6 +61,10 @@ import {
 import { useShellPaneActions } from "./pane/actions";
 import { resolvePaneFocusSourceLayout } from "./fullscreen";
 import { useTransientLayout } from "../transient-layout";
+import {
+  resolveShellCursorOcclusionRects,
+  useShellCursorOcclusionGuard,
+} from "./cursor-occlusion";
 
 export { resolveAppHeaderHeightCells } from "./chrome";
 export { buildNativeWindowState } from "./native/window-state";
@@ -102,6 +106,7 @@ export function Shell({
   const { nativePaneChrome = false, nativeContextMenu, precisePointer, titleBarOverlay, cellHeightPx } = useUiCapabilities();
   const { showContextMenu } = useContextMenu();
   const { width, height } = useViewport();
+  const shellRef = useRef<BoxRenderable | null>(null);
 
   const appHeaderHeight = resolveAppHeaderHeightCells({ titleBarOverlay, cellHeightPx });
   const contentHeight = Math.max(1, height - appHeaderHeight - (statusBarVisible ? 1 : 0));
@@ -124,7 +129,11 @@ export function Shell({
   }, []);
   const overlayOpen = commandBarOpen || dialogOpen || !!menuState;
 
-  const dragRuntime = useShellDragRuntimeState({ contentHeight, width });
+  const dragRuntime = useShellDragRuntimeState({
+    contentHeight,
+    throttleFloatingPreview: nativePaneChrome,
+    width,
+  });
   const {
     cancelActiveDrag,
     dividerPreview,
@@ -209,6 +218,27 @@ export function Shell({
     pluginRegistry,
     width,
   });
+  const cursorOcclusionRects = useMemo(() => resolveShellCursorOcclusionRects({
+    contentHeight,
+    dragFloatingRect,
+    nativePaneChrome,
+    overlayOpen,
+    transientFocusActive,
+    visibleFloatingPanes,
+    width,
+  }), [
+    contentHeight,
+    dragFloatingRect,
+    nativePaneChrome,
+    overlayOpen,
+    transientFocusActive,
+    visibleFloatingPanes,
+    width,
+  ]);
+  useShellCursorOcclusionGuard({
+    occlusionRects: cursorOcclusionRects,
+    shellRef,
+  });
 
   const {
     closeAllFloatingPanes,
@@ -485,12 +515,24 @@ export function Shell({
 
   return (
     <Box
+      ref={shellRef}
       flexDirection="row"
       flexGrow={1}
+      flexShrink={1}
+      flexBasis={0}
+      minWidth={0}
+      minHeight={0}
       height={nativePaneChrome ? undefined : contentHeight}
       position={nativePaneChrome ? "relative" : undefined}
       overflow="hidden"
-      {...(!nativePaneChrome ? { onMouse: handleMouse } : {})}
+      {...(!nativePaneChrome
+        ? {
+          onMouseDown: handleMouse,
+          onMouseDrag: handleMouse,
+          onMouseDragEnd: handleMouse,
+          onMouseUp: handleMouse,
+        }
+        : {})}
     >
       <Box
         position="absolute"

package/src/components/layout/shell/layout-state.test.ts

@@ -0,0 +1,33 @@
+import { describe, expect, test } from "bun:test";
+import { getDockedPaneIds } from "../../../plugins/pane-manager";
+import { createPaneInstance, type LayoutConfig } from "../../../types/config";
+import { resolveShellVisibleLayout } from "./visible-layout";
+
+describe("shell visible layout", () => {
+  test("removes unregistered pane types before resolving dock geometry", () => {
+    const layout: LayoutConfig = {
+      dockRoot: {
+        kind: "split",
+        axis: "horizontal",
+        ratio: 0.5,
+        first: { kind: "pane", instanceId: "missing:main" },
+        second: { kind: "pane", instanceId: "chat:main" },
+      },
+      instances: [
+        createPaneInstance("missing-plugin", { instanceId: "missing:main" }),
+        createPaneInstance("chat", { instanceId: "chat:main" }),
+      ],
+      floating: [],
+      detached: [],
+    };
+
+    const visibleLayout = resolveShellVisibleLayout(
+      layout,
+      new Set(),
+      new Map([["chat", true]]),
+    );
+
+    expect(visibleLayout.instances.map((instance) => instance.instanceId)).toEqual(["chat:main"]);
+    expect(getDockedPaneIds(visibleLayout)).toEqual(["chat:main"]);
+  });
+});

package/src/components/layout/shell/layout-state.ts

@@ -6,8 +6,9 @@ import {
   type ResolvedPane,
 } from "../../../plugins/pane-manager";
 import type { PluginRegistry } from "../../../plugins/registry";
-import { removePaneInstances, type LayoutConfig } from "../../../types/config";
+import type { LayoutConfig } from "../../../types/config";
 import { constrainFloatingRectToBounds } from "./drag";
+import { resolveShellVisibleLayout } from "./visible-layout";
 
 interface ShellVisibleLayoutOptions {
   disabledPlugins: readonly string[];
@@ -34,15 +35,9 @@ export function useShellVisibleLayout({
     return paneIds;
   }, [disabledPlugins, pluginRegistry]);
 
-  const hiddenInstanceIds = useMemo(() => (
-    layout.instances
-      .filter((instance) => disabledPaneIds.has(instance.paneId))
-      .map((instance) => instance.instanceId)
-  ), [disabledPaneIds, layout.instances]);
-
   const visibleLayout = useMemo(
-    () => (hiddenInstanceIds.length > 0 ? removePaneInstances(layout, hiddenInstanceIds) : layout),
-    [hiddenInstanceIds, layout],
+    () => resolveShellVisibleLayout(layout, disabledPaneIds, pluginRegistry.panes),
+    [disabledPaneIds, layout, pluginRegistry.panes],
   );
 
   return { disabledPaneIds, visibleLayout };

package/src/components/layout/shell/pane/layers.tsx

@@ -111,11 +111,14 @@ export function ShellPaneLayers({
           >
             <PaneFooterProvider>
               {(footer) => {
-                const reserveFooter = shouldReservePaneFooter(nativePaneChrome, hasPaneFooterContent(footer));
+                const showFooter = hasPaneFooterContent(footer);
+                const reserveFooter = shouldReservePaneFooter(nativePaneChrome, showFooter);
+                const renderFooter = reserveFooter || showFooter;
                 const bodyFrame = resolvePaneBodyFrame({
                   width: rect.width,
                   height: rect.height,
                   nativePaneChrome,
+                  footerVisible: renderFooter,
                   reserveFooter,
                 });
                 return (
@@ -129,7 +132,7 @@ export function ShellPaneLayers({
                     windowModeSelected={windowModeSelected}
                     footer={footer}
                     onMouseDown={nativePaneChrome ? (event) => handleNativePaneMouseDown(leaf.instanceId, event) : undefined}
-                    onMouseMove={() => setHoveredPaneIfChanged(leaf.instanceId)}
+                    onHeaderMouseMove={() => setHoveredPaneIfChanged(leaf.instanceId)}
                     onHeaderMouseDown={nativePaneChrome && !transientFocusActive ? (event) => startNativeDockedDrag(leaf.instanceId, rect, event) : undefined}
                     onHeaderMouseDrag={nativePaneChrome && !transientFocusActive ? handleNativeDrag : undefined}
                     onHeaderMouseDragEnd={nativePaneChrome && !transientFocusActive ? handleNativeDrag : undefined}
@@ -165,11 +168,14 @@ export function ShellPaneLayers({
         return (
           <PaneFooterProvider key={`float:${pane.instance.instanceId}`}>
             {(footer) => {
-              const reserveFooter = shouldReservePaneFooter(nativePaneChrome, hasPaneFooterContent(footer));
+              const showFooter = hasPaneFooterContent(footer);
+              const reserveFooter = shouldReservePaneFooter(nativePaneChrome, showFooter);
+              const renderFooter = reserveFooter || showFooter;
               const bodyFrame = resolvePaneBodyFrame({
                 width: preview.width,
                 height: preview.height,
                 nativePaneChrome,
+                footerVisible: renderFooter,
                 reserveFooter,
               });
               return (
@@ -186,7 +192,7 @@ export function ShellPaneLayers({
                   showActions={showActions}
                   footer={footer}
                   onMouseDown={nativePaneChrome ? (event) => handleNativePaneMouseDown(pane.instance.instanceId, event) : undefined}
-                  onMouseMove={() => setHoveredPaneIfChanged(pane.instance.instanceId)}
+                  onHeaderMouseMove={() => setHoveredPaneIfChanged(pane.instance.instanceId)}
                   onHeaderMouseDown={nativePaneChrome ? (event) => startNativeFloatingDrag(pane.instance.instanceId, preview, event) : undefined}
                   onHeaderMouseDrag={nativePaneChrome ? handleNativeDrag : undefined}
                   onHeaderMouseDragEnd={nativePaneChrome ? handleNativeDrag : undefined}

package/src/components/layout/shell/visible-layout.ts

@@ -0,0 +1,17 @@
+import {
+  removeUnavailablePaneTypes,
+  type PaneTypeAvailability,
+} from "../../../plugins/pane-manager";
+import type { LayoutConfig } from "../../../types/config";
+
+export function resolveShellVisibleLayout(
+  layout: LayoutConfig,
+  disabledPaneIds: ReadonlySet<string>,
+  registeredPaneIds: PaneTypeAvailability,
+): LayoutConfig {
+  return removeUnavailablePaneTypes(
+    layout,
+    registeredPaneIds,
+    { disabledPaneIds },
+  );
+}

package/src/components/layout/status-bar.test.tsx

@@ -1,7 +1,7 @@
 import { afterEach, describe, expect, test } from "bun:test";
 import { testRender } from "../../renderers/opentui/test-utils";
 import { AppContext, createInitialState } from "../../state/app/context";
-import { cloneLayout, createDefaultConfig, type LayoutConfig } from "../../types/config";
+import { cloneLayout, createDefaultConfig, TICKER_RESEARCH_PANE_ID, type LayoutConfig } from "../../types/config";
 import type { AppNotificationRequest } from "../../types/plugin";
 import { StatusBar } from "./status-bar";
 import { setSharedRegistryForTests } from "../../plugins/registry";
@@ -174,6 +174,10 @@ describe("StatusBar", () => {
     const notifications: AppNotificationRequest[] = [];
 
     setSharedRegistryForTests({
+      panes: new Map([
+        ["portfolio-list", {}],
+        [TICKER_RESEARCH_PANE_ID, {}],
+      ]),
       getLayoutFn: () => state.config.layout,
       getTermSizeFn: () => ({ width: 120, height: 40 }),
       updateLayoutFn: (layout: LayoutConfig) => { updatedLayout = layout; },
@@ -233,6 +237,7 @@ describe("StatusBar", () => {
     globalThis.clearTimeout = (() => {}) as typeof clearTimeout;
 
     setSharedRegistryForTests({
+      panes: new Map(),
       getLayoutFn: () => state.config.layout,
       getTermSizeFn: () => ({ width: 120, height: 40 }),
       updateLayoutFn: () => {},

package/src/components/layout/status-bar.tsx

@@ -114,7 +114,11 @@ export function StatusBar() {
     event?.stopPropagation?.();
     if (!registry) return;
     const { width, height } = registry.getTermSizeFn();
-    registry.updateLayoutFn(gridlockAllPanes(registry.getLayoutFn(), { x: 0, y: 0, width, height }));
+    registry.updateLayoutFn(gridlockAllPanes(
+      registry.getLayoutFn(),
+      { x: 0, y: 0, width, height },
+      registry.panes,
+    ));
     notifyGridlockComplete(registry.notify.bind(registry), () => {
       dispatch({ type: "UNDO_LAYOUT" });
     });
@@ -360,7 +364,7 @@ function CommandBarHint({
     <Text
       fg={hovered ? colors.text : colors.textDim}
       {...(!nativePaneChrome ? { bg: hovered ? hoverBg() : undefined } : {})}
-      onMouseMove={() => setHoveredControl((current) => (current === "command-bar" ? current : "command-bar"))}
+      onMouseOver={() => setHoveredControl((current) => (current === "command-bar" ? current : "command-bar"))}
       onMouseDown={openCommandBar}
       {...(nativePaneChrome ? { "data-gloom-interactive": "true" } : {})}
     >
@@ -381,7 +385,7 @@ function NativeGridlockTip({
       <Text
         fg={hoveredControl === "gridlock-tip" ? colors.textBright : colors.borderFocused}
         attributes={TextAttributes.BOLD}
-        onMouseMove={() => setHoveredControl((current) => (current === "gridlock-tip" ? current : "gridlock-tip"))}
+        onMouseOver={() => setHoveredControl((current) => (current === "gridlock-tip" ? current : "gridlock-tip"))}
         onMouseDown={handleGridlockTip}
         data-gloom-interactive="true"
       >
@@ -389,7 +393,7 @@ function NativeGridlockTip({
       </Text>
       <Text
         fg={hoveredControl === "gridlock-tip-dismiss" ? colors.text : colors.textDim}
-        onMouseMove={() => setHoveredControl((current) => (current === "gridlock-tip-dismiss" ? current : "gridlock-tip-dismiss"))}
+        onMouseOver={() => setHoveredControl((current) => (current === "gridlock-tip-dismiss" ? current : "gridlock-tip-dismiss"))}
         onMouseDown={dismissGridlockTip}
         data-gloom-interactive="true"
       >
@@ -411,14 +415,14 @@ function TerminalGridlockTip({
       <Box width={1} />
       <Box
         backgroundColor={hoveredControl === "gridlock-tip" ? hoverBg() : colors.header}
-        onMouseMove={() => setHoveredControl((current) => (current === "gridlock-tip" ? current : "gridlock-tip"))}
+        onMouseOver={() => setHoveredControl((current) => (current === "gridlock-tip" ? current : "gridlock-tip"))}
         onMouseDown={handleGridlockTip}
       >
         <Text fg={colors.headerText}> Gridlock All </Text>
       </Box>
       <Text
         fg={hoveredControl === "gridlock-tip-dismiss" ? colors.text : colors.textDim}
-        onMouseMove={() => setHoveredControl((current) => (current === "gridlock-tip-dismiss" ? current : "gridlock-tip-dismiss"))}
+        onMouseOver={() => setHoveredControl((current) => (current === "gridlock-tip-dismiss" ? current : "gridlock-tip-dismiss"))}
         onMouseDown={dismissGridlockTip}
       >
         {" x"}