@quatcode/agent 0.2.4 → 0.2.6

package/dist/tui.js

@@ -10,7 +10,7 @@ import { Picker } from "./picker.js";
 import { Screen } from "./screen.js";
 import { TurnController, fmtCost, fmtDuration, fmtTokens, toolArg, toolResultBlock } from "./turn.js";
 import { renderBanner } from "./logo.js";
-import { renderMarkdown } from "./markdown.js";
+import { renderMarkdown, wrapSegments } from "./markdown.js";
 import { ADD_PROVIDER, allProviders, buildProvider, defaultModelFor, effortsForModel, hasKey, keyEnvFor, probeProviderModels, providerEnvKey, providerHasModel, providerMeta, providerSlug, registerCustomProvider, removeCustomProvider, resolveProviderForModel, } from "./models.js";
 import { activeThemeId, bg, bold, buildColorRemap, clipAnsi, fg, getThemes, glyphs, padEndTo, palette, remapColors, setTheme, stringWidth, stripAnsi, tone, toolGlyph, } from "./theme.js";
 import { listSessionsForDir, loadConfig, makeSessionId, saveConfig, saveSession, deleteSession } from "./store.js";
@@ -136,6 +136,9 @@ class TuiApp {
     modeBadgeWidth = 0;
     modeBadgeHover = false;
     versionNotice = null;
+    bottomHintStart = -1;
+    bottomHintWidth = 0;
+    bottomHintRow = -1;
     constructor(options, input, output) {
         this.opts = options;
         this.dir = path.resolve(options.dir);
@@ -433,6 +436,11 @@ class TuiApp {
                 this.selection = null;
                 this.scheduleRender();
             }
+            if (key.type === "nav" && key.dir === "down" && key.ctrl) {
+                this.scrollOffset = 0;
+                this.scheduleRender();
+                continue;
+            }
             if (this.mode === "editing")
                 this.handleEditKey(key);
             else if (this.mode === "running")
@@ -735,16 +743,38 @@ class TuiApp {
         if (!rendered)
             return false;
         const top = this.lastHeaderRows + this.lastViewport + this.lastInputOffset;
-        const lineIndex = row - top;
-        if (lineIndex < 0 || lineIndex >= rendered.lines.length)
+        const rowIndex = row - top;
+        if (rowIndex < 0 || rowIndex >= rendered.lines.length)
+            return false;
+        const visual = rendered.rows[rowIndex];
+        if (!visual)
             return false;
-        const prefixWidth = rendered.prefixWidths[lineIndex] ?? 0;
-        const textCol = col - this.padX - prefixWidth;
-        const start = rendered.lineStarts[lineIndex] ?? 0;
-        this.buffer.setCursorFromDisplay(lineIndex, Math.max(0, textCol), start);
+        const textCol = col - this.padX - visual.prefixWidth;
+        this.buffer.setCursorFromDisplay(visual.line, Math.max(0, textCol), visual.start);
         this.scheduleRender();
         return true;
     }
+    bottomHintHit(row, col) {
+        if (this.bottomHintRow < 0 || this.bottomHintStart < 0)
+            return false;
+        if (row !== this.bottomHintRow)
+            return false;
+        const start = this.padX + this.bottomHintStart;
+        return col >= start && col < start + this.bottomHintWidth;
+    }
+    bottomRuleLine() {
+        const width = this.contentWidth();
+        const label = `${glyphs.arrowDown} bottom · ctrl+${glyphs.arrowDown}`;
+        this.bottomHintStart = -1;
+        this.bottomHintWidth = 0;
+        if (this.scrollOffset > 0 && this.mode !== "picker" && width > 36) {
+            const dashes = Math.max(8, width - 2 - stringWidth(label) - 2);
+            this.bottomHintStart = 2 + dashes + 2;
+            this.bottomHintWidth = stringWidth(label);
+            return `  ${tone.mist("─".repeat(dashes))}  ${tone.silver(label)}`;
+        }
+        return `  ${tone.mist("─".repeat(Math.max(8, width - 2)))}`;
+    }
     handleHover(row, col) {
         if (row === 1) {
             const hover = this.badgeHit(col);
@@ -791,6 +821,11 @@ class TuiApp {
             this.toggleMode();
             return;
         }
+        if (this.bottomHintHit(row, col)) {
+            this.scrollOffset = 0;
+            this.scheduleRender();
+            return;
+        }
         if (this.mode === "permission") {
             const index = this.permissionOptionAt(row, col);
             if (index !== null) {
@@ -1036,6 +1071,8 @@ class TuiApp {
         const viewport = Math.max(3, rows - header.length - footer.length - this.padTop - this.padBottom);
         this.lastHeaderRows = header.length + this.padTop;
         this.lastViewport = viewport;
+        this.bottomHintRow =
+            this.bottomHintStart >= 0 ? this.lastHeaderRows + viewport + footer.length - 1 : -1;
         let content;
         if (this.mode === "picker" && this.picker) {
             content = this.picker.render(this.contentWidth() - 2, viewport);
@@ -1099,7 +1136,14 @@ class TuiApp {
         this.modeBadgeWidth = stringWidth(badge);
         const left = `${before}  ${badge}`;
         const scrolled = this.scrollOffset > 0 ? tone.mist("↑ ") : "";
-        const right = `${scrolled}${tone.mist(`v${VERSION}`)}`;
+        const versionText = tone.mist(`v${VERSION}`);
+        const dirLabel = shortenHome(this.dir);
+        const reserve = stringWidth(left) + stringWidth(versionText) + stringWidth(scrolled) + 5;
+        const maxDir = Math.max(12, Math.min(48, width - reserve));
+        const dirText = stringWidth(dirLabel) > maxDir
+            ? `…${dirLabel.slice(-(maxDir - 1))}`
+            : dirLabel;
+        const right = `${scrolled}${tone.mist(dirText)}  ${versionText}`;
         const gap = Math.max(1, width - 2 - stringWidth(left) - stringWidth(right));
         return [
             `  ${left}${" ".repeat(gap)}${right}`,
@@ -1109,6 +1153,7 @@ class TuiApp {
     footerLines() {
         const width = this.contentWidth();
         const rule = `  ${tone.mist("─".repeat(Math.max(8, width - 2)))}`;
+        const bottom = this.bottomRuleLine();
         if (this.mode === "editing") {
             const rendered = this.buffer.render({
                 width,
@@ -1117,23 +1162,35 @@ class TuiApp {
                 mask: this.inputMask,
                 style: styleInputLine,
             });
-            this.lastInputRender = rendered;
+            const maxRows = Math.max(3, Math.floor(this.screen.rows / 2));
+            if (rendered.lines.length > maxRows) {
+                const start = Math.max(0, Math.min(rendered.cursorRow - maxRows + 1, rendered.lines.length - maxRows));
+                this.lastInputRender = {
+                    lines: rendered.lines.slice(start, start + maxRows),
+                    rows: rendered.rows.slice(start, start + maxRows),
+                    cursorRow: rendered.cursorRow - start,
+                    cursorCol: rendered.cursorCol,
+                };
+            }
+            else {
+                this.lastInputRender = rendered;
+            }
             const suggestions = this.suggestions();
             this.lastInputOffset = 1 + suggestions.length;
-            return [rule, ...suggestions, ...rendered.lines, rule];
+            return [rule, ...suggestions, ...this.lastInputRender.lines, bottom];
         }
         this.lastInputRender = null;
         if (this.status)
-            return [rule, this.statusLine(), rule];
+            return [rule, this.statusLine(), bottom];
         if (this.mode === "running") {
-            return [rule, `  ${tone.mist("// esc interrupts")}`, rule];
+            return [rule, `  ${tone.mist("// esc interrupts")}`, bottom];
         }
         if (this.mode === "permission")
-            return [rule, `  ${this.permissionHint}`, rule];
+            return [rule, `  ${this.permissionHint}`, bottom];
         if (this.mode === "picker" && this.picker) {
-            return [rule, this.picker.footer(this.picker.itemCount()), rule];
+            return [rule, this.picker.footer(this.picker.itemCount()), bottom];
         }
-        return [rule, `  ${tone.mist(`// ${shortenHome(this.dir)}`)}`, rule];
+        return [rule, "", bottom];
     }
     statusLine() {
         const spin = tone.accent(glyphs.spinner[this.spinnerFrame % glyphs.spinner.length] ?? "-");
@@ -1293,7 +1350,7 @@ class TuiApp {
             `${summary.fileCount} files`,
             summary.packageManager ?? "",
         ].filter(Boolean);
-        return tone.mist(parts.join(" · "));
+        return `${tone.mist(parts.join(" · "))}  ${tone.silver(shortenHome(this.dir))}`;
     }
     buildSystem(query) {
         if (!this.opts.context || !this.summary)
@@ -2680,6 +2737,7 @@ class TuiApp {
             ["sessions picker", "ctrl+r rename · ctrl+p pin · ctrl+d delete"],
             ["↑ ↓", "input history — previous / next message"],
             ["wheel", "scroll the conversation"],
+            ["ctrl+↓", "jump to the bottom of the chat (or click the ↓ button)"],
             ["ctrl+p/ctrl+n", "input history (same as ↑ ↓)"],
             ["tab / badge", "switch plan/build · click the header badge · complete commands"],
             ["ctrl+z", "undo the last message (works while thinking)"],
@@ -2698,13 +2756,23 @@ class TuiApp {
         this.append(lines);
     }
     userBlockLines(input, imageCount = 0) {
+        const width = Math.max(20, this.contentWidth() - 2);
         const lines = input.split("\n");
-        const head = `  ${tone.accent(glyphs.prompt)} ${bold(tone.bone(lines[0] ?? ""))}`;
-        const rest = lines.slice(1).map((line) => `    ${tone.bone(line)}`);
-        const images = imageCount > 0
-            ? [`    ${tone.mist(`[${imageCount} image${imageCount === 1 ? "" : "s"} attached]`)}`]
-            : [];
-        return [head, ...rest, ...images];
+        const out = [];
+        for (let index = 0; index < lines.length; index++) {
+            const line = lines[index];
+            if (line === "") {
+                out.push("");
+                continue;
+            }
+            const prefix = index === 0 ? `  ${tone.accent(glyphs.prompt)} ` : "    ";
+            const kind = index === 0 ? "bold" : "plain";
+            out.push(...wrapSegments([{ text: line, kind }], prefix, "    ", width));
+        }
+        if (imageCount > 0) {
+            out.push(`    ${tone.mist(`[${imageCount} image${imageCount === 1 ? "" : "s"} attached]`)}`);
+        }
+        return out;
     }
     async saveTurn(input, result, durationMs) {
         const cost = estimateCost(result.usage, this.model, this.providerId);