@noobdemon/noob-cli 1.13.1 → 1.13.3

package/src/tui.js

@@ -13,6 +13,20 @@ import { c } from './ui.js';
 const ESC = '\x1b';
 const ANSI_RE = /\x1b\[[0-9;?]*[ -/]*[@-~]/g;
 const visLen = (s) => s.replace(ANSI_RE, '').length;
+// Trích chuỗi mã ANSI còn "mở" tính tới cuối `text`: replay mọi SGR escape,
+// reset (\x1b[0m / \x1b[m) xoá sạch, mã khác tích luỹ. Trả về chuỗi để TÁI MỞ
+// màu ở đầu dòng wrap kế tiếp — chống mất màu khi soft-wrap cắt giữa vùng màu.
+function openAnsi(text) {
+  let codes = [];
+  const re = /\x1b\[[0-9;?]*[ -/]*[@-~]/g;
+  let m;
+  while ((m = re.exec(text))) {
+    const seq = m[0];
+    if (seq === '\x1b[0m' || seq === '\x1b[m') codes = [];
+    else codes.push(seq);
+  }
+  return codes.join('');
+}
 function readClipboardImageDataUrl() {
   if (process.platform !== 'win32') return null;
   try {
@@ -72,16 +86,20 @@ function softWrapLine(text, width) {
   if (visLen(text) <= width) return [close(text)];
   const lines = [];
   let remaining = text;
+  let carry = ''; // mã ANSI còn mở từ dòng trước → tái mở ở đầu dòng kế.
   while (remaining) {
-    if (visLen(remaining) <= width) {
-      lines.push(remaining);
+    const piece = carry + remaining;
+    if (visLen(piece) <= width) {
+      lines.push(piece);
       break;
     }
-    let cutPos = findVisPos(remaining, width);
+    let cutPos = findVisPos(remaining, width - visLen(carry));
     const slice = remaining.slice(0, cutPos);
     const lastSpace = slice.lastIndexOf(' ');
     if (lastSpace > width * 0.3) cutPos = lastSpace;
-    lines.push(remaining.slice(0, cutPos).trimEnd());
+    const head = remaining.slice(0, cutPos).trimEnd();
+    lines.push(carry + head);
+    carry = hasAnsi ? openAnsi(carry + head) : '';
     remaining = remaining.slice(cutPos).trimStart();
   }
   return lines.map(close);
@@ -97,17 +115,21 @@ function wrapText(text, width, maxLines) {
   // nằm ở đâu trong tổng stream.
   const lines = [];
   let remaining = text;
+  let carry = ''; // mã ANSI còn mở từ dòng trước → tái mở ở đầu dòng kế.
   while (remaining) {
-    if (visLen(remaining) <= width) {
-      lines.push(remaining);
+    const piece = carry + remaining;
+    if (visLen(piece) <= width) {
+      lines.push(piece);
       remaining = '';
       break;
     }
-    let cutPos = findVisPos(remaining, width);
+    let cutPos = findVisPos(remaining, width - visLen(carry));
     const slice = remaining.slice(0, cutPos);
     const lastSpace = slice.lastIndexOf(' ');
     if (lastSpace > width * 0.3) cutPos = lastSpace;
-    lines.push(remaining.slice(0, cutPos).trimEnd());
+    const head = remaining.slice(0, cutPos).trimEnd();
+    lines.push(carry + head);
+    carry = hasAnsi ? openAnsi(carry + head) : '';
     remaining = remaining.slice(cutPos).trimStart();
   }
   if (lines.length > maxLines) {
@@ -221,6 +243,8 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
   let frameTimer = null;
   let prevRows = 0;
   let drawn = false;
+  let lastUpBy = 0; // số dòng con trỏ nằm TRÊN dòng cuối đã vẽ (placeCursor set);
+  // eraseSeq dùng để biết con trỏ đang ở đâu mà nhảy lên đúng dòng đầu.
 
   let promptLabel = '';
   // Thanh nhập = mảng "ô" + con trỏ. Mỗi ô là 1 ký tự {c} hoặc 1 khối dán
@@ -288,18 +312,30 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
     return preview ? `[pasted ${x.lines} lines: "${preview}"]` : `[pasted ${x.lines} lines]`;
   };
   const fullText = () => cells.map(cellStr).join('');
-  const coloredInput = () =>
-    cells
-      .map((x) => {
-        if (x.image) return c.dim(imageLabel(x));
-        if (x.paste === undefined) return x.c;
-        const preview = pastePreview(x.paste);
-        const label = preview
-          ? `[pasted ${x.lines} lines: "${preview}"]`
-          : `[pasted ${x.lines} lines]`;
-        return c.dim(label);
-      })
-      .join('');
+  // Con trỏ ẢO: ô tại vị trí `cur` được đảo màu (reverse video \x1b[7m). Vẽ con
+  // trỏ trong CHÍNH text thay vì dựa con trỏ phần cứng → không phụ thuộc terminal
+  // có tôn trọng DECSCUSR / vẽ block-cursor đè sai ô hay không. cur == len → con
+  // trỏ sau ký tự cuối: đảo màu 1 space ở cuối.
+  const REV = `${ESC}[7m`;
+  const UNREV = `${ESC}[27m`;
+  const cellColored = (x) => {
+    if (x.image) return c.dim(imageLabel(x));
+    if (x.paste === undefined) return x.c;
+    const preview = pastePreview(x.paste);
+    const label = preview
+      ? `[pasted ${x.lines} lines: "${preview}"]`
+      : `[pasted ${x.lines} lines]`;
+    return c.dim(label);
+  };
+  const coloredInput = () => {
+    let out = '';
+    for (let i = 0; i < cells.length; i++) {
+      const rendered = cellColored(cells[i]);
+      out += i === cur ? `${REV}${rendered}${UNREV}` : rendered;
+    }
+    if (cur >= cells.length) out += `${REV} ${UNREV}`; // con trỏ ở cuối
+    return out;
+  };
 
   // Dựng thanh nhập + tính vị trí con trỏ trên màn (`cursorScreenCol` +
   // `cursorScreenRow`). Vừa khung → tô màu đầy đủ, 1 dòng. Tràn khung → soft-
@@ -308,6 +344,7 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
   // thêm "…".
   let cursorScreenCol = 0;
   let cursorScreenRow = 0;
+  let trailingRows = 0; // số dòng trang trí SAU bar (thanh chắn dưới); placeCursor nhảy lên qua chúng
   let barRows = 1; // số dòng bar hiện tại; cập nhật bởi renderBar. placeCursor
   // dùng để tính upBy — KHÔNG dùng totalRows (gồm cả top/menu
   // rows phía trên) vì sẽ kéo cursor lên quá cao, lần commit
@@ -377,7 +414,21 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
     cursorScreenCol = promptW + colInLine;
     barRows = lines.length;
 
-    return lines.map((l, i) => (i === 0 ? promptLabel : indent) + l).join('\n');
+    // Con trỏ ẢO cho nhánh wrap: chèn ô đảo màu (reverse video) tại `colInLine`
+    // của dòng `curLine`. Con trỏ ở cuối ô (colInLine == lineLen) → đảo màu 1
+    // space append; giữa dòng → đảo màu ký tự tại đó. KHÔNG dùng con trỏ phần
+    // cứng (đã ẩn suốt phiên) nên nhánh này PHẢI tự vẽ con trỏ, nếu không wrap
+    // sẽ mất con trỏ.
+    return lines
+      .map((l, i) => {
+        let body = l;
+        if (i === curLine) {
+          if (colInLine >= l.length) body = l + `${REV} ${UNREV}`;
+          else body = l.slice(0, colInLine) + `${REV}${l[colInLine]}${UNREV}` + l.slice(colInLine + 1);
+        }
+        return (i === 0 ? promptLabel : indent) + body;
+      })
+      .join('\n');
   }
   function topRow() {
     if (liveOut) {
@@ -521,13 +572,29 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
       if (top !== null) r.push(...top);
       for (const mr of menuRows()) r.push(mr);
     }
+    // Khung nhập: kẻ 2 thanh chắn (trên + dưới) quanh thanh nhập để khu gõ luôn
+    // rõ ràng, KỂ CẢ khi model đang chạy (rows() chạy cùng path busy/rảnh). Thanh
+    // chắn là dòng trang trí tĩnh — KHÔNG nằm trong barRows (renderBar set), nên
+    // placeCursor phải nhảy lên qua thanh chắn DƯỚI: cộng nó vào trailingRows.
+    const rule = c.dim('─'.repeat(Math.max(8, cols())));
     const bar = renderBar();
-    if (bar) r.push(...bar.split('\n'));
+    if (bar) {
+      r.push(rule); // thanh chắn TRÊN (phía trên bar — không ảnh hưởng cursor)
+      r.push(...bar.split('\n'));
+      r.push(rule); // thanh chắn DƯỚI
+      trailingRows = 1; // 1 dòng sau bar → placeCursor nhảy lên thêm 1
+    } else {
+      trailingRows = 0;
+    }
     return r;
   }
   function eraseSeq() {
     if (!drawn) return '\r';
-    return '\r' + (prevRows > 1 ? `${ESC}[${prevRows - 1}A` : '') + `${ESC}[J`;
+    // Sau lần vẽ trước, placeCursor đã đưa con trỏ về dòng nhập logic — nằm
+    // TRÊN dòng cuối cùng đã vẽ `lastUpBy` dòng (qua thanh chắn dưới + phần bar).
+    // Để về dòng ĐẦU rồi ESC[J xóa xuống, chỉ nhảy lên (prevRows-1) - lastUpBy.
+    const up = Math.max(0, prevRows - 1 - lastUpBy);
+    return '\r' + (up > 0 ? `${ESC}[${up}A` : '') + `${ESC}[J`;
   }
   // Sau khi vẽ xong các hàng, con trỏ đang ở CUỐI thanh (hàng cuối, cột cuối).
   // Đưa về đúng (row, col) của con trỏ logic: \r về cột 0 → đi lên `upBy` hàng
@@ -535,7 +602,11 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
   // upBy dùng `barRows` (số dòng BAR, set bởi renderBar) — KHÔNG dùng totalRows
   // (gồm cả top/menu rows phía trên bar) vì sẽ kéo cursor lên quá cao.
   const placeCursor = () => {
-    const upBy = barRows - 1 - cursorScreenRow;
+    // upBy: số dòng cần nhảy LÊN từ dòng cuối cùng đã vẽ về dòng con trỏ logic.
+    // Dòng cuối giờ là thanh chắn DƯỚI (trailingRows), nên cộng nó vào: nhảy qua
+    // thanh chắn rồi mới tính trong phạm vi bar như cũ.
+    const upBy = trailingRows + (barRows - 1 - cursorScreenRow);
+    lastUpBy = upBy; // ghi lại để eraseSeq lần sau biết con trỏ đang ở đâu
     let s = '\r';
     if (upBy > 0) s += `${ESC}[${upBy}A`;
     if (cursorScreenCol > 0) s += `${ESC}[${cursorScreenCol}C`;
@@ -543,7 +614,10 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
   };
   function draw() {
     const rs = rows(); // rows() → renderBar() cập nhật cursorScreenRow/Col + barRows
-    w(`${ESC}[?25l` + eraseSeq() + rs.join('\n') + placeCursor() + `${ESC}[?25h`);
+    // Con trỏ ảo (ô đảo màu trong coloredInput) là con trỏ DUY NHẤT — giữ con trỏ
+    // phần cứng ẩn (?25l) suốt phiên, không bật lại ở cuối frame. placeCursor vẫn
+    // đưa con trỏ phần cứng về dòng nhập để eraseSeq lần sau tính đúng vùng xóa.
+    w(`${ESC}[?25l` + eraseSeq() + rs.join('\n') + placeCursor());
     prevRows = rs.length;
     drawn = true;
   }
@@ -560,7 +634,8 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
     let s = `${ESC}[?25l` + eraseSeq();
     s += block;
     if (!block.endsWith('\n')) s += '\n';
-    s += rs.join('\n') + placeCursor() + `${ESC}[?25h`;
+    // Con trỏ ảo là con trỏ duy nhất — không bật con trỏ phần cứng ở cuối frame.
+    s += rs.join('\n') + placeCursor();
     w(s);
     prevRows = rs.length;
     drawn = true;
@@ -577,7 +652,27 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
     }
     liveOut = buf;
     if (done.length) commit(done.join('\n'));
-    else draw();
+    // Phần dở (chưa có \n) sống trong liveOut → topRow() đẩy nó lên TOP vùng vẽ
+    // lại mỗi frame. Nếu liveOut phình dài hơn 1 dòng terminal, wrapText cho nhiều
+    // dòng → tổng rows() cao dần, vượt chiều cao terminal → terminal CUỘN, prevRows
+    // không còn khớp vị trí vật lý con trỏ → eraseSeq lần kế xóa nhầm, bar (thanh
+    // chat) bị đẩy khuất/mất. Fix: khi liveOut tràn 1 dòng, FLUSH phần đã đầy dòng
+    // thành output vĩnh viễn (commit), chỉ giữ lại đuôi ngắn (< cols) trong liveOut.
+    else if (visLen(liveOut) > cols()) {
+      const w0 = cols();
+      const wrapped = softWrapLine(liveOut, w0);
+      // Giữ dòng cuối (đuôi đang gõ tiếp) trong liveOut, commit các dòng đã đầy.
+      const tail = wrapped[wrapped.length - 1];
+      const head = wrapped.slice(0, -1).join('\n');
+      if (head) {
+        liveOut = tail.replace(ANSI_RE, '');
+        commit(head);
+      } else {
+        draw();
+      }
+    } else {
+      draw();
+    }
   }
 
   // ----- bàn phím: paste (bracketed) + heuristic chunk nhiều dòng -----
@@ -941,7 +1036,9 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
       process.stdin.setEncoding('utf8');
       if (process.stdin.setRawMode) process.stdin.setRawMode(true);
       process.stdin.resume();
-      w(`${ESC}[?2004h`); // bật bracketed paste
+      // Bar cursor (DECSCUSR 6): vạch đứng hiển thị GIỮA hai ô, không đè màu lên
+      // ký tự như block cursor → tránh ảo giác '|a' (block phủ ô trống sau text).
+      w(`${ESC}[?2004h${ESC}[6 q`); // bật bracketed paste + bar cursor
       process.stdin.on('data', onData); // Shift+Tab (\x1b[Z) + mũi tên xử lý trong feedKeys
       // vá stdout: mọi output → commit phía trên thanh
       process.stdout.write = (chunk, enc, cb) => {
@@ -1046,7 +1143,9 @@ export function createTui({ onLine, onInterrupt, onEOF, onShiftTab, onCtrlT, com
       try {
         if (frameTimer) clearInterval(frameTimer);
         process.stdout.write = realWrite;
-        w(`${ESC}[?2004l${ESC}[?25h\n`);
+        // Tắt bracketed paste + reset cursor style về mặc định (DECSCUSR 0) +
+        // hiện con trỏ. Không reset → bar cursor dính lại ở shell sau khi thoát.
+        w(`${ESC}[?2004l${ESC}[0 q${ESC}[?25h\n`);
         if (process.stdin.setRawMode) process.stdin.setRawMode(false);
         process.stdin.pause();
       } catch {}