gloomberb 0.16.6 → 0.17.0

package/src/components/layout/missing-pane.tsx

@@ -163,6 +163,8 @@ export function missingPanePlaceholderDef(paneId: string): PaneDef {
       defaultMode: "floating",
       defaultFloatingSize: { width: 60, height: 12 },
       portableShare: { private: {} },
+      // It draws a notice, not the pane's own data.
+      personalData: () => null,
     };
     placeholders.set(paneId, def);
   }

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

@@ -513,6 +513,7 @@ export function Shell({
   const { canAsk, askAboutPane, askAboutFocusedPane } = useShellPaneAsk({
     focusedPaneId,
     getPaneTitle,
+    layout: visibleLayout,
     nativePaneChrome,
     paneMap,
     pluginRegistry,

package/src/components/layout/shell/pane/ask.ts

@@ -1,4 +1,4 @@
-import { useCallback, useSyncExternalStore, type RefObject } from "react";
+import { useCallback, useRef, useSyncExternalStore, type RefObject } from "react";
 import { buildAskGloomPaneAttachment } from "../../../../ask-gloom/pane-context";
 import {
   askGloomAboutPane,
@@ -9,13 +9,16 @@ import { domPaneText, terminalPaneText, type CellRect } from "../../../../ask-gl
 import type { DockLeafLayout, FloatingRect, LayoutBounds, ResolvedPane } from "../../../../layout/pane-manager";
 import type { PluginRegistry } from "../../../../plugins/registry";
 import { useRemoteUiRegistry, type RemoteUiRegistry } from "../../../../remote/semantic-tree";
-import { resolveTickerForPane, type AppState } from "../../../../state/app/context";
+import type { AppState } from "../../../../state/app/context";
+import type { LayoutConfig } from "../../../../types/config";
 import { useNativeRenderer } from "../../../../ui";
 import { readRenderableBounds } from "../cursor-occlusion";
 
 interface ShellPaneAskOptions {
   focusedPaneId: string | null;
   getPaneTitle: (pane: ResolvedPane) => string;
+  /** The layout the panes are in, for their `personalData` rules. */
+  layout: LayoutConfig;
   nativePaneChrome: boolean;
   paneMap: Map<string, ResolvedPane>;
   pluginRegistry: PluginRegistry;
@@ -68,6 +71,7 @@ function activePaneTabs(paneId: string, remoteUi: RemoteUiRegistry | null, nativ
 export function useShellPaneAsk({
   focusedPaneId,
   getPaneTitle,
+  layout,
   nativePaneChrome,
   paneMap,
   pluginRegistry,
@@ -79,6 +83,9 @@ export function useShellPaneAsk({
   const canAsk = useSyncExternalStore(subscribeAskGloomAboutPanes, canAskGloomAboutPanes, canAskGloomAboutPanes);
   const nativeRenderer = useNativeRenderer();
   const remoteUi = useRemoteUiRegistry();
+  // Read when asked, so a layout edit does not remake the actions that ask.
+  const layoutRef = useRef(layout);
+  layoutRef.current = layout;
 
   const readTerminalText = useCallback((paneId: string, cover: LayoutBounds | null | undefined): string | null => {
     const frame = nativeRenderer.captureFrame?.();
@@ -110,12 +117,10 @@ export function useShellPaneAsk({
     }
     const attachment = buildAskGloomPaneAttachment({
       registry: pluginRegistry,
-      instance: pane.instance,
+      pane,
+      state,
+      layout: layoutRef.current,
       title: getPaneTitle(pane),
-      symbol: resolveTickerForPane(state, paneId),
-      paneState: state.paneState[paneId],
-      config: state.config,
-      tickers: state.tickers,
       activeTabs: activePaneTabs(paneId, remoteUi, nativePaneChrome),
       visibleText,
     });

package/src/components/layout/shell/pane/capture.ts

@@ -1,18 +1,12 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { createOneShot } from "../../../../utils/one-shot";
 import type { LayoutBounds, ResolvedPane } from "../../../../layout/pane-manager";
-import { getPaneSettings } from "../../../../pane-settings";
 import type { PluginRegistry } from "../../../../plugins/registry";
 import { paneScreenshotScale, PANE_SCREENSHOT_MIN_WIDTH } from "../../../../remote/pane-screenshot";
-import {
-  base64Bytes,
-  formatCaptureStamp,
-  resolvePanePersonalData,
-  type PaneImageCapture,
-} from "../../../../shares/pane-image";
-import { resolveCollectionForPane, resolveTickerForPane, useAppStateRef, type AppState } from "../../../../state/app/context";
+import { base64Bytes, formatCaptureStamp, type PaneImageCapture } from "../../../../shares/pane-image";
+import { panePersonalData } from "../../../../shares/personal-pane";
+import { resolveTickerForPane, useAppStateRef } from "../../../../state/app/context";
 import type { LayoutConfig } from "../../../../types/config";
-import type { PanePersonalDataContext } from "../../../../types/plugin";
 import { useUiCapabilities, type NativeRendererHost } from "../../../../ui";
 import { buildPaneSharePayload } from "../../../../shares/pane";
 import { preparePaneShare } from "../../../../shares/prepare";
@@ -34,29 +28,6 @@ function nextFrames(count: number): Promise<void> {
   });
 }
 
-/** What a pane shows now, for its `personalData` rule. */
-function personalDataContext(state: AppState, layout: LayoutConfig, pane: ResolvedPane): PanePersonalDataContext {
-  const paneId = pane.instance.instanceId;
-  return {
-    config: state.config,
-    layout,
-    paneId,
-    paneType: pane.instance.paneId,
-    pane: pane.instance,
-    settings: getPaneSettings(pane.instance),
-    paneState: state.paneState[paneId] ?? {},
-    activeTicker: resolveTickerForPane(state, paneId),
-    activeCollectionId: resolveCollectionForPane(state, paneId),
-    tickers: state.tickers,
-  };
-}
-
-/** Whether the plugin that owns a pane also connects a broker. */
-function ownerConnectsBroker(pluginRegistry: PluginRegistry, paneType: string): boolean {
-  const owner = pluginRegistry.getPanePluginId(paneType);
-  return !!owner && [...pluginRegistry.brokers.keys()].some((brokerType) => pluginRegistry.getBrokerPluginId(brokerType) === owner);
-}
-
 interface UseShellPaneCaptureOptions {
   appHeaderHeight: number;
   closePaneMenu: () => void;
@@ -135,8 +106,11 @@ export function useShellPaneCapture(options: UseShellPaneCaptureOptions): void {
           resolveTickerForPane(stateRef.current, paneId),
           stateRef.current.tickers,
         ) : null,
-        personalData: resolvePanePersonalData(pane.def, personalDataContext(stateRef.current, current.layout, pane), {
-          ownerConnectsBroker: ownerConnectsBroker(current.pluginRegistry, pane.def.id),
+        personalData: panePersonalData({
+          registry: current.pluginRegistry,
+          state: stateRef.current,
+          layout: current.layout,
+          pane,
         }),
         ...image,
       };

package/src/components/markdown-text.tsx

@@ -10,7 +10,13 @@ import { useUiCapabilities } from "../ui";
 
 export interface MarkdownTextProps {
   text: string;
+  /**
+   * Columns the terminal wraps at, and the width tables are fitted to. The
+   * desktop and the web wrap text at the width of the box it sits in.
+   */
   lineWidth?: number;
+  /** Desktop and web: the space a blank line leaves between paragraphs, in CSS units; one line when unset. */
+  paragraphGap?: string;
   catalog?: Record<string, InlineTickerCatalogEntry>;
   textColor?: string;
   openTicker?: (symbol: string) => void;
@@ -405,6 +411,21 @@ function wrappedTextStyle() {
   } as const;
 }
 
+/**
+ * A wrapped line on the desktop and the web: a list item's later lines hang
+ * under its text rather than its marker, measured in characters of its own
+ * type.
+ */
+function nativeLineStyle(parsed: ParsedLine) {
+  const marker = parsed.segments[0]?.text ?? "";
+  const hang = parsed.heading || !/^([-*]|\d+\.) $/.test(marker) ? 0 : (parsed.indent ?? 0) + marker.length;
+  return {
+    ...wrappedTextStyle(),
+    display: "block",
+    ...(hang > 0 ? { paddingLeft: `${hang}ch`, textIndent: `-${hang}ch` } : {}),
+  } as const;
+}
+
 function wrappedInlineTextStyle() {
   return {
     ...wrappedTextStyle(),
@@ -412,6 +433,9 @@ function wrappedInlineTextStyle() {
   } as const;
 }
 
+/** Desktop and web: the width of the box the text sits in, beside a list marker too. */
+const NATIVE_FILL = { width: "100%", flexShrink: 1, minWidth: 0 } as const;
+
 function SegmentSpan({ segment, wrap = false, onOpenLink }: {
   segment: StyledSegment;
   wrap?: boolean;
@@ -479,15 +503,17 @@ function MarkdownLine({
   onHover: (symbol: string | null) => void;
   onOpenLink?: (href: string) => void;
 }) {
+  const { nativePaneChrome } = useUiCapabilities();
   const indent = parsed.indent ?? 0;
   const indentStr = indent > 0 ? " ".repeat(indent) : "";
-  const shouldWrap = lineWidth != null;
+  // The desktop and the web always wrap, in CSS, across the box the text sits in.
+  const shouldWrap = lineWidth != null || nativePaneChrome === true;
   const textWrapProps = shouldWrap
     ? {
-        width: lineWidth,
+        width: nativePaneChrome ? "100%" : lineWidth,
         wrapText: true,
         wrapMode: "word",
-        style: wrappedTextStyle(),
+        style: nativePaneChrome ? nativeLineStyle(parsed) : wrappedTextStyle(),
       }
     : {};
 
@@ -511,7 +537,7 @@ function MarkdownLine({
   // Complex case: need to handle tickers within styled segments
   // Render as a flex row to allow badge elements
   return (
-    <Box flexDirection="row" flexWrap="wrap" {...(lineWidth != null ? { width: lineWidth } : {})}>
+    <Box flexDirection="row" flexWrap="wrap" {...(nativePaneChrome ? NATIVE_FILL : lineWidth != null ? { width: lineWidth } : {})}>
       {indentStr ? <Text fg={textColor}>{indentStr}</Text> : null}
       {parsed.segments.map((segment, segIdx) => {
         const tokens = tokenizeTickerText(segment.text);
@@ -568,13 +594,16 @@ export function MarkdownText({
   textColor = colors.text,
   openTicker = () => {},
   onOpenLink,
+  paragraphGap,
 }: MarkdownTextProps) {
+  const { nativePaneChrome } = useUiCapabilities();
   const links = onOpenLink !== undefined;
   const [hoveredSymbol, setHoveredSymbol] = useState<string | null>(null);
   const blocks = parseMarkdownBlocks(text);
 
   return (
-    <Box flexDirection="column" {...(lineWidth != null ? { width: lineWidth } : {})}>
+    // Rendered prose: the desktop and web let a person select and copy it.
+    <Box flexDirection="column" data-gloom-selectable="true" {...(nativePaneChrome ? NATIVE_FILL : lineWidth != null ? { width: lineWidth } : {})}>
       {blocks.map((block, index) => {
         if (block.kind === "table") {
           return (
@@ -591,7 +620,9 @@ export function MarkdownText({
         }
         const line = block.text;
         if (line.trim() === "") {
-          return <Text key={index}>{" "}</Text>;
+          return nativePaneChrome && paragraphGap
+            ? <Box key={index} flexShrink={0} style={{ height: paragraphGap }} />
+            : <Text key={index}>{" "}</Text>;
         }
         const parsed = parseLine(line, links);
         return (