dsh-neotui 0.0.2 → 0.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-neotui",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "Neo-TUI: mouse-driven terminal UI client for DeepSeek Harness (B-tier per dsh-tui-design.md)",
   "type": "module",
   "bin": { "dsh-neotui": "bin/dsh-tui.js" },

package/src/panels.js

@@ -393,10 +393,16 @@ export class WorkspacePanel extends Widget {
       };
       walk(this.tree);
       this.searchResults = results;
-      for (let i = 0; i < Math.min(this.h - 2, results.length); i++) {
-        const sel = i === this.searchSel;
+      const visH = Math.max(1, this.h - 2);
+      if (this.searchSel < (this.searchScroll ?? 0)) this.searchScroll = this.searchSel;
+      else if (this.searchSel >= (this.searchScroll ?? 0) + visH) this.searchScroll = this.searchSel - visH + 1;
+      this.searchScroll = Math.max(0, Math.min(Math.max(0, results.length - visH), this.searchScroll ?? 0));
+      for (let i = 0; i < visH; i++) {
+        const idx = this.searchScroll + i;
+        if (idx >= results.length) break;
+        const sel = idx === this.searchSel;
         screen.fillRect(this.x + 1, this.y + 2 + i, mid - 2, this.y + 2 + i, " ", { bg: sel ? K.MENUSEL : -1 });
-        screen.text(this.x + 2, this.y + 2 + i, truncate("⚲ " + basename(results[i]), mid - 6), { fg: sel ? K.BOLD : K.TXT, bg: sel ? K.MENUSEL : -1 });
+        screen.text(this.x + 2, this.y + 2 + i, truncate("⚲ " + basename(results[idx]), mid - 6), { fg: sel ? K.BOLD : K.TXT, bg: sel ? K.MENUSEL : -1 });
       }
       screen.text(this.x + 1, this.y + this.h - 1, ` 匹配 ${results.length} 个文件 · Esc 退出搜索`, { fg: K.FAINT });
       return;
@@ -781,6 +787,7 @@ export class ControlPanel extends Widget {
     this.subPages = ["常规", "插件"];
     this.subPage = 0;
     this.sel = 0;
+    this.scroll = 0;
     this.commands = DEFAULT_COMMANDS;
     this.plugins = null;
     this.pluginError = null;
@@ -884,9 +891,15 @@ export class ControlPanel extends Widget {
     }
     const items = this.items();
     if (this.sel >= items.length) this.sel = Math.max(0, items.length - 1);
-    for (let i = 0; i < Math.min(this.h - 3, items.length); i++) {
-      const it = items[i];
-      const sel = i === this.sel;
+    const visible = Math.max(1, this.h - 3);
+    if (this.sel < this.scroll) this.scroll = this.sel;
+    else if (this.sel >= this.scroll + visible) this.scroll = this.sel - visible + 1;
+    this.scroll = Math.max(0, Math.min(Math.max(0, items.length - visible), this.scroll));
+    for (let i = 0; i < visible; i++) {
+      const idx = this.scroll + i;
+      const it = items[idx];
+      if (!it) { s.hline(this.x + 1, this.x + this.w - 2, this.y + 2 + i, " ", { bg: T.PANEL }); continue; }
+      const sel = idx === this.sel;
       s.fillRect(this.x + 1, this.y + 2 + i, this.x + this.w - 2, this.y + 2 + i, " ", { bg: sel ? T.MENUSEL : T.PANEL });
       const label = it[0];
       s.text(this.x + 2, this.y + 2 + i, truncate(label, this.w - 34), { fg: sel ? T.BOLD : (this.page === 0 ? T.ACCENT : T.TXT), bg: sel ? T.MENUSEL : T.PANEL, attrs: sel ? 1 : 0 });
@@ -947,9 +960,9 @@ export class ControlPanel extends Widget {
         }
         return true;
       }
-      const idx = ev.y - this.y - 2;
+      const idx = this.scroll + (ev.y - this.y - 2);
       const items = this.items();
-      if (idx >= 0 && idx < items.length && idx < this.h - 3) {
+      if (idx >= 0 && idx < items.length && (ev.y - this.y - 2) < this.h - 3) {
         this.sel = idx;
         const it = items[idx];
         if (it && it[2]) { it[2](); this.app.redraw(); }

package/src/term.js

@@ -44,7 +44,8 @@ export class Term {
     this.input.on("data", (chunk) => this.#feed(this.decoder.write(chunk)));
     const o = this.output;
     o.write("\x1b[?1049h"); // alt screen
-    o.write("\x1b[?25l");   // hide cursor
+    o.write("\x1b[?25l");   // hide cursor (shown only over the focused input)
+    o.write("\x1b[5 q");    // DECSCUSR: blinking vertical bar caret
     o.write("\x1b[?1000h"); // mouse: clicks
     o.write("\x1b[?1002h"); // mouse: drag
     o.write("\x1b[?1003h"); // mouse: all motion

package/src/views.js

@@ -528,6 +528,7 @@ export class ChatView extends Widget {
     this.collapsedBlocks = new Set(); // per-block COLLAPSE (default expanded): `${realIdx}:${bi}`
     this.thinkMode = "expanded";        // think blocks: expanded by default (t toggles)
     this.bashMode = "expanded";         // tool blocks: expanded | collapsed (b toggles)
+    this.todosVisible = true;           // todo block above the input (Shift+T toggles)
     this.running = false;
     this.hasMore = false;
     this.loadingOlder = false;
@@ -679,12 +680,20 @@ export class ChatView extends Widget {
     }
   }
 
+  /** Height of the collapsible todo block (0 when empty or collapsed). */
+  #todoHeight() {
+    const todos = this.app.todos;
+    if (!this.todosVisible || !todos || todos.length === 0) return 0;
+    return Math.min(todos.length, 6) + 1; // 1 header row + up to 6 todos
+  }
+
   #inputChanged() {
     // Multi-line input grew/shrunk → reflow view vs input, keep the tail visible.
     const ih = this.input.height();
     const prevIh = this.input.h;
     this.input.h = ih;
-    this.view.h = this.h - ih - 1;
+    const th = this.#todoHeight();
+    this.view.h = this.h - ih - th - 1;
     this.input.y = this.y + this.h - ih;
     if (ih !== prevIh) this.app.layout();
     this.app.redraw();
@@ -694,7 +703,8 @@ export class ChatView extends Widget {
     this.x = x; this.y = y; this.w = w; this.h = h;
     const ih = this.input.height();
     this.input.h = ih;
-    this.view.x = x; this.view.y = y; this.view.w = w; this.view.h = h - ih - 1;
+    const th = this.#todoHeight();
+    this.view.x = x; this.view.y = y; this.view.w = w; this.view.h = h - ih - th - 1;
     this.input.x = x; this.input.y = y + h - ih; this.input.w = w;
     this.cache.clear();
     this.#rebuild();
@@ -1107,10 +1117,27 @@ export class ChatView extends Widget {
         screen.invertRect(this.view.x, this.view.y + (y0 - this.view.scrollY), this.view.x + this.view.w - 2, this.view.y + (y1 - this.view.scrollY));
       }
     }
+    this.#renderTodos(screen);
     screen.hline(this.x, this.x + this.w - 1, this.input.y - 1, "─", { fg: T.BORDER2 });
     this.input.render(screen);
   }
 
+  /** Collapsible todo block between the view and the input (Shift+T toggles). */
+  #renderTodos(screen) {
+    const th = this.#todoHeight();
+    if (th === 0) return;
+    const todos = this.app.todos ?? [];
+    const y = this.input.y - th - 1;
+    screen.fillRect(this.x, y, this.x + this.w - 1, y + th - 1, " ", { bg: T.THINKBG });
+    screen.text(this.x, y, " ☐ 任务清单（Shift+T 折叠）", { fg: K.FAINT });
+    for (let i = 0; i < Math.min(todos.length, th - 1); i++) {
+      const t = todos[i];
+      const icon = t.status === "completed" ? "✓" : t.status === "in_progress" ? "◉" : "○";
+      const color = t.status === "completed" ? T.FAINT : t.status === "in_progress" ? T.WARN : T.DIM;
+      screen.text(this.x + 2, y + 1 + i, `${icon} ${truncate(t.content ?? String(t), this.w - 6)}`, { fg: color });
+    }
+  }
+
   onMouse(ev) {
     if (this.input.inside(ev.x, ev.y)) {
       // INSERT mode is keyboard-only; only position the cursor if already there.
@@ -1213,6 +1240,12 @@ export class ChatView extends Widget {
       return true;
     }
     if (ev.name === "char" && ev.key === "t" && !ev.ctrl) {
+      if (ev.shift) {
+        this.todosVisible = !this.todosVisible;
+        this.app.toast(this.todosVisible ? "任务块：显示（Shift+T 折叠）" : "任务块：折叠（Shift+T 展开）");
+        this.#inputChanged();
+        return true;
+      }
       this.thinkMode = this.thinkMode === "collapsed" ? "expanded" : "collapsed";
       this.expanded.clear();
       this.collapsedBlocks.clear();
@@ -1227,12 +1260,16 @@ export class ChatView extends Widget {
 function toolSummary(b) {
   // Prefer the human description of what the tool did (the agent's `description`
   // argument), then the host card title, then the raw command — mirrors the web.
+  // File tools get a path-based summary so read/edit collapse as concisely as bash.
   if (b.args) {
     try {
       const a = JSON.parse(b.args);
       if (typeof a === "object" && a !== null) {
-        const desc = a.description ?? a.summary ?? a.title ?? a.path ?? a.query ?? a.content ?? a.name;
+        const desc = a.description ?? a.summary ?? a.title ?? a.query ?? a.content ?? a.name;
         if (desc) return String(desc).slice(0, 120);
+        if (a.file_path) return `read ${String(a.file_path)}`.slice(0, 120);
+        if (a.path && a.command) return `${a.command} ${String(a.path)}`.slice(0, 120);
+        if (a.path) return String(a.path).slice(0, 120);
         return a.command ?? null;
       }
       return String(a).slice(0, 120);
@@ -2396,11 +2433,14 @@ export class App {
     if (this.menu) this.menu.render(s);
     if (this.overlay) this.overlay.render(s);
     if (this.toastMsg) {
-      const w = strWidth(this.toastMsg) + 4;
-      const x0 = Math.max(0, Math.floor(s.w / 2 - w / 2));
-      const x1 = Math.min(s.w - 1, Math.floor(s.w / 2 + w / 2));
-      s.fillRect(x0, 0, x1, 0, " ", { bg: T.BORDER });
-      s.text(x0 + 2, 0, truncate(this.toastMsg, s.w - 4), { fg: T.BOLD, bg: T.BORDER });
+      // Toasts land in the LOWER half (just above the input/footer) where the
+      // user's attention is while pressing shortcuts — a solid color block,
+      // not a top-of-screen whisper.
+      const w = Math.min(s.w - 4, strWidth(this.toastMsg) + 6);
+      const x0 = Math.max(2, Math.floor((s.w - w) / 2));
+      const y = Math.max(1, s.h - this.footerHeight() - 2);
+      s.fillRect(x0 - 1, y - 1, x0 + w, y + 1, " ", { bg: T.ACCENT });
+      s.text(x0 + 1, y, truncate(this.toastMsg, w - 2), { fg: T.SELFG, bg: T.ACCENT, attrs: 1 });
     }
     if (this.renameInput && this.popup) this.renameInput.render(s);
 
@@ -2409,6 +2449,11 @@ export class App {
     if (this.overlay && typeof this.overlay.kittyTransmit === "function" && kittyCapable()) {
       tail = this.overlay.kittyTransmit();
     }
+    // Native terminal caret: a blinking vertical bar (text-editor style) at
+    // the focused input's cursor cell; hidden everywhere else.
+    const cell = this.focused?.cursorCell;
+    if (cell) tail = `\x1b[?25h\x1b[${cell.y + 1};${cell.x + 1}H` + tail;
+    else tail = "\x1b[?25l" + tail;
     this.term.output.write(out + tail);
   }
 

package/src/widgets.js

@@ -247,9 +247,59 @@ export class Input extends Widget {
     this.histIdx = -1;
   }
   #cps() { return Array.from(this.value); }            // code points
-  #lines() { return this.value.split("\n"); }
-  /** Rendered height: 1 line, or up to maxLines when multi-line. */
-  height() { return this.multi ? Math.max(1, Math.min(this.maxLines, this.#lines().length)) : 1; }
+  /** Visual rows for multi-line input: logical lines wrapped at the width. */
+  #visualRows() {
+    const inner0 = Math.max(1, this.w - strWidth(this.prompt) - 2);
+    const innerN = Math.max(1, this.w - 2);
+    const rows = [];
+    const cps = Array.from(this.value);
+    let text = "", width = 0, limit = inner0, start = 0;
+    for (let i = 0; i < cps.length; i++) {
+      const ch = cps[i];
+      if (ch === "\n") {
+        rows.push({ text, start, end: i, limit });
+        text = ""; width = 0; limit = innerN; start = i + 1;
+        continue;
+      }
+      const cw = strWidth(ch);
+      if (width + cw > limit && width > 0) {
+        rows.push({ text, start, end: i, limit });
+        text = ""; width = 0; limit = innerN; start = i;
+      }
+      text += ch; width += cw;
+    }
+    rows.push({ text, start, end: cps.length, limit });
+    return rows;
+  }
+  /** [visualRow, display-col] of the cursor in wrapped coordinates. */
+  #cursorVisual() {
+    const rows = this.#visualRows();
+    const cursor = Math.max(0, Math.min(this.cursor, Array.from(this.value).length));
+    for (let ri = 0; ri < rows.length; ri++) {
+      const r = rows[ri];
+      if (cursor >= r.start && cursor <= r.end) {
+        const before = Array.from(r.text).slice(0, cursor - r.start);
+        return { row: ri, col: before.reduce((w, ch) => w + strWidth(ch), 0) };
+      }
+    }
+    const last = rows[rows.length - 1];
+    return { row: rows.length - 1, col: strWidth(last.text) };
+  }
+  /** Code-point index of the nearest position at a visual [row, col]. */
+  #indexAtVisual(row, col) {
+    const rows = this.#visualRows();
+    const r = rows[Math.max(0, Math.min(row, rows.length - 1))];
+    const cps = Array.from(r.text);
+    let w = 0, j = 0;
+    for (; j < cps.length; j++) {
+      const cw = strWidth(cps[j]);
+      if (col < w + cw / 2) break;
+      w += cw;
+    }
+    return r.start + j;
+  }
+  /** Rendered height: 1, or wrapped rows capped at maxLines when multi. */
+  height() { return this.multi ? Math.max(1, Math.min(this.maxLines, this.#visualRows().length)) : 1; }
   setValue(v, opts = {}) {
     this.value = String(v);
     this.cursor = this.#cps().length;
@@ -270,75 +320,88 @@ export class Input extends Widget {
     cps.splice(idx, 1);
     this.value = cps.join("");
   }
-  /** [line, display-col] of the cursor. */
-  #cursorPos() {
-    const before = this.#cps().slice(0, this.cursor);
-    let line = 0, col = 0;
-    for (const ch of before) {
-      if (ch === "\n") { line++; col = 0; }
-      else col += strWidth(ch);
-    }
-    return [line, col];
-  }
-  /** Code-point index of the nearest position at [line, col]. */
-  #indexAtLineCol(line, col) {
-    const lines = this.#lines();
-    let idx = 0;
-    for (let i = 0; i < Math.min(line, lines.length); i++) idx += Array.from(lines[i]).length + 1;
-    const target = lines[Math.min(line, lines.length - 1)] ?? "";
-    const cps = Array.from(target);
-    let w = 0;
-    for (let j = 0; j < cps.length; j++) {
-      const cw = strWidth(cps[j]);
-      if (col < w + cw / 2) break;
-      w += cw;
-      idx++;
-    }
-    return idx;
+  /** Scroll offset that keeps the cursor's visual row inside the window. */
+  #scrollStart(h) {
+    const rows = this.#visualRows();
+    const { row } = this.#cursorVisual();
+    const maxStart = Math.max(0, rows.length - this.maxLines);
+    let start = this.scrollY ?? 0;
+    if (row < start) start = row;
+    else if (row >= start + h) start = row - h + 1;
+    start = Math.max(0, Math.min(maxStart, start));
+    this.scrollY = start;
+    return start;
   }
   render(screen) {
-    const n = this.height();
-    screen.fillRect(this.x, this.y, this.x + this.w - 1, this.y + n - 1, " ", { bg: this.bg });
+    if (!this.multi) {
+      // single-line: horizontal scroll (search/rename/picker inputs)
+      screen.fillRect(this.x, this.y, this.x + this.w - 1, this.y, " ", { bg: this.bg });
+      screen.hline(this.x, this.x + this.w - 1, this.y, "─", { fg: this.border, bg: this.bg });
+      const promptW = strWidth(this.prompt);
+      const inner = Math.max(0, this.w - promptW - 2);
+      screen.text(this.x, this.y, this.prompt, { fg: T.ACCENT, bg: this.bg });
+      if (this.value === "" && this.placeholder) {
+        screen.text(this.x + promptW, this.y, truncate(this.placeholder, inner), { fg: T.FAINT, bg: this.bg });
+        this.cursorCell = { x: this.x + promptW, y: this.y };
+        return;
+      }
+      const before = Array.from(this.value).slice(0, this.cursor).join("");
+      const cx = strWidth(before);
+      let start = 0;
+      while (cx - start >= inner) start += Math.max(1, Math.floor(inner / 2));
+      const visible = truncate(Array.from(this.value).slice(start).join(""), inner);
+      screen.text(this.x + promptW, this.y, visible, { fg: this.fg, bg: this.bg });
+      this.cursorCell = { x: this.x + promptW + Math.min(inner, Math.max(0, cx - start)), y: this.y };
+      return;
+    }
+    // multi-line: auto-wrap + scroll window that follows the cursor
+    const rows = this.#visualRows();
+    const h = Math.min(this.maxLines, rows.length);
+    screen.fillRect(this.x, this.y, this.x + this.w - 1, this.y + h - 1, " ", { bg: this.bg });
     screen.hline(this.x, this.x + this.w - 1, this.y, "─", { fg: this.border, bg: this.bg });
-    const lines = this.#lines();
-    const [curLine, curCol] = this.#cursorPos();
-    const promptW = strWidth(this.prompt);
-    const inner0 = Math.max(0, this.w - promptW - 2);
-    const innerN = Math.max(0, this.w - 2);
     if (this.value === "" && this.placeholder) {
       screen.text(this.x, this.y, this.prompt, { fg: T.ACCENT, bg: this.bg });
-      screen.text(this.x + promptW, this.y, truncate(this.placeholder, inner0), { fg: T.FAINT, bg: this.bg });
+      screen.text(this.x + strWidth(this.prompt), this.y, truncate(this.placeholder, this.w - strWidth(this.prompt) - 2), { fg: T.FAINT, bg: this.bg });
+      this.cursorCell = { x: this.x + strWidth(this.prompt), y: this.y };
       return;
     }
-    for (let li = 0; li < n; li++) {
-      const y = this.y + li;
-      const line = lines[li] ?? "";
-      if (li === 0) {
+    const { row: curRow, col: curCol } = this.#cursorVisual();
+    const start = this.#scrollStart(h);
+    for (let ri = start; ri < Math.min(rows.length, start + h); ri++) {
+      const r = rows[ri];
+      const y = this.y + (ri - start);
+      if (ri === 0) {
         screen.text(this.x, y, this.prompt, { fg: T.ACCENT, bg: this.bg });
-        let start = 0;
-        if (curLine === 0) {
-          while (curCol - start >= inner0) start += Math.max(1, Math.floor(inner0 / 2));
-        }
-        const visible = truncate(Array.from(line).slice(start).join(""), inner0);
-        screen.text(this.x + promptW, y, visible, { fg: this.fg, bg: this.bg });
-        if (curLine === 0) {
-          const at = Math.min(inner0, Math.max(0, curCol - start));
-          screen.put(this.x + promptW + at, y, "█", { fg: T.FAINT, bg: this.bg });
-        }
+        screen.text(this.x + strWidth(this.prompt), y, r.text, { fg: this.fg, bg: this.bg });
       } else {
-        screen.text(this.x + 1, y, truncate(line, innerN), { fg: this.fg, bg: this.bg });
-        if (curLine === li) {
-          const at = Math.min(innerN, Math.max(0, curCol));
-          screen.put(this.x + 1 + at, y, "█", { fg: T.FAINT, bg: this.bg });
-        }
+        screen.text(this.x + 1, y, r.text, { fg: this.fg, bg: this.bg });
       }
     }
+    // Native terminal caret (blinking bar) is positioned by the app after the
+    // frame; store the cell it should occupy (the char at the cursor index).
+    const curY = this.y + (curRow - start);
+    const curX = curRow === 0 ? this.x + strWidth(this.prompt) + curCol : this.x + 1 + curCol;
+    this.cursorCell = { x: Math.min(this.x + this.w - 1, curX), y: Math.min(this.y + h - 1, curY) };
   }
   onMouse(ev) {
     if (ev.kind === "press" && ev.button === 0) {
-      const line = Math.max(0, Math.min(this.#lines().length - 1, ev.y - this.y));
-      const rx = ev.x - this.x - (line === 0 ? strWidth(this.prompt) : 1);
-      this.cursor = this.#indexAtLineCol(line, Math.max(0, rx));
+      if (this.multi) {
+        const h = this.height();
+        const start = this.scrollY ?? 0;
+        const row = start + Math.max(0, Math.min(h - 1, ev.y - this.y));
+        const rx = ev.x - this.x - (row === 0 ? strWidth(this.prompt) : 1);
+        this.cursor = this.#indexAtVisual(row, Math.max(0, rx));
+      } else {
+        const rx = ev.x - this.x - strWidth(this.prompt);
+        let w = 0, idx = 0;
+        for (const ch of Array.from(this.value)) {
+          const cw = strWidth(ch);
+          if (rx < w + cw / 2) break;
+          w += cw;
+          idx++;
+        }
+        this.cursor = idx;
+      }
       return true;
     }
     return false;
@@ -355,12 +418,21 @@ export class Input extends Widget {
         return true;
       case "left": this.selectAll = false; this.cursor = Math.max(0, this.cursor - 1); return true;
       case "right": this.selectAll = false; this.cursor = Math.min(this.#cps().length, this.cursor + 1); return true;
-      case "home": { const [l] = this.#cursorPos(); this.cursor = this.#indexAtLineCol(l, 0); return true; }
-      case "end": { const [l] = this.#cursorPos(); const line = this.#lines()[l] ?? ""; this.cursor = this.#indexAtLineCol(l, strWidth(line)); return true; }
+      case "home": {
+        if (this.multi) { const rows = this.#visualRows(); const { row } = this.#cursorVisual(); this.cursor = rows[row].start; }
+        else this.cursor = 0;
+        return true;
+      }
+      case "end": {
+        if (this.multi) { const rows = this.#visualRows(); const { row } = this.#cursorVisual(); this.cursor = rows[row].end; }
+        else this.cursor = this.#cps().length;
+        return true;
+      }
       case "up":
         if (this.multi) {
-          const [l, c] = this.#cursorPos();
-          if (l > 0) this.cursor = this.#indexAtLineCol(l - 1, c);
+          const rows = this.#visualRows();
+          const { row, col } = this.#cursorVisual();
+          if (row > 0) this.cursor = this.#indexAtVisual(row - 1, col);
         } else if (this.history.length) {
           this.histIdx = this.histIdx < 0 ? this.history.length - 1 : Math.max(0, this.histIdx - 1);
           this.setValue(this.history[this.histIdx] ?? "");
@@ -368,8 +440,9 @@ export class Input extends Widget {
         return true;
       case "down":
         if (this.multi) {
-          const [l, c] = this.#cursorPos();
-          if (l < this.#lines().length - 1) this.cursor = this.#indexAtLineCol(l + 1, c);
+          const rows = this.#visualRows();
+          const { row, col } = this.#cursorVisual();
+          if (row < rows.length - 1) this.cursor = this.#indexAtVisual(row + 1, col);
         } else if (this.histIdx >= 0) {
           this.histIdx++;
           if (this.histIdx >= this.history.length) { this.histIdx = -1; this.setValue(""); }