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

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

@@ -2,6 +2,7 @@ import React from 'react';
 import type { ChannelUi as Channel } from '../adapter/channel/ui-policy.js';
 import type { ComposerImageRef } from '../dsh-adapter/channel.js';
 import type { TranscriptImage } from '../dsh-adapter/transcript-images.js';
+import { type PromptDraftCache } from './promptDraftCache.js';
 /** Capabilities referenced by `text`, in first occurrence order. A raw token
  * restored from disk/history has no sidecar entry and therefore stays inert. */
 export declare function composerImageRefsForText(text: string, stagedByToken: ReadonlyMap<string, string>): ComposerImageRef[];
@@ -13,6 +14,8 @@ export declare function composerImageRefsForText(text: string, stagedByToken: Re
  */
 export interface PromptController {
     hasText(): boolean;
+    /** The draft text, for a caller that must not lose it (see {@link PromptDraftCache}). */
+    text(): string;
     /** Current capability-backed draft images in token order, without reads. */
     previewImages?(): readonly {
         image: TranscriptImage;
@@ -39,10 +42,33 @@ export interface PromptController {
      *  Chat's working-turn Esc interrupt must yield in BOTH submodes. */
     vimActive(): boolean;
 }
+/**
+ * Owner-held slot for the composer draft, so a screen that unmounts the
+ * prompt (every early return in Chat) does not discard what the user typed.
+ *
+ * The composer writes ONE complete snapshot as it unmounts and consumes it on
+ * the way back; the shape and the reasoning live in `promptDraftCache.ts`.
+ */
 export interface PromptInputProps {
     channel: Channel;
     /** Keep the draft mounted while another prompt-slot panel owns the UI. */
     suspended?: boolean;
+    /**
+     * Owner-held slot for the unsent draft.
+     *
+     * The prompt owns its text in local state, and several screens REPLACE the
+     * conversation (the session screen, the session tree, settings, the jobs and
+     * subagent panels, the trajectory scene) — early returns that unmount this
+     * component and would take a half-written prompt down with it. Chat owns the
+     * slot, so the text, its caret AND its image bindings survive that unmount
+     * and come back when the composer does. The owner also drops it on a session
+     * change, so a draft can never leak into a different conversation.
+     *
+     * Nothing is written from render: a commit-time assignment would run before
+     * the restore effect has read the slot and overwrite the draft with the
+     * empty first value.
+     */
+    draftCache?: PromptDraftCache;
     /** Whether the `?` help menu is open (state lives in the Chat screen). */
     helpOpen: boolean;
     onToggleHelp(): void;
@@ -67,6 +93,16 @@ export interface PromptInputProps {
      * opens the agent view (with text, ← moves the caret as usual).
      */
     onBackgroundRequest?(): void;
+    /**
+     * Open the session screen (the one `/resume`, `/agentview` and `/home`
+     * share) from the `⌂` entry at the head of the input row.
+     *
+     * Optional on purpose: the entry is rendered ONLY when this is provided, so
+     * hosts that mount the prompt without a session screen — and the layout
+     * regressions that pin this row's column budget — keep exactly the row they
+     * had before.
+     */
+    onOpenSessions?(): void;
     /**
      * Background sessions waiting on the user (agent view "needs input" rows
      * excluding this session); the prompt footer shows the
@@ -123,5 +159,5 @@ export interface PromptInputProps {
  * working) interrupts the turn and delivers them right away; Ctrl+Enter
  * aborts the turn and sends the current input immediately.
  */
-export declare function PromptInput({ channel, suspended, helpOpen, onToggleHelp, onRunCommand, selectionActive, fillText, onFillConsumed, onRewindRequest, onBackgroundRequest, backgroundAgentsNeedingInput, controllerRef, onCaretImage, caretPreviewOpen, onDismissCaretPreview, }: PromptInputProps): React.JSX.Element | null;
+export declare function PromptInput({ channel, suspended, draftCache, helpOpen, onToggleHelp, onRunCommand, selectionActive, fillText, onFillConsumed, onRewindRequest, onBackgroundRequest, onOpenSessions, backgroundAgentsNeedingInput, controllerRef, onCaretImage, caretPreviewOpen, onDismissCaretPreview, }: PromptInputProps): React.JSX.Element | null;
 //# sourceMappingURL=PromptInput.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"PromptInput.d.ts","sourceRoot":"","sources":["../../../src/components/PromptInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AA0BzB,OAAO,KAAK,EAAE,SAAS,IAAI,OAAO,EAAE,MAAM,iCAAiC,CAAA;AAC3E,OAAO,KAAK,EACV,gBAAgB,EAGjB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAA;AAgH1E;gFACgF;AAChF,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,MAAM,EACZ,aAAa,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,GACzC,gBAAgB,EAAE,CAWpB;AA+MD;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B,OAAO,IAAI,OAAO,CAAA;IAClB,4EAA4E;IAC5E,aAAa,CAAC,IAAI,SAAS;QAAE,KAAK,EAAE,eAAe,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACtE,KAAK,IAAI,IAAI,CAAA;IACb;;;;;OAKG;IACH,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B;;;;;OAKG;IACH,oBAAoB,IAAI,OAAO,CAAA;IAC/B,2EAA2E;IAC3E,SAAS,IAAI,OAAO,CAAA;IACpB;yEACqE;IACrE,SAAS,IAAI,OAAO,CAAA;CAAC;AAEvB,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,OAAO,CAAA;IAChB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,0EAA0E;IAC1E,QAAQ,EAAE,OAAO,CAAA;IACjB,YAAY,IAAI,IAAI,CAAA;IACpB;;;OAGG;IACH,YAAY,CACV,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,SAAS,gBAAgB,EAAE,GAClC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,CAAA;IAC7B,6EAA6E;IAC7E,eAAe,EAAE,OAAO,CAAA;IACxB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,cAAc,CAAC,IAAI,IAAI,CAAA;IACvB,kEAAkE;IAClE,eAAe,CAAC,IAAI,IAAI,CAAA;IACxB;;;OAGG;IACH,mBAAmB,CAAC,IAAI,IAAI,CAAA;IAC5B;;;;OAIG;IACH,4BAA4B,CAAC,EAAE,MAAM,CAAA;IACrC,0EAA0E;IAC1E,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAA;IACxD;;;;;;;OAOG;IACH,YAAY,CAAC,CAAC,KAAK,EAAE,eAAe,GAAG,SAAS,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,OAAO,GAAG,OAAO,GAAG,IAAI,CAAA;IAC7G;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,qBAAqB,CAAC,IAAI,IAAI,CAAA;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,SAAiB,EACjB,QAAQ,EACR,YAAY,EACZ,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,4BAA4B,EAC5B,aAAa,EACb,YAAY,EACZ,gBAAwB,EACxB,qBAAqB,GACtB,EAAE,gBAAgB,4BA6hGlB"}
+{"version":3,"file":"PromptInput.d.ts","sourceRoot":"","sources":["../../../src/components/PromptInput.tsx"],"names":[],"mappings":"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"}

package/lib/types/components/PromptInput.js

@@ -34,7 +34,26 @@ import { FileSuggestions } from './FileSuggestions.js';
 import { HelpMenu } from './HelpMenu.js';
 import { OverlayAbove } from './OverlayAbove.js';
 import { SuggestionCard, cardContentWidth } from './SuggestionCard.js';
+import { filterLiveImageBindings, isUsableDraftSnapshot, resolveBindingGeneration, } from './promptDraftCache.js';
 const HISTORY_LIMIT = 50;
+/**
+ * Visible text of the session-entry control at the head of the input row:
+ * U+2338 APL FUNCTIONAL SYMBOL QUAD COLON plus a separator space.
+ *
+ * The glyph is chosen for ONE property above all others: the layout model and
+ * the terminal cell table must agree on how many columns it occupies. `\u2338`
+ * is a plain single-cell symbol with no emoji presentation, so
+ * `stringWidth` and the terminal both say 1 + 1 = 2 and
+ * {@link HOME_BUTTON_COLS} can be derived rather than guessed.
+ *
+ * The emoji house (`U+1F3E0`) was tried and rejected on this exact ground: it
+ * costs the terminal ONE cell while `stringWidth` charges the row TWO, and
+ * appending VARIATION SELECTOR-15 (text presentation) does not change either
+ * number. That standing one-column disagreement put every caret-relative
+ * column in the composer off by one, so no offset compensation made it work.
+ */
+const HOME_BUTTON_TEXT = '⌸ ';
+const HOME_BUTTON_COLS = stringWidth(HOME_BUTTON_TEXT);
 /**
  * Paste fold with a visible preview and no black box:
  * a paste that leaves the input this big folds into a one-line chip
@@ -67,6 +86,9 @@ function sanitizeEditableText(text) {
         .replace(/[\u0000-\u0008\u000b\u000c\u000e-\u001f\u007f]/gu, '');
 }
 const COMPOSER_IMAGE_TOKEN = /\[Image #\d+\]/gu;
+/** Format label for one image media type, matching the image preview card's
+ *  title (`JPEG`, `PNG`, `WEBP`, `GIF`). */
+const mediaTypeLabel = (mediaType) => mediaType.replace(/^image\//u, '').replace(/\+xml$/u, '').toUpperCase();
 /** Every `[Image #N]` in `text`, in order. */
 function imageTokenSpans(text) {
     const spans = [];
@@ -352,13 +374,70 @@ const DOUBLE_CLICK_MS = 500;
  * working) interrupts the turn and delivers them right away; Ctrl+Enter
  * aborts the turn and sends the current input immediately.
  */
-export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp, onRunCommand, selectionActive, fillText, onFillConsumed, onRewindRequest, onBackgroundRequest, backgroundAgentsNeedingInput, controllerRef, onCaretImage, caretPreviewOpen = false, onDismissCaretPreview, }) {
+export function PromptInput({ channel, suspended = false, draftCache, helpOpen, onToggleHelp, onRunCommand, selectionActive, fillText, onFillConsumed, onRewindRequest, onBackgroundRequest, onOpenSessions, backgroundAgentsNeedingInput, controllerRef, onCaretImage, caretPreviewOpen = false, onDismissCaretPreview, }) {
     const [themeName] = useTheme();
     // Raw stdout writer for OSC 52 clipboard writes (selection copy) — must
     // bypass the frame pipeline; null outside a mounted Ink App.
     const writeRaw = React.useContext(TerminalWriteContext);
+    // The composer owns its text in local state, so it starts EMPTY and adopts
+    // whatever draft the owner stored in a MOUNT-TIME effect below. Reading the
+    // store in this initializer instead looks equivalent and is not: a non-empty
+    // first frame leaves `repro-resume-position` red — resuming a session parks
+    // the transcript mid-history instead of pinning it to the newest message.
+    // Adopting after mount keeps the first frame identical to a fresh composer
+    // while still handing the draft back.
     const [value, setValue] = React.useState('');
     const [cursor, setCursor] = React.useState(0);
+    /**
+     * Adopt the owner's draft ONCE, after mount.
+     *
+     * This is where a screen swap gives the draft back: the slot outlives this
+     * component, so a remount picks up what the user had written — text, caret,
+     * the image bindings behind the visible `[Image #N]` tokens, and the edit
+     * state around them (fold chip, fullscreen editor, vim mode).
+     *
+     * It runs as an effect rather than as the `useState` initial value on
+     * purpose. A composer whose FIRST frame is already non-empty moves the
+     * transcript's restored scroll position (`repro-resume-position`); adopting
+     * after the first commit keeps that frame identical to a fresh composer. The
+     * slot is consumed here, and the composer never writes to it while mounted,
+     * so the empty first value cannot overwrite the draft before this reads it.
+     */
+    const adoptDraft = React.useRef(true);
+    React.useEffect(() => {
+        if (draftCache === undefined || !adoptDraft.current)
+            return;
+        adoptDraft.current = false;
+        const snapshot = draftCache.current;
+        draftCache.current = null;
+        if (!isUsableDraftSnapshot(snapshot, String(channel.agentId), resolveBindingGeneration(channel)))
+            return;
+        const text = snapshot.value;
+        // Carried edit state, restored ahead of the text: the chip, the
+        // fullscreen editor and the vim mode/submode come back with the draft —
+        // and they come back even with NO text, because they are modes rather
+        // than content. Fold ranges are safe by the CAPTURE invariant, not by
+        // restore order: a snapshot's block, when set, always sits inside the
+        // snapshot's own text (setInput keeps or drops it atomically), and at
+        // mount the caret is 0 so updateFoldBlock's caret-drag clamp cannot fire
+        // here. The transient state around them — editor scroll, vim undo stack,
+        // selection — does not come back.
+        updateFoldBlock(snapshot.foldBlock);
+        expandedRef.current = snapshot.expanded;
+        setExpanded(snapshot.expanded);
+        vimEnabledRef.current = snapshot.vimEnabled;
+        setVimEnabled(snapshot.vimEnabled);
+        vimInsertRef.current = snapshot.vimInsert;
+        setVimInsert(snapshot.vimInsert);
+        if (text === '')
+            return;
+        const restoredCursor = normalizeCursorOffset(text, snapshot.cursor);
+        replaceDraftImages(filterLiveImageBindings(snapshot.images, stageId => channel.hasStagedImage?.(stageId) === true).map(([token, stageId]) => ({ token, stageId })));
+        valueRef.current = text;
+        cursorRef.current = restoredCursor;
+        setValue(text);
+        setCursor(restoredCursor);
+    }, [draftCache]);
     /**
      * Mouse text selection: UTF-16 offsets [start, end) in `value`, snapped
      * to grapheme boundaries, start ≤ end. Null = no selection. Created by
@@ -403,7 +482,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
     const foldBlockRef = React.useRef(null);
     /**
      * Fullscreen draft editor (`expandEditor`, default Ctrl+Shift+E, or the
-     * ⛶ affordance at the end of the input row). While expanded the SAME
+     * ✎ affordance at the end of the input row). While expanded the SAME
      * editing state renders into the PromptEditorLayer cover (published via
      * setPromptEditorNode each render): Enter inserts a newline, Ctrl+Enter
      * submits, Esc collapses. The fold chip is bypassed (full text shown).
@@ -424,14 +503,16 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
     const prevExpandedRef = React.useRef(false);
     /**
      * Feature gate (settings `dsh-tui.expandEditor`, on by default; a mock
-     * channel without the field also reads as on). Off hides the ⛶
+     * channel without the field also reads as on). Off hides the ✎
      * affordance and refuses the shortcut — the editor cannot open.
      */
     const expandEnabled = channel.expandEditor !== false;
     /** Latest expanded viewport metrics for the useInput wheel branch. */
     const editorViewportRef = React.useRef(null);
-    /** Hover state of the ⤢/⛶ expand affordance in the input row. */
+    /** Hover state of the ⤢/✎ expand affordance in the input row. */
     const [expandHovered, setExpandHovered] = React.useState(false);
+    /** Hover state of the ⌂ session-list affordance at the head of the row. */
+    const [homeHovered, setHomeHovered] = React.useState(false);
     /** Pointer over the input box (drives the hover peek card). */
     const [hovered, setHovered] = React.useState(false);
     /** 120ms grace so the pointer crossing the input border row from the
@@ -550,6 +631,10 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
     syncImageGeneration();
     valueRef.current = value;
     cursorRef.current = cursor;
+    // Nothing is written to the owner's draft slot here — see the unmount
+    // hand-off below. A commit-time write would run BEFORE the restore effect
+    // has consumed the slot, so the composer's own first (empty) value would
+    // erase the draft it just came back for.
     // Publish the live controller (fresh closure over `value` every render).
     // A prompt-slot panel withdraws the handle in the same commit: external
     // injection must not append/submit a hidden command draft while it waits
@@ -563,6 +648,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
         }
         controllerRef.current = {
             hasText: () => value.length > 0,
+            text: () => valueRef.current,
             previewImages: () => composerImageRefsForText(valueRef.current, draftImagesRef.current).flatMap(ref => {
                 const image = channel.stagedImage(ref.stageId);
                 return image === undefined ? [] : [{ image, title: ref.token.slice(1, -1) }];
@@ -660,9 +746,56 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
                 clearTimeout(escTimerRef.current);
             if (hoverLeaveTimerRef.current)
                 clearTimeout(hoverLeaveTimerRef.current);
-            // An async image read/stage may outlive this component. Revoke its
-            // draft lease so it cannot bind an invisible capability after unmount.
-            discardDraftImages();
+            /**
+             * Hand the draft to the owner's slot as this component goes away.
+             *
+             * This is the ONLY write to that slot, and it belongs here: it happens at
+             * the instant a screen replaces the composer, so it can neither race the
+             * restore effect nor change the transcript's first frame.
+             *
+             * `advanceDraftRevision` invalidates any image read/stage still in
+             * flight, so a late continuation cannot bind a capability into a composer
+             * that no longer exists. `clearVimUndo` releases the capabilities that
+             * only the undo stack was holding: they are not part of the draft, and
+             * nothing will ever restore them once this composer is gone.
+             *
+             * The stageIds the DRAFT holds are deliberately NOT revoked — they are
+             * part of the snapshot the slot now keeps, and the restore filters out
+             * whatever the channel revoked in the meantime. Revoking them here is why
+             * an image draft used to come back as inert text.
+             */
+            advanceDraftRevision();
+            clearVimUndo();
+            const images = [...draftImagesRef.current.entries()]
+                .map(([token, stageId]) => [token, stageId]);
+            draftImagesRef.current.clear();
+            if (draftCache === undefined) {
+                discardUnretainedImages(images.map(image => image[1]));
+                return;
+            }
+            const text = valueRef.current;
+            // The edit state rides along even with nothing typed: vim mode and the
+            // fullscreen editor are MODES the user turned on, not content, and an
+            // empty composer must not drop them (`text === ''` alone used to skip
+            // the snapshot entirely, losing the vim badge on a round trip with an
+            // empty composer).
+            const editState = foldBlockRef.current !== null || expandedRef.current
+                || vimEnabledRef.current;
+            if (text === '' && images.length === 0 && !editState) {
+                draftCache.current = null;
+                return;
+            }
+            draftCache.current = {
+                ownerAgentId: String(channel.agentId),
+                bindingGeneration: resolveBindingGeneration(channel),
+                value: text,
+                cursor: cursorRef.current,
+                foldBlock: foldBlockRef.current,
+                expanded: expandedRef.current,
+                vimEnabled: vimEnabledRef.current,
+                vimInsert: vimInsertRef.current,
+                images,
+            };
         };
     }, []);
     const { columns, rows: terminalRows } = useTerminalSize();
@@ -768,14 +901,17 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
     onCaretImageRef.current = onCaretImage;
     const lastCaretImageRef = React.useRef({ image: undefined, title: undefined });
     /** Tell the caller which staged image the caret is on. `'caret'` reports
-     *  only changes; `'click'` always reports (see onCaretImage). */
+     *  only changes; `'click'` always reports (see onCaretImage). "Same image"
+     *  is the attachment id plus the token, not facade identity: this runs
+     *  after every commit and the caller stores what it reports, so an
+     *  identity-only difference would re-render the caller forever (#885). */
     const reportCaretImage = (reason) => {
         const report = onCaretImageRef.current;
         if (report === undefined)
             return;
         const found = suspended ? undefined : caretImageAt(valueRef.current, cursorRef.current);
         const last = lastCaretImageRef.current;
-        if (reason === 'caret' && last.image === found?.image && last.title === found?.title)
+        if (reason === 'caret' && last.image?.id === found?.image.id && last.title === found?.title)
             return;
         lastCaretImageRef.current = { image: found?.image, title: found?.title };
         report(found?.image, found?.title, reason);
@@ -1231,7 +1367,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
         if (!tryRunCommand(value))
             submitText(value);
     };
-    /** Expand/collapse the fullscreen editor (shortcut + ⛶ affordance).
+    /** Expand/collapse the fullscreen editor (shortcut + ✎ affordance).
      *  Expanding also DROPS any fold block: the fullscreen view shows and
      *  edits the full text, and the block's atomic-clamp semantics (caret
      *  pushed to its edges, selection clamped to one side) would contradict
@@ -1324,6 +1460,35 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
         imageStageChainRef.current = queued.then(() => undefined, () => undefined);
         return queued;
     };
+    /** Success notice for one staged image. An adapted paste says what the user
+     *  actually got (stored dimensions, stored format, filled alpha) — naming it
+     *  is the difference between a reported adaptation and a silently rewritten
+     *  image. */
+    const stagedImageNotice = (token, handle) => {
+        const adjustment = handle.adjustment;
+        if (adjustment === undefined)
+            return t('input-image-pasted', { token });
+        const details = [];
+        if (adjustment.resized) {
+            details.push(t('input-image-detail-resized', {
+                width: adjustment.width,
+                height: adjustment.height,
+            }));
+        }
+        if (adjustment.mediaType !== adjustment.sourceMediaType) {
+            const from = mediaTypeLabel(adjustment.sourceMediaType);
+            const to = mediaTypeLabel(adjustment.mediaType);
+            details.push(adjustment.flattened
+                ? t('input-image-detail-converted-flattened', { from, to })
+                : t('input-image-detail-converted', { from, to }));
+        }
+        // An adjustment always describes a resize or a conversion; anything else
+        // keeps the plain notice rather than an empty parenthetical. ' · ' joins
+        // the clauses in both shipped languages.
+        if (details.length === 0)
+            return t('input-image-pasted', { token });
+        return t('input-image-pasted-adjusted', { token, detail: details.join(' · ') });
+    };
     const discardStagedHandles = (handles) => {
         for (const stageId of new Set(handles.map(handle => handle.stageId))) {
             channel.discardStagedImage(stageId);
@@ -1411,7 +1576,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
             setFileSelected(0);
             return;
         }
-        // ── 全屏草稿编辑（expandEditor，默认 Ctrl+Shift+E / 输入行 ⛶）─────
+        // ── 全屏草稿编辑（expandEditor，默认 Ctrl+Shift+E / 输入行 ✎）─────
         // 展开态拥有屏幕；Esc 收起（有选区时上面的 selection 分支已先行只清
         // 选区）。滚轮不经此——编辑区的 onWheel 位置路由直接驱动滚动窗口。
         if (key.escape && expandedRef.current) {
@@ -1497,7 +1662,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
                     // Bind and insert share this synchronous continuation: setInput's
                     // sidecar pruning can never observe a bound-but-not-visible token.
                     insertClipboardAtCaret(`${token} `);
-                    channel.notify(t('input-image-pasted', { token }), { timeoutMs: 2500 });
+                    channel.notify(stagedImageNotice(token, handle), { timeoutMs: 2500 });
                 })
                     .catch(() => {
                     if (!draftImageLeaseIsCurrent(lease))
@@ -1561,7 +1726,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
                                 const handle = await stageImagePath(content.path, lease);
                                 const token = bindStagedImage(handle, lease);
                                 insertClipboardAtCaret(`${token} `);
-                                channel.notify(t('input-image-pasted', { token }), { timeoutMs: 2500 });
+                                channel.notify(stagedImageNotice(token, handle), { timeoutMs: 2500 });
                             });
                         }
                         catch (error) {
@@ -1605,9 +1770,14 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
                                     // All bindings and their visible labels enter together;
                                     // typing while an earlier file saves cannot prune one.
                                     insertClipboardAtCaret(`${rendered.join(' ')} `);
+                                    // A batch cannot itemise every image in one line, but it must
+                                    // still say that some of them were not stored as pasted.
+                                    const adapted = staged.filter(handle => handle.adjustment !== undefined).length;
                                     channel.notify(boundTokens.length === 1
-                                        ? t('input-image-pasted', { token: boundTokens[0] })
-                                        : t('input-images-staged', { count: boundTokens.length }), { timeoutMs: 2500 });
+                                        ? stagedImageNotice(boundTokens[0], staged[0])
+                                        : adapted > 0
+                                            ? t('input-images-staged-adapted', { count: boundTokens.length, adapted })
+                                            : t('input-images-staged', { count: boundTokens.length }), { timeoutMs: 2500 });
                                     return true;
                                 }
                                 catch (error) {
@@ -2463,6 +2633,11 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
     // the same row, so the wrap budget must shrink by its width or long lines
     // would be clipped at the value box's right edge.
     const vimBadgeCols = vimEnabled ? 7 : 0;
+    // 行首会话入口占列：未传 onOpenSessions 时按钮整体不渲染，预算同步归还
+    // （既有调用方的可用列数逐列不变）。用实测常量而不是 stringWidth：该字符
+    // 是 U+1F3E0+VS15，stringWidth 按码点算 2（含 VS15 仍是 2），终端只给 1，
+    // 见 HOME_BUTTON_COLS 的说明。
+    const homeButtonCols = onOpenSessions === undefined ? 0 : HOME_BUTTON_COLS;
     // 补全卡片边框与输入框 idle 边框同色（plan 模式下整套面板一起变 sage
     // 绿）。`/color` 会话强调色优先于主题 promptBorder（plan 模式仍整体走
     // sage 绿）。`?? ''` 防御最小 mock channel（只声明用到的字段的回归脚
@@ -2470,14 +2645,15 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
     const sessionAccent = sessionColorHex(channel.sessionColor ?? '');
     const promptAccent = channel.mode.plan === true ? 'planMode' : (sessionAccent ?? 'promptBorder');
     // 展开态布局参数：编辑器独占整屏 —— 行号槽（宽度随逻辑行数伸缩）+
-    // 圆角边框 2 + 两侧 padding 各 1 占列，❯ 前缀 / vim 徽标 / ⛶ 按钮
-    // 全部让位；收起态额外扣掉行尾 ⛶ 按钮的 2 列。
+    // 圆角边框 2 + 两侧 padding 各 1 占列，⌸ 入口 / ❯ 前缀 / vim 徽标 /
+    // ⛶ 按钮全部让位；收起态额外扣掉行首 ⌸ 入口（未渲染时 0 列）与行尾
+    // ⛶ 按钮的 2 列。
     const editorLogicalLines = expanded ? value.split('\n').length : 1;
     const editorNoWidth = Math.max(2, String(editorLogicalLines).length);
     const editorGutterCols = editorNoWidth + 3;
     const inputWidth = expanded
         ? Math.max(1, columns - 4 - editorGutterCols)
-        : Math.max(1, columns - 3 - vimBadgeCols - (expandEnabled ? 2 : 0));
+        : Math.max(1, columns - 3 - vimBadgeCols - homeButtonCols - (expandEnabled ? 2 : 0));
     // 展开态无视折叠块：全屏编辑就是为了看全文（foldBlock 状态保留，
     // 收起后折叠显示恢复）。
     const block = expanded ? null : foldBlock;
@@ -2546,22 +2722,50 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
         visibleCount = MAX_VISIBLE_LINES;
     }
     const visibleLines = visualLines.slice(windowStart, windowStart + visibleCount);
+    // Caret-window jump: when the caret leaves MAX_VISIBLE_LINES (typing past
+    // it, arrow-key walks through a long prompt) the whole visible band is
+    // replaced in place — same-height rows, completely different text. The
+    // per-cell diff that repaints that band is exactly the path that goes
+    // haywire when the inline viewport is even one row out of sync with the
+    // terminal's scrollback ("重叠变花": old rows bleeding through the new
+    // ones). Same one-shot reanchor family as the shrink/floaters/editor
+    // patches above — the window jump is a viewport-level discontinuity, not
+    // an ordinary content edit.
+    const prevWindowStartRef = React.useRef(windowStart);
+    React.useLayoutEffect(() => {
+        if (windowStart !== prevWindowStartRef.current) {
+            prevWindowStartRef.current = windowStart;
+            const ink = instances.get(process.stdout) ?? instances.values().next().value;
+            ink?.invalidatePrevFrame();
+            ink?.reanchorViewport();
+        }
+    }, [windowStart]);
     // useInput 的滚轮分支需要这份几何（它在这些派生之前注册）。
     if (expanded) {
         editorViewportRef.current = { maxRows: editorMaxRows, total: visualLines.length };
     }
     // Folded chip content: block stats + first-line preview + hover hint,
     // all pre-truncated to the input width (the row is one line, always).
+    // `·` separators are U+30FB KATAKANA MIDDLE DOT, NOT U+00B7: the latter
+    // is East-Asian-ambiguous (model 1 cell, CJK terminal fonts paint 2) and
+    // this row's stats→preview→hint truncation arithmetic all runs through
+    // stringWidth — a painted-wide separator shifts every segment right by
+    // one column per separator and the row reads as overlapping text.
+    // U+30FB is officially Ambiguous too, but get-east-asian-width hardcodes
+    // it Wide and mainstream terminals (Western included) paint it 2 cells —
+    // the model and the painted width agree in practice. A wcwidth-strict
+    // Western terminal painting it 1 cell would leave a spare column, which
+    // the `- 6` slack below absorbs.
     const foldBadge = `▸ ${stats}`;
     const foldHint = t('input-fold-hover');
-    const foldPreviewWidth = inputWidth - stringWidth(foldBadge) - stringWidth(` · ${foldHint}`) - 6;
+    const foldPreviewWidth = inputWidth - stringWidth(foldBadge) - stringWidth(`・${foldHint}`) - 6;
     const foldPreview = foldPreviewWidth >= 8
         ? truncateToWidth(foldText.split('\n')[0] ?? '', foldPreviewWidth)
         : '';
     // Expanded-state fold affordance: a `▾` prefix at the start of the FIRST
     // row (only while the window is at the top and no block exists); its
     // cells fold the whole input into a block again on click.
-    const prefixLabel = `▾ ${stats} · `;
+    const prefixLabel = `▾ ${stats}・`;
     const prefixCols = !block && !expanded && big && windowStart === 0 ? stringWidth(prefixLabel) : 0;
     // Offset range [start, end) of every visual row — the SAME break rule as
     // wrapToWidth — so the selection highlight can intersect each row. With a
@@ -2639,7 +2843,7 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
             return (_jsxs(Box, { flexDirection: "row", onClick: (event) => {
                     event.stopImmediatePropagation();
                     updateFoldBlock(null);
-                }, onMouseEnter: hoverEnter, onMouseLeave: hoverLeave, children: [_jsx(Text, { dimColor: true, children: foldBadge }), foldPreview !== '' && _jsx(Text, { dimColor: true, children: " \u00B7 " }), foldPreview !== '' && _jsx(Text, { wrap: "truncate-end", children: foldPreview }), _jsx(Text, { dimColor: true, children: ` · ${foldHint}` })] }, `fold-${absoluteLine}`));
+                }, onMouseEnter: hoverEnter, onMouseLeave: hoverLeave, children: [_jsx(Text, { dimColor: true, children: foldBadge }), foldPreview !== '' && _jsx(Text, { dimColor: true, children: "\u30FB" }), foldPreview !== '' && _jsx(Text, { wrap: "truncate-end", children: foldPreview }), _jsx(Text, { dimColor: true, children: `・${foldHint}` })] }, `fold-${absoluteLine}`));
         }
         const withPrefix = absoluteLine === 0 && prefixCols > 0;
         const text = withPrefix ? truncateToWidth(line, inputWidth - prefixCols) : line;
@@ -2723,12 +2927,16 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
         // In the expanded editor the declared box starts at its outer edge
         // (padding + gutter included), so those columns ride along and the
         // clamp grows with them.
-        column: Math.min(caretVisualCol +
-            (expanded
-                ? editorGutterCols + 1
-                : caretVisualLine === 0 && prefixCols > 0
-                    ? prefixCols
-                    : 0), expanded ? editorGutterCols + 1 + inputWidth : inputWidth),
+        //
+        // The declared column is relative to the VALUE BOX, and `caretVisualCol`
+        // is already measured in that box's cell space: the text box IS the text
+        // run, so nothing that renders before it — the session entry, the `❯ `
+        // glyph, the fold prefix — shifts a cell inside it. Adding any of those
+        // back double-counts them and parks the hardware cursor to the RIGHT of
+        // the inverted caret cell (a 2-column miss shows up as a displaced IME
+        // preedit target). Only the expanded editor declares against a wider box
+        // (gutter + padding), so only that branch adds columns.
+        column: Math.min(caretVisualCol + (expanded ? editorGutterCols + 1 : 0), expanded ? editorGutterCols + 1 + inputWidth : inputWidth),
         active: !suspended && !selectionActive,
     });
     /**
@@ -3063,7 +3271,14 @@ export function PromptInput({ channel, suspended = false, helpOpen, onToggleHelp
                                 : undefined, rows: peekVisualLines.map((row, index) => (_jsx(Text, { wrap: "truncate-end", children: row }, index))), onRowPick: () => {
                                 updateFoldBlock(null);
                                 setHovered(false);
-                            } }) }))] })), lastNotification && (_jsx(Box, { position: "absolute", marginTop: -1, height: 1, width: "100%", paddingLeft: 2, paddingRight: 1, flexDirection: "column", justifyContent: "flex-end", overflow: "hidden", children: _jsx(Box, { justifyContent: "flex-end", children: _jsx(Text, { color: lastNotification.color, dimColor: !lastNotification.color, wrap: "truncate", children: lastNotification.text }) }) })), _jsx(EffortInputBorder, { effort: channel.reasoningEffort, levels: channel.effortLevels, columns: columns, onLight: isLightThemeActive(themeName), idleColor: promptAccent, topRightLabel: topRightLabel, children: _jsxs(Box, { flexDirection: "row", alignItems: "flex-start", width: "100%", children: [_jsx(EffortChargeGlyph, { effort: channel.reasoningEffort, levels: channel.effortLevels, working: channel.working }), vimEnabled && (_jsxs(Text, { bold: true, color: vimInsert ? 'success' : 'warning', children: [vimInsert ? 'INSERT' : 'NORMAL', " "] })), _jsx(Box, { ref: expanded ? undefined : valueBoxRef, flexGrow: 1, flexShrink: 1, onClick: handleValueClick, onDragStart: handleDragStart, onDragMove: handleDragMove, onDragEnd: handleDragEnd, children: value.length === 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { inverse: true, children: " " }), _jsx(EffortTierBadge, { effort: channel.reasoningEffort, levels: channel.effortLevels, onLight: isLightThemeActive(themeName), columns: columns, leadingColumns: 3 })] })) : (_jsx(Box, { flexDirection: "column", children: rendered })) }), expandEnabled && (_jsx(Box, { flexShrink: 0, onClick: (event) => {
+                            } }) }))] })), lastNotification && (_jsx(Box, { position: "absolute", marginTop: -1, height: 1, width: "100%", paddingLeft: 2, paddingRight: 1, flexDirection: "column", justifyContent: "flex-end", overflow: "hidden", children: _jsx(Box, { justifyContent: "flex-end", children: _jsx(Text, { color: lastNotification.color, dimColor: !lastNotification.color, wrap: "truncate", children: lastNotification.text }) }) })), _jsx(EffortInputBorder, { effort: channel.reasoningEffort, levels: channel.effortLevels, columns: columns, onLight: isLightThemeActive(themeName), idleColor: promptAccent, topRightLabel: topRightLabel, children: _jsxs(Box, { flexDirection: "row", alignItems: "flex-start", width: "100%", children: [onOpenSessions !== undefined && (_jsx(Box, { flexShrink: 0, onClick: (event) => {
+                                event.stopImmediatePropagation();
+                                onOpenSessions?.();
+                            }, onMouseEnter: () => {
+                                setHomeHovered(true);
+                            }, onMouseLeave: () => {
+                                setHomeHovered(false);
+                            }, children: _jsx(Text, { dimColor: !homeHovered, bold: homeHovered, color: homeHovered ? promptAccent : undefined, children: HOME_BUTTON_TEXT }) })), _jsx(EffortChargeGlyph, { effort: channel.reasoningEffort, levels: channel.effortLevels, working: channel.working }), vimEnabled && (_jsxs(Text, { bold: true, color: vimInsert ? 'success' : 'warning', children: [vimInsert ? 'INSERT' : 'NORMAL', " "] })), _jsx(Box, { ref: expanded ? undefined : valueBoxRef, flexGrow: 1, flexShrink: 1, onClick: handleValueClick, onDragStart: handleDragStart, onDragMove: handleDragMove, onDragEnd: handleDragEnd, children: value.length === 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { inverse: true, children: " " }), _jsx(EffortTierBadge, { effort: channel.reasoningEffort, levels: channel.effortLevels, onLight: isLightThemeActive(themeName), columns: columns, leadingColumns: 3 + homeButtonCols })] })) : (_jsx(Box, { flexDirection: "column", children: rendered })) }), expandEnabled && (_jsx(Box, { flexShrink: 0, onClick: (event) => {
                                 event.stopImmediatePropagation();
                                 toggleExpand();
                             }, onMouseEnter: () => {

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

@@ -10,16 +10,31 @@ import { type ScrollBoxHandle } from '../ui.js';
  *  - 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 declare function ScrollbarGutter({ handle, terminalWidth, }: {
     handle: ScrollBoxHandle | null;

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

@@ -1 +1 @@
-{"version":3,"file":"ScrollbarGutter.d.ts","sourceRoot":"","sources":["../../../src/components/ScrollbarGutter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,UAAU,CAAA;AAUpE;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,aAAa,GACd,EAAE;IACD,MAAM,EAAE,eAAe,GAAG,IAAI,CAAA;IAC9B,aAAa,EAAE,MAAM,CAAA;CACtB,GAAG,KAAK,CAAC,SAAS,CAsIlB"}
+{"version":3,"file":"ScrollbarGutter.d.ts","sourceRoot":"","sources":["../../../src/components/ScrollbarGutter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,UAAU,CAAA;AAqBpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,aAAa,GACd,EAAE;IACD,MAAM,EAAE,eAAe,GAAG,IAAI,CAAA;IAC9B,aAAa,EAAE,MAAM,CAAA;CACtB,GAAG,KAAK,CAAC,SAAS,CA6LlB"}