@deepseek-harness-tui/dsh-tui 0.10.2 → 0.11.0

package/lib/types/components/ScrollbarGutter.js

@@ -1,12 +1,21 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { Box, Text, NoSelect } from '../ui.js';
+import { FRAME_INTERVAL_MS } from '../ink/constants.js';
 import { RAIL_MIN_TERMINAL_WIDTH, RAIL_WIDTH } from '../ink/timeline-rail.js';
 /** Thumb glyph across the 2-col gutter: solid, clearly positional —
  *  deliberately distinct from the timeline's ━━ active tick. */
 const THUMB = '██';
 /** Rest time before the hover position chip pops (anti-flash sweep gate). */
 const CHIP_DWELL_MS = 250;
+/**
+ * Post-landing settle reads (see the subscribe effect): how many deferred
+ * re-reads follow a landing before giving up. The re-pinning Ink pass lands
+ * a frame or two after the commit, so a single read can still catch the
+ * pre-landing geometry — the bound only exists so a frame that never
+ * settles cannot chain renders forever.
+ */
+const PIN_SETTLE_CHECKS = 3;
 /**
  * Proportional scrollbar for the fullscreen transcript's gutter — the
  * `scrollbar` option of the `dsh-tui.scrollGutter` setting (the timeline
@@ -17,19 +26,38 @@ const CHIP_DWELL_MS = 250;
  *  - clicking the track scrolls the clicked position to the viewport top
  *    (classic scrollbar semantics — the thumb centers under the click
  *    through the follow-up renders);
+ *  - dragging the track scrubs the transcript: the drag protocol's
+ *    per-target localRow maps through the SAME trackScrollTop as a click
+ *    (absolute mapping — drag to point, no grabbed thumb offset), so a
+ *    drag is a continuous run of click-to-position jumps. The mapping only
+ *    reads the render-time maxScroll/trackH and never re-reads scrollTop
+ *    mid-gesture, so a throttled/clamped scrollTo cannot feed back into the
+ *    pointer mapping (no jitter). Dragging the thumb therefore lands the
+ *    pointer's row at the viewport top, exactly like clicking that row;
+ *  - a landing (drag or the back-to-bottom affordance) breaks and re-pins
+ *    sticky, which unmounts the chrome that had shrunk the transcript row;
+ *    the re-pinning Ink pass follows the commit and fires no subscriber
+ *    notify, so the gutter re-reads the handle once that frame lands (see
+ *    the subscribe effect). Without it the thumb stays painted from the
+ *    shrunken viewport and floats a few rows above the bottom until an
+ *    unrelated render (hover) re-reads the handle;
  *  - the gutter is permanent while scrollable (Qwen's rule: an
  *    auto-hiding gutter that changes content width rewraps everything);
  *    hidden below 60 terminal columns or when the content fits (inline
  *    mode keeps the terminal's native scrollback);
  *  - NoSelect fences the glyphs out of click-drag text selection; the
- *    wheel over the gutter scrolls the transcript.
- *
- * Thumb dragging is intentionally NOT implemented (Grok's MVP rule): a
- * proportional thumb encodes position, and the tick rail remains the
- * semantic navigator. Click-to-position covers the same need.
+ *    wheel over the gutter scrolls the transcript. Because the track is a
+ *    drag target, an unmodified left drag scrubs instead of selecting, and
+ *    multi-clicks on the track no longer feed the select-line chain;
+ *    Shift/Alt/Ctrl drags never open a drag session and keep the
+ *    selection path.
  */
 export function ScrollbarGutter({ handle, terminalWidth, }) {
     const [, setTick] = React.useState(0);
+    // Geometry the last render painted with. The Ink render pass runs AFTER
+    // React's commit, so the commit that lands a pinned view can paint from
+    // geometry that pass is about to change (see the subscribe effect).
+    const geomRef = React.useRef('');
     // Hover readout: the row under the pointer brightens the thumb when it is
     // the hovered one, and floats a `62% · 340/540` chip left of the gutter
     // naming the position a click there would jump to. The chip is
@@ -53,12 +81,57 @@ export function ScrollbarGutter({ handle, terminalWidth, }) {
     React.useEffect(() => {
         if (!handle)
             return;
-        return handle.subscribe(() => setTick(t => t + 1));
+        const readGeom = () => `${handle.getScrollTop()}:${handle.getScrollHeight()}:${handle.getViewportHeight()}`;
+        let timer = null;
+        let checksLeft = 0;
+        // Landing settle re-read. Reaching the bottom breaks and then re-pins
+        // sticky; the commit that consumes the notification paints while the
+        // chrome that shrank the transcript row (`PinnedTurnHeader` +
+        // "return to bottom" pill, both `!isSticky`) is still mounted, and the
+        // NEXT Ink pass then grows the viewport back and re-pins scrollTop to
+        // the taller maxScroll — with NO subscriber notify, because sticky
+        // never flips again (ScrollBox's subscribe contract). Nothing would
+        // re-read the handle, so the thumb stays painted from the shrunken
+        // viewport and floats above the bottom until an unrelated render
+        // (hover) rescues it. Re-read once that pass has landed and re-render
+        // if the geometry moved; only pinned notifications arm this (a landing
+        // is the one shape that can be re-pinned after the commit), so the
+        // cost is a couple of timers per landing, never per scroll frame.
+        const settle = () => {
+            timer = null;
+            if (readGeom() !== geomRef.current)
+                setTick(t => t + 1);
+            if (--checksLeft > 0)
+                timer = setTimeout(settle, FRAME_INTERVAL_MS);
+        };
+        const unsubscribe = handle.subscribe(() => {
+            setTick(t => t + 1);
+            if (!handle.isSticky())
+                return;
+            checksLeft = PIN_SETTLE_CHECKS;
+            if (timer === null)
+                timer = setTimeout(settle, FRAME_INTERVAL_MS);
+        });
+        return () => {
+            unsubscribe();
+            if (timer !== null)
+                clearTimeout(timer);
+        };
     }, [handle]);
+    // Geometry the last COMMITTED render painted with: captured during render,
+    // but the ref write happens in the layout effect below — this root is a
+    // ConcurrentRoot, so a render pass can be discarded, and a render-phase
+    // write would leak a frame that never painted into settle()'s diff.
+    const viewport = handle === null ? 0 : handle.getViewportHeight();
+    const content = handle === null ? 0 : handle.getScrollHeight();
+    const scrollTop = handle === null ? 0 : handle.getScrollTop();
+    const geom = handle === null ? null : `${scrollTop}:${content}:${viewport}`;
+    React.useLayoutEffect(() => {
+        if (geom !== null)
+            geomRef.current = geom;
+    }, [geom]);
     if (!handle)
         return null;
-    const viewport = handle.getViewportHeight();
-    const content = handle.getScrollHeight();
     const maxScroll = Math.max(0, content - viewport);
     if (viewport < 2 || content <= viewport || terminalWidth < RAIL_MIN_TERMINAL_WIDTH)
         return null;
@@ -67,10 +140,12 @@ export function ScrollbarGutter({ handle, terminalWidth, }) {
     // top follows scrollTop over the scroll range.
     const thumbH = Math.max(2, Math.round((viewport * viewport) / content));
     const trackH = Math.max(1, viewport - thumbH);
-    const thumbTop = Math.round((handle.getScrollTop() / Math.max(1, maxScroll)) * trackH);
+    const thumbTop = Math.round((scrollTop / Math.max(1, maxScroll)) * trackH);
     const thumbBottom = Math.min(viewport, thumbTop + thumbH);
     // Clicking the track maps the clicked row's position on the track back
     // to a scrollTop and scrolls that content position to the viewport top.
+    // Dragging reuses the same mapping per motion through the drag protocol's
+    // target-relative localRow (the outer track is the single drag target).
     const trackScrollTop = (y) => {
         if (y <= 0)
             return 0;
@@ -78,6 +153,9 @@ export function ScrollbarGutter({ handle, terminalWidth, }) {
             return maxScroll;
         return Math.round((y / trackH) * maxScroll);
     };
+    const applyDragRow = (event) => {
+        handle.scrollTo(trackScrollTop(event.localRow));
+    };
     const rows = [];
     for (let y = 0; y < viewport; y++) {
         const inThumb = y >= thumbTop && y < thumbBottom;
@@ -115,5 +193,5 @@ export function ScrollbarGutter({ handle, terminalWidth, }) {
     return (_jsx(NoSelect, { children: _jsxs("ink-box", { onWheel: e => {
                 if (e.deltaY !== 0)
                     handle.scrollBy(e.deltaY);
-            }, style: { flexDirection: 'column', flexShrink: 0, width: RAIL_WIDTH }, children: [rows, hoverChip] }) }));
+            }, onDragStart: applyDragRow, onDragMove: applyDragRow, onDragEnd: applyDragRow, style: { flexDirection: 'column', flexShrink: 0, width: RAIL_WIDTH }, children: [rows, hoverChip] }) }));
 }

package/lib/types/components/StreamingMarkdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StreamingMarkdown.d.ts","sourceRoot":"","sources":["../../../src/components/StreamingMarkdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAqMzB,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,QAAgB,GACjB,EAAE;IACD,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,KAAK,CAAC,SAAS,CAyIlB"}
+{"version":3,"file":"StreamingMarkdown.d.ts","sourceRoot":"","sources":["../../../src/components/StreamingMarkdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAuMzB,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,QAAgB,GACjB,EAAE;IACD,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,KAAK,CAAC,SAAS,CAyIlB"}

package/lib/types/components/StreamingMarkdown.js

@@ -4,7 +4,7 @@ import { marked } from 'marked';
 import Box from '../ink/components/Box.js';
 import { formatToken, stripPromptXMLTags } from '../terminal-utils/markdown.js';
 import { t } from '../i18n.js';
-import { Markdown } from './Markdown.js';
+import { isStandaloneToken, Markdown } from './Markdown.js';
 /**
  * Renders streaming markdown in sealed groups of completed top-level blocks.
  * Only the unsealed group and growing final block change as text arrives.
@@ -50,7 +50,7 @@ function clipSuffixTail(suffix, cut) {
 const UNSAFE_BOUNDARY = {
     safe: false,
     gap: 0,
-    endsWithTable: false,
+    endsWithNode: false,
     trailingEmptyTextNode: false,
 };
 /**
@@ -70,8 +70,8 @@ function blankTokenNewlines(type) {
  * Analyze the candidate stable tokens using the same formatter as Markdown.
  * Both split halves trim their outer whitespace, so the trailing newline count
  * determines the Yoga gap: one newline merely starts the next row; every
- * additional newline is one genuinely blank row. Tables are separate layout
- * nodes and therefore keep Markdown's fixed one-row node gap.
+ * additional newline is one genuinely blank row. Standalone nodes are
+ * separate layout nodes and therefore keep Markdown's fixed one-row node gap.
  *
  * Only the LAST token that can produce visible text decides the outcome, so
  * the region is walked backwards and formatted one token at a time instead of
@@ -79,14 +79,14 @@ function blankTokenNewlines(type) {
  * boundary. `formatToken` runs once for the common case.
  */
 function analyzeStableBoundary(tokens, suffixIndex) {
-    // A table resets the accumulated text, so only the segment after the last
-    // one matters; anything before it is already folded into the table branch.
+    // A standalone node resets the accumulated text, so only the segment after
+    // the last one matters; anything before it is already folded into the node branch.
     let segmentStart = 0;
-    let hasTable = false;
+    let hasNode = false;
     for (let i = suffixIndex - 1; i >= 0; i--) {
-        if (tokens[i].type === 'table') {
+        if (isStandaloneToken(tokens[i])) {
             segmentStart = i + 1;
-            hasTable = true;
+            hasNode = true;
             break;
         }
     }
@@ -116,17 +116,17 @@ function analyzeStableBoundary(tokens, suffixIndex) {
         return {
             safe: true,
             gap: Math.max(0, trailingNewlines - 1),
-            endsWithTable: false,
+            endsWithNode: false,
             trailingEmptyTextNode: false,
         };
     }
-    if (hasTable) {
+    if (hasNode) {
         return {
             safe: true,
             gap: 1,
-            endsWithTable: true,
-            // Whitespace after the table still occupies a zero-height text node
-            // between two tables.
+            endsWithNode: true,
+            // Whitespace after the node still occupies a zero-height text node
+            // between two standalone nodes.
             trailingEmptyTextNode: blankNewlines > 0,
         };
     }
@@ -141,14 +141,16 @@ function analyzeStableBoundary(tokens, suffixIndex) {
 function analyzeSuffixStart(tokens, startIndex) {
     let leadingNewlines = 0;
     for (let i = startIndex; i < tokens.length; i++) {
-        const type = tokens[i]?.type;
-        if (type === 'table')
-            return { kind: 'table', leadingNewlines };
-        if (type === 'space' || type === 'br') {
+        const token = tokens[i];
+        if (token === undefined)
+            break;
+        if (isStandaloneToken(token))
+            return { kind: 'node', leadingNewlines };
+        if (token.type === 'space' || token.type === 'br') {
             leadingNewlines += 1;
             continue;
         }
-        if (type === 'def' || type === 'del' || type === 'html')
+        if (token.type === 'def' || token.type === 'del' || token.type === 'html')
             continue;
         return { kind: 'text', leadingNewlines };
     }
@@ -157,10 +159,10 @@ function analyzeSuffixStart(tokens, startIndex) {
 function gapBetween(boundary, start) {
     if (start.kind === undefined)
         return 0;
-    if (boundary.endsWithTable) {
-        return start.kind === 'table' && (boundary.trailingEmptyTextNode || start.leadingNewlines > 0) ? 2 : 1;
+    if (boundary.endsWithNode) {
+        return start.kind === 'node' && (boundary.trailingEmptyTextNode || start.leadingNewlines > 0) ? 2 : 1;
     }
-    return start.kind === 'table' ? 1 : boundary.gap + start.leadingNewlines;
+    return start.kind === 'node' ? 1 : boundary.gap + start.leadingNewlines;
 }
 export function StreamingMarkdown({ children, dimColor = false, }) {
     // The prefix tracks source offsets; its rendered blocks are sealed once
@@ -173,7 +175,7 @@ export function StreamingMarkdown({ children, dimColor = false, }) {
     const cutRef = React.useRef(0);
     const boundaryGapRef = React.useRef(0);
     const prefixVisibleRef = React.useRef(false);
-    const prefixEndsWithTableRef = React.useRef(false);
+    const prefixEndsWithNodeRef = React.useRef(false);
     const prefixTrailingEmptyTextRef = React.useRef(false);
     const stripped = stripPromptXMLTags(children);
     // Reset if text was replaced (defensive; normally unmount handles this)
@@ -182,7 +184,7 @@ export function StreamingMarkdown({ children, dimColor = false, }) {
         cutRef.current = 0;
         boundaryGapRef.current = 0;
         prefixVisibleRef.current = false;
-        prefixEndsWithTableRef.current = false;
+        prefixEndsWithNodeRef.current = false;
         prefixTrailingEmptyTextRef.current = false;
         blocksRef.current = {
             blocks: [], end: 0, tokens: [], tail: '', tailGap: 0,
@@ -241,7 +243,7 @@ export function StreamingMarkdown({ children, dimColor = false, }) {
             prefixRef.current = stripped.substring(0, boundary + advance);
             boundaryGapRef.current = stableBoundary.gap;
             prefixVisibleRef.current = true;
-            prefixEndsWithTableRef.current = stableBoundary.endsWithTable;
+            prefixEndsWithNodeRef.current = stableBoundary.endsWithNode;
             prefixTrailingEmptyTextRef.current = stableBoundary.trailingEmptyTextNode;
             suffixTokenIndex = lastContentIdx;
         }
@@ -257,12 +259,12 @@ export function StreamingMarkdown({ children, dimColor = false, }) {
         ? { kind: 'text', leadingNewlines: 0 }
         : analyzeSuffixStart(tokens, suffixTokenIndex);
     const boundaryGap = prefixVisibleRef.current && suffixStart.kind !== undefined
-        ? prefixEndsWithTableRef.current
-            ? suffixStart.kind === 'table' &&
+        ? prefixEndsWithNodeRef.current
+            ? suffixStart.kind === 'node' &&
                 (prefixTrailingEmptyTextRef.current || suffixStart.leadingNewlines > 0)
                 ? 2
                 : 1
-            : suffixStart.kind === 'table'
+            : suffixStart.kind === 'node'
                 ? 1
                 : boundaryGapRef.current + suffixStart.leadingNewlines
         : 0;

package/lib/types/components/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAqBlE,yEAAyE;AACzE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAA;AAEpD,MAAM,MAAM,cAAc,GAAG;IAC3B,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,qEAAqE;AACrE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,YAAY,EAAE,CAAC,KAAK,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IAC5C,YAAY,EAAE,MAAM,IAAI,CAAA;CACzB,CAAA;AAED;;;;GAIG;AACH,KAAK,YAAY,GAAG;IAAE,KAAK,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAA;CAAE,CAAA;AAEnE,KAAK,YAAY,GAAG;IAClB,KAAK,EAAE,YAAY,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,MAAM,CAAA;CAChB,CAAA;AAYD,uEAAuE;AACvE,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAKjE;AAED,8EAA8E;AAC9E,wBAAgB,kBAAkB,IAAI,YAAY,GAAG,IAAI,CAExD;AAcD,mEAAmE;AACnE,wBAAgB,YAAY,IAAI,IAAI,CAMnC;AAED;;;;;;;;GAQG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,cAAc,EAAE,IAAI,CAAC,EAAE,cAAc,GAAG,iBAAiB,CAuC5F;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,cAAc,CAAA;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,KAAK,CAAC,SAAS,CAGlB;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,eAAe,EACf,qBAAqB,GACtB,GAAE;IACD,8EAA8E;IAC9E,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,+EAA+E;IAC/E,qBAAqB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,IAAI,CAAA;CACxD,GAAG,KAAK,CAAC,SAAS,CA4EvB"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AA0BlE,yEAAyE;AACzE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAA;AAEpD,MAAM,MAAM,cAAc,GAAG;IAC3B,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,qEAAqE;AACrE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,YAAY,EAAE,CAAC,KAAK,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IAC5C,YAAY,EAAE,MAAM,IAAI,CAAA;CACzB,CAAA;AAED;;;;GAIG;AACH,KAAK,YAAY,GAAG;IAAE,KAAK,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAA;CAAE,CAAA;AAEnE,KAAK,YAAY,GAAG;IAClB,KAAK,EAAE,YAAY,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,MAAM,CAAA;CAChB,CAAA;AAYD,uEAAuE;AACvE,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAKjE;AAED,8EAA8E;AAC9E,wBAAgB,kBAAkB,IAAI,YAAY,GAAG,IAAI,CAExD;AAcD,mEAAmE;AACnE,wBAAgB,YAAY,IAAI,IAAI,CAMnC;AAED;;;;;;;;GAQG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,cAAc,EAAE,IAAI,CAAC,EAAE,cAAc,GAAG,iBAAiB,CAuC5F;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,cAAc,CAAA;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,KAAK,CAAC,SAAS,CAGlB;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,eAAe,EACf,qBAAqB,GACtB,GAAE;IACD,8EAA8E;IAC9E,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,+EAA+E;IAC/E,qBAAqB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,IAAI,CAAA;CACxD,GAAG,KAAK,CAAC,SAAS,CA8GvB"}

package/lib/types/components/Tooltip.js

@@ -3,6 +3,8 @@ import React from 'react';
 import stripAnsi from 'strip-ansi';
 import { Box, Text, useTerminalSize } from '../ui.js';
 import { useTerminalFocus } from '../ink/hooks/use-terminal-focus.js';
+import { useSelection } from '../ink/hooks/use-selection.js';
+import { hasSelection } from '../ink/selection.js';
 import { stringWidth } from '../ink/stringWidth.js';
 import { getGraphemeSegmenter } from '../utils/intl.js';
 import { PageInsetContext } from './PageMargin.js';
@@ -17,6 +19,11 @@ import { PageInsetContext } from './PageMargin.js';
  * content already visible next to the pointer is noise, not detail (the
  * tool-call header gates on folded/clipped content for this reason).
  *
+ * Tooltips and text selection are mutually exclusive: a drag-copy reads the
+ * painted screen, and the card REPLACES the cells it covers, so
+ * {@link TooltipLayer} hides all tooltips while a selection drag or an
+ * active selection exists (see its subscription on selection mutations).
+ *
  * Hover events only exist in fullscreen (alternate screen + mouse
  * tracking); inline mode never fires the handlers, so the store can only
  * be written from a live fullscreen tree.
@@ -135,6 +142,29 @@ export function TooltipLayer({ invalidationKey, subscribeInvalidation, } = {}) {
     const { columns, rows } = useTerminalSize();
     const terminalFocused = useTerminalFocus();
     const tooltip = React.useSyncExternalStore(subscribeTooltip, getTooltipSnapshot);
+    // A text selection and a floating tooltip are mutually exclusive: the copy
+    // reads the PAINTED screen, and the tooltip card REPLACES the cells of the
+    // text it covers — dragging across a shown tooltip (or letting one pop
+    // mid-drag via its dwell timer) puts the tooltip fragment in the clipboard
+    // instead of the message text. Every selection mutation (drag start, each
+    // motion event, release, clear) funnels through this notification, so the
+    // layer goes dark the instant a drag begins and stays dark until the
+    // selection settles. The render guard below is belt-and-suspenders: a
+    // dwell that fires between two motion events must still never paint.
+    const selection = useSelection();
+    const selectionBusy = React.useSyncExternalStore(selection.subscribe, () => {
+        const state = selection.getState();
+        return state !== null && (state.isDragging || hasSelection(state));
+    }, () => false);
+    React.useEffect(() => {
+        return selection.subscribe(() => {
+            // Every selection mutation (drag start, motion, release, clear) resets
+            // the tooltip system wholesale: while busy the card must never paint,
+            // and the settle must also invalidate dwell timers armed while dark,
+            // so a finished copy is not immediately followed by a surprise card.
+            clearTooltip();
+        });
+    }, [selection]);
     // Remounts and modal/screen transitions invalidate shown AND pending tips.
     React.useEffect(() => {
         clearTooltip();
@@ -157,6 +187,9 @@ export function TooltipLayer({ invalidationKey, subscribeInvalidation, } = {}) {
     }, [columns, rows]);
     if (tooltip === null)
         return null;
+    // Never paint over an active drag/selection (see the subscription above).
+    if (selectionBusy)
+        return null;
     // A bordered card needs at least one content cell plus two border cells.
     // Below that, hiding is safer than creating geometry wider/taller than the
     // terminal (Yoga would clip unpredictably on 1–2 column/row resize states).
@@ -176,14 +209,19 @@ export function TooltipLayer({ invalidationKey, subscribeInvalidation, } = {}) {
     const height = lines.length + 2;
     // Prefer resting on the row ABOVE the anchor; when there is no room
     // (anchor at the top of the screen), drop below it, clamped on-screen.
-    // The anchor coordinates are SCREEN coordinates (pointer events) while
-    // the absolute box is placed relative to the content-area origin — under
-    // PageMargin (root page inset) the offset must be added back, and the
-    // clamp bounds run over the inset content area.
+    // The anchor is SCREEN geometry (pointer events) while the absolute box is
+    // placed relative to the inset content-area origin, and useTerminalSize()
+    // already reports the content size: convert the anchor into content
+    // coordinates first, then clamp inside the content area. Adding the inset
+    // (the earlier bug) moved the whole card by the page margin — with the
+    // default margin one row low and two columns right, so its bottom border
+    // landed ON the hovered row and that row's glyphs showed beside the card.
     const inset = React.useContext(PageInsetContext);
-    const topAbove = tooltip.anchorRow - height;
-    const top = Math.max(inset.y, Math.min(topAbove >= 0 ? topAbove : tooltip.anchorRow + 1, inset.y + Math.max(0, rows - height)));
-    const left = Math.max(inset.x, Math.min(tooltip.anchorCol, inset.x + Math.max(0, columns - width)));
+    const anchorRow = tooltip.anchorRow - inset.y;
+    const anchorCol = tooltip.anchorCol - inset.x;
+    const topAbove = anchorRow - height;
+    const top = Math.max(0, Math.min(topAbove >= 0 ? topAbove : anchorRow + 1, Math.max(0, rows - height)));
+    const left = Math.max(0, Math.min(anchorCol, Math.max(0, columns - width)));
     return (_jsx(Box, { position: "absolute", left: left, top: top, width: width, height: height, flexDirection: "column", flexShrink: 0, borderStyle: "round", borderColor: "permission", backgroundColor: "toolCardBackground", children: lines.map((line, index) => (_jsx(Text, { wrap: "truncate-end", children: line === '' ? ' ' : line }, index))) }));
 }
 /**

package/lib/types/components/messages/UserPromptMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserPromptMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/UserPromptMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAEjE,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,yCAAyC;IACzC,eAAe,EAAE,OAAO,CAAA;IACxB,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAClC,CAAA;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,eAAe,EACf,UAAkB,EAClB,OAAO,GACR,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CAmCzB"}
+{"version":3,"file":"UserPromptMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/UserPromptMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAEjE,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,yCAAyC;IACzC,eAAe,EAAE,OAAO,CAAA;IACxB,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAClC,CAAA;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,eAAe,EACf,UAAkB,EAClB,OAAO,GACR,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CAiCzB"}

package/lib/types/components/messages/UserPromptMessage.js

@@ -3,7 +3,6 @@ import { Box, Text, useTerminalSize } from '../../ui.js';
 import { POINTER } from '../../terminal-utils/figures.js';
 import { stringWidth } from '../../ink/stringWidth.js';
 import { wrapWidth } from '../../sessions/format.js';
-import { useTooltip } from '../Tooltip.js';
 /**
  * User prompt bubble: `❯ text` in bold userPromptLabel gold with no background
  * fill (Kimi Code style: the user turn gets a distinct bold tint so it reads
@@ -21,10 +20,9 @@ export function UserPromptMessage({ text, marginTopOnTurn, isSelected = false, o
     // Ink; a second wrap would move the continuation back to column zero.
     const lines = wrapWidth(text, Math.max(1, columns - prefixWidth - 3));
     const continuationIndent = ' '.repeat(prefixWidth);
-    // Hover tooltip: a message that wrapped/truncated onto several visual
-    // lines pops its full original text in one floating card (the pointer
-    // row only shows one visual line at a time).
-    const promptTooltip = useTooltip(text);
-    const tooltipActive = lines.length > 1;
-    return (_jsx(Box, { flexDirection: "column", marginTop: marginTopOnTurn ? 1 : 0, backgroundColor: isSelected ? 'messageActionsBackground' : undefined, paddingRight: 1, onClick: onClick, ...(tooltipActive ? promptTooltip : {}), children: lines.map((line, index) => (_jsxs(Text, { color: "userPromptLabel", bold: true, wrap: "truncate-end", children: [index === 0 ? `${POINTER} ` : continuationIndent, line] }, index))) }));
+    // No hover tooltip here, deliberately: the message is pre-wrapped so every
+    // visual line is already on screen — a float would only repeat visible
+    // text, and worse, the card REPLACES the cells it covers, so a drag-copy
+    // crossing it yields the tooltip fragment instead of the message.
+    return (_jsx(Box, { flexDirection: "column", marginTop: marginTopOnTurn ? 1 : 0, backgroundColor: isSelected ? 'messageActionsBackground' : undefined, paddingRight: 1, onClick: onClick, children: lines.map((line, index) => (_jsxs(Text, { color: "userPromptLabel", bold: true, wrap: "truncate-end", children: [index === 0 ? `${POINTER} ` : continuationIndent, line] }, index))) }));
 }

package/lib/types/components/messages/useImageInspection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useImageInspection.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/useImageInspection.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AACxF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAA;AAI/D,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAC1G,IAAI,EAAE,gBAAgB,GAAG,SAAS,EAAE,IAAI,EAAE,MAAM;;;aAsErC,MAAM,KAAK,MAAM,KAAG,IAAI;kBAfI,SAAS;EAmBjD"}
+{"version":3,"file":"useImageInspection.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/useImageInspection.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AACxF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAA;AAQ/D,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAC1G,IAAI,EAAE,gBAAgB,GAAG,SAAS,EAAE,IAAI,EAAE,MAAM;;;aA4ErC,MAAM,KAAK,MAAM,KAAG,IAAI;kBAfI,SAAS;EAmBjD"}

package/lib/types/components/messages/useImageInspection.js

@@ -1,19 +1,29 @@
 import React from 'react';
 import { ImageInspectionSession, inspectionRegion } from './imageInspection.js';
 import { loadTranscriptImageFull } from './TranscriptImages.js';
+// The attachment is identified by `image.id` (a content hash), never by the
+// facade object: callers may hand a fresh facade for the same attachment on
+// every render, and keying effects or memos on the object would then restart
+// the session and re-request pixels each commit — a render loop (#885).
 export function useImageInspection(image, available, columns, rows, cell, zoom) {
+    const imageId = image.id;
+    // Committed facade for the loaders below. Written in a layout effect, not
+    // during render: an interrupted render must not leak its facade into a
+    // timer that an earlier commit already scheduled.
+    const latestImage = React.useRef(image);
+    React.useLayoutEffect(() => { latestImage.current = image; }, [image]);
     const session = React.useRef(null);
     const [position, setPosition] = React.useState(null);
-    const center = position?.image === image ? position.center : undefined;
+    const center = position?.imageId === imageId ? position.center : undefined;
     const dimensions = React.useRef(null);
     React.useEffect(() => {
-        const current = new ImageInspectionSession(image);
+        const current = new ImageInspectionSession(latestImage.current);
         session.current = current;
         dimensions.current = null;
         setPosition(null);
         return () => { current.dispose(); session.current = null; };
-    }, [image]);
-    const request = React.useMemo(() => ({ image, available, columns, rows, cell, zoom, center }), [image, available, columns, rows, cell, zoom, center]);
+    }, [imageId]);
+    const request = React.useMemo(() => ({ imageId, available, columns, rows, cell, zoom, center }), [imageId, available, columns, rows, cell, zoom, center]);
     const [result, setResult] = React.useState(null);
     React.useEffect(() => {
         if (!available || (zoom > 0 && !cell))
@@ -25,7 +35,7 @@ export function useImageInspection(image, available, columns, rows, cell, zoom)
         const timer = setTimeout(() => {
             void (async () => {
                 if (zoom === 0)
-                    return loadTranscriptImageFull(image, controller.signal);
+                    return loadTranscriptImageFull(latestImage.current, controller.signal);
                 const size = await current.metadata();
                 controller.signal.throwIfAborted();
                 dimensions.current = size;
@@ -53,9 +63,9 @@ export function useImageInspection(image, available, columns, rows, cell, zoom)
             return;
         const next = clampedCenter({ x: previous.x + x, y: previous.y + y });
         if (next)
-            setPosition(old => old?.image === image && old.center.x === next.x && old.center.y === next.y
-                ? old : { image, center: next });
-    }, [clampedCenter, image]);
+            setPosition(old => old?.imageId === imageId && old.center.x === next.x && old.center.y === next.y
+                ? old : { imageId, center: next });
+    }, [clampedCenter, imageId]);
     const dragOrigin = React.useRef(undefined);
     const drag = React.useCallback((event) => {
         event.stopImmediatePropagation();
@@ -70,7 +80,7 @@ export function useImageInspection(image, available, columns, rows, cell, zoom)
     }, [cell, zoom, clampedCenter, move]);
     // Preserve the previous pixels while panning, but never stretch stale pixels
     // across a new geometry, zoom, terminal cell size, or attachment.
-    const reusable = result?.request.image === image && result.request.zoom === zoom &&
+    const reusable = result?.request.imageId === imageId && result.request.zoom === zoom &&
         result.request.columns === columns && result.request.rows === rows && result.request.cell === cell;
     return {
         source: available && reusable ? result?.source : undefined,

package/lib/types/components/promptDraftCache.d.ts

@@ -0,0 +1,102 @@
+/**
+ * The composer draft that a screen hands to its owner on the way out.
+ *
+ * Every screen that REPLACES the conversation (`/resume`'s session screen, the
+ * session tree, `/settings`, the jobs panel, the trajectory scene) is an early
+ * return in `Chat`, so `PromptInput` is unmounted while the user is away and
+ * its text, caret and staged-image bindings live in component state. The owner
+ * therefore holds one slot of this type and the composer fills it as it
+ * unmounts; on the way back it is read, checked and consumed.
+ *
+ * Deliberately dependency-free (it does not import `PromptInput`, which would
+ * be a cycle), so the component and the headless regressions can both assert
+ * against the same rules.
+ *
+ * The snapshot shape, the image-liveness rule and the carried edit state
+ * (fold block, fullscreen editor, vim mode) are taken from PR #847
+ * (`promptDraftCache.ts`, branch `fix/composer-draft-retention`); the owner
+ * check here adds the agent id, because a generation alone cannot tell two
+ * channels with a fixed generation apart.
+ */
+/** One token → staged-image capability pair, in visible order. */
+export type PromptDraftImage = readonly [token: string, stageId: string];
+/**
+ * Everything the composer needs to put a draft back exactly as it was left.
+ *
+ * Transient interaction state — mouse selection, drag anchor, suggestion menu,
+ * history position, editor scroll, the vim undo stack — is NOT here: it
+ * describes a composer that was on screen, not the draft that outlives it.
+ */
+export interface PromptDraftSnapshot {
+    /** Agent the draft was typed into; a different one means "not this draft". */
+    readonly ownerAgentId: string;
+    /** Binding generation at capture time; see {@link resolveBindingGeneration}. */
+    readonly bindingGeneration: number;
+    readonly value: string;
+    readonly cursor: number;
+    /**
+     * Fold block [start, end) rendering as a one-line chip, or null. Edit
+     * state, not transient chrome: coming back with the text unfolded loses
+     * exactly what the user folded.
+     */
+    readonly foldBlock: {
+        readonly start: number;
+        readonly end: number;
+    } | null;
+    /** Fullscreen draft editor open at capture time. */
+    readonly expanded: boolean;
+    /** vim mode on (`/vim`), and whether it is in INSERT (vs NORMAL) submode. */
+    readonly vimEnabled: boolean;
+    readonly vimInsert: boolean;
+    /** Visible `[Image #N]` token → staged stageId, so images survive the trip. */
+    readonly images: readonly PromptDraftImage[];
+}
+/**
+ * The single slot an owner (today: `Chat`) keeps for the composer draft.
+ *
+ * A mutable ref-shaped cell rather than React state: it is written from an
+ * unmount cleanup and read from a mount effect, and neither may trigger a
+ * render — a draft that changed the first frame would move the transcript's
+ * restored scroll position.
+ */
+export interface PromptDraftCache {
+    current: PromptDraftSnapshot | null;
+}
+/**
+ * The current binding generation, mirroring the channel expression: the agent
+ * binding generation advances on every agent replacement (`/resume` to another
+ * session, `/new`, `/bg`, attach, rewind) and wins; a simplified or embedded
+ * channel without it falls back to the staged-image generation, and 0 when it
+ * has neither.
+ * @param source - The channel, or anything carrying the same two members.
+ * @returns The generation the snapshot is fenced against.
+ */
+export declare function resolveBindingGeneration(source: {
+    readonly agentBindingGeneration?: number;
+    readonly stagedImageGeneration?: () => number;
+}): number;
+/**
+ * Whether a stored draft belongs to the conversation in front of us now.
+ *
+ * Both halves are required. The generation catches a replaced binding; the
+ * agent id catches the case a generation cannot describe — a test or embedded
+ * channel whose generation is a constant, where a stale draft would otherwise
+ * be adopted by a different conversation.
+ * @param snapshot - The stored draft, if any.
+ * @param ownerAgentId - Agent id of the composer that would restore it.
+ * @param generation - Current binding generation.
+ */
+export declare function isUsableDraftSnapshot(snapshot: PromptDraftSnapshot | null | undefined, ownerAgentId: string, generation: number): snapshot is PromptDraftSnapshot;
+/**
+ * Drop the image bindings whose capability is gone.
+ *
+ * A visible `[Image #N]` is only a label; what makes it an attachment is the
+ * stageId behind it. A session switch (or a discard) revokes the capability and
+ * the label must not be re-bound by reading the number back out of the text.
+ * Entries that fail the check are dropped silently and the caller keeps the
+ * visible token as ordinary text, which is the behaviour an edit already has.
+ * @param images - Stored pairs.
+ * @param hasStagedImage - Channel capability probe; absent means "none live".
+ */
+export declare function filterLiveImageBindings(images: readonly PromptDraftImage[] | null | undefined, hasStagedImage?: (stageId: string) => boolean): readonly PromptDraftImage[];
+//# sourceMappingURL=promptDraftCache.d.ts.map

package/lib/types/components/promptDraftCache.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"promptDraftCache.d.ts","sourceRoot":"","sources":["../../../src/components/promptDraftCache.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,kEAAkE;AAClE,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAA;AAExE;;;;;;GAMG;AACH,MAAM,WAAW,mBAAmB;IAClC,8EAA8E;IAC9E,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAA;IAC7B,gFAAgF;IAChF,QAAQ,CAAC,iBAAiB,EAAE,MAAM,CAAA;IAClC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;IACvB;;;;OAIG;IACH,QAAQ,CAAC,SAAS,EAAE;QAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;IAC3E,oDAAoD;IACpD,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAA;IAC1B,6EAA6E;IAC7E,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAA;IAC3B,+EAA+E;IAC/E,QAAQ,CAAC,MAAM,EAAE,SAAS,gBAAgB,EAAE,CAAA;CAC7C;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,mBAAmB,GAAG,IAAI,CAAA;CACpC;AAED;;;;;;;;GAQG;AACH,wBAAgB,wBAAwB,CAAC,MAAM,EAAE;IAC/C,QAAQ,CAAC,sBAAsB,CAAC,EAAE,MAAM,CAAA;IACxC,QAAQ,CAAC,qBAAqB,CAAC,EAAE,MAAM,MAAM,CAAA;CAC9C,GAAG,MAAM,CAET;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,mBAAmB,GAAG,IAAI,GAAG,SAAS,EAChD,YAAY,EAAE,MAAM,EACpB,UAAU,EAAE,MAAM,GACjB,QAAQ,IAAI,mBAAmB,CAKjC;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,SAAS,gBAAgB,EAAE,GAAG,IAAI,GAAG,SAAS,EACtD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,GAC5C,SAAS,gBAAgB,EAAE,CAW7B"}