dsh-neotui 0.2.1 → 0.2.2

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## 0.2.2 — 2026-08-16
+
+### Added
+
+- 底栏在子代理状态后显示“有 x 条命令正在排队 Ctrl+N 查看详情”。
+- Ctrl+N 打开精简排队命令面板；每条命令一行，支持 `dd` 删除。
+
+### Changed
+
+- AskUser 窗口按实际内容自适应高度，长内容才启用滚动。
+- 选项标签与描述只显示一次，完整描述按终端宽度换行。
+- 自定义答案常驻在选项下一行并支持最多六行自动换行。
+- 长正文使用 Ctrl+↑/Ctrl+↓、PgUp/PgDn、Home/End 和滚轮翻页。
+- 权限审批窗口保留完整原因和命令，明确显示滚动提示与位置。
+
+### Fixed
+
+- AskUser 自定义回答、真实跳过项、精确鼠标 hitbox 和文本光标编辑。
+- 权限申请窗口支持 ↑/↓ 逐行滚动，不改变安全默认“拒绝”。
+- 超长审批命令不再只保留前六行。
+- Queue 面板移除未要求的编辑与 steering 操作，`dd` 同时兼容 text/key 事件。
+
 ## 0.2.1 — 2026-08-16
 
 ### Fixed

package/package.json

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

package/src/panels.js

@@ -1751,18 +1751,17 @@ export class QueuePanel extends Popup {
     const items = app.queueItems ?? [];
     const w = Math.max(24, Math.min(84, app.screen.w - 4));
     const h = Math.max(7, Math.min(24, app.screen.h - 4));
-    super({ x: Math.max(0, Math.floor((app.screen.w - w) / 2)), y: Math.max(0, Math.floor((app.screen.h - h) / 2)), w, h, title: "消息队列", lines: [], buttons: [{ label: "关闭", action: "close" }], onAction: () => app.closeOverlay(), scrollable: true });
-    this.app = app; this.items = items; this.sel = 0; this.pending = false; this.editInput = null; this.rebuild();
+    super({ x: Math.max(0, Math.floor((app.screen.w - w) / 2)), y: Math.max(0, Math.floor((app.screen.h - h) / 2)), w, h, title: "排队命令 · ↑↓ 选择 · dd 删除 · Esc 关闭", lines: [], buttons: [], scrollable: true });
+    this.app = app; this.items = items; this.sel = 0; this.pending = false; this.dArmed=false; this.rebuild();
   }
   rebuild() {
-    const lines = [[{ t: ` ↑↓选择 · e 编辑 · s 立即 steering · d 删除 · Esc关闭${this.pending ? " · 操作中…" : ""}`, fg: this.pending ? K.WARN : K.DIM }]];
+    const lines = [];
     for (let i = 0; i < this.items.length; i++) {
       const item = this.items[i];
       const text = partsText(item.message?.content).replace(/\s+/g, " ");
       lines.push([{ t: `${i === this.sel ? "▸" : " "} ${item.placement === "queued" ? "⏳" : item.placement === "steering" ? "↪" : "ℹ"} ${truncate(text || item.id, this.w - 8)}`, fg: i === this.sel ? T.SELFG : K.TXT, bg: i === this.sel ? T.MENUSEL : -1 }]);
     }
     if (!this.items.length) lines.push([{ t: " （队列为空）", fg: K.FAINT }]);
-    if (this.editInput) lines.push([{ t: ` 编辑: ${truncate(this.editInput.value, this.w - 8)}`, fg: K.ACCENT }]);
     this.lines = lines;
   }
   syncItems(items) {
@@ -1782,7 +1781,6 @@ export class QueuePanel extends Popup {
       const action = kind === "edit" ? { kind, content: [{ type: "text", text: content }] } : { kind };
       await this.app.api.call("session.updateQueue", { sessionId: this.app.currentSession, itemId: item.id, action });
       if (kind === "remove") this.syncItems(this.items.filter((row) => row.id !== item.id));
-      this.editInput = null;
     } catch (e) {
       const code = this.#errorCode(e);
       if (code === "queue-item-not-found" || /queue-item-not-found/.test(e.message ?? "")) {
@@ -1793,31 +1791,19 @@ export class QueuePanel extends Popup {
       } else this.app.toast(`队列操作失败: ${e.message}`);
     } finally { this.pending = false; this.rebuild(); this.app.redraw(); }
   }
-  #beginEdit() {
-    const item = this.items[this.sel];
-    if (!item || item.placement !== "queued") { this.app.toast("只有排队消息可以编辑"); return; }
-    this.editInput = new Input({ x: this.x + 2, y: this.y + this.h - 3, w: this.w - 4, h: 1, prompt: "编辑: ", allowEmptyEnter: false, onEnter: (value) => this.#mutate("edit", value) });
-    this.editInput.setValue(partsText(item.message?.content));
-    this.rebuild();
-  }
   onKey(ev) {
-    if (this.editInput) {
-      if (ev.type === "key" && ev.name === "escape") { this.editInput = null; this.rebuild(); return true; }
-      if (this.editInput.onKey(ev)) { this.rebuild(); this.app.redraw(); return true; }
-    }
+    const ch=ev.type==="text"?ev.text:ev.type==="key"&&ev.name==="char"?ev.key:null;
+    if(ch==="d"){if(this.dArmed){this.dArmed=false;this.#mutate("remove");}else{this.dArmed=true;this.app.toast("再按 d 删除这条排队命令");}return true;}
     if (ev.type === "key") {
       if (ev.name === "escape") { this.app.closeOverlay(); return true; }
-      if (ev.name === "up") { this.sel = Math.max(0, this.sel - 1); this.rebuild(); return true; }
-      if (ev.name === "down") { this.sel = Math.min(this.items.length - 1, this.sel + 1); this.rebuild(); return true; }
-      if (ev.name === "char" && ev.key === "e" && !ev.ctrl) { this.#beginEdit(); return true; }
-      if (ev.name === "char" && ev.key === "s" && !ev.ctrl) { this.#mutate("steer"); return true; }
-      if (ev.name === "char" && ev.key === "d" && !ev.ctrl) { this.#mutate("remove"); return true; }
+      if (ev.name === "up") { this.dArmed=false;this.sel = Math.max(0, this.sel - 1); this.rebuild(); return true; }
+      if (ev.name === "down") { this.dArmed=false;this.sel = Math.min(this.items.length - 1, this.sel + 1); this.rebuild(); return true; }
     }
-    return super.onKey(ev);
+    this.dArmed=false;return false;
   }
   onMouse(ev) {
     if (ev.kind === "press" && ev.button === 0) {
-      const idx = ev.y - this.y - 2;
+      const idx = ev.y - this.y - 1;
       if (idx >= 0 && idx < this.items.length) { this.sel = idx; this.rebuild(); this.app.redraw(); return true; }
     }
     return super.onMouse(ev);

package/src/views.js

@@ -2344,14 +2344,31 @@ function truncateText(s, n) {
   return s.length > n ? s.slice(0, n) + "\n…(截断)" : s;
 }
 
+function wrapDisplayText(value, width) {
+  const out = [];
+  for (const raw of String(value ?? "").split("\n")) {
+    if (!raw) { out.push(""); continue; }
+    let line = "", used = 0;
+    for (const g of graphemes(raw)) {
+      const gw = graphemeWidth(g);
+      if (line && used + gw > width) { out.push(line); line = ""; used = 0; }
+      line += g; used += gw;
+    }
+    out.push(line);
+  }
+  return out;
+}
+
 // ---- Question popup ----
 
 export class QuestionPopup extends Popup {
   constructor({ app, frame }) {
     const questions = frame.questions ?? [];
     const planReview = questions.length === 1 && questions[0]?.intent?.kind === "plan-review";
-    const w = Math.max(12, Math.min(planReview ? 88 : 72, app.screen.w - 2));
-    const h = Math.max(5, Math.min(Math.max(5, app.screen.h - 2), planReview ? app.screen.h - 2 : questions.length * 5 + 8));
+    const w = Math.max(12, Math.min(planReview ? 96 : 92, app.screen.w - 2));
+    const wrapCount=(value,width)=>wrapDisplayText(value,width).length;
+    const estimated=questions.reduce((n,q)=>n+1+wrapCount(q.question??"",w-4)+(q.detail?wrapCount(q.detail,w-4):0)+(q.options??[]).reduce((m,o)=>m+1+(o.description?wrapCount(o.description,w-10):0),0)+(q.intent?.kind==="plan-review"?0:4),0)+2;
+    const h=Math.max(10,Math.min(app.screen.h-2,estimated));
     super({
       x: Math.max(0, Math.floor((app.screen.w - w) / 2)), y: Math.max(0, Math.floor((app.screen.h - h) / 2)),
       w, h, title: planReview ? "✎ 计划审阅" : "❓ 需要你的回答",
@@ -2387,44 +2404,44 @@ export class QuestionPopup extends Popup {
     const q = this.questions[this.questionIdx];
     if (!q) return;
     const draft = this.drafts[this.questionIdx];
-    let ly = this.y + 1;
-    screen.text(this.x + 2, ly++, truncate(`▎ ${q.header ?? `问题 ${this.questionIdx + 1}/${this.questions.length}`}`, this.w - 4), { fg: K.ACCENT, bold: true });
-    screen.text(this.x + 2, ly++, truncate(q.question ?? "", this.w - 4), { fg: K.TXT });
-    if (this.planReview) screen.text(this.x + 2, ly++, "Enter 执行计划 · ↓ 继续规划 · Esc 取消审阅", { fg: K.FAINT });
     const opts = q.options ?? [];
-    if (q.detail) {
-      const detailLines = String(q.detail).split("\n");
-      const optionRows = opts.reduce((n, option) => n + (option.description ? 2 : 1), 0);
-      const room = Math.max(1, this.y + this.h - 4 - ly - optionRows);
-      const maxScroll = Math.max(0, detailLines.length - room);
-      this.detailScrollY = Math.max(0, Math.min(this.detailScrollY, maxScroll));
-      this.detailPage = room;
-      const visible = detailLines.slice(this.detailScrollY, this.detailScrollY + room);
-      for (const detail of visible) screen.text(this.x + 2, ly++, truncate(detail, this.w - 4), { fg: K.DIM });
-      if (this.planReview && detailLines.length > room && ly < this.y + this.h - 3) {
-        const start = this.detailScrollY + 1, end = Math.min(detailLines.length, this.detailScrollY + room);
-        screen.text(this.x + 2, ly++, `计划 ${start}–${end} / ${detailLines.length} 行 · PgUp/PgDn/Home/End/滚轮`, { fg: K.FAINT });
-      }
-    }
+    const optionDescriptionRows=opts.reduce((n,o)=>n+(o.description?wrapDisplayText(o.description,this.w-10).length:0),0);
+    const actionRows = opts.length + optionDescriptionRows + (this.planReview ? 0 : Math.min(6,Math.max(3,wrapDisplayText(draft.custom||"在此输入…",this.w-10).length))+2);
+    const actionTop = Math.max(this.y + 5, this.y + this.h - 1 - Math.min(actionRows,this.h-6));
+    const doc = [
+      { text: `▎ ${q.header ?? `问题 ${this.questionIdx + 1}/${this.questions.length}`}`, fg: K.ACCENT, bold: true },
+      ...wrapDisplayText(q.question ?? "", this.w - 4).map((text) => ({ text, fg: K.TXT })),
+      ...(q.detail ? wrapDisplayText(q.detail, this.w - 4).map((text) => ({ text, fg: K.DIM })) : []),
+    ];
+
+    const room = Math.max(1, actionTop - (this.y + 1));
+    const maxScroll = Math.max(0, doc.length - room);
+    this.detailScrollY = Math.max(0, Math.min(this.detailScrollY, maxScroll)); this.detailPage = room; this.detailTotal = doc.length;
+    let ly = this.y + 1;
+    for (const line of doc.slice(this.detailScrollY, this.detailScrollY + room)) screen.text(this.x + 2, ly++, truncate(line.text, this.w - 4), { fg: line.fg, attrs: line.bold ? 1 : 0 });
+    if(maxScroll>0){screen.text(this.x+this.w-26,this.y,`正文 Ctrl+↑↓ 翻页 ${this.detailScrollY+1}-${Math.min(doc.length,this.detailScrollY+room)}/${doc.length}`,{fg:K.ACCENT,bg:T.BG2});}
+    screen.hline(this.x+1,this.x+this.w-2,actionTop-1,"─",{fg:T.BORDER2,bg:T.BG2});screen.text(this.x+3,actionTop-1," 回答（↑/↓ 选择） ",{fg:K.ACCENT,bg:T.BG2});
+    ly=actionTop;
     this.optionRows = []; this.optionHitboxes = [];
-    for (let i = 0; i < opts.length && ly < this.y + this.h - 3; i++) {
+    for (let i = 0; i < opts.length; i++) {
       this.optionRows[i] = ly;
       const chosen = draft.selected.includes(opts[i].label);
       const cursor = this.selIdx === i;
       const glyph = q.multiSelect ? (chosen ? "☑" : "☐") : (chosen ? "●" : "○");
       const optionText=truncate(` ${cursor ? "▸" : " "} ${glyph} ${opts[i].label}`, this.w - 6);
-      this.optionHitboxes[i]={x1:this.x+2,x2:this.x+2+strWidth(optionText)-1,y1:ly,y2:ly+(opts[i].description?1:0)};
+      const descLines=opts[i].description?wrapDisplayText(opts[i].description,this.w-10):[];
+      this.optionHitboxes[i]={x1:this.x+2,x2:this.x+2+strWidth(optionText)-1,y1:ly,y2:ly+descLines.length};
       screen.text(this.x + 2, ly++, optionText, { fg: cursor ? T.SELFG : K.TXT, bg: cursor ? T.MENUSEL : -1 });
-      if (opts[i].description && ly < this.y + this.h - 3) screen.text(this.x + 7, ly++, truncate(opts[i].description, this.w - 10), { fg: K.FAINT });
+      for(const line of descLines)screen.text(this.x+7,ly++,line,{fg:K.FAINT,bg:cursor?T.MENUSEL:-1});
     }
-    if (!this.planReview && ly < this.y + this.h - 3) {
+    if (!this.planReview) {
       this.optionRows[opts.length] = ly;
       const cursor = this.selIdx === opts.length;
       const customText=truncate(` ${cursor ? "▸" : " "} ✎ 输入自己的回答`, this.w - 6);
       this.optionHitboxes[opts.length]={x1:this.x+2,x2:this.x+2+strWidth(customText)-1,y1:ly,y2:ly};
       screen.text(this.x + 2, ly++, customText, { fg: cursor ? T.SELFG : K.ACCENT, bg: cursor ? T.MENUSEL : -1 });
-      if(ly<this.y+this.h-3){const chars=Array.from(draft.custom),shown=this.customEditing?[...chars.slice(0,this.customCursor),"▏",...chars.slice(this.customCursor)].join(""):draft.custom;const inputText=truncate(`   > ${shown||"在此输入…"}`,this.w-8);screen.text(this.x+2,ly++,inputText,{fg:this.customEditing?K.TXT:K.FAINT,bg:this.customEditing?T.BG2:-1});}
-      if(ly<this.y+this.h-3){this.optionRows[opts.length+1]=ly;const skip=this.selIdx===opts.length+1,skipText=` ${skip?"▸":" "} ↷ 跳过此问题`;this.optionHitboxes[opts.length+1]={x1:this.x+2,x2:this.x+2+strWidth(skipText)-1,y1:ly,y2:ly};screen.text(this.x+2,ly++,skipText,{fg:skip?T.SELFG:K.FAINT,bg:skip?T.MENUSEL:-1});}
+      {const chars=Array.from(draft.custom),shown=this.customEditing?[...chars.slice(0,this.customCursor),"▏",...chars.slice(this.customCursor)].join(""):draft.custom;const inputLines=wrapDisplayText(shown||"在此输入…",this.w-10).slice(-6);for(let i=0;i<inputLines.length;i++)screen.text(this.x+4,ly++,`${i===0?"> ":"  "}${inputLines[i]}`,{fg:this.customEditing?K.TXT:K.FAINT,bg:this.customEditing?T.BG2:-1});}
+      {this.optionRows[opts.length+1]=ly;const skip=this.selIdx===opts.length+1,skipText=` ${skip?"▸":" "} ↷ 跳过此问题`;this.optionHitboxes[opts.length+1]={x1:this.x+2,x2:this.x+2+strWidth(skipText)-1,y1:ly,y2:ly};screen.text(this.x+2,ly++,skipText,{fg:skip?T.SELFG:K.FAINT,bg:skip?T.MENUSEL:-1});}
     }
   }
 
@@ -2441,8 +2458,9 @@ export class QuestionPopup extends Popup {
   }
 
   onMouse(ev) {
-    if (this.planReview && (ev.kind === "wheel-up" || ev.kind === "wheel-down")) {
-      this.detailScrollY = Math.max(0, this.detailScrollY + (ev.kind === "wheel-up" ? -3 : 3));
+    if (ev.kind === "wheel-up" || ev.kind === "wheel-down") {
+      const max=Math.max(0,(this.detailTotal??0)-(this.detailPage??1));
+      this.detailScrollY = Math.max(0,Math.min(max,this.detailScrollY + (ev.kind === "wheel-up" ? -3 : 3)));
       this.app.redraw(); return true;
     }
     if (ev.kind === "press" && ev.button === 0) {
@@ -2469,14 +2487,16 @@ export class QuestionPopup extends Popup {
     const choices = count + (this.planReview ? 0 : 2);
     if (ev.type === "text") { if(this.customEditing||this.selIdx===count){this.customEditing=true;draft.selected=[];const chars=Array.from(draft.custom);chars.splice(this.customCursor,0,...Array.from(ev.text));draft.custom=chars.join("");this.customCursor+=Array.from(ev.text).length;draft.skipped=false;return true;} return false; }
     if (ev.type !== "key") return false;
-    if (this.planReview && ["pageup", "pagedown", "home", "end"].includes(ev.name)) {
-      const total = String(q?.detail ?? "").split("\n").length;
+    if (["pageup", "pagedown", "home", "end"].includes(ev.name)) {
+      const total=this.detailTotal??0,max=Math.max(0,total-this.detailPage);
       if (ev.name === "pageup") this.detailScrollY = Math.max(0, this.detailScrollY - this.detailPage);
-      else if (ev.name === "pagedown") this.detailScrollY = Math.min(Math.max(0, total - this.detailPage), this.detailScrollY + this.detailPage);
+      else if (ev.name === "pagedown") this.detailScrollY = Math.min(max, this.detailScrollY + this.detailPage);
       else if (ev.name === "home") this.detailScrollY = 0;
-      else this.detailScrollY = Math.max(0, total - this.detailPage);
+      else this.detailScrollY = max;
       this.app.redraw(); return true;
     }
+    if(!this.customEditing&&ev.ctrl&&ev.name==="up"){this.detailScrollY=Math.max(0,this.detailScrollY-this.detailPage);return true;}
+    if(!this.customEditing&&ev.ctrl&&ev.name==="down"){this.detailScrollY=Math.min(Math.max(0,(this.detailTotal??0)-this.detailPage),this.detailScrollY+this.detailPage);return true;}
     if(this.customEditing&&ev.name==="left"){this.customCursor=Math.max(0,this.customCursor-1);return true;}
     if(this.customEditing&&ev.name==="right"){this.customCursor=Math.min(Array.from(draft.custom).length,this.customCursor+1);return true;}
     if(this.customEditing&&ev.name==="home"){this.customCursor=0;return true;}
@@ -2538,13 +2558,14 @@ export class ApprovalPopup extends Popup {
     const maxW = Math.max(12, app.screen.w - 2);
     const w = Math.min(72, maxW);
     const command = app.chat?.toolCommandForCall?.(frame.callId) ?? null;
-    const lines = [
-      [{ t: ` ${frame.reason ?? `工具 ${frame.toolName ?? "tool"} 请求越权执行`}`, fg: K.WARN }],
-    ];
-    if (command) lines.push([{ t: " 将执行:", fg: K.DIM, underline: true }], ...String(command).split("\n").slice(0, 6).map((line) => [{ t: "  " + truncate(line, w - 4), fg: K.TXT }]));
+    const wrap=(value,width)=>{const out=[];for(const raw of String(value??"").split("\n")){const gs=graphemes(raw);let line="",used=0;for(const g of gs){const gw=graphemeWidth(g);if(used+gw>width&&line){out.push(line);line="";used=0;}line+=g;used+=gw;}out.push(line);}return out;};
+    const reason=frame.reason ?? `工具 ${frame.toolName ?? "tool"} 请求越权执行`;
+    const lines = [[{t:" 请求原因",fg:K.DIM,underline:true}],...wrap(reason,w-6).map(line=>[{t:`  ${line}`,fg:K.WARN}])];
+    if (command) lines.push([{ t: " 将执行", fg: K.DIM, underline: true }], ...wrap(command,w-6).map((line) => [{ t: "  " + line, fg: K.TXT }]));
+    lines.push([{t:" 导航：↑/↓ 逐行 · PgUp/PgDn 翻页 · 滚轮 · ←/→ 选择",fg:K.FAINT}]);
     super({
-      x: Math.max(0, Math.floor((app.screen.w - w) / 2)), y: Math.max(0, Math.floor(app.screen.h / 2) - 4),
-      w, h: Math.min(app.screen.h, command ? 10 : 7), title: "⚠ 工具需要授权",
+      x: Math.max(0, Math.floor((app.screen.w - w) / 2)), y: Math.max(0, Math.floor((app.screen.h - Math.min(app.screen.h - 2, Math.max(10, Math.min(24, lines.length + 4)))) / 2)),
+      w, h: Math.min(app.screen.h - 2, Math.max(10, Math.min(24, lines.length + 4))), title: "⚠ 工具需要授权 · 可滚动",
       lines,
       buttons: [
         { label: "允许一次", action: "allowed-once" },
@@ -3837,7 +3858,7 @@ export class App {
       if (ev.ctrl && ev.key === "t") { this.setMode("trajectory"); return; }
       if (ev.ctrl && ev.key === "e") { this.quickJumpStep(); return; }
       if (ev.ctrl && ev.key === "j") { this.showJobs(); return; }
-      if (ev.ctrl && ev.key === "u") { this.showQueue(); return; }
+      if (ev.ctrl && ev.key === "n") { this.showQueue(); return; }
       if (ev.ctrl && ev.key === "y") {
         const next = busyEnter() === "queue" ? "steer" : "queue";
         saveTuiConfig({ busyEnter: next });
@@ -4031,7 +4052,6 @@ export class App {
     if (rawGoal && !["complete", "completed", "cleared"].includes(rawGoal.phase)) {
       row0.left.push({ t: ` 🎯 ${truncate(rawGoal.objective ?? "目标", 14)} · Ctrl+G `, fg: T.SELFG, bg: T.WARN, bold: true });
     }
-    if (this.queueItems.length) row0.left.push({ t: ` ⏳队列 ${this.queueItems.length} (Ctrl+U) `, fg: T.SELFG, bg: T.WARN, bold: true });
     if (this.sidebarVisible) row0.left.push({ t: " " + truncate(t || "（未选择会话）", 40) + " ", fg: T.TXT, bg: T.STATUSBG });
     else row0.left.push({ t: " " + truncate(t || "（未选择会话）", 40) + " ", fg: T.TXT, bg: T.STATUSBG });
     if (cur?.running) row0.left.push({ t: " ●运行 ", fg: T.OK, bg: T.STATUSBG });
@@ -4118,6 +4138,7 @@ export class App {
       row2.left.push({ t: ` ${done}已完成${failed > 0 ? ` ${failed}失败` : ""} `, fg: done > 0 ? T.OK : T.FAINT, bg: T.STATUSBG });
       row2.left.push({ t: ` ${subStats.running > 0 ? `${subStats.running} 个子代理运行中` : "没有子代理运行"} ${subStats.completed}已完成 `, fg: subStats.running > 0 ? T.PURPLE : T.FAINT, bg: T.STATUSBG, bold: subStats.running > 0 });
       if (sub) row2.left.push({ t: ` 🛰 ${truncate(sub.label ?? sub.mode ?? "子代理", 20)} `, fg: T.PURPLE, bg: T.STATUSBG });
+      if(this.queueItems.length)row2.left.push({t:` 有${this.queueItems.length}条命令正在排队 Ctrl+N查看详情 `,fg:T.SELFG,bg:T.WARN,bold:true});
       row2.right.push({ t: " Ctrl+J 任务/子代理 ", fg: T.DIM, bg: T.STATUSBG });
       rows.push(row2);
     }

package/src/widgets.js

@@ -788,8 +788,8 @@ export class Popup extends Widget {
       }
       if (this.maxScroll() > 0) {
         // "↑N" / "↓N" overflow indicators on the border row
-        if (this.scrollY > 0) screen.text(this.x + this.w - 6, this.y, ` ↑${this.scrollY}`, { fg: T.ACCENT, bg: T.BG2 });
-        if (this.scrollY < this.maxScroll()) screen.text(this.x + this.w - 8, this.y + this.h - 1, ` ↓${this.maxScroll() - this.scrollY}`, { fg: T.ACCENT, bg: T.BG2 });
+        if (this.scrollY > 0) screen.text(this.x + this.w - 10, this.y, ` ↑ ${this.scrollY}/${this.lines.length}`, { fg: T.ACCENT, bg: T.BG2 });
+        if (this.scrollY < this.maxScroll()) screen.text(this.x + this.w - 12, this.y + this.h - 1, ` ↓ ${this.scrollY + this.contentRows()}/${this.lines.length}`, { fg: T.ACCENT, bg: T.BG2 });
       }
     } else {
       for (const line of this.lines) draw(line);
@@ -832,6 +832,8 @@ export class Popup extends Widget {
   onKey(ev) {
     if (ev.type !== "key") return false;
     if (this.scrollable) {
+      if (ev.name === "up") { this.scrollY = Math.max(0, this.scrollY - 1); return true; }
+      if (ev.name === "down") { this.scrollY = Math.min(this.maxScroll(), this.scrollY + 1); return true; }
       if (ev.name === "pgup") { this.scrollY = Math.max(0, this.scrollY - this.contentRows()); return true; }
       if (ev.name === "pgdn") { this.scrollY = Math.min(this.maxScroll(), this.scrollY + this.contentRows()); return true; }
     }