@deepseek-harness-tui/dsh-tui 0.10.1 → 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;AAkLzB,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,CAkFlB"}
+{"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,12 +4,12 @@ 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 markdown during streaming by splitting at the last top-level block
- * boundary: everything before is stable (memoized, never re-parsed), only the
- * final block is re-parsed per delta. marked.lexer() correctly handles unclosed code
- * fences as a single token, so block boundaries are always safe.
+ * Renders streaming markdown in sealed groups of completed top-level blocks.
+ * Only the unsealed group and growing final block change as text arrives.
+ * marked.lexer() keeps unclosed fences inside one token, and the boundary
+ * analysis below preserves the whole-document formatter's row spacing.
  */
 /**
  * Tail budget for the unstable suffix during streaming. The sticky view only
@@ -28,6 +28,7 @@ import { Markdown } from './Markdown.js';
 const SUFFIX_TAIL_BUDGET = 3584;
 const SUFFIX_BOUNDARY_LOOKBACK = 2048;
 const SUFFIX_CUT_STEP = 1024;
+const STABLE_BLOCK_BUDGET = 8192;
 function clipSuffixTail(suffix, cut) {
     const total = suffix.length;
     if (total <= SUFFIX_TAIL_BUDGET) {
@@ -49,7 +50,7 @@ function clipSuffixTail(suffix, cut) {
 const UNSAFE_BOUNDARY = {
     safe: false,
     gap: 0,
-    endsWithTable: false,
+    endsWithNode: false,
     trailingEmptyTextNode: false,
 };
 /**
@@ -69,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
@@ -78,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;
         }
     }
@@ -115,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,
         };
     }
@@ -140,29 +141,41 @@ 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 };
     }
     return { kind: undefined, leadingNewlines };
 }
+function gapBetween(boundary, start) {
+    if (start.kind === undefined)
+        return 0;
+    if (boundary.endsWithNode) {
+        return start.kind === 'node' && (boundary.trailingEmptyTextNode || start.leadingNewlines > 0) ? 2 : 1;
+    }
+    return start.kind === 'node' ? 1 : boundary.gap + start.leadingNewlines;
+}
 export function StreamingMarkdown({ children, dimColor = false, }) {
-    // The stable prefix is kept as ONE string identity across renders: a
-    // fresh substring per render would break Markdown's React.memo and
-    // re-layout the entire finished transcript tail on every token. The
-    // identity only changes when a new block boundary advances the prefix.
+    // The prefix tracks source offsets; its rendered blocks are sealed once
+    // so an advancing boundary never reparses the entire accumulated answer.
     const prefixRef = React.useRef('');
+    const blocksRef = React.useRef({
+        blocks: [], end: 0, tokens: [], tail: '', tailGap: 0,
+        boundary: undefined, definitions: 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)
@@ -171,12 +184,26 @@ 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,
+            boundary: undefined, definitions: false,
+        };
     }
     // Lex only from current boundary — O(unstable length), not O(full text)
     const boundary = prefixRef.current.length;
     const tokens = marked.lexer(stripped.substring(boundary));
+    const blocks = blocksRef.current;
+    // Reference definitions have document-wide scope, including references
+    // in the growing suffix. These documents cannot use independent parsers.
+    if (!blocks.definitions && Object.keys(tokens.links).length > 0) {
+        blocks.definitions = true;
+        blocks.blocks = [];
+        blocks.tokens = [];
+        blocks.end = 0;
+        blocks.boundary = undefined;
+    }
     // Last non-space token is the growing block; everything before is final
     let lastContentIdx = tokens.length - 1;
     while (lastContentIdx >= 0 && tokens[lastContentIdx].type === 'space') {
@@ -190,27 +217,54 @@ export function StreamingMarkdown({ children, dimColor = false, }) {
     if (advance > 0) {
         const stableBoundary = analyzeStableBoundary(tokens, lastContentIdx);
         if (stableBoundary.safe) {
+            if (!blocks.definitions) {
+                let end = boundary;
+                for (let index = 0; index < lastContentIdx; index++) {
+                    const token = tokens[index];
+                    blocks.tokens.push(token);
+                    end += token.raw.length;
+                    if (end - blocks.end < STABLE_BLOCK_BUDGET)
+                        continue;
+                    const blockBoundary = analyzeStableBoundary(blocks.tokens, blocks.tokens.length);
+                    if (!blockBoundary.safe)
+                        continue;
+                    const gap = blocks.boundary === undefined ? 0 : gapBetween(blocks.boundary, analyzeSuffixStart(blocks.tokens, 0));
+                    // Detach the sealed slice from the growing source buffer, preserving
+                    // UTF-16 code units rather than pinning every historical full reply.
+                    const text = Buffer.from(stripped.substring(blocks.end, end), 'utf16le').toString('utf16le');
+                    blocks.blocks.push({ text, gap });
+                    blocks.end = end;
+                    blocks.boundary = blockBoundary;
+                    blocks.tokens = [];
+                }
+                blocks.tail = stripped.substring(blocks.end, boundary + advance);
+                blocks.tailGap = blocks.boundary === undefined ? 0 : gapBetween(blocks.boundary, analyzeSuffixStart(blocks.tokens, 0));
+            }
             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;
         }
     }
+    if (blocks.definitions) {
+        return _jsx(Markdown, { dimColor: dimColor, cacheTokens: false, children: stripped });
+    }
     const stablePrefix = prefixRef.current;
+    const prefixTail = blocks.tail;
     const suffixSource = stripped.substring(stablePrefix.length);
     const unstableSuffix = clipSuffixTail(suffixSource, cutRef);
     const suffixStart = cutRef.current > 0
         ? { 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;
@@ -221,5 +275,5 @@ export function StreamingMarkdown({ children, dimColor = false, }) {
     // an overlapping empty/duplicate boundary.
     const hasDistinctSuffix = unstableSuffix !== '' &&
         (stablePrefix === '' || !unstableSuffix.startsWith(stablePrefix));
-    return (_jsxs(Box, { flexDirection: "column", gap: boundaryGap, children: [stablePrefix && _jsx(Markdown, { dimColor: dimColor, children: stablePrefix }), hasDistinctSuffix && _jsx(Markdown, { dimColor: dimColor, cacheTokens: false, children: unstableSuffix })] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [blocks.blocks.map((block, index) => (_jsx(Box, { flexDirection: "column", marginTop: block.gap, children: _jsx(Markdown, { dimColor: dimColor, children: block.text }) }, index))), prefixTail && (_jsx(Box, { flexDirection: "column", marginTop: blocks.tailGap, children: _jsx(Markdown, { dimColor: dimColor, children: prefixTail }) }, "prefix")), hasDistinctSuffix && (_jsx(Box, { flexDirection: "column", marginTop: boundaryGap, children: _jsx(Markdown, { dimColor: dimColor, cacheTokens: false, children: unstableSuffix }) }, "suffix"))] }));
 }

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,