gloomberb 0.7.5 → 0.8.0

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

@@ -0,0 +1,451 @@
+import { AsciiText, Box, Text, compactContextMenuItems, useContextMenu, useUiHost } from "../../../ui";
+import { useCallback, useMemo, useState } from "react";
+import { useRendererHost, useUiCapabilities } from "../../../ui";
+import { useViewport } from "../../../react/input";
+import { useDialogState } from "../../../ui/dialog";
+import { scheduleConfigSave } from "../../../state/config-save-scheduler";
+import type { DesktopDockPreviewState, DesktopWindowBridge } from "../../../types/desktop-window";
+import {
+  getDockDividerLayouts,
+  getDockLeafLayouts,
+  type DockGeometryOptions,
+  type LayoutBounds,
+  type ResolvedPane,
+} from "../../../plugins/pane-manager";
+import type { PluginRegistry } from "../../../plugins/registry";
+import type { LayoutConfig } from "../../../types/config";
+import { contextMenuDivider } from "../../../types/context-menu";
+import {
+  resolveTickerForPane,
+  syncConfigActiveLayoutState,
+  useAppDispatch,
+  useAppSelector,
+} from "../../../state/app/context";
+import {
+  selectCommandBarOpen,
+  selectFocusedPaneId,
+  selectLayout,
+  selectStatusBarVisible,
+} from "../../../state/selectors-ui";
+import { colors } from "../../../theme/colors";
+import { useThemeColors } from "../../../theme/theme-context";
+import { getPaneDisplayTitle } from "../pane/title";
+import { getShortcutDisplayMode } from "../../../utils/shortcut-labels";
+import {
+  actionMenuWidth,
+  menuForPane,
+  menuItemsForFallback,
+} from "./menu";
+import {
+  makeSnapGuides,
+  resolveExternalDockPreview,
+  resolveHoverOverlay,
+} from "./drag";
+import { resolveAppHeaderHeightCells } from "./chrome";
+import { useShellWindowMode } from "./window-mode";
+import { useShellNativeSurfaceWindowState } from "./native/surfaces";
+import { ShellWindowModeOverlays } from "./window-mode/overlays";
+import { ShellPaneLayers } from "./pane/layers";
+import { ShellActionMenuOverlay, type ActionMenuState } from "./action-menu-overlay";
+import { ShellDragOverlays } from "./drag/overlays";
+import {
+  useShellDragRuntimeState,
+  useShellPointerRuntime,
+} from "./drag/runtime";
+import { useShellPaneManagementShortcuts } from "./pane/management-shortcuts";
+import {
+  useShellResolvedPanes,
+  useShellVisibleLayout,
+} from "./layout-state";
+import { useShellPaneActions } from "./pane/actions";
+
+export { resolveAppHeaderHeightCells } from "./chrome";
+export { buildNativeWindowState } from "./native/window-state";
+export { resolvePaneManagementShortcut } from "./shortcuts";
+
+interface ShellProps {
+  pluginRegistry: PluginRegistry;
+  desktopWindowBridge?: DesktopWindowBridge;
+  desktopDockPreview?: DesktopDockPreviewState | null;
+  commandBarNativeOccluder?: LayoutBounds | null;
+}
+
+export function Shell({
+  pluginRegistry,
+  desktopWindowBridge,
+  desktopDockPreview,
+  commandBarNativeOccluder = null,
+}: ShellProps) {
+  useThemeColors();
+  const dispatch = useAppDispatch();
+  const config = useAppSelector((state) => state.config);
+  const paneState = useAppSelector((state) => state.paneState);
+  const focusedPaneId = useAppSelector(selectFocusedPaneId);
+  const activePanel = useAppSelector((state) => state.activePanel);
+  const commandBarOpen = useAppSelector(selectCommandBarOpen);
+  const inputCaptured = useAppSelector((state) => state.inputCaptured);
+  const statusBarVisible = useAppSelector(selectStatusBarVisible);
+  const rendererHost = useRendererHost();
+  const uiKind = useUiHost().kind;
+  const shortcutDisplayMode = getShortcutDisplayMode(uiKind);
+  const { nativePaneChrome = false, nativeContextMenu, precisePointer, titleBarOverlay, cellHeightPx } = useUiCapabilities();
+  const { showContextMenu } = useContextMenu();
+  const { width, height } = useViewport();
+
+  const appHeaderHeight = resolveAppHeaderHeightCells({ titleBarOverlay, cellHeightPx });
+  const contentHeight = Math.max(1, height - appHeaderHeight - (statusBarVisible ? 1 : 0));
+  pluginRegistry.getTermSizeFn = () => ({ width, height: contentHeight });
+
+  const layout = useAppSelector(selectLayout);
+  const dialogOpen = useDialogState((dialog) => dialog.isOpen);
+  const [hoveredPaneId, setHoveredPaneId] = useState<string | null>(null);
+  const setHoveredPaneIfChanged = useCallback((paneId: string | null) => {
+    setHoveredPaneId((current) => (current === paneId ? current : paneId));
+  }, []);
+  const [menuState, setMenuState] = useState<ActionMenuState | null>(null);
+  const [hoveredMenuItemId, setHoveredMenuItemId] = useState<string | null>(null);
+  const closePaneMenu = useCallback(() => {
+    setMenuState(null);
+    setHoveredMenuItemId(null);
+  }, []);
+  const overlayOpen = commandBarOpen || dialogOpen || !!menuState;
+
+  const dragRuntime = useShellDragRuntimeState({ contentHeight, width });
+  const {
+    cancelActiveDrag,
+    dividerPreview,
+    dockPreview,
+    dragCursor,
+    dragFloatingRect,
+    dragRef,
+    hasActiveDrag,
+  } = dragRuntime;
+
+  const { disabledPaneIds, visibleLayout } = useShellVisibleLayout({
+    disabledPlugins: config.disabledPlugins,
+    layout,
+    pluginRegistry,
+  });
+  const dockGeometryOptions = useMemo<DockGeometryOptions>(() => (
+    nativePaneChrome ? { precise: true } : { reserveDividerGutters: true }
+  ), [nativePaneChrome]);
+  const bounds = useMemo<LayoutBounds>(() => ({ x: 0, y: 0, width, height: contentHeight }), [contentHeight, width]);
+
+  const persistLayout = useCallback((nextLayout: LayoutConfig, options?: { pushHistory?: boolean }) => {
+    if (options?.pushHistory !== false) {
+      dispatch({ type: "PUSH_LAYOUT_HISTORY" });
+    }
+    dispatch({ type: "UPDATE_LAYOUT", layout: nextLayout });
+    scheduleConfigSave(syncConfigActiveLayoutState(
+      { ...config, layout: nextLayout },
+      paneState,
+      focusedPaneId,
+      activePanel,
+    ));
+  }, [activePanel, config, dispatch, focusedPaneId, paneState]);
+
+  const focusPane = useCallback((paneId: string) => {
+    dispatch({ type: "FOCUS_PANE", paneId });
+  }, [dispatch]);
+
+  const {
+    activeLayout,
+    nativeWindowModePanelRect,
+    selectWindowModePane,
+    startWindowMode,
+    updateWindowModePreviewLayout,
+    windowMode,
+    windowModeDockMovePreview,
+  } = useShellWindowMode({
+    bounds,
+    cancelActiveDrag,
+    closePaneMenu,
+    contentHeight,
+    dockGeometryOptions,
+    focusPane,
+    focusedPaneId,
+    hasActiveDrag,
+    nativePaneChrome,
+    persistLayout,
+    pluginRegistry,
+    visibleLayout,
+    width,
+  });
+
+  const {
+    dockedPanes,
+    floatingPanes,
+    paneMap,
+    visibleFloatingPanes,
+  } = useShellResolvedPanes({
+    activeLayout,
+    contentHeight,
+    disabledPaneIds,
+    pluginRegistry,
+    width,
+  });
+
+  const {
+    closeFocusedPane,
+    copyFocusedPaneScreenshot,
+    copyPaneScreenshot,
+    gridlockVisiblePanes,
+    handleFloatingClose,
+    openFocusedPaneSettings,
+    openLayoutMenu,
+    openPaneSettings,
+    popOutFocusedPane,
+    toggleFocusedPaneFloating,
+  } = useShellPaneActions({
+    closePaneMenu,
+    contentHeight,
+    desktopWindowBridge,
+    focusedPaneId,
+    focusPane,
+    nativePaneChrome,
+    paneMap,
+    persistLayout,
+    pluginRegistry,
+    rendererHost,
+    visibleLayout,
+    width,
+  });
+
+  useShellPaneManagementShortcuts({
+    cancelActiveDrag,
+    closeFocusedPane,
+    copyFocusedPaneScreenshot,
+    focusedPaneId,
+    gridlockVisiblePanes,
+    hasActiveDrag,
+    inputCaptured,
+    openFocusedPaneSettings,
+    openLayoutMenu,
+    overlayOpen,
+    popOutFocusedPane,
+    startWindowMode,
+    toggleFocusedPaneFloating,
+  });
+
+  const dockLeafLayouts = useMemo(() => getDockLeafLayouts(activeLayout, bounds, dockGeometryOptions), [activeLayout, bounds, dockGeometryOptions]);
+  const dockDividerLayouts = useMemo(() => getDockDividerLayouts(activeLayout, bounds, dockGeometryOptions), [activeLayout, bounds, dockGeometryOptions]);
+  const snapGuides = useMemo(() => makeSnapGuides(width, contentHeight), [contentHeight, width]);
+  const externalDockPreview = useMemo(
+    () => resolveExternalDockPreview(desktopDockPreview, bounds),
+    [bounds, desktopDockPreview],
+  );
+  const activePaneDrag = dragRef.current?.type === "pane-drag" ? dragRef.current : null;
+  const activeHoverOverlay = activePaneDrag && dragCursor
+    ? resolveHoverOverlay(dragCursor.x, dragCursor.y, dockLeafLayouts, activePaneDrag.paneId)
+    : null;
+  const effectiveDockPreview = dockPreview ?? externalDockPreview;
+  useShellNativeSurfaceWindowState({
+    activeHoverOverlay,
+    activePaneDrag,
+    appHeaderHeight,
+    commandBarNativeOccluder,
+    contentHeight,
+    dialogOpen,
+    dividerPreview,
+    dockDividerLayouts,
+    dockedPanes,
+    dragFloatingRect,
+    effectiveDockPreview,
+    menuState,
+    nativeWindowModePanelRect,
+    visibleFloatingPanes,
+    width,
+    windowModeDockMovePreview,
+  });
+
+  const titleState = useMemo(
+    () => ({ config, paneState }) as Parameters<typeof resolveTickerForPane>[0],
+    [config, paneState],
+  );
+  const getPaneTitle = useCallback(
+    (pane: ResolvedPane): string => getPaneDisplayTitle(titleState, pane.instance, pane.def),
+    [titleState],
+  );
+
+  const openPaneMenu = useCallback((paneId: string, rect: LayoutBounds, event?: { preventDefault?: () => void; stopPropagation?: () => void }) => {
+    const pane = paneMap.get(paneId);
+    if (!pane) return;
+    focusPane(paneId);
+    const context = {
+      kind: "pane" as const,
+      paneId,
+      paneType: pane.instance.paneId,
+      title: getPaneTitle(pane),
+      floating: !!pane.floating,
+    };
+    const items = menuForPane(
+      pane,
+      visibleLayout,
+      width,
+      contentHeight,
+      pluginRegistry,
+      persistLayout,
+      focusPane,
+      openPaneSettings,
+      desktopWindowBridge,
+      nativePaneChrome && rendererHost.copyPngImage ? copyPaneScreenshot : undefined,
+    );
+    void showContextMenu(context, items, event).then((shown) => {
+      if (shown) return;
+      const pluginItems = pluginRegistry.getContextMenuItems?.(context) ?? [];
+      const fallbackSourceItems = compactContextMenuItems([
+        ...items,
+        ...(items.length > 0 && pluginItems.length > 0 ? [contextMenuDivider(`${context.kind}:plugin-divider`)] : []),
+        ...pluginItems,
+      ]);
+      const fallbackItems = menuItemsForFallback(fallbackSourceItems, shortcutDisplayMode);
+      if (fallbackItems.length === 0) return;
+      const menuWidth = actionMenuWidth(fallbackItems, width);
+      const menuX = Math.max(0, Math.min(width - menuWidth, rect.x + Math.max(0, rect.width - menuWidth)));
+      const menuY = Math.max(0, Math.min(contentHeight - 1, rect.y + 1));
+      setHoveredMenuItemId(fallbackItems[0]?.id ?? null);
+      setMenuState({
+        paneId,
+        x: menuX,
+        y: menuY,
+        width: menuWidth,
+        items: fallbackItems,
+      });
+    });
+  }, [contentHeight, copyPaneScreenshot, desktopWindowBridge, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, persistLayout, pluginRegistry, rendererHost.copyPngImage, shortcutDisplayMode, showContextMenu, visibleLayout, width]);
+
+  const {
+    handleFloatingCloseMouseDown,
+    handleMouse,
+    handleNativeDrag,
+    handleNativePaneContextMenu,
+    handleNativePaneMouseDown,
+    handlePaneAction,
+    startNativeDividerDrag,
+    startNativeDockedDrag,
+    startNativeFloatingDrag,
+    startNativeFloatResize,
+  } = useShellPointerRuntime({
+    appHeaderHeight,
+    bounds,
+    closePaneMenu,
+    contentHeight,
+    dispatch,
+    dockDividerLayouts,
+    dockLeafLayouts,
+    dragRuntime,
+    focusPane,
+    focusedPaneId,
+    handleFloatingClose,
+    menuState,
+    nativePaneChrome,
+    openPaneMenu,
+    paneMap,
+    persistLayout,
+    precisePointer,
+    selectWindowModePane,
+    setHoveredMenuItemId,
+    setMenuState,
+    snapGuides,
+    updateWindowModePreviewLayout,
+    visibleFloatingPanes,
+    visibleLayout,
+    width,
+    windowMode,
+  });
+  const windowModeDockResizePathKey = windowMode?.focus.kind === "dock-resize"
+    ? windowMode.focus.pathKey
+    : null;
+
+  return (
+    <Box
+      flexDirection="row"
+      flexGrow={1}
+      height={nativePaneChrome ? undefined : contentHeight}
+      position={nativePaneChrome ? "relative" : undefined}
+      overflow="hidden"
+      {...(!nativePaneChrome ? { onMouse: handleMouse } : {})}
+    >
+      <Box
+        position="absolute"
+        left={0}
+        top={0}
+        width={width}
+        height={contentHeight}
+        alignItems="center"
+        justifyContent="center"
+      >
+        <Box flexDirection="column" alignItems="center">
+          <AsciiText text="Gloomberb" font="wordmark" color={colors.textMuted} />
+          <Box height={1} />
+          <Text fg={colors.textDim}>Ctrl+P to get started.</Text>
+        </Box>
+      </Box>
+
+      <ShellPaneLayers
+        contentHeight={contentHeight}
+        dividerPreview={dividerPreview}
+        dockDividerLayouts={dockDividerLayouts}
+        dockLeafLayouts={dockLeafLayouts}
+        dragFloatingRect={dragFloatingRect}
+        focusedPaneId={focusedPaneId}
+        getPaneTitle={getPaneTitle}
+        handleFloatingClose={handleFloatingClose}
+        handleFloatingCloseMouseDown={handleFloatingCloseMouseDown}
+        handleNativeDrag={handleNativeDrag}
+        handleNativePaneContextMenu={handleNativePaneContextMenu}
+        handleNativePaneMouseDown={handleNativePaneMouseDown}
+        handlePaneAction={handlePaneAction}
+        hoveredPaneId={hoveredPaneId}
+        menuPaneId={menuState?.paneId ?? null}
+        nativeContextMenu={nativeContextMenu}
+        nativePaneChrome={nativePaneChrome}
+        overlayOpen={overlayOpen}
+        paneMap={paneMap}
+        setHoveredPaneIfChanged={setHoveredPaneIfChanged}
+        startNativeDividerDrag={startNativeDividerDrag}
+        startNativeDockedDrag={startNativeDockedDrag}
+        startNativeFloatingDrag={startNativeFloatingDrag}
+        startNativeFloatResize={startNativeFloatResize}
+        visibleFloatingPanes={visibleFloatingPanes}
+        width={width}
+        windowModeDockResizePathKey={windowModeDockResizePathKey}
+        windowModePaneId={windowMode?.paneId ?? null}
+      />
+
+      <ShellWindowModeOverlays
+        bounds={bounds}
+        contentHeight={contentHeight}
+        dockGeometryOptions={dockGeometryOptions}
+        dockLeafLayouts={dockLeafLayouts}
+        dragFloatingRect={dragFloatingRect}
+        focusedPaneId={focusedPaneId}
+        getPaneTitle={getPaneTitle}
+        menuOpen={!!menuState}
+        nativePaneChrome={nativePaneChrome}
+        nativeWindowModePanelRect={nativeWindowModePanelRect}
+        overlayOpen={overlayOpen}
+        paneMap={paneMap}
+        visibleFloatingPanes={visibleFloatingPanes}
+        width={width}
+        windowMode={windowMode}
+        windowModeDockMovePreview={windowModeDockMovePreview}
+      />
+
+      <ShellDragOverlays
+        activeHoverOverlay={activeHoverOverlay}
+        activePaneDrag={activePaneDrag}
+        dockPreview={dockPreview}
+        dragFloatingRect={dragFloatingRect}
+        effectiveDockPreview={effectiveDockPreview}
+      />
+
+      <ShellActionMenuOverlay
+        menuState={menuState}
+        hoveredMenuItemId={hoveredMenuItemId}
+        onClose={closePaneMenu}
+        onHoverItem={setHoveredMenuItemId}
+      />
+    </Box>
+  );
+}

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

@@ -0,0 +1,97 @@
+import { useMemo } from "react";
+import {
+  resolveDocked,
+  resolveFloating,
+  type FloatingRect,
+  type ResolvedPane,
+} from "../../../plugins/pane-manager";
+import type { PluginRegistry } from "../../../plugins/registry";
+import { removePaneInstances, type LayoutConfig } from "../../../types/config";
+import { constrainFloatingRectToBounds } from "./drag";
+
+interface ShellVisibleLayoutOptions {
+  disabledPlugins: readonly string[];
+  layout: LayoutConfig;
+  pluginRegistry: PluginRegistry;
+}
+
+export function useShellVisibleLayout({
+  disabledPlugins,
+  layout,
+  pluginRegistry,
+}: ShellVisibleLayoutOptions): {
+  disabledPaneIds: Set<string>;
+  visibleLayout: LayoutConfig;
+} {
+  const disabledPaneIds = useMemo(() => {
+    const pluginIds = new Set(disabledPlugins);
+    const paneIds = new Set<string>();
+    for (const pluginId of pluginIds) {
+      for (const paneId of pluginRegistry.getPluginPaneIds(pluginId)) {
+        paneIds.add(paneId);
+      }
+    }
+    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],
+  );
+
+  return { disabledPaneIds, visibleLayout };
+}
+
+interface ShellResolvedPanesOptions {
+  activeLayout: LayoutConfig;
+  contentHeight: number;
+  disabledPaneIds: ReadonlySet<string>;
+  pluginRegistry: PluginRegistry;
+  width: number;
+}
+
+export function useShellResolvedPanes({
+  activeLayout,
+  contentHeight,
+  disabledPaneIds,
+  pluginRegistry,
+  width,
+}: ShellResolvedPanesOptions): {
+  dockedPanes: ResolvedPane[];
+  floatingPanes: ResolvedPane[];
+  paneMap: Map<string, ResolvedPane>;
+  visibleFloatingPanes: Array<{ pane: ResolvedPane; rect: FloatingRect }>;
+} {
+  const dockedPanes = useMemo(
+    () => resolveDocked(activeLayout, pluginRegistry.panes).filter((pane) => !disabledPaneIds.has(pane.def.id)),
+    [activeLayout, disabledPaneIds, pluginRegistry.panes],
+  );
+  const floatingPanes = useMemo(
+    () => resolveFloating(activeLayout, pluginRegistry.panes).filter((pane) => !disabledPaneIds.has(pane.def.id)),
+    [activeLayout, disabledPaneIds, pluginRegistry.panes],
+  );
+  const visibleFloatingPanes = useMemo(
+    () => floatingPanes.map((pane) => ({
+      pane,
+      rect: constrainFloatingRectToBounds(pane.floating!, width, contentHeight),
+    })),
+    [contentHeight, floatingPanes, width],
+  );
+  const paneMap = useMemo(
+    () => new Map([...dockedPanes, ...floatingPanes].map((pane) => [pane.instance.instanceId, pane])),
+    [dockedPanes, floatingPanes],
+  );
+
+  return {
+    dockedPanes,
+    floatingPanes,
+    paneMap,
+    visibleFloatingPanes,
+  };
+}

package/src/components/layout/shell/menu.ts

@@ -0,0 +1,152 @@
+import type { DesktopWindowBridge } from "../../../types/desktop-window";
+import {
+  applyDrop,
+  floatPane,
+  removePane,
+  type LayoutBounds,
+  type ResolvedPane,
+} from "../../../plugins/pane-manager";
+import type { PluginRegistry } from "../../../plugins/registry";
+import type { LayoutConfig } from "../../../types/config";
+import { contextMenuDivider, type ContextMenuItem } from "../../../types/context-menu";
+import {
+  formatPlatformShortcutLabel,
+  type ShortcutDisplayMode,
+} from "../../../utils/shortcut-labels";
+import { PANE_MANAGEMENT_ACCELERATORS } from "./shortcuts";
+
+const MENU_MIN_WIDTH = 18;
+const MENU_MAX_WIDTH = 44;
+
+export const MENU_Z_INDEX = 10_000;
+
+export function menuForPane(
+  pane: ResolvedPane,
+  layout: LayoutConfig,
+  width: number,
+  contentHeight: number,
+  pluginRegistry: PluginRegistry,
+  persistLayout: (nextLayout: LayoutConfig, options?: { pushHistory?: boolean }) => void,
+  focusPane: (paneId: string) => void,
+  openPaneSettings: (paneId: string) => void,
+  desktopWindowBridge?: DesktopWindowBridge,
+  copyPaneScreenshot?: (paneId: string) => void | Promise<void>,
+): ContextMenuItem[] {
+  const baseActions: ContextMenuItem[] = [];
+  if (pluginRegistry.hasPaneSettings(pane.instance.instanceId)) {
+    baseActions.push({
+      id: "settings",
+      label: "Settings",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.settings,
+      onSelect: () => openPaneSettings(pane.instance.instanceId),
+    });
+  }
+  if (copyPaneScreenshot) {
+    baseActions.push({
+      id: "copy-screenshot",
+      label: "Copy Screenshot",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.copyScreenshot,
+      onSelect: () => copyPaneScreenshot(pane.instance.instanceId),
+    });
+  }
+
+  if (pane.floating) {
+    baseActions.push({
+      id: "dock",
+      label: "Dock Pane",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.toggleFloating,
+      onSelect: () => {
+        persistLayout(applyDrop(layout, pane.instance.instanceId, { kind: "frame", edge: "right" }));
+        focusPane(pane.instance.instanceId);
+      },
+    });
+  } else {
+    baseActions.push({
+      id: "float",
+      label: "Float Pane",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.toggleFloating,
+      onSelect: () => {
+        persistLayout(floatPane(layout, pane.instance.instanceId, width, contentHeight, pane.def));
+        focusPane(pane.instance.instanceId);
+      },
+    });
+  }
+
+  if (desktopWindowBridge?.kind === "main" && desktopWindowBridge.popOutPane) {
+    baseActions.push({
+      id: "pop-out",
+      label: "Pop Out",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.popOut,
+      onSelect: () => {
+        void desktopWindowBridge.popOutPane?.(pane.instance.instanceId);
+      },
+    });
+  }
+
+  baseActions.push({
+    id: "close-pane",
+    label: "Close Pane",
+    accelerator: PANE_MANAGEMENT_ACCELERATORS.close,
+    onSelect: () => persistLayout(removePane(layout, pane.instance.instanceId)),
+  });
+
+  baseActions.push(
+    contextMenuDivider("pane:layout-divider"),
+    {
+      id: "window-move-mode",
+      label: "Move Window...",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.windowMode,
+      onSelect: () => pluginRegistry.openWindowMode(pane.instance.instanceId, "move"),
+    },
+    {
+      id: "window-resize-mode",
+      label: "Resize Window...",
+      accelerator: "WIN resize",
+      onSelect: () => pluginRegistry.openWindowMode(pane.instance.instanceId, "resize"),
+    },
+    {
+      id: "layout-actions",
+      label: "Layout Actions...",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.layoutActions,
+      onSelect: () => pluginRegistry.openCommandBar("LAY "),
+    },
+  );
+
+  return baseActions;
+}
+
+export function menuItemsForFallback(
+  items: ContextMenuItem[],
+  shortcutDisplayMode: ShortcutDisplayMode,
+): Array<{ id: string; label: string; accelerator?: string; action: () => void }> {
+  return items.flatMap((item) => {
+    if (item.type === "divider" || item.type === "role" || item.enabled === false || item.hidden === true) return [];
+    if (!item.onSelect) return [];
+    return [{
+      id: item.id,
+      label: item.label,
+      accelerator: item.accelerator
+        ? formatPlatformShortcutLabel(item.accelerator, undefined, shortcutDisplayMode)
+        : undefined,
+      action: () => { void item.onSelect?.(); },
+    }];
+  });
+}
+
+export function actionMenuWidth(
+  items: Array<{ label: string; accelerator?: string }>,
+  availableWidth: number,
+): number {
+  const requested = Math.max(
+    MENU_MIN_WIDTH,
+    ...items.map((item) => item.label.length + (item.accelerator ? item.accelerator.length + 3 : 0) + 2),
+  );
+  return Math.max(MENU_MIN_WIDTH, Math.min(MENU_MAX_WIDTH, availableWidth, requested));
+}
+
+export function truncateMenuText(text: string, width: number): string {
+  if (width <= 0) return "";
+  if (text.length <= width) return text;
+  if (width <= 3) return ".".repeat(width);
+  return `${text.slice(0, width - 3)}...`;
+}