chocolatito-code 1.3.1 → 1.3.3

package/dist/index.js

@@ -13,6 +13,9 @@ import { buildSystemPrompt } from "./prompts/systemPrompt.js";
 import { AgentLoop } from "./agent/loop.js";
 import { codigoDeSalida, EXIT_OK, EXIT_FALLO, EXIT_USO, EXIT_LICENCIA } from "./agent/result.js";
 import { showBanner, animateStartupBanner, showHelp, showEffortMenu } from "./ui/banner.js";
+import { fijarMotor } from "./ui/motorActual.js";
+import { elegirDeLista } from "./ui/selector.js";
+import { reafirmarModoCrudo } from "./ui/keyboardGuard.js";
 import { askInteractivePrompt, SLASH_COMMANDS } from "./ui/prompt.js";
 import { changeDir } from "./tools/changeDir.js";
 import { gitDiff, gitCommit } from "./tools/gitTools.js";
@@ -233,6 +236,9 @@ ${nodeViejo}
     const sessionManager = new SessionManager();
     const sessionId = `session_${Date.now()}`;
     let currentModel = DEFAULT_ESPECTRO;
+    // La barra de estado lo lee de aqui. Fijarlo al arrancar y no solo al
+    // cambiarlo: si no, hasta el primer /effort la barra no dice nada.
+    fijarMotor(currentModel.name, currentModel.effortLevel);
     let isPlanMode = false;
     let systemPrompt = buildSystemPrompt(context, currentModel, skillManager, memoryManager, isPlanMode);
     const agent = new AgentLoop(apiKey, getEngineBaseUrl(), currentModel, systemPrompt);
@@ -429,6 +435,7 @@ ${sessionData}
                 const restauracion = prepararRestauracion(loaded, { cwd: agent.currentCwd, modelId: currentModel.id });
                 agent.currentCwd = restauracion.cwd;
                 currentModel = ESPECTRO_MODELS[restauracion.modelId] || currentModel;
+                fijarMotor(currentModel.name, currentModel.effortLevel);
                 const refreshedContext = await getProjectContext(agent.currentCwd);
                 systemPrompt = buildSystemPrompt(refreshedContext, currentModel, skillManager, memoryManager, isPlanMode);
                 agent.messages = [{ role: "system", content: systemPrompt }, ...restauracion.conversacion];
@@ -580,20 +587,57 @@ Directivas de ejecución:
         }
         if (trimmed.startsWith("/effort") || trimmed.startsWith("/espectro") || trimmed === "/model") {
             const parts = trimmed.split(/\s+/);
-            const targetId = parts[1]?.trim();
+            let targetId = parts[1]?.trim();
+            // Sin argumento se ABRE UN MENU, no se imprime una lista.
+            //
+            // Antes se volcaban las cuatro opciones con console.log y una frase al
+            // final que decia "selecciona con /effort 2.0". En pantalla se veia una
+            // lista, la gente pulsaba las flechas -que es lo unico razonable- y no
+            // pasaba nada.
             if (!targetId || !ESPECTRO_MODELS[targetId]) {
-                showEffortMenu(currentModel.id);
-            }
-            else {
-                currentModel = ESPECTRO_MODELS[targetId];
-                const refreshedContext = await getProjectContext(agent.currentCwd);
-                const updatedPrompt = buildSystemPrompt(refreshedContext, currentModel, skillManager, memoryManager, isPlanMode);
-                agent.setEspectroModel(currentModel, updatedPrompt);
-                console.log(chalk.green(`\n✔ Nivel actualizado a `) +
-                    chalk.bold.hex("#A855F7")(currentModel.name) +
-                    chalk.gray(` (${currentModel.effortLevel})`) +
-                    `\n  ${chalk.italic.gray(currentModel.description)}\n`);
+                const opciones = Object.values(ESPECTRO_MODELS).map((m) => ({
+                    id: m.id,
+                    titulo: `${m.name}  ${m.id === currentModel.id ? "· activo" : ""}`.trimEnd(),
+                    detalle: `Esfuerzo ${m.effortLevel} — ${m.description}`,
+                }));
+                const indiceActual = Object.values(ESPECTRO_MODELS).findIndex((m) => m.id === currentModel.id);
+                const elegido = await elegirDeLista("POTENCIA DEL MOTOR — CHOCOLATITO CODE", opciones, Math.max(0, indiceActual));
+                // Sin terminal el menu no puede abrirse: ahi se cae a la lista de
+                // siempre, que al menos dice como elegir escribiendolo.
+                if (elegido === null) {
+                    if (!process.stdin.isTTY)
+                        showEffortMenu(currentModel.id);
+                    continue;
+                }
+                targetId = elegido;
             }
+            currentModel = ESPECTRO_MODELS[targetId];
+            // Sin esto la barra de abajo sigue anunciando el motor anterior.
+            fijarMotor(currentModel.name, currentModel.effortLevel);
+            const refreshedContext = await getProjectContext(agent.currentCwd);
+            const updatedPrompt = buildSystemPrompt(refreshedContext, currentModel, skillManager, memoryManager, isPlanMode);
+            agent.setEspectroModel(currentModel, updatedPrompt);
+            console.log(chalk.green(`
+✔ Nivel actualizado a `) +
+                chalk.bold.hex("#A855F7")(currentModel.name) +
+                chalk.gray(` (${currentModel.effortLevel})`) +
+                `
+  ${chalk.italic.gray(currentModel.description)}
+`);
+            // EL TECLADO SE QUEDABA TRABADO AL CAMBIAR DE MOTOR
+            //
+            // "una vez cambiado de effort se queda trabado y con un enter se va la
+            // traba". Ese "con un enter se arregla" es la firma del modo COCIDO: la
+            // consola retiene lo tecleado hasta el salto de linea, asi que el prompt
+            // no recibe nada hasta que pulsas Enter.
+            //
+            // Aqui en medio se refresca el contexto del proyecto, que lanza git. Un
+            // hijo que hereda la consola puede devolverla en cocido al terminar, y
+            // Node no se entera: `process.stdin.isRaw` sigue diciendo true. Por eso el
+            // vigilante del prompt no lo arregla —solo actua cuando SABE que se
+            // perdio— y hace falta reafirmar, que pasa por false antes de poner true
+            // y por tanto no se lo come la cache de libuv.
+            reafirmarModoCrudo(process.stdin);
             continue;
         }
         if (trimmed === "/clear") {

package/dist/ui/marco.js

@@ -1,5 +1,6 @@
 import chalk from "chalk";
-import { describeMode, getMode } from "./modes.js";
+import { describeMode, getMode, TRIANGULOS } from "./modes.js";
+import { ESFUERZO_MAXIMO, esfuerzoActual, marcaDeMotor, motorActual } from "./motorActual.js";
 /**
  * EL MARCO DE LA BARRA, EN UN SOLO SITIO
  *
@@ -121,27 +122,67 @@ export function buildPromptFrame(opts) {
     // ancha que el terminal. En una consola de 80 columnas el pie media 87 y se
     // partia en dos filas desde el primer dibujado.
     const modeLook = describeMode(getMode());
-    const hintPlain = "? /help para atajos · shift+tab modo · esc cancelar";
-    const modePlain = `⇥ modo ${modeLook.label}`;
-    const enginePlain = "· Espectro 1.0 (Ágil)";
-    const hint = chalk.gray(hintPlain);
+    // 3. La linea de estado, con POSICIONES FIJAS.
+    //
+    // Antes iban los atajos a la izquierda y el modo y el motor apelotonados a la
+    // derecha, y encima la linea se reordenaba sola en cuatro variantes segun el
+    // ancho: al estrecharse la ventana, el modo saltaba de sitio. El usuario lo
+    // pidio asi: "el boton del modo debe ir a la izquierda... y el modelo a la
+    // derecha, pero deben ser fijos siempre y nunca cambiar".
+    //
+    // Ahora el modo esta SIEMPRE pegado a la izquierda y el motor SIEMPRE pegado a
+    // la derecha. Lo unico que aparece y desaparece es la pista del medio, que es
+    // lo prescindible: quien ya se sabe los atajos no la necesita, y quien no, la
+    // tiene en /help.
+    const modePlain = `${TRIANGULOS} modo ${modeLook.label}`;
+    // Estaba escrito a mano y por eso no cambiaba nunca. Vacio si nadie lo ha
+    // fijado: mejor un hueco que un nombre que no es el que se esta usando.
+    //
+    // El nivel de esfuerzo va PEGADO al motor y no en una linea aparte: es un dato
+    // del mismo hecho -con que potencia trabajas-, y una fila mas en el pie es una
+    // fila menos de conversacion en pantalla.
+    const nivel = esfuerzoActual();
+    const marca = marcaDeMotor(nivel);
+    const motor = motorActual();
+    const enginePlain = motor ? `${marca ? `${marca} ` : ""}${motor}${nivel ? ` · ${nivel}` : ""}` : "";
+    const hintPlain = "shift+tab cambia · esc cancela · ? /help";
     const modeTag = chalk.hex(modeLook.color)(modePlain);
-    const engine = chalk.gray(enginePlain);
+    // En el maximo se pinta encendido, no en gris: es el unico nivel que conviene
+    // que se note, porque es el que se come la cuota.
+    const engine = nivel === ESFUERZO_MAXIMO ? chalk.hex("#FFA500")(enginePlain) : chalk.gray(enginePlain);
+    // Dos columnas de respiro. Los triangulos son un glifo de anchura ambigua y
+    // hay terminales que lo pintan doble: si la linea llegara justa al ancho, el
+    // terminal la partiria en dos filas y el repintado del marco se descuadraria
+    // entero. Ese fallo ya costo una barra huerfana por pulsacion.
+    const util = Math.max(0, cols - 2);
     let footerLine;
-    if (hintPlain.length + 1 + modePlain.length + 1 + enginePlain.length <= cols) {
-        const padLen = cols - hintPlain.length - modePlain.length - 1 - enginePlain.length;
-        footerLine = `${hint}${" ".repeat(padLen)}${modeTag} ${engine}`;
+    const huecoConPista = util - modePlain.length - 1 - hintPlain.length - enginePlain.length;
+    const hueco = util - modePlain.length - enginePlain.length;
+    if (!enginePlain) {
+        // Todavia nadie ha dicho que motor hay. Se enseña el modo y ya, pero SIN
+        // saltarse el recorte: "⏵⏵ modo acepta ediciones" son 24 columnas y en una
+        // consola de 20 se partiria en dos filas, que es lo que descuadra el marco.
+        const conPista = util - modePlain.length - 1 - hintPlain.length;
+        if (modePlain.length > util) {
+            footerLine = chalk.hex(modeLook.color)(truncatePlain(modePlain, util));
+        }
+        else {
+            footerLine = conPista >= 0 ? `${modeTag} ${chalk.gray(hintPlain)}` : modeTag;
+        }
     }
-    else if (modePlain.length + 1 + enginePlain.length <= cols) {
-        // Los atajos son opcionales; el modo activo no, que es lo que decide si te
-        // van a preguntar antes de tocar tus archivos.
-        footerLine = `${" ".repeat(cols - modePlain.length - 1 - enginePlain.length)}${modeTag} ${engine}`;
+    else if (huecoConPista >= 1) {
+        footerLine = `${modeTag} ${chalk.gray(hintPlain)}${" ".repeat(huecoConPista)}${engine}`;
+    }
+    else if (hueco >= 1) {
+        footerLine = `${modeTag}${" ".repeat(hueco)}${engine}`;
     }
-    else if (modePlain.length <= cols) {
-        footerLine = `${" ".repeat(cols - modePlain.length)}${modeTag}`;
+    else if (modePlain.length <= util) {
+        // Si hay que sacrificar uno, se va el motor: el modo es lo que decide si te
+        // van a preguntar antes de tocar tus archivos.
+        footerLine = modeTag;
     }
     else {
-        footerLine = chalk.hex(modeLook.color)(truncatePlain(modePlain, cols));
+        footerLine = chalk.hex(modeLook.color)(truncatePlain(modePlain, util));
     }
     const lines = [bar, inputLine, ...dropdownLines, bar, footerLine];
     // 4. Donde queda el cursor, en filas fisicas. Antes se hacia cursorCol =

package/dist/ui/modes.d.ts

@@ -22,7 +22,15 @@ export interface ModeLook {
     color: string;
 }
 export declare function describeMode(mode?: InteractiveMode): ModeLook;
-/** Etiqueta de una linea para el pie del prompt y para el spinner. */
+/**
+ * El simbolo del modo.
+ *
+ * Dos triangulos, no la flecha de tabulacion. El "⇥" de antes es el simbolo del
+ * tabulador: dice COMO se cambia de modo, no QUE modo hay puesto. Y como ademas
+ * el atajo es shift+tab, se leia como si el modo fuera un atajo mas.
+ */
+export declare const TRIANGULOS = "\u23F5\u23F5";
+/** Etiqueta de una linea del modo activo. */
 export declare function modeBadge(mode?: InteractiveMode): string;
 /** Aviso completo, para cuando el usuario acaba de cambiar de modo. */
 export declare function modeAnnouncement(mode?: InteractiveMode): string;

package/dist/ui/modes.js

@@ -43,15 +43,23 @@ const LOOKS = {
 export function describeMode(mode = current) {
     return LOOKS[mode];
 }
-/** Etiqueta de una linea para el pie del prompt y para el spinner. */
+/**
+ * El simbolo del modo.
+ *
+ * Dos triangulos, no la flecha de tabulacion. El "⇥" de antes es el simbolo del
+ * tabulador: dice COMO se cambia de modo, no QUE modo hay puesto. Y como ademas
+ * el atajo es shift+tab, se leia como si el modo fuera un atajo mas.
+ */
+export const TRIANGULOS = "⏵⏵";
+/** Etiqueta de una linea del modo activo. */
 export function modeBadge(mode = current) {
     if (mode === "default")
         return "";
     const look = LOOKS[mode];
-    return chalk.hex(look.color)(`⇥ modo ${look.label}`);
+    return chalk.hex(look.color)(`${TRIANGULOS} modo ${look.label}`);
 }
 /** Aviso completo, para cuando el usuario acaba de cambiar de modo. */
 export function modeAnnouncement(mode = current) {
     const look = LOOKS[mode];
-    return `${chalk.bold.hex(look.color)(`⇥ modo ${look.label}`)} ${chalk.gray(`· ${look.hint}`)} ${chalk.gray("· shift+tab para cambiar")}`;
+    return `${chalk.bold.hex(look.color)(`${TRIANGULOS} modo ${look.label}`)} ${chalk.gray(`· ${look.hint}`)} ${chalk.gray("· shift+tab para cambiar")}`;
 }

package/dist/ui/motorActual.d.ts

@@ -0,0 +1,42 @@
+/**
+ * QUE MOTOR ESTA PUESTO
+ *
+ * La linea de estado del marco lo llevaba escrito a mano:
+ *
+ *     const enginePlain = "Espectro 1.0 (Ágil)";
+ *
+ * Asi que decia siempre lo mismo pasara lo que pasara. Cambiabas de motor con
+ * /effort, el agente empezaba a usar otro de verdad, y la barra seguia
+ * anunciando el primero. Lo vio el usuario: "al poner el modelo, la parte de
+ * abajo que es fija no se actualiza con el modelo que se pone".
+ *
+ * Un indicador que miente es peor que no tener indicador: te hace tomar
+ * decisiones -esperar mas, gastar mas- creyendo que estas en otro sitio.
+ *
+ * Vive aparte y no en el marco por lo mismo que el modo (ver modes.ts): lo
+ * escribe quien cambia de motor y lo lee quien pinta, y ninguno de los dos tiene
+ * por que conocer al otro.
+ */
+/** Lo pone index.ts al arrancar y cada vez que se cambia de motor. */
+export declare function fijarMotor(nuevo: string, nivel?: string): void;
+/** El nivel de esfuerzo activo ("Normal", "Alto", "Extendido", "Máximo"). */
+export declare function esfuerzoActual(): string;
+/** El nivel mas alto. Es el unico que se anuncia distinto. */
+export declare const ESFUERZO_MAXIMO = "M\u00E1ximo";
+/**
+ * La marca que precede al nombre del motor.
+ *
+ * Recibe el reloj en vez de leerlo: asi se puede comprobar fotograma a
+ * fotograma, que dentro de un terminal no se revisa a ojo.
+ *
+ * Cambia cada 180 ms, no cada 120 como el spinner. Dos cosas latiendo al mismo
+ * ritmo se leen como una sola parpadeando; a ritmos distintos se distinguen.
+ */
+export declare function marcaDeMotor(nivel?: string, ahora?: number): string;
+/**
+ * El nombre del motor activo.
+ *
+ * Vacio hasta que alguien lo fije. Quien pinta decide que hacer con eso: mejor
+ * no enseñar nada que enseñar un nombre inventado.
+ */
+export declare function motorActual(): string;

package/dist/ui/motorActual.js

@@ -0,0 +1,66 @@
+/**
+ * QUE MOTOR ESTA PUESTO
+ *
+ * La linea de estado del marco lo llevaba escrito a mano:
+ *
+ *     const enginePlain = "Espectro 1.0 (Ágil)";
+ *
+ * Asi que decia siempre lo mismo pasara lo que pasara. Cambiabas de motor con
+ * /effort, el agente empezaba a usar otro de verdad, y la barra seguia
+ * anunciando el primero. Lo vio el usuario: "al poner el modelo, la parte de
+ * abajo que es fija no se actualiza con el modelo que se pone".
+ *
+ * Un indicador que miente es peor que no tener indicador: te hace tomar
+ * decisiones -esperar mas, gastar mas- creyendo que estas en otro sitio.
+ *
+ * Vive aparte y no en el marco por lo mismo que el modo (ver modes.ts): lo
+ * escribe quien cambia de motor y lo lee quien pinta, y ninguno de los dos tiene
+ * por que conocer al otro.
+ */
+let nombre = "";
+let esfuerzo = "";
+/** Lo pone index.ts al arrancar y cada vez que se cambia de motor. */
+export function fijarMotor(nuevo, nivel = "") {
+    if (nuevo && nuevo.trim())
+        nombre = nuevo.trim();
+    if (nivel && nivel.trim())
+        esfuerzo = nivel.trim();
+}
+/** El nivel de esfuerzo activo ("Normal", "Alto", "Extendido", "Máximo"). */
+export function esfuerzoActual() {
+    return esfuerzo;
+}
+/** El nivel mas alto. Es el unico que se anuncia distinto. */
+export const ESFUERZO_MAXIMO = "Máximo";
+/**
+ * Los cuatro fotogramas del latido del maximo.
+ *
+ * Solo se anima el nivel mas alto, y a proposito: si parpadeara siempre seria
+ * ruido de fondo que se deja de ver a los dos minutos. Animando solo el maximo,
+ * el movimiento SIGNIFICA algo -"estas gastando el motor caro"- en vez de ser
+ * decoracion.
+ */
+const LATIDO = ["◇", "◈", "◆", "◈"];
+/**
+ * La marca que precede al nombre del motor.
+ *
+ * Recibe el reloj en vez de leerlo: asi se puede comprobar fotograma a
+ * fotograma, que dentro de un terminal no se revisa a ojo.
+ *
+ * Cambia cada 180 ms, no cada 120 como el spinner. Dos cosas latiendo al mismo
+ * ritmo se leen como una sola parpadeando; a ritmos distintos se distinguen.
+ */
+export function marcaDeMotor(nivel = esfuerzo, ahora = Date.now()) {
+    if (nivel !== ESFUERZO_MAXIMO)
+        return "";
+    return LATIDO[Math.floor(ahora / 180) % LATIDO.length];
+}
+/**
+ * El nombre del motor activo.
+ *
+ * Vacio hasta que alguien lo fije. Quien pinta decide que hacer con eso: mejor
+ * no enseñar nada que enseñar un nombre inventado.
+ */
+export function motorActual() {
+    return nombre;
+}

package/dist/ui/prompt.js

@@ -462,10 +462,28 @@ export async function askInteractivePrompt(promptSymbol = "❯", cwd = process.c
                     render();
                     return;
                 }
-                if (items.length > 0 && (inputBuffer === "/" || getAtMention().active)) {
-                    if (applySelectedDropdownItem()) {
+                // EL DESPLEGABLE MANDA SOBRE LO TECLEADO
+                //
+                // Antes esto solo entraba con el buffer EXACTAMENTE en "/". Si habias
+                // escrito "/e" y el desplegable te estaba señalando "/effort", el Enter
+                // enviaba "/e" tal cual: un comando que no existe, mientras en pantalla
+                // ponia otra cosa. Lo conto el usuario asi: "me recomienda effort pero
+                // al dar enter se manda como /e".
+                const mencionActiva = getAtMention().active;
+                const escribiendoComando = inputBuffer.startsWith("/") && !inputBuffer.includes(" ");
+                const soloLaBarra = inputBuffer === "/";
+                if (items.length > 0 && (escribiendoComando || mencionActiva)) {
+                    const elegido = items[selectedIndex];
+                    const yaEstaEntero = Boolean(elegido) && inputBuffer === elegido.insertText;
+                    if (!yaEstaEntero && applySelectedDropdownItem()) {
                         render();
-                        return;
+                        // Se completa Y SE ENVIA, que es lo que uno espera al ver el comando
+                        // señalado y pulsar Enter. Dos excepciones que solo completan:
+                        //  - una mencion de archivo casi siempre lleva mas texto detras;
+                        //  - con solo "/" escrito no has elegido nada todavia, y enviar ahi
+                        //    ejecutaria el primero de la lista sin querer.
+                        if (mencionActiva || soloLaBarra)
+                            return;
                     }
                 }
                 scheduleSubmit();

package/dist/ui/selector.d.ts

@@ -0,0 +1,37 @@
+/**
+ * UNA LISTA POR LA QUE SE PUEDE SUBIR Y BAJAR
+ *
+ * `/effort` no era un menu: era un `console.log` con las cuatro opciones y una
+ * frase al final que decia "selecciona con /effort 2.0". El usuario lo vio en
+ * pantalla como una lista, hizo lo unico razonable -pulsar las flechas- y no
+ * paso nada. Sus palabras: "me salen en pantalla los modelos pero no puedo
+ * subir y bajar entre ellos con las flechitas".
+ *
+ * Una lista que parece elegible y no lo es engaña dos veces: primero no
+ * funciona, y despues hay que leerse la letra pequeña para descubrir que habia
+ * que escribir el comando otra vez con un argumento.
+ *
+ * POR QUE NO SE REUTILIZO EL DIALOGO DE PERMISOS
+ *
+ * Hace lo mismo -flechas y Enter- pero tiene dentro toda la logica de aprobar,
+ * rechazar, recordar patrones y pedir explicacion por escrito. Sacar de ahi la
+ * parte de elegir habria sido tocar el camino por el que pasa CADA accion con
+ * consecuencias del agente, y por un menu que se abre de higos a brevas. Esto
+ * son sesenta lineas que no tocan nada de eso.
+ */
+export interface OpcionDeLista {
+    /** Lo que se devuelve al elegirla. */
+    id: string;
+    /** Primera linea, la que se lee. */
+    titulo: string;
+    /** Segunda linea en gris. Opcional. */
+    detalle?: string;
+}
+/**
+ * Enseña la lista y devuelve el id elegido. `null` si se sale con Esc.
+ *
+ * Sin terminal no hay nada que elegir: devuelve null en el acto en vez de
+ * quedarse esperando una tecla que no va a llegar nunca. Es lo que pasaria al
+ * correrlo desde un script o dentro de las pruebas.
+ */
+export declare function elegirDeLista(titulo: string, opciones: OpcionDeLista[], indiceInicial?: number): Promise<string | null>;

package/dist/ui/selector.js

@@ -0,0 +1,81 @@
+import chalk from "chalk";
+import process from "node:process";
+import readline from "node:readline";
+import { dibujar } from "./salida.js";
+/**
+ * Enseña la lista y devuelve el id elegido. `null` si se sale con Esc.
+ *
+ * Sin terminal no hay nada que elegir: devuelve null en el acto en vez de
+ * quedarse esperando una tecla que no va a llegar nunca. Es lo que pasaria al
+ * correrlo desde un script o dentro de las pruebas.
+ */
+export async function elegirDeLista(titulo, opciones, indiceInicial = 0) {
+    if (opciones.length === 0)
+        return null;
+    if (!process.stdin.isTTY)
+        return null;
+    return new Promise((resolve) => {
+        let elegido = Math.max(0, Math.min(indiceInicial, opciones.length - 1));
+        if (!readline.__choco_keypress) {
+            readline.emitKeypressEvents(process.stdin);
+            readline.__choco_keypress = true;
+        }
+        const eraCrudo = process.stdin.isRaw;
+        if (process.stdin.setRawMode)
+            process.stdin.setRawMode(true);
+        process.stdin.resume();
+        /** Filas del ultimo dibujo. Se repinta encima, sin dejar restos. */
+        let filas = 0;
+        function pintar() {
+            const lineas = ["", chalk.bold.hex("#E4CDEC")(titulo), ""];
+            opciones.forEach((o, i) => {
+                const puesto = i === elegido;
+                const punta = puesto ? chalk.bold.hex("#D97757")(" ❯ ") : "   ";
+                const nombre = puesto ? chalk.bold.white(o.titulo) : chalk.hex("#A855F7")(o.titulo);
+                lineas.push(`${punta}${nombre}`);
+                if (o.detalle)
+                    lineas.push(`     ${chalk.gray(o.detalle)}`);
+            });
+            lineas.push("", chalk.gray("   ↑↓ para moverte · enter para elegir · esc para salir"), "");
+            // Se sube justo lo que se escribio la vez anterior: ni una fila mas, ni
+            // una menos. Contar de mas se come la linea de encima.
+            const salida = (filas > 0 ? `\x1b[${filas}A` : "") + lineas.map((l) => `\r\x1b[2K${l}`).join("\n") + "\n";
+            dibujar(salida);
+            filas = lineas.length;
+        }
+        function terminar(valor) {
+            process.stdin.removeListener("keypress", alPulsar);
+            // Se devuelve el modo que habia, no se fuerza uno: si el prompt tenia el
+            // teclado en crudo y aqui se dejara en cocido, la sesion se queda sin
+            // poder escribir y no se sabe por que.
+            if (process.stdin.setRawMode)
+                process.stdin.setRawMode(eraCrudo || false);
+            resolve(valor);
+        }
+        function alPulsar(_str, key) {
+            if (!key)
+                return;
+            if (key.name === "up" || (key.name === "k" && !key.ctrl)) {
+                elegido = (elegido - 1 + opciones.length) % opciones.length;
+                pintar();
+            }
+            else if (key.name === "down" || (key.name === "j" && !key.ctrl)) {
+                elegido = (elegido + 1) % opciones.length;
+                pintar();
+            }
+            else if (key.name === "return" || key.name === "enter") {
+                terminar(opciones[elegido].id);
+            }
+            else if (key.name === "escape") {
+                terminar(null);
+            }
+            else if (key.ctrl && key.name === "c") {
+                // Ctrl+C aqui es "sal del menu", no "cierra el programa": estas
+                // eligiendo, no ejecutando nada.
+                terminar(null);
+            }
+        }
+        pintar();
+        process.stdin.on("keypress", alPulsar);
+    });
+}

package/dist/ui/spinner.js

@@ -1,7 +1,6 @@
 import chalk from "chalk";
 import process from "node:process";
 import { typedText, queuedCount } from "./typeAhead.js";
-import { modeBadge } from "./modes.js";
 import { fijarSecciones, quitarSeccion } from "./pieFijo.js";
 import { buildPromptFrame } from "./marco.js";
 /**
@@ -32,9 +31,6 @@ const VERBS = [
     "Tejiendo",
     "Cocinando",
 ];
-function sinColores(texto) {
-    return texto.replace(/\x1b\[[0-9;]*m/g, "");
-}
 export class DynamicSpinner {
     timer = null;
     glyphIdx = 0;
@@ -81,24 +77,17 @@ export class DynamicSpinner {
      * 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 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();
-        if (!badge)
-            return izquierda;
-        const anchoBadge = sinColores(badge).length;
-        const hueco = cols - anchoIzq - anchoBadge;
-        return hueco >= 2 ? `${izquierda}${" ".repeat(hueco)}${badge}` : izquierda;
+        // El modo YA NO va aqui. Vive en la linea de estado de la barra, que ahora
+        // es la misma en los dos estados: repetirlo era decir dos veces lo mismo en
+        // dos sitios que no siempre coincidian, y ademas obligaba a cuadrar anchos a
+        // mano justo en la linea mas propensa a partirse en dos filas.
+        return `${glyph} ${verb} ${cola}`;
     }
     /**
      * LA BARRA. La MISMA que se ve al escribir una orden, no una parecida.

package/extension/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "minimum_chrome_version": "102",
   "name": "Chocolatito Code",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "Deja que Chocolatito Code trabaje dentro de tu Chrome, en segundo plano y con tus sesiones ya iniciadas.",
   "permissions": [
     "tabs",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chocolatito-code",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "Agente autónomo de programación para la terminal, con control real del ordenador y del navegador. Desarrollado por Chocolatito.",
   "type": "module",
   "bin": {