@xingjisoft/neutrino 0.1.0 → 0.1.2

package/dist/ui.js

@@ -70,25 +70,12 @@ export function wrapText(text, width) {
     }
     return lines;
 }
-export function drawInputBox(buf, x, y, w, value, cursorPos, opts = {}) {
-    const active = opts.active ?? true;
-    const dimmed = opts.dimmed ?? false;
-    const placeholder = opts.placeholder ?? "";
-    const h = 3;
-    const innerX = x + 2;
-    const innerW = w - 4;
-    const innerY = y + 1;
-    if (active)
-        buf.fillRect(x, y, w, h, { bg: C.highlightBg });
-    const textStyle = dimmed
-        ? { fg: C.dim, bg: C.highlightBg }
-        : active
-            ? { fg: C.white, bg: C.highlightBg }
-            : { fg: C.dim };
-    if (value.length === 0) {
-        buf.writeText(innerX, innerY, truncateByWidth(placeholder, innerW), textStylePlaceholder(active));
-        return;
-    }
+/**
+ * Compute which part of the input value is visible inside the box, given the
+ * cursor position. Shared by `drawInputBox` and mouse click handling so the
+ * rendered text and click-to-position-cursor always agree.
+ */
+export function computeInputWindow(value, cursorPos, innerW) {
     const chars = Array.from(value);
     const widths = chars.map((ch) => wcwidth(ch.codePointAt(0) ?? 0));
     const cursorCp = Math.min(Array.from(value.slice(0, cursorPos)).length, chars.length);
@@ -113,20 +100,99 @@ export function drawInputBox(buf, x, y, w, value, cursorPos, opts = {}) {
     let prefixW = 0;
     for (let i = 0; i < startCp; i++)
         prefixW += widths[i];
-    let endCp = chars.length;
+    let visibleCount = 0;
     let acc = 0;
     for (let i = startCp; i < chars.length; i++) {
-        if (acc + widths[i] > innerW) {
-            endCp = i;
+        if (acc + widths[i] > innerW)
             break;
-        }
         acc += widths[i];
+        visibleCount++;
+    }
+    return { startCp, prefixW, visibleCount };
+}
+/**
+ * Map a column inside the input box (0-based, relative to the inner area) to a
+ * cursor index in the full value.
+ */
+export function cursorFromColumn(value, col, win) {
+    const chars = Array.from(value);
+    if (col <= 0)
+        return win.startCp;
+    let acc = 0;
+    let i = win.startCp;
+    while (i < chars.length) {
+        const w = wcwidth(chars[i].codePointAt(0) ?? 0);
+        if (col < acc + w)
+            return i;
+        acc += w;
+        i++;
+    }
+    return i;
+}
+export function inRect(px, py, r) {
+    return px >= r.x && px < r.x + r.w && py >= r.y && py < r.y + r.h;
+}
+export function drawHint(buf, y, text) {
+    const max = buf.width;
+    const t = displayWidth(text) <= max ? text : truncateByWidth(text, max - 1) + "…";
+    buf.centerText(y, t, { fg: C.dim });
+}
+export function drawInputBox(buf, x, y, w, value, cursorPos, opts = {}) {
+    const active = opts.active ?? true;
+    const dimmed = opts.dimmed ?? false;
+    const placeholder = opts.placeholder ?? "";
+    const cursorOn = opts.cursorOn ?? true;
+    const h = 3;
+    const innerX = x + 2;
+    const innerW = w - 4;
+    const innerY = y + 1;
+    if (active)
+        buf.fillRect(x, y, w, h, { bg: C.highlightBg });
+    const textStyle = dimmed
+        ? { fg: C.dim, bg: C.highlightBg }
+        : active
+            ? { fg: C.white, bg: C.highlightBg }
+            : { fg: C.dim };
+    if (value.length === 0) {
+        buf.writeText(innerX, innerY, truncateByWidth(placeholder, innerW), textStylePlaceholder(active));
+        return;
     }
-    const visible = chars.slice(startCp, endCp).join("");
+    const win = computeInputWindow(value, cursorPos, innerW);
+    const chars = Array.from(value);
+    // Codepoint index of the cursor (cursorPos is a UTF-16 offset).
+    const cursorCp = Math.min(Array.from(value.slice(0, cursorPos)).length, chars.length);
+    const visible = chars.slice(win.startCp, win.startCp + win.visibleCount).join("");
     buf.writeText(innerX, innerY, visible, textStyle);
-    const cursorScreenCol = cursorCol - prefixW;
-    if (active && cursorScreenCol >= 0 && cursorScreenCol < innerW) {
-        buf.set(innerX + cursorScreenCol, innerY, " ", { fg: C.black, bg: C.accent });
+    // Blinking block cursor. While it is "on" the character underneath is drawn
+    // inside the block in the opposite colour so the text stays legible instead
+    // of being hidden by the cursor.
+    const cursorScreenCol = cursorColAt(chars, cursorCp, win);
+    if (active && cursorOn && cursorScreenCol >= 0 && cursorScreenCol < innerW) {
+        drawBlockCursor(buf, innerX + cursorScreenCol, innerY, chars, cursorCp, cursorScreenCol, innerW);
+    }
+}
+function cursorColAt(chars, cursorCp, win) {
+    let col = win.prefixW;
+    for (let i = win.startCp; i < cursorCp; i++) {
+        col += wcwidth(chars[i].codePointAt(0) ?? 0);
+    }
+    return col - win.prefixW;
+}
+/**
+ * Draw a single block cursor cell. The glyph under the cursor (the character
+ * immediately to its right) is rendered in the opposite colour — a dark glyph
+ * on the accent block — so it remains readable. Past the end of the text, or
+ * when the glyph would not fit, a solid block is drawn instead.
+ */
+function drawBlockCursor(buf, x, y, chars, cursorCp, col, innerW) {
+    const cursorStyle = { fg: C.black, bg: C.accent };
+    const ch = cursorCp < chars.length ? chars[cursorCp] : "";
+    const cw = ch ? wcwidth(ch.codePointAt(0) ?? 0) : 0;
+    if (ch && ch !== " " && cw >= 1 && col + cw <= innerW) {
+        buf.writeText(x, y, ch, cursorStyle);
+    }
+    else {
+        buf.set(x, y, " ", cursorStyle);
     }
 }
 function textStylePlaceholder(active) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xingjisoft/neutrino",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "XINGJI Neutrino - a CLI coding agent in the terminal.",
   "type": "module",
   "license": "Apache-2.0",
@@ -17,6 +17,7 @@
   },
   "scripts": {
     "build": "tsc -p tsconfig.json",
+    "test": "npm run build && node scripts/test-mouse.mjs && node scripts/test-cursor.mjs && node scripts/test-selection.mjs && node scripts/test-render.mjs",
     "prepare": "npm run build"
   },
   "keywords": [