chocolatito-code 1.1.0 → 1.3.0

package/dist/ui/reasoningStream.js

@@ -1,5 +1,6 @@
 import chalk from "chalk";
 import process from "node:process";
+import { fijarSeccion, quitarSeccion, escribirEncimaDelPie } from "./pieFijo.js";
 /**
  * Lo que se ve mientras el modelo piensa.
  *
@@ -23,9 +24,17 @@ import process from "node:process";
  * que aparecia justo en las tareas largas -las que mas razonan- y nunca al
  * saludar.
  *
- * Ahora se resume: una sola linea que se reescribe sobre si misma diciendo
- * cuanto lleva pensando y en que anda. Cero avance de scroll, una escritura por
- * trozo recibido en vez de una por letra.
+ * Ahora se resume: una sola linea que dice cuanto lleva pensando y en que anda.
+ * Cero avance de scroll, una escritura por trozo recibido en vez de una por
+ * letra.
+ *
+ * DONDE VIVE ESA LINEA
+ *
+ * En el pie fijo, no en la fila actual. Antes se reescribia sobre si misma con
+ * `\r\x1b[2K`, que la ata a la fila donde nacio: al empezar a llegar la
+ * respuesta, el terminal desplaza y se la lleva hacia arriba. Es la "nubecita
+ * que sube con lo que me respondes". Entregandola al pie, se repinta abajo tras
+ * cada linea de respuesta y se queda quieta.
  *
  * Quien quiera verlo entero: CHOCOLATITO_RAZONAMIENTO=completo.
  */
@@ -56,7 +65,7 @@ export class ReasoningStream {
             this.caracteres = 0;
             this.cola = "";
             if (COMPLETO) {
-                process.stdout.write(`\n  ${chalk.bold.hex("#8B5CF6")("💭 Razonando:")}\n`);
+                escribirEncimaDelPie(`\n  ${chalk.bold.hex("#8B5CF6")("💭 Razonando:")}\n`);
             }
         }
         if (COMPLETO) {
@@ -87,22 +96,20 @@ export class ReasoningStream {
         }
         // Un solo write, y el color se aplica una vez al bloque entero en vez de a
         // cada letra: mismo resultado en pantalla, una fraccion de los bytes.
-        process.stdout.write(chalk.gray(salida));
+        escribirEncimaDelPie(chalk.gray(salida));
     }
     refrescar(forzar) {
         const ahora = Date.now();
         if (!forzar && ahora - this.ultimoRefresco < MS_ENTRE_REFRESCOS)
             return;
         this.ultimoRefresco = ahora;
-        if (!process.stdout.isTTY)
-            return;
         const segundos = Math.round((ahora - this.inicio) / 1000);
         const ancho = Math.max(20, (process.stdout.columns || 80) - 4);
         const cabeza = `  ${chalk.hex("#8B5CF6")("💭")} ${chalk.gray(`pensando… ${segundos}s`)}`;
         // La ultima frase a medias da una pista de por donde va sin contarlo todo.
         const pista = unaLinea(this.cola, Math.max(0, ancho - 24));
         const linea = pista ? `${cabeza} ${chalk.dim("·")} ${chalk.dim(pista)}` : cabeza;
-        process.stdout.write(`\r\x1b[2K${unaLinea(linea, ancho + 40)}`);
+        fijarSeccion("razonamiento", [linea]);
         this.lineaPintada = true;
     }
     flush() {
@@ -110,17 +117,20 @@ export class ReasoningStream {
             return;
         if (COMPLETO) {
             if (!this.atLineStart) {
-                process.stdout.write("\n");
+                escribirEncimaDelPie("\n");
                 this.atLineStart = true;
             }
-            process.stdout.write("\n");
+            escribirEncimaDelPie("\n");
             this.hasStarted = false;
             return;
         }
         const segundos = Math.max(1, Math.round((Date.now() - this.inicio) / 1000));
+        // Primero se quita la linea viva del pie y despues se escribe el resumen
+        // como texto permanente. Al reves, el resumen quedaria por encima de una
+        // linea de "pensando…" que ya no viene a cuento.
+        quitarSeccion("razonamiento");
         if (this.lineaPintada) {
-            // Se deja una sola linea de resumen donde estaba la que iba cambiando.
-            process.stdout.write(`\r\x1b[2K  ${chalk.hex("#8B5CF6")("💭")} ${chalk.gray(`pensó ${segundos}s`)}\n`);
+            escribirEncimaDelPie(`  ${chalk.hex("#8B5CF6")("💭")} ${chalk.gray(`pensó ${segundos}s`)}\n`);
         }
         this.lineaPintada = false;
         this.hasStarted = false;

package/dist/ui/salida.d.ts

@@ -0,0 +1,10 @@
+/** Pinta encima del terminal. En produccion es `process.stdout.write` y nada mas. */
+export declare function dibujar(texto: string): void;
+/**
+ * Desvia el dibujo. Con `null` vuelve al terminal.
+ *
+ * Solo lo usan las pruebas, y siempre devolviendolo en un `finally`: si se
+ * queda desviado, las pruebas que vengan detras dibujan en el vacio sin
+ * enterarse.
+ */
+export declare function redirigirDibujo(destino: ((texto: string) => void) | null): void;

package/dist/ui/salida.js

@@ -0,0 +1,50 @@
+import process from "node:process";
+/**
+ * Por donde sale lo que se pinta encima del terminal.
+ *
+ * Aqui va SOLO el dibujo que ocupa el terminal a la fuerza: el marco del
+ * prompt, los avisos que se escriben pisando la linea actual con \r y \x1b[2K.
+ * Un `console.log` normal no pasa por aqui y no tiene por que.
+ *
+ * POR QUE EXISTE
+ *
+ * `npm publish` corre `prepublishOnly` -> `npm test`, y las pruebas del teclado
+ * abren el prompt de verdad. Con un terminal delante, el prompt mueve el
+ * cursor, borra lineas y repinta su marco encima de la sesion de quien esta
+ * publicando. En un `npm publish` real se vio esto:
+ *
+ *     ❯ hola mundo
+ *     ↳ en cola: y ahora los tests
+ *
+ * El terminal dejaba de ser suyo y la publicacion no arrancaba. Hubo que
+ * publicar con --ignore-scripts, saltandose las 488 pruebas; una red de
+ * seguridad que hay que apagar para trabajar no es una red.
+ *
+ * POR QUE NO SE SILENCIA `process.stdout` DESDE FUERA
+ *
+ * Se intento de las dos formas y las dos rompen algo peor. `node --test`
+ * instrumenta process.stdout para asociar cada linea a la prueba que la
+ * produjo: al sustituir el objeto -o solo su `write`- las pruebas se ejecutan
+ * pero desaparecen del informe, sin fallar y sin dejar rastro. Medido: de 6
+ * pruebas pasaban a contarse 2, en verde. Una prueba que se evapora es peor que
+ * una que falla.
+ *
+ * Con un conducto propio, process.stdout no se toca nunca.
+ */
+let conducto = (texto) => {
+    process.stdout.write(texto);
+};
+/** Pinta encima del terminal. En produccion es `process.stdout.write` y nada mas. */
+export function dibujar(texto) {
+    conducto(texto);
+}
+/**
+ * Desvia el dibujo. Con `null` vuelve al terminal.
+ *
+ * Solo lo usan las pruebas, y siempre devolviendolo en un `finally`: si se
+ * queda desviado, las pruebas que vengan detras dibujan en el vacio sin
+ * enterarse.
+ */
+export function redirigirDibujo(destino) {
+    conducto = destino ?? ((texto) => { process.stdout.write(texto); });
+}

package/dist/ui/spinner.d.ts

@@ -6,19 +6,26 @@ export declare class DynamicSpinner {
     private isRunning;
     private prefix;
     tokenCount: number;
-    /** Lineas extra pintadas debajo del spinner en el ultimo tick. */
-    private extraRows;
     constructor(prefix?: string);
     start(initialPrefix?: string): void;
     private tick;
     /**
-     * Segunda linea con lo que el usuario esta escribiendo mientras se genera.
+     * `✳ Compactando historial… (3s · ↓ 1.2k tokens · esc para pausar)   ⇥ modo`
      *
-     * Antes el teclado se tragaba todo sin pintar nada y parecia que el terminal
-     * se habia colgado. Se dibuja debajo y el cursor vuelve arriba, para que el
-     * siguiente tick sobrescriba las dos lineas sin dejar rastro.
+     * El prefijo se pasaba en `start("Compactando historial")` y no se pintaba en
+     * ningun sitio: `tick()` usaba siempre los verbos rotatorios. Asi que las
+     * cuatro esperas con nombre propio -compactar, optimizar memoria, verificar-
+     * salian todas como "Rumiando…", indistinguibles de una peticion normal.
      */
-    private drawTypeAhead;
-    private clearExtraRows;
+    private lineaDelSpinner;
+    /**
+     * La barra de escribir, debajo del spinner.
+     *
+     * Antes solo aparecia si ya habias escrito algo, asi que mientras el agente
+     * trabajaba no habia ninguna senal de que se pudiera escribir: el teclado es
+     * del vigilante y lo tecleado se acumulaba a ciegas. Ahora la barra esta
+     * siempre, y es la misma que se ve al escribir el prompt.
+     */
+    private lineasDeEntrada;
     stop(): void;
 }

package/dist/ui/spinner.js

@@ -2,6 +2,22 @@ import chalk from "chalk";
 import process from "node:process";
 import { typedText, queuedCount } from "./typeAhead.js";
 import { modeBadge } from "./modes.js";
+import { fijarSecciones } from "./pieFijo.js";
+/**
+ * LA LINEA QUE DICE QUE ESTO SIGUE VIVO
+ *
+ * Antes se pintaba con `\r\x1b[2K` sobre la fila donde estuviera el cursor. Eso
+ * la deja clavada a esa fila, y en cuanto la respuesta empieza a salir el
+ * terminal desplaza el contenido y se lleva el spinner hacia arriba con el.
+ * Palabras del usuario: "la nubecita y el rayito suben con lo que me respondes".
+ *
+ * Ahora se entrega a `pieFijo`, que la vuelve a pintar abajo despues de cada
+ * escritura. La linea deja de moverse aunque salgan cien lineas de respuesta.
+ *
+ * Y por eso mismo ya no hace falta pararlo al llegar el primer trozo: el
+ * contador de segundos y de tokens sigue a la vista MIENTRAS el modelo habla,
+ * que es justo cuando interesa saber cuanto lleva.
+ */
 const GLYPHS = ["✢", "✳", "∗", "✻", "✽"];
 const VERBS = [
     "Analizando",
@@ -15,6 +31,18 @@ const VERBS = [
     "Tejiendo",
     "Cocinando",
 ];
+const PISTA_VACIA = "escribe para encolar un mensaje…";
+function sinColores(texto) {
+    return texto.replace(/\x1b\[[0-9;]*m/g, "");
+}
+/** Deja las ULTIMAS `ancho` columnas: al escribir, lo que importa es el final. */
+function colaVisible(texto, ancho) {
+    if (ancho <= 0)
+        return "";
+    if (texto.length <= ancho)
+        return texto;
+    return `…${texto.slice(-(ancho - 1))}`;
+}
 export class DynamicSpinner {
     timer = null;
     glyphIdx = 0;
@@ -23,8 +51,6 @@ export class DynamicSpinner {
     isRunning = false;
     prefix = "";
     tokenCount = 0;
-    /** Lineas extra pintadas debajo del spinner en el ultimo tick. */
-    extraRows = 0;
     constructor(prefix = "") {
         this.prefix = prefix;
     }
@@ -37,7 +63,7 @@ export class DynamicSpinner {
         this.startTime = Date.now();
         this.glyphIdx = 0;
         this.verbIdx = 0;
-        this.extraRows = 0;
+        this.tick();
         this.timer = setInterval(() => {
             this.tick();
         }, 120);
@@ -47,55 +73,63 @@ export class DynamicSpinner {
             return;
         this.glyphIdx = (this.glyphIdx + 1) % GLYPHS.length;
         const elapsedSec = Math.floor((Date.now() - this.startTime) / 1000);
-        // Rotate verbs every 2.5 seconds
         this.verbIdx = Math.floor(elapsedSec / 2.5) % VERBS.length;
+        // Las dos juntas: por separado se repinta el bloque dos veces por tick.
+        fijarSecciones([
+            ["spinner", [this.lineaDelSpinner(elapsedSec)]],
+            ["entrada", this.lineasDeEntrada()],
+        ]);
+    }
+    /**
+     * `✳ Compactando historial… (3s · ↓ 1.2k tokens · esc para pausar)   ⇥ modo`
+     *
+     * El prefijo se pasaba en `start("Compactando historial")` y no se pintaba en
+     * ningun sitio: `tick()` usaba siempre los verbos rotatorios. Asi que las
+     * cuatro esperas con nombre propio -compactar, optimizar memoria, verificar-
+     * salian todas como "Rumiando…", indistinguibles de una peticion normal.
+     */
+    lineaDelSpinner(elapsedSec) {
+        const cols = Math.max(20, process.stdout.columns || 80);
         const glyph = chalk.hex("#D97757")(GLYPHS[this.glyphIdx]);
-        const verb = chalk.italic.hex("#D97757")(`${VERBS[this.verbIdx]}…`);
-        const timeStr = chalk.gray(`(${elapsedSec}s`);
-        const tokenStr = this.tokenCount > 0 ? chalk.gray(` · ↑ ${(this.tokenCount / 1000).toFixed(1)}k tokens`) : "";
-        const escStr = chalk.gray(` · esc para pausar)`);
+        const verbo = this.prefix || VERBS[this.verbIdx];
+        const verb = chalk.italic.hex("#D97757")(`${verbo}…`);
+        // El contador va hacia abajo: son los tokens que ESTAN LLEGANDO del modelo.
+        const tokenStr = this.tokenCount > 0 ? ` · ↓ ${(this.tokenCount / 1000).toFixed(1)}k tokens` : "";
+        const cola = chalk.gray(`(${elapsedSec}s${tokenStr} · esc para pausar)`);
+        const izquierda = `${glyph} ${verb} ${cola}`;
+        const anchoIzq = 1 + 1 + verbo.length + 1 + 1 + `(${elapsedSec}s${tokenStr} · esc para pausar)`.length;
+        // La chapa del modo se pega a la derecha, y solo si sobra sitio: antes se
+        // concatenaba siempre y en una consola estrecha empujaba la linea a una
+        // segunda fila, que es justo lo que descuadra el repintado.
         const badge = modeBadge();
-        const modeStr = badge ? `  ${badge}` : "";
-        this.clearExtraRows();
-        process.stdout.write(`\r\x1b[2K${glyph} ${verb} ${timeStr}${tokenStr}${escStr}${modeStr}`);
-        this.drawTypeAhead();
+        if (!badge)
+            return izquierda;
+        const anchoBadge = sinColores(badge).length;
+        const hueco = cols - anchoIzq - anchoBadge;
+        return hueco >= 2 ? `${izquierda}${" ".repeat(hueco)}${badge}` : izquierda;
     }
     /**
-     * Segunda linea con lo que el usuario esta escribiendo mientras se genera.
+     * La barra de escribir, debajo del spinner.
      *
-     * Antes el teclado se tragaba todo sin pintar nada y parecia que el terminal
-     * se habia colgado. Se dibuja debajo y el cursor vuelve arriba, para que el
-     * siguiente tick sobrescriba las dos lineas sin dejar rastro.
+     * Antes solo aparecia si ya habias escrito algo, asi que mientras el agente
+     * trabajaba no habia ninguna senal de que se pudiera escribir: el teclado es
+     * del vigilante y lo tecleado se acumulaba a ciegas. Ahora la barra esta
+     * siempre, y es la misma que se ve al escribir el prompt.
      */
-    drawTypeAhead() {
+    lineasDeEntrada() {
+        const cols = Math.max(20, process.stdout.columns || 80);
         const typing = typedText();
         const pendientes = queuedCount();
-        const rows = [];
-        if (typing.length > 0) {
-            rows.push(`${chalk.hex("#D97757")("❯")} ${chalk.white(typing)}${chalk.gray("  (enter para encolarlo)")}`);
-        }
+        const simbolo = chalk.bold.hex("#D97757")("❯");
+        const cuerpo = typing.length > 0
+            ? `${chalk.white(colaVisible(typing, cols - 3))}${chalk.hex("#D97757")("▌")}`
+            : chalk.gray(colaVisible(PISTA_VACIA, cols - 2));
+        const filas = [chalk.gray("─".repeat(cols)), `${simbolo} ${cuerpo}`];
         if (pendientes > 0) {
             const plural = pendientes === 1 ? "mensaje en cola" : "mensajes en cola";
-            rows.push(chalk.gray(`  ${pendientes} ${plural}; se enviará al terminar este turno`));
-        }
-        if (rows.length === 0) {
-            this.extraRows = 0;
-            return;
-        }
-        for (const row of rows) {
-            process.stdout.write(`\n\r\x1b[2K${row}`);
-        }
-        process.stdout.write(`\x1b[${rows.length}A\r`);
-        this.extraRows = rows.length;
-    }
-    clearExtraRows() {
-        if (this.extraRows === 0)
-            return;
-        for (let i = 0; i < this.extraRows; i++) {
-            process.stdout.write("\x1b[1B\r\x1b[2K");
+            filas.push(chalk.gray(`  ${pendientes} ${plural}; se enviará al terminar este turno`));
         }
-        process.stdout.write(`\x1b[${this.extraRows}A\r`);
-        this.extraRows = 0;
+        return filas;
     }
     stop() {
         if (!this.isRunning)
@@ -105,7 +139,11 @@ export class DynamicSpinner {
             clearInterval(this.timer);
             this.timer = null;
         }
-        this.clearExtraRows();
-        process.stdout.write("\r\x1b[2K");
+        // Las dos de golpe: quitarlas por separado deja un fotograma con la barra
+        // de escribir suelta y sin spinner encima.
+        fijarSecciones([
+            ["spinner", []],
+            ["entrada", []],
+        ]);
     }
 }