gloomberb 0.11.1 → 0.11.2

package/src/components/layout/detached-pane-shell.tsx

@@ -1,8 +1,8 @@
-import { Box, Span, Text, useRendererHost, useUiCapabilities } from "../../ui";
+import { Box, Span, Text, useContextMenu, useRendererHost, useUiCapabilities } from "../../ui";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { t } from "../../i18n";
 import { useShortcut, useViewport } from "../../react/input";
-import { useAppDispatch, useAppSelector } from "../../state/app/context";
+import { resolveTickerForPane, useAppDispatch, useAppSelector } from "../../state/app/context";
 import type { DesktopWindowBridge } from "../../types/desktop-window";
 import { findPaneInstance } from "../../types/config";
 import type { PluginRegistry } from "../../plugins/registry";
@@ -20,6 +20,13 @@ import {
   recordDoubleEscapeClose,
   resetDoubleEscapeClose,
 } from "../../utils/double-escape-close";
+import { createShare, openLiveShareUrl } from "../../shares/api";
+import { buildPaneSharePayload } from "../../shares/pane";
+import type { ContextMenuItem } from "../../types/context-menu";
+import {
+  PANE_MANAGEMENT_ACCELERATORS,
+  resolvePaneManagementShortcut,
+} from "./shell/shortcuts";
 
 interface DetachedPaneShellProps {
   pluginRegistry: PluginRegistry;
@@ -35,6 +42,7 @@ export function DetachedPaneShell({ pluginRegistry, desktopWindowBridge }: Detac
   const colors = useThemeColors();
   const dispatch = useAppDispatch();
   const rendererHost = useRendererHost();
+  const { showContextMenu } = useContextMenu();
   const config = useAppSelector((state) => state.config);
   const paneState = useAppSelector((state) => state.paneState);
   const inputCaptured = useAppSelector((state) => state.inputCaptured);
@@ -46,6 +54,7 @@ export function DetachedPaneShell({ pluginRegistry, desktopWindowBridge }: Detac
   const {
     cellHeightPx = 18,
     nativePaneChrome,
+    publicSharing,
     titleBarOverlay,
     nativeWindowChrome = titleBarOverlay,
     windowControls,
@@ -55,13 +64,21 @@ export function DetachedPaneShell({ pluginRegistry, desktopWindowBridge }: Detac
   const instance = useAppSelector((state) => findPaneInstance(state.config.layout, desktopWindowBridge.paneId) ?? null);
   const paneDef = instance ? pluginRegistry.panes.get(instance.paneId) ?? null : null;
   const hasPaneSettings = !!instance && pluginRegistry.hasPaneSettings(instance.instanceId);
-  const quickSettings = instance ? pluginRegistry.resolvePaneQuickSettings(instance.instanceId) : [];
   const titleState = useMemo(
-    () => ({ config, paneState }) as Parameters<typeof getPaneDisplayTitle>[0],
+    () => ({ config, paneState }) as Parameters<typeof resolveTickerForPane>[0],
     [config, paneState],
   );
+  const sharePayload = useMemo(() => instance && publicSharing
+    ? buildPaneSharePayload(
+        pluginRegistry,
+        instance,
+        paneState[instance.instanceId] ?? {},
+        resolveTickerForPane(titleState, instance.instanceId),
+      )
+    : null, [instance, paneState, pluginRegistry, publicSharing, titleState]);
+  const quickSettings = instance ? pluginRegistry.resolvePaneQuickSettings(instance.instanceId) : [];
   const title = instance && paneDef
-    ? getPaneDisplayTitle(titleState, instance, paneDef)
+    ? getPaneDisplayTitle(titleState, instance, paneDef, pluginRegistry.panes)
     : "Detached Pane";
   const focused = windowFocused;
 
@@ -121,10 +138,56 @@ export function DetachedPaneShell({ pluginRegistry, desktopWindowBridge }: Detac
     if (nativeWindowChrome) void rendererHost.startWindowDrag?.();
   }, [focusPane, nativeWindowChrome, rendererHost]);
 
-  const openSettings = useCallback((event?: { stopPropagation?: () => void; preventDefault?: () => void }) => {
+  const sharePane = useCallback(async () => {
+    if (!sharePayload) return;
+    try {
+      const { id } = await createShare(sharePayload);
+      await rendererHost.copyText(openLiveShareUrl(id));
+      pluginRegistry.notify({ body: "Share link copied to clipboard", type: "success" });
+    } catch (error) {
+      pluginRegistry.notify({
+        body: error instanceof Error ? error.message : "Could not share this pane.",
+        type: "error",
+      });
+    }
+  }, [pluginRegistry, rendererHost, sharePayload]);
+
+  useShortcut((event) => {
+    if (resolvePaneManagementShortcut(event) !== "share" || !sharePayload) return;
+    if (inputCaptured && event.ctrl && !event.meta && !event.super) return;
+    event.preventDefault();
+    event.stopPropagation();
+    void sharePane();
+  });
+
+  const openActions = useCallback((event?: { stopPropagation?: () => void; preventDefault?: () => void }) => {
     stopMouse(event);
-    pluginRegistry.openPaneSettingsFn(desktopWindowBridge.paneId);
-  }, [desktopWindowBridge.paneId, pluginRegistry]);
+    focusPane();
+    const items: ContextMenuItem[] = [];
+    if (hasPaneSettings) {
+      items.push({
+        id: "settings",
+        label: "Settings",
+        onSelect: () => pluginRegistry.openPaneSettingsFn(desktopWindowBridge.paneId),
+      });
+    }
+    if (sharePayload) items.push({
+      id: "share-pane",
+      label: "Share Pane",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.share,
+      onSelect: sharePane,
+    });
+    void showContextMenu({
+      kind: "pane",
+      paneId: desktopWindowBridge.paneId,
+      paneType: instance?.paneId ?? "",
+      title,
+      floating: true,
+    }, items, event).then((shown) => {
+      if (!shown && hasPaneSettings) pluginRegistry.openPaneSettingsFn(desktopWindowBridge.paneId);
+      else if (!shown && sharePayload) void sharePane();
+    });
+  }, [desktopWindowBridge.paneId, focusPane, hasPaneSettings, instance?.paneId, pluginRegistry, sharePane, sharePayload, showContextMenu, title]);
   const toggleQuickSetting = useCallback((key: string, event?: { stopPropagation?: () => void; preventDefault?: () => void }) => {
     stopMouse(event);
     focusPane();
@@ -230,14 +293,15 @@ export function DetachedPaneShell({ pluginRegistry, desktopWindowBridge }: Detac
                   </Box>
                 ))}
                 <Box flexGrow={1} minWidth={0} />
-                {hasPaneSettings && (
+                {(hasPaneSettings || sharePayload) && (
                   <Text
                     fg={paneTitleText(focused, true, colors)}
                     selectable={false}
                     className="electrobun-webkit-app-region-no-drag"
                     data-gloom-role="pane-action"
                     data-gloom-interactive="true"
-                    onMouseDown={openSettings}
+                    aria-label="Pane actions"
+                    onMouseDown={openActions}
                   >
                     {" ... "}
                   </Text>

package/src/components/layout/pane/title.ts

@@ -1,9 +1,16 @@
 import { resolveCollectionForPane, resolveTickerForPane, type AppState } from "../../../state/app/context";
-import { t } from "../../../i18n";
-import { TICKER_RESEARCH_PANE_ID, type PaneInstanceConfig } from "../../../types/config";
+import { t, tf } from "../../../i18n";
+import {
+  findPaneInstance,
+  TICKER_RESEARCH_PANE_ID,
+  type PaneInstanceConfig,
+} from "../../../types/config";
 import type { PaneDef } from "../../../types/plugin";
 
-export function getPaneDisplayTitle(
+/** Single-cell link glyph: emoji link icons render double-width in terminals. */
+const LINK_GLYPH = "\u29c9";
+
+function getBasePaneDisplayTitle(
   state: Pick<AppState, "config" | "paneState">,
   instance: PaneInstanceConfig,
   paneDef: PaneDef,
@@ -38,6 +45,27 @@ export function getPaneDisplayTitle(
       ?? t(paneDef.name);
   }
 
+  // A source pane owns the cursor symbol; echoing it in its own title would just repeat the row.
+  if (paneDef.tickerSource) return t(paneDef.name);
+
   const ticker = resolveTickerForPane(state as AppState, instance.instanceId);
   return ticker ? `${t(paneDef.name)}: ${ticker}` : t(paneDef.name);
 }
+
+export function getPaneDisplayTitle(
+  state: Pick<AppState, "config" | "paneState">,
+  instance: PaneInstanceConfig,
+  paneDef: PaneDef,
+  panes?: ReadonlyMap<string, PaneDef>,
+): string {
+  const title = getBasePaneDisplayTitle(state, instance, paneDef);
+  if (instance.paneId !== TICKER_RESEARCH_PANE_ID || instance.binding?.kind !== "follow" || !panes) {
+    return title;
+  }
+
+  const source = findPaneInstance(state.config.layout, instance.binding.sourceInstanceId);
+  const sourceDef = source ? panes.get(source.paneId) : null;
+  if (!source || !sourceDef) return title;
+  const sourceTitle = getBasePaneDisplayTitle(state, source, sourceDef);
+  return `${title}  ${LINK_GLYPH} ${tf("Linked to {source}", { source: sourceTitle })}`;
+}

package/src/components/layout/shell/active-drag.ts

@@ -1,4 +1,4 @@
-import { useCallback, type Dispatch } from "react";
+import { useCallback } from "react";
 import {
   floatAtRect,
   getRememberedFloatingRect,
@@ -10,7 +10,6 @@ import {
   type LayoutBounds,
   type ResolvedPane,
 } from "../../../plugins/pane-manager";
-import type { AppAction } from "../../../state/app/context";
 import type { LayoutConfig } from "../../../types/config";
 import {
   finalizePaneDragRelease,
@@ -32,7 +31,6 @@ interface UseShellActiveDragOptions {
   appHeaderHeight: number;
   bounds: LayoutBounds;
   contentHeight: number;
-  dispatch: Dispatch<AppAction>;
   dockGeometryOptions: DockGeometryOptions;
   dockLeafLayouts: DockLeafLayout[];
   dragRuntime: ShellDragRuntimeState;
@@ -52,7 +50,6 @@ export function useShellActiveDrag({
   appHeaderHeight,
   bounds,
   contentHeight,
-  dispatch,
   dockGeometryOptions,
   dockLeafLayouts,
   dragRuntime,
@@ -168,16 +165,13 @@ export function useShellActiveDrag({
             ? getRememberedFloatingRect(baseLayout, drag.paneId, width, contentHeight, pane?.def)
             : drag.origRect;
           const releaseRect = resolvePaneDragFloatingRect(drag, baseRect, preciseX, preciseShellY, width, contentHeight);
-          const releaseResult = finalizePaneDragRelease(baseLayout, drag.paneId, releaseRect, dockPreviewRef.current);
+          const nextLayout = finalizePaneDragRelease(baseLayout, drag.paneId, releaseRect, dockPreviewRef.current);
           if (windowMode) {
-            updateWindowModePreviewLayout(releaseResult.nextLayout, drag.paneId);
+            updateWindowModePreviewLayout(nextLayout, drag.paneId);
           } else {
-            persistLayout(releaseResult.nextLayout);
+            persistLayout(nextLayout);
           }
           focusPane(drag.paneId);
-          if (!windowMode && releaseResult.shouldShowGridlockTip) {
-            dispatch({ type: "SHOW_GRIDLOCK_TIP" });
-          }
           updateDockPreview(null);
           setDragCursor(null);
           updateDragFloatingRect(null);
@@ -201,7 +195,6 @@ export function useShellActiveDrag({
     appHeaderHeight,
     bounds,
     contentHeight,
-    dispatch,
     dockGeometryOptions,
     dividerPreviewRef,
     dockLeafLayouts,

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

@@ -46,11 +46,6 @@ export type DragPreview =
     rect: FloatingRect;
   };
 
-export interface PaneDragReleaseResult {
-  nextLayout: LayoutConfig;
-  shouldShowGridlockTip: boolean;
-}
-
 export interface PaneDragRectState {
   mode: "docked" | "floating";
   startX: number;
@@ -272,25 +267,14 @@ export function finalizePaneDragRelease(
   paneId: string,
   previewRect: FloatingRect,
   dockPreview: DragPreview | null,
-): PaneDragReleaseResult {
+): LayoutConfig {
   if (dockPreview?.kind === "dock") {
-    return {
-      nextLayout: applyDrop(layout, paneId, dockPreview.target),
-      shouldShowGridlockTip: false,
-    };
+    return applyDrop(layout, paneId, dockPreview.target);
   }
-
   if (dockPreview?.kind === "snap") {
-    return {
-      nextLayout: floatAtRect(layout, paneId, dockPreview.rect),
-      shouldShowGridlockTip: true,
-    };
+    return floatAtRect(layout, paneId, dockPreview.rect);
   }
-
-  return {
-    nextLayout: floatAtRect(layout, paneId, previewRect),
-    shouldShowGridlockTip: false,
-  };
+  return floatAtRect(layout, paneId, previewRect);
 }
 
 export function makeSnapGuides(width: number, height: number): SnapGuide[] {

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

@@ -15,7 +15,6 @@ import {
   type LayoutBounds,
   type ResolvedPane,
 } from "../../../../plugins/pane-manager";
-import type { AppAction } from "../../../../state/app/context";
 import type { LayoutConfig } from "../../../../types/config";
 import {
   constrainFloatingRectToBounds,
@@ -165,7 +164,6 @@ interface UseShellPointerRuntimeOptions {
   bounds: LayoutBounds;
   closePaneMenu: () => void;
   contentHeight: number;
-  dispatch: Dispatch<AppAction>;
   dockGeometryOptions: DockGeometryOptions;
   dockDividerLayouts: DockDividerLayout[];
   dockLeafLayouts: DockLeafLayout[];
@@ -193,6 +191,7 @@ interface UseShellPointerRuntimeOptions {
   visibleLayout: LayoutConfig;
   width: number;
   windowMode: WindowEditState | null;
+  commandBarOpen: boolean;
 }
 
 export function useShellPointerRuntime({
@@ -200,7 +199,6 @@ export function useShellPointerRuntime({
   bounds,
   closePaneMenu,
   contentHeight,
-  dispatch,
   dockGeometryOptions,
   dockDividerLayouts,
   dockLeafLayouts,
@@ -224,12 +222,12 @@ export function useShellPointerRuntime({
   visibleLayout,
   width,
   windowMode,
+  commandBarOpen,
 }: UseShellPointerRuntimeOptions) {
   const handleActiveDrag = useShellActiveDrag({
     appHeaderHeight,
     bounds,
     contentHeight,
-    dispatch,
     dockGeometryOptions,
     dockLeafLayouts,
     focusPane,
@@ -282,6 +280,7 @@ export function useShellPointerRuntime({
     setMenuState,
     transientFocusActive,
     windowMode,
+    commandBarOpen,
   });
 
   return {

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

@@ -62,6 +62,7 @@ function createShellPluginRegistry(options?: {
     hasPaneSettings: (paneId: string) => paneId === "portfolio-list:main",
     openPaneSettingsFn: () => {},
     openCommandBar: () => {},
+    showPane: () => {},
     openWindowMode: () => {},
     openWindowModeFn: () => {},
     updateLayoutFn: () => {},
@@ -356,7 +357,8 @@ describe("Shell", () => {
     expect(resolvePaneManagementShortcut({ ...base, name: "D", key: "D" })).toBe("toggle-floating");
     expect(resolvePaneManagementShortcut({ ...base, name: "o", key: "o" })).toBe("pop-out");
     expect(resolvePaneManagementShortcut({ ...base, name: "c", key: "c" })).toBe("copy-screenshot");
-    expect(resolvePaneManagementShortcut({ ...base, name: "l", key: "l" })).toBe("layout-actions");
+    expect(resolvePaneManagementShortcut({ ...base, name: "s", key: "s" })).toBe("share");
+    expect(resolvePaneManagementShortcut({ ...base, name: "l", key: "l" })).toBe("layout-gallery");
     expect(resolvePaneManagementShortcut({ ...base, name: "f", key: "f" })).toBe("toggle-fullscreen");
     expect(resolvePaneManagementShortcut({ ...base, name: "g", key: "g" })).toBe("gridlock-all");
     expect(resolvePaneManagementShortcut({ ...base, name: "m", key: "m" })).toBe("window-mode");
@@ -366,6 +368,18 @@ describe("Shell", () => {
     expect(resolvePaneManagementShortcut({ ...base, name: "d", key: "d", meta: false, super: false })).toBeNull();
   });
 
+  test("opens the layout browser from the primary Shift-L shortcut", async () => {
+    const config = createDefaultConfig("/tmp/gloomberb-shell-layout-browser-shortcut-test");
+    const opened: string[] = [];
+    const registry = createShellPluginRegistry();
+    registry.showPane = (paneId) => opened.push(paneId);
+    await renderShellForWindowModeTest(createInitialState(config), { registry });
+
+    await emitKeypress({ name: "l", ctrl: true, shift: true });
+
+    expect(opened).toEqual(["layout-marketplace"]);
+  });
+
   test("toggles the focused pane fullscreen without persisting layout", async () => {
     const config = createDefaultConfig("/tmp/gloomberb-shell-fullscreen-shortcut-test");
     const mainPane = requireLayoutInstance(config, "portfolio-list:main");
@@ -478,8 +492,8 @@ describe("Shell", () => {
 
     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);
+    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);

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

@@ -21,6 +21,7 @@ import {
   syncConfigActiveLayoutState,
   useAppDispatch,
   useAppSelector,
+  useAppStateRef,
 } from "../../../state/app/context";
 import {
   selectCommandBarOpen,
@@ -37,6 +38,7 @@ import {
   menuForPane,
   menuItemsForFallback,
 } from "./menu";
+import { tickerLinkMenuItems } from "./ticker-link-menu";
 import {
   makeSnapGuides,
   resolveExternalDockPreview,
@@ -67,6 +69,9 @@ import {
   resolveShellCursorOcclusionRects,
   useShellCursorOcclusionGuard,
 } from "./cursor-occlusion";
+import { createShare, openLiveShareUrl } from "../../../shares/api";
+import { buildPaneSharePayload } from "../../../shares/pane";
+import type { SharePayload } from "../../../shares/payload";
 
 export { resolveAppHeaderHeightCells } from "./chrome";
 export { buildNativeWindowState } from "./native/window-state";
@@ -100,13 +105,14 @@ export function Shell({
   const previousFocusedPaneId = useAppSelector((state) => state.previousFocusedPaneId);
   const activePanel = useAppSelector((state) => state.activePanel);
   const commandBarOpen = useAppSelector(selectCommandBarOpen);
+  const stateRef = useAppStateRef();
   const inputCaptured = useAppSelector((state) => state.inputCaptured);
   const statusBarVisible = useAppSelector(selectStatusBarVisible);
   const rendererHost = useRendererHost();
   const { setTransientLayout } = useTransientLayout();
   const uiKind = useUiHost().kind;
   const shortcutDisplayMode = getShortcutDisplayMode(uiKind);
-  const { nativePaneChrome = false, nativeContextMenu, precisePointer, titleBarOverlay, cellHeightPx } = useUiCapabilities();
+  const { nativePaneChrome = false, nativeContextMenu, precisePointer, publicSharing, titleBarOverlay, cellHeightPx } = useUiCapabilities();
   const { showContextMenu } = useContextMenu();
   const { width, height } = useViewport();
   const shellRef = useRef<BoxRenderable | null>(null);
@@ -119,8 +125,9 @@ export function Shell({
   const dialogOpen = useDialogState((dialog) => dialog.isOpen);
   const [hoveredPaneId, setHoveredPaneId] = useState<string | null>(null);
   const setHoveredPaneIfChanged = useCallback((paneId: string | null) => {
+    if (commandBarOpen) return;
     setHoveredPaneId((current) => (current === paneId ? current : paneId));
-  }, []);
+  }, [commandBarOpen]);
   const [menuState, setMenuState] = useState<ActionMenuState | null>(null);
   const [transientFocusLayoutState, setTransientFocusLayoutState] = useState<TransientFocusLayoutState | null>(null);
   const transientFocusLayoutStateRef = useRef<TransientFocusLayoutState | null>(null);
@@ -131,6 +138,9 @@ export function Shell({
     setHoveredMenuItemId(null);
   }, []);
   const overlayOpen = commandBarOpen || dialogOpen || !!menuState;
+  useEffect(() => {
+    if (commandBarOpen) setHoveredPaneId(null);
+  }, [commandBarOpen]);
 
   const dragRuntime = useShellDragRuntimeState({
     contentHeight,
@@ -165,13 +175,14 @@ export function Shell({
     dispatch(hasFocusTarget
       ? { type: "UPDATE_LAYOUT", layout: nextLayout, focusedPaneId: options.focusedPaneId ?? null }
       : { type: "UPDATE_LAYOUT", layout: nextLayout });
+    const currentState = stateRef.current;
     scheduleConfigSave(syncConfigActiveLayoutState(
-      { ...config, layout: nextLayout },
-      paneState,
-      hasFocusTarget ? (options.focusedPaneId ?? null) : focusedPaneId,
-      activePanel,
+      { ...currentState.config, layout: nextLayout },
+      currentState.paneState,
+      hasFocusTarget ? (options.focusedPaneId ?? null) : currentState.focusedPaneId,
+      currentState.activePanel,
     ));
-  }, [activePanel, config, dispatch, focusedPaneId, paneState]);
+  }, [dispatch, stateRef]);
 
   const focusPane = useCallback((paneId: string) => {
     dispatch({ type: "FOCUS_PANE", paneId });
@@ -253,7 +264,6 @@ export function Shell({
     gridlockVisiblePanes,
     handleFloatingClose,
     openFocusedPaneSettings,
-    openLayoutMenu,
     openPaneSettings,
     popOutFocusedPane,
     toggleFocusedPaneFloating,
@@ -272,6 +282,9 @@ export function Shell({
     visibleLayout,
     width,
   });
+  const openLayoutGallery = useCallback(() => {
+    pluginRegistry.showPane("layout-marketplace");
+  }, [pluginRegistry]);
   const setTransientFocusLayout = useCallback((next: TransientFocusLayoutState | null) => {
     transientFocusLayoutStateRef.current = next;
     setTransientFocusLayoutState(next);
@@ -369,24 +382,6 @@ export function Shell({
     transientFocusLayoutState,
   ]);
 
-  useShellPaneManagementShortcuts({
-    cancelActiveDrag,
-    closeAllFloatingPanes,
-    closeFocusedPane,
-    copyFocusedPaneScreenshot,
-    focusedPaneId,
-    gridlockVisiblePanes,
-    hasActiveDrag,
-    inputCaptured,
-    openFocusedPaneSettings,
-    openLayoutMenu,
-    overlayOpen,
-    popOutFocusedPane,
-    startWindowMode,
-    toggleFocusedPaneFullscreen,
-    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]);
@@ -423,8 +418,8 @@ export function Shell({
     [config, paneState],
   );
   const getPaneTitle = useCallback(
-    (pane: ResolvedPane): string => getPaneDisplayTitle(titleState, pane.instance, pane.def),
-    [titleState],
+    (pane: ResolvedPane): string => getPaneDisplayTitle(titleState, pane.instance, pane.def, pluginRegistry.panes),
+    [pluginRegistry.panes, titleState],
   );
   const handlePaneQuickSetting = useCallback((paneId: string, key: string, event: any) => {
     event?.preventDefault?.();
@@ -447,6 +442,51 @@ export function Shell({
       onMouseDown: (event) => handlePaneQuickSetting(paneId, setting.key, event),
     }))
   ), [config, handlePaneQuickSetting, pluginRegistry]);
+  const sharePane = useCallback(async (payload: Extract<SharePayload, { kind: "pane" }>) => {
+    try {
+      const { id } = await createShare(payload);
+      await rendererHost.copyText(openLiveShareUrl(id));
+      pluginRegistry.notify({ body: "Share link copied to clipboard", type: "success" });
+    } catch (error) {
+      pluginRegistry.notify({
+        body: error instanceof Error ? error.message : "Could not share this pane.",
+        type: "error",
+      });
+    }
+  }, [pluginRegistry, rendererHost]);
+  const shareFocusedPane = useCallback(() => {
+    if (!publicSharing || !focusedPaneId) return false;
+    const pane = paneMap.get(focusedPaneId);
+    if (!pane) return false;
+    const payload = buildPaneSharePayload(
+      pluginRegistry,
+      pane.instance,
+      paneState[focusedPaneId] ?? {},
+      resolveTickerForPane(titleState, focusedPaneId),
+    );
+    if (!payload) return false;
+    void sharePane(payload);
+    return true;
+  }, [focusedPaneId, paneMap, paneState, pluginRegistry, publicSharing, sharePane, titleState]);
+
+  useShellPaneManagementShortcuts({
+    cancelActiveDrag,
+    closeAllFloatingPanes,
+    closeFocusedPane,
+    copyFocusedPaneScreenshot,
+    focusedPaneId,
+    gridlockVisiblePanes,
+    hasActiveDrag,
+    inputCaptured,
+    openFocusedPaneSettings,
+    openLayoutGallery,
+    overlayOpen,
+    popOutFocusedPane,
+    shareFocusedPane,
+    startWindowMode,
+    toggleFocusedPaneFullscreen,
+    toggleFocusedPaneFloating,
+  });
 
   const openPaneMenu = useCallback((paneId: string, rect: LayoutBounds, event?: { preventDefault?: () => void; stopPropagation?: () => void }) => {
     const pane = paneMap.get(paneId);
@@ -459,6 +499,14 @@ export function Shell({
       title: getPaneTitle(pane),
       floating: !!pane.floating,
     };
+    const sharePayload = publicSharing
+      ? buildPaneSharePayload(
+          pluginRegistry,
+          pane.instance,
+          paneState[paneId] ?? {},
+          resolveTickerForPane(titleState, paneId),
+        )
+      : null;
     const items = menuForPane(
       pane,
       visibleLayout,
@@ -470,6 +518,14 @@ export function Shell({
       openPaneSettings,
       desktopWindowBridge,
       nativePaneChrome && rendererHost.copyPngImage ? copyPaneScreenshot : undefined,
+      sharePayload ? () => sharePane(sharePayload) : undefined,
+      tickerLinkMenuItems({
+        instance: pane.instance,
+        layout: visibleLayout,
+        panes: pluginRegistry.panes,
+        state: titleState,
+        persistLayout,
+      }),
     );
     void showContextMenu(context, items, event).then((shown) => {
       if (shown) return;
@@ -493,7 +549,7 @@ export function Shell({
         items: fallbackItems,
       });
     });
-  }, [contentHeight, copyPaneScreenshot, desktopWindowBridge, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, persistLayout, pluginRegistry, rendererHost.copyPngImage, shortcutDisplayMode, showContextMenu, visibleLayout, width]);
+  }, [contentHeight, copyPaneScreenshot, desktopWindowBridge, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, paneState, persistLayout, pluginRegistry, publicSharing, rendererHost.copyPngImage, sharePane, shortcutDisplayMode, showContextMenu, titleState, visibleLayout, width]);
 
   const {
     handleFloatingCloseMouseDown,
@@ -511,7 +567,6 @@ export function Shell({
     bounds,
     closePaneMenu,
     contentHeight,
-    dispatch,
     dockGeometryOptions,
     dockDividerLayouts,
     dockLeafLayouts,
@@ -535,6 +590,7 @@ export function Shell({
     visibleLayout,
     width,
     windowMode,
+    commandBarOpen,
   });
   const windowModeDockResizePathKey = windowMode?.focus.kind === "dock-resize"
     ? windowMode.focus.pathKey

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

@@ -1,7 +1,43 @@
 import { describe, expect, test } from "bun:test";
 import { displayWidth } from "../../../utils/format";
 import { getLanguage, setLanguage, t } from "../../../i18n";
-import { actionMenuWidth } from "./menu";
+import { actionMenuWidth, menuForPane } from "./menu";
+
+describe("pane action menu", () => {
+  test("offers the global share action for a portable pane", async () => {
+    let shared = false;
+    const items = menuForPane(
+      {
+        instance: { instanceId: "chart-1", paneId: "chart-composer" },
+        def: { defaultPosition: "right" },
+        floating: false,
+      } as any,
+      {
+        dockRoot: { kind: "pane", instanceId: "chart-1" },
+        instances: [{ instanceId: "chart-1", paneId: "chart-composer" }],
+        floating: [],
+        detached: [],
+      },
+      120,
+      40,
+      {
+        hasPaneSettings: () => false,
+        openWindowMode: () => {},
+      } as any,
+      () => {},
+      () => {},
+      () => {},
+      undefined,
+      undefined,
+      () => { shared = true; },
+    );
+
+    const share = items.find((item) => item.type !== "divider" && item.id === "share-pane");
+    await share?.onSelect?.();
+    expect(shared).toBe(true);
+    expect(share?.accelerator).toBe("CmdOrCtrl+Shift+S");
+  });
+});
 
 describe("action menu sizing", () => {
   test("uses translated terminal display width", () => {