chocolatito-code 1.3.0 → 1.3.2

package/dist/ui/marco.d.ts

@@ -0,0 +1,35 @@
+export interface DropdownItem {
+    type: "command" | "file";
+    label: string;
+    secondary?: string;
+    insertText: string;
+}
+export interface PromptFrameOptions {
+    cols: number;
+    /** Alto de la ventana; sirve para no dibujar un marco que no quepa. */
+    rows?: number;
+    promptSymbol?: string;
+    input?: string;
+    cursorIndex?: number;
+    items?: DropdownItem[];
+    selectedIndex?: number;
+}
+export interface PromptFrame {
+    /** Lineas LOGICAS. Cualquiera puede ocupar mas de una fila fisica. */
+    lines: string[];
+    /** Filas de pantalla que ocupara el marco entero con este ancho. */
+    totalRows: number;
+    /** Fila fisica del cursor, con 0 en la primera fila del marco. */
+    cursorRow: number;
+    cursorCol: number;
+    /** Primer elemento del desplegable que se muestra (ventana deslizante). */
+    dropdownOffset: number;
+}
+/**
+ * Arma el marco del prompt y dice exactamente donde queda el cursor.
+ *
+ * Va aparte de render() por dos razones: se puede probar sin terminal, y la
+ * aritmetica de filas se hace UNA vez sobre las mismas lineas que se pintan, en
+ * lugar de estimarse por otro lado y descuadrarse.
+ */
+export declare function buildPromptFrame(opts: PromptFrameOptions): PromptFrame;

package/dist/ui/marco.js

@@ -0,0 +1,193 @@
+import chalk from "chalk";
+import { describeMode, getMode, TRIANGULOS } from "./modes.js";
+import { motorActual } from "./motorActual.js";
+/**
+ * EL MARCO DE LA BARRA, EN UN SOLO SITIO
+ *
+ * Vivia dentro de prompt.ts. Ahora lo necesitan dos: el prompt cuando espera una
+ * orden, y el spinner mientras el agente trabaja.
+ *
+ * POR QUE COMPARTIDO Y NO COPIADO
+ *
+ * Habia DOS barras distintas turnandose. Al esperar salia el marco entero
+ * -barra, entrada, barra, linea de ayuda-; al trabajar, una version recortada
+ * con otro texto. Se parecian lo justo para que el cambio de una a otra se viera
+ * como un salto, y el usuario lo dijo asi: "aun no es fija... debe ser fija y
+ * por debajo deben pasar los otros mensajes".
+ *
+ * Con el constructor compartido no pueden divergir: si alguien toca el marco, lo
+ * toca en los dos estados a la vez. Copiarlo habria durado hasta el primer
+ * retoque.
+ *
+ * Va aparte tambien por peso: prompt.ts arrastra readline, el historial en disco
+ * y el escaneo del proyecto, y el spinner no tiene por que cargar nada de eso.
+ */
+function stripAnsi(str) {
+    return str.replace(/\x1b\[[0-9;]*m/g, "");
+}
+const PLACEHOLDER = "Escribe una instrucción, '@' para archivos o '/' para comandos...";
+/**
+ * Filas FISICAS que ocupa una linea del marco.
+ *
+ * Aqui estaba el fallo de verdad: el repintado contaba elementos del array del
+ * marco mientras el terminal cuenta filas de pantalla. Cualquier linea que no
+ * cupiera en el ancho se partia en dos filas, el cursor subia una fila de menos
+ * y el marco entero se iba bajando, dejando una barra huerfana por pulsacion.
+ * La entrada ademas puede llevar saltos de linea dentro (continuacion con "\").
+ */
+function physicalRows(line, cols) {
+    return stripAnsi(line)
+        .split("\n")
+        .reduce((n, seg) => n + Math.max(1, Math.ceil(seg.length / cols)), 0);
+}
+/** Recorta a `width` columnas visibles. Texto sin pintar: aqui no hay que cerrar colores. */
+function truncatePlain(text, width) {
+    if (width <= 0)
+        return "";
+    if (text.length <= width)
+        return text;
+    return width <= 1 ? text.slice(0, width) : `${text.slice(0, width - 1)}…`;
+}
+/**
+ * Arma el marco del prompt y dice exactamente donde queda el cursor.
+ *
+ * Va aparte de render() por dos razones: se puede probar sin terminal, y la
+ * aritmetica de filas se hace UNA vez sobre las mismas lineas que se pintan, en
+ * lugar de estimarse por otro lado y descuadrarse.
+ */
+export function buildPromptFrame(opts) {
+    const cols = Math.max(20, opts.cols || 80);
+    const viewportRows = Math.max(6, opts.rows || 24);
+    const promptSymbol = opts.promptSymbol ?? "❯";
+    const input = opts.input ?? "";
+    const cursorIndex = Math.max(0, Math.min(opts.cursorIndex ?? input.length, input.length));
+    const items = opts.items ?? [];
+    const selectedIndex = items.length > 0 ? (((opts.selectedIndex ?? 0) % items.length) + items.length) % items.length : 0;
+    const isPlan = promptSymbol.includes("plan");
+    const symbolStr = isPlan
+        ? `${chalk.cyan.bold("plan ❯")} `
+        : `${chalk.bold.hex("#D97757")("❯")} `;
+    const symbolWidth = isPlan ? 7 : 2;
+    const bar = chalk.gray("─".repeat(cols));
+    // 1. Linea de entrada. Lo que el usuario escribe NO se recorta nunca: se deja
+    // que el terminal la parta y despues se cuentan las filas que ocupa.
+    let formattedInput;
+    if (input.length === 0) {
+        // La pista si se recorta: en una ventana estrecha ocupaba una segunda fila
+        // para no decir nada que el usuario no sepa ya.
+        formattedInput = chalk.gray(truncatePlain(PLACEHOLDER, cols - symbolWidth));
+    }
+    else if (input.startsWith("/")) {
+        const parts = input.split(" ");
+        const cmdPart = chalk.bold.hex("#A855F7")(parts[0]);
+        const restPart = parts.slice(1).join(" ");
+        formattedInput = restPart ? `${cmdPart} ${chalk.white(restPart)}` : cmdPart;
+    }
+    else {
+        formattedInput = input.replace(/(@[^\s]+)/g, (m) => chalk.bold.hex("#D97757")(m));
+    }
+    const inputLine = symbolStr + formattedInput;
+    const inputRows = physicalRows(inputLine, cols);
+    // 2. Desplegable. Un marco mas alto que la ventana obliga al terminal a
+    // desplazar el contenido, y a partir de ahi el repintado ya no sabe donde
+    // esta su primera fila: se muestra solo una ventana alrededor del elegido.
+    const room = Math.max(1, viewportRows - 1 - (1 + inputRows + 1 + 1));
+    const shown = Math.min(items.length, room);
+    const dropdownOffset = shown > 0 && items.length > shown
+        ? Math.min(Math.max(0, selectedIndex - Math.floor(shown / 2)), items.length - shown)
+        : 0;
+    const dropdownLines = [];
+    for (let i = dropdownOffset; i < dropdownOffset + shown; i++) {
+        const item = items[i];
+        const isSelected = i === selectedIndex;
+        const colorHex = item.type === "file" ? "#D97757" : "#A855F7";
+        const pointer = isSelected ? chalk.bold.hex(colorHex)(" ❯ ") : chalk.gray("   ");
+        // El puntero se lleva 3 columnas fijas. De lo que queda manda la etiqueta:
+        // la descripcion es lo primero que se cae, porque una ruta a medias no se
+        // puede ni leer ni elegir.
+        const free = cols - 3;
+        const label = truncatePlain(item.label, free);
+        const roomForDesc = free - label.length - 2;
+        const secondary = item.secondary && roomForDesc >= 8 ? truncatePlain(item.secondary, roomForDesc) : "";
+        const paintedLabel = isSelected ? chalk.bold.white(label) : chalk.hex(colorHex)(label);
+        const paintedDesc = secondary
+            ? isSelected
+                ? chalk.whiteBright(`  ${secondary}`)
+                : chalk.gray(`  ${secondary}`)
+            : "";
+        dropdownLines.push(`${pointer}${paintedLabel}${paintedDesc}`);
+    }
+    // 3. Pie de estado. El relleno se calculaba con Math.max(1, ...): cuando no
+    // cabia, en vez de recortarse se quedaba con un espacio y la linea salia MAS
+    // 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());
+    // 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.
+    const enginePlain = motorActual();
+    const hintPlain = "shift+tab cambia · esc cancela · ? /help";
+    const modeTag = chalk.hex(modeLook.color)(modePlain);
+    const engine = 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;
+    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 (huecoConPista >= 1) {
+        footerLine = `${modeTag} ${chalk.gray(hintPlain)}${" ".repeat(huecoConPista)}${engine}`;
+    }
+    else if (hueco >= 1) {
+        footerLine = `${modeTag}${" ".repeat(hueco)}${engine}`;
+    }
+    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, util));
+    }
+    const lines = [bar, inputLine, ...dropdownLines, bar, footerLine];
+    // 4. Donde queda el cursor, en filas fisicas. Antes se hacia cursorCol =
+    // total % cols: aplicaba el modulo pero nunca sumaba la fila, asi que en
+    // cuanto la entrada se partia el acento se iba a escribir a otra linea.
+    const typed = input.length === 0 ? "" : input.slice(0, cursorIndex);
+    const segments = typed.split("\n");
+    let cursorRow = physicalRows(bar, cols);
+    for (let i = 0; i < segments.length - 1; i++) {
+        cursorRow += Math.max(1, Math.ceil(((i === 0 ? symbolWidth : 0) + segments[i].length) / cols));
+    }
+    const lastSegWidth = (segments.length === 1 ? symbolWidth : 0) + segments[segments.length - 1].length;
+    cursorRow += Math.floor(lastSegWidth / cols);
+    const cursorCol = lastSegWidth % cols;
+    const totalRows = lines.reduce((n, l) => n + physicalRows(l, cols), 0);
+    return { lines, totalRows, cursorRow, cursorCol, dropdownOffset };
+}

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,28 @@
+/**
+ * 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): void;
+/**
+ * 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,34 @@
+/**
+ * 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 = "";
+/** Lo pone index.ts al arrancar y cada vez que se cambia de motor. */
+export function fijarMotor(nuevo) {
+    if (nuevo && nuevo.trim())
+        nombre = nuevo.trim();
+}
+/**
+ * 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.d.ts

@@ -1,47 +1,10 @@
+export { buildPromptFrame } from "./marco.js";
+export type { DropdownItem, PromptFrame, PromptFrameOptions } from "./marco.js";
+export { SLASH_COMMANDS } from "./comandos.js";
+export type { SlashCommandItem } from "./comandos.js";
 /**
  * Imprime sin romper el prompt. Uselo en vez de `console.log` para todo lo que
  * pueda llegar TARDE: conexiones en segundo plano, avisos, temporizadores.
  */
 export declare function imprimirSobreElPrompt(texto: string): void;
-export interface SlashCommandItem {
-    name: string;
-    description: string;
-    args?: string;
-}
-export declare const SLASH_COMMANDS: SlashCommandItem[];
-export interface DropdownItem {
-    type: "command" | "file";
-    label: string;
-    secondary?: string;
-    insertText: string;
-}
-export interface PromptFrameOptions {
-    cols: number;
-    /** Alto de la ventana; sirve para no dibujar un marco que no quepa. */
-    rows?: number;
-    promptSymbol?: string;
-    input?: string;
-    cursorIndex?: number;
-    items?: DropdownItem[];
-    selectedIndex?: number;
-}
-export interface PromptFrame {
-    /** Lineas LOGICAS. Cualquiera puede ocupar mas de una fila fisica. */
-    lines: string[];
-    /** Filas de pantalla que ocupara el marco entero con este ancho. */
-    totalRows: number;
-    /** Fila fisica del cursor, con 0 en la primera fila del marco. */
-    cursorRow: number;
-    cursorCol: number;
-    /** Primer elemento del desplegable que se muestra (ventana deslizante). */
-    dropdownOffset: number;
-}
-/**
- * Arma el marco del prompt y dice exactamente donde queda el cursor.
- *
- * Va aparte de render() por dos razones: se puede probar sin terminal, y la
- * aritmetica de filas se hace UNA vez sobre las mismas lineas que se pintan, en
- * lugar de estimarse por otro lado y descuadrarse.
- */
-export declare function buildPromptFrame(opts: PromptFrameOptions): PromptFrame;
 export declare function askInteractivePrompt(promptSymbol?: string, cwd?: string): Promise<string>;

package/dist/ui/prompt.js

@@ -4,12 +4,21 @@ import fs from "node:fs";
 import path from "node:path";
 import os from "node:os";
 import chalk from "chalk";
-import { cycleMode, describeMode, getMode } from "./modes.js";
+import { cycleMode } from "./modes.js";
 import { releaseKeyboard, tomarTecladoParaPrompt, devolverTecladoDelPrompt } from "./interrupt.js";
 import { repararTeclado, reafirmarModoCrudo, MS_ENTRE_COMPROBACIONES } from "./keyboardGuard.js";
 import { clearTyped } from "./typeAhead.js";
 import { dibujar } from "./salida.js";
-import { escribirEncimaDelPie, reiniciarPie } from "./pieFijo.js";
+// La lista vive en su propio modulo porque tambien la necesita el prompt de
+// sistema, y este archivo arrastra readline, el historial y el escaneo del
+// proyecto. Se re-exporta para no romper a quien ya la importaba de aqui.
+import { SLASH_COMMANDS } from "./comandos.js";
+// El marco lo comparten el prompt y el spinner: son la MISMA barra, no dos
+// que se parecen. Ver la nota de marco.ts.
+import { buildPromptFrame } from "./marco.js";
+export { buildPromptFrame } from "./marco.js";
+export { SLASH_COMMANDS } from "./comandos.js";
+import { escribirEncimaDelPie, soltarPie } from "./pieFijo.js";
 import { esGrande, guardarPegado, expandirPegados, marcaQueTerminaEn, limpiarPegados } from "./pegados.js";
 /**
  * Escribir algo mientras el prompt esta dibujado.
@@ -45,26 +54,6 @@ export function imprimirSobreElPrompt(texto) {
     // viven ahi. Un aviso que llegue tarde tiene que pasar por encima igual.
     escribirEncimaDelPie(texto.endsWith("\n") ? texto : `${texto}\n`);
 }
-export const SLASH_COMMANDS = [
-    { name: "/mcp", description: "Ver servidores MCP conectados y sus herramientas" },
-    { name: "/undo", description: "Deshacer las últimas modificaciones de archivos de la sesión" },
-    { name: "/export", description: "Exportar bitácora de la sesión a archivo Markdown", args: "[nombre.md]" },
-    { name: "/plan", description: "Alternar Modo Plan (solo lectura e investigación previa)" },
-    { name: "/resume", description: "Reanudar una sesión anterior guardada", args: "[id]" },
-    { name: "/skills", description: "Ver skills disponibles y cómo usarlos" },
-    { name: "/memory", description: "Consultar la memoria persistente transversal (~/.chocolatito/memory/)" },
-    { name: "/effort", description: "Regular potencia del motor (1.0, 1.5, 2.0, 2.5)", args: "[nivel]" },
-    { name: "/goal", description: "Ejecutar meta compleja autónoma con auto-corrección", args: "<meta>" },
-    { name: "/compact", description: "Comprimir contexto y optimizar memoria de la sesión" },
-    { name: "/diff", description: "Ver diferencias de código (Git diff) del proyecto" },
-    { name: "/commit", description: "Crear un commit en Git con mensaje semántico", args: "<mensaje>" },
-    { name: "/cd", description: "Cambiar el directorio de trabajo activo", args: "<ruta>" },
-    { name: "/cost", description: "Ver consumo detallado de tokens e inversión en USD" },
-    { name: "/clear", description: "Limpiar historial y reiniciar contexto" },
-    { name: "/init", description: "Crear archivo de directivas CHOCOLATITO.md" },
-    { name: "/help", description: "Mostrar guía completa de comandos y ayuda" },
-    { name: "/exit", description: "Cerrar sesión de Chocolatito Code" },
-];
 let isKeypressInitialized = false;
 /**
  * PEGADO DE VARIAS LINEAS
@@ -151,148 +140,18 @@ function scanProjectFiles(dir, maxResults = 40) {
     walk(dir);
     return results;
 }
-const PLACEHOLDER = "Escribe una instrucción, '@' para archivos o '/' para comandos...";
-/**
- * Filas FISICAS que ocupa una linea del marco.
- *
- * Aqui estaba el fallo de verdad: el repintado contaba elementos del array del
- * marco mientras el terminal cuenta filas de pantalla. Cualquier linea que no
- * cupiera en el ancho se partia en dos filas, el cursor subia una fila de menos
- * y el marco entero se iba bajando, dejando una barra huerfana por pulsacion.
- * La entrada ademas puede llevar saltos de linea dentro (continuacion con "\").
- */
-function physicalRows(line, cols) {
-    return stripAnsi(line)
-        .split("\n")
-        .reduce((n, seg) => n + Math.max(1, Math.ceil(seg.length / cols)), 0);
-}
-/** Recorta a `width` columnas visibles. Texto sin pintar: aqui no hay que cerrar colores. */
-function truncatePlain(text, width) {
-    if (width <= 0)
-        return "";
-    if (text.length <= width)
-        return text;
-    return width <= 1 ? text.slice(0, width) : `${text.slice(0, width - 1)}…`;
-}
-/**
- * Arma el marco del prompt y dice exactamente donde queda el cursor.
- *
- * Va aparte de render() por dos razones: se puede probar sin terminal, y la
- * aritmetica de filas se hace UNA vez sobre las mismas lineas que se pintan, en
- * lugar de estimarse por otro lado y descuadrarse.
- */
-export function buildPromptFrame(opts) {
-    const cols = Math.max(20, opts.cols || 80);
-    const viewportRows = Math.max(6, opts.rows || 24);
-    const promptSymbol = opts.promptSymbol ?? "❯";
-    const input = opts.input ?? "";
-    const cursorIndex = Math.max(0, Math.min(opts.cursorIndex ?? input.length, input.length));
-    const items = opts.items ?? [];
-    const selectedIndex = items.length > 0 ? (((opts.selectedIndex ?? 0) % items.length) + items.length) % items.length : 0;
-    const isPlan = promptSymbol.includes("plan");
-    const symbolStr = isPlan
-        ? `${chalk.cyan.bold("plan ❯")} `
-        : `${chalk.bold.hex("#D97757")("❯")} `;
-    const symbolWidth = isPlan ? 7 : 2;
-    const bar = chalk.gray("─".repeat(cols));
-    // 1. Linea de entrada. Lo que el usuario escribe NO se recorta nunca: se deja
-    // que el terminal la parta y despues se cuentan las filas que ocupa.
-    let formattedInput;
-    if (input.length === 0) {
-        // La pista si se recorta: en una ventana estrecha ocupaba una segunda fila
-        // para no decir nada que el usuario no sepa ya.
-        formattedInput = chalk.gray(truncatePlain(PLACEHOLDER, cols - symbolWidth));
-    }
-    else if (input.startsWith("/")) {
-        const parts = input.split(" ");
-        const cmdPart = chalk.bold.hex("#A855F7")(parts[0]);
-        const restPart = parts.slice(1).join(" ");
-        formattedInput = restPart ? `${cmdPart} ${chalk.white(restPart)}` : cmdPart;
-    }
-    else {
-        formattedInput = input.replace(/(@[^\s]+)/g, (m) => chalk.bold.hex("#D97757")(m));
-    }
-    const inputLine = symbolStr + formattedInput;
-    const inputRows = physicalRows(inputLine, cols);
-    // 2. Desplegable. Un marco mas alto que la ventana obliga al terminal a
-    // desplazar el contenido, y a partir de ahi el repintado ya no sabe donde
-    // esta su primera fila: se muestra solo una ventana alrededor del elegido.
-    const room = Math.max(1, viewportRows - 1 - (1 + inputRows + 1 + 1));
-    const shown = Math.min(items.length, room);
-    const dropdownOffset = shown > 0 && items.length > shown
-        ? Math.min(Math.max(0, selectedIndex - Math.floor(shown / 2)), items.length - shown)
-        : 0;
-    const dropdownLines = [];
-    for (let i = dropdownOffset; i < dropdownOffset + shown; i++) {
-        const item = items[i];
-        const isSelected = i === selectedIndex;
-        const colorHex = item.type === "file" ? "#D97757" : "#A855F7";
-        const pointer = isSelected ? chalk.bold.hex(colorHex)(" ❯ ") : chalk.gray("   ");
-        // El puntero se lleva 3 columnas fijas. De lo que queda manda la etiqueta:
-        // la descripcion es lo primero que se cae, porque una ruta a medias no se
-        // puede ni leer ni elegir.
-        const free = cols - 3;
-        const label = truncatePlain(item.label, free);
-        const roomForDesc = free - label.length - 2;
-        const secondary = item.secondary && roomForDesc >= 8 ? truncatePlain(item.secondary, roomForDesc) : "";
-        const paintedLabel = isSelected ? chalk.bold.white(label) : chalk.hex(colorHex)(label);
-        const paintedDesc = secondary
-            ? isSelected
-                ? chalk.whiteBright(`  ${secondary}`)
-                : chalk.gray(`  ${secondary}`)
-            : "";
-        dropdownLines.push(`${pointer}${paintedLabel}${paintedDesc}`);
-    }
-    // 3. Pie de estado. El relleno se calculaba con Math.max(1, ...): cuando no
-    // cabia, en vez de recortarse se quedaba con un espacio y la linea salia MAS
-    // 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);
-    const modeTag = chalk.hex(modeLook.color)(modePlain);
-    const engine = chalk.gray(enginePlain);
-    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}`;
-    }
-    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 (modePlain.length <= cols) {
-        footerLine = `${" ".repeat(cols - modePlain.length)}${modeTag}`;
-    }
-    else {
-        footerLine = chalk.hex(modeLook.color)(truncatePlain(modePlain, cols));
-    }
-    const lines = [bar, inputLine, ...dropdownLines, bar, footerLine];
-    // 4. Donde queda el cursor, en filas fisicas. Antes se hacia cursorCol =
-    // total % cols: aplicaba el modulo pero nunca sumaba la fila, asi que en
-    // cuanto la entrada se partia el acento se iba a escribir a otra linea.
-    const typed = input.length === 0 ? "" : input.slice(0, cursorIndex);
-    const segments = typed.split("\n");
-    let cursorRow = physicalRows(bar, cols);
-    for (let i = 0; i < segments.length - 1; i++) {
-        cursorRow += Math.max(1, Math.ceil(((i === 0 ? symbolWidth : 0) + segments[i].length) / cols));
-    }
-    const lastSegWidth = (segments.length === 1 ? symbolWidth : 0) + segments[segments.length - 1].length;
-    cursorRow += Math.floor(lastSegWidth / cols);
-    const cursorCol = lastSegWidth % cols;
-    const totalRows = lines.reduce((n, l) => n + physicalRows(l, cols), 0);
-    return { lines, totalRows, cursorRow, cursorCol, dropdownOffset };
-}
 export async function askInteractivePrompt(promptSymbol = "❯", cwd = process.cwd()) {
     return new Promise((resolve) => {
-        // A partir de aqui el terminal es del prompt, que lleva su propia cuenta de
-        // filas. El pie fijo tiene que olvidar la suya SIN borrar nada: lo que dejo
-        // en pantalla es respuesta del agente, no adorno. Y devuelve el cursor, que
-        // lo escondia mientras se repintaba.
-        reiniciarPie();
+        // El relevo de la barra.
+        //
+        // Mientras el agente trabajaba, el pie tenia pintado ESTE MISMO marco. Se
+        // borra -dejando el cursor justo donde empezaba- y acto seguido se dibuja
+        // aqui, en el mismo sitio y con el mismo contenido. Desde fuera la barra no
+        // se ha movido: no hay parpadeo ni salto, que era la queja.
+        //
+        // `soltarPie` y no `reiniciarPie`: hay que BORRAR lo que el pie tenia
+        // pintado. Olvidarlo sin borrar dejaria dos marcos, uno encima del otro.
+        soltarPie();
         let inputBuffer = "";
         let cursorIndex = 0;
         let selectedIndex = 0;
@@ -603,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/renderer.d.ts

@@ -5,6 +5,19 @@ export declare function renderToolError(name: string, errorSummary: string): voi
 export declare function renderDiff(filePath: string, diffText: string): void;
 export declare function renderReasoning(reasoningText: string): void;
 export declare function renderAssistantResponse(markdownText: string): void;
+/**
+ * La linea de cada turno.
+ *
+ * `⚡ 3.0s · 64 tokens salida (10.8k en caché) · Espectro 1.0 (Ágil) · 99%
+ *  contexto libre · 28% de la cuota semanal`
+ *
+ * Con cuenta gestionada NO lleva importe. Se quito primero de /cost y esta se
+ * quedo atras; el usuario lo vio enseguida -"aun sigue saliendo el precio que se
+ * gasta"- y con razon: /cost se mira cuando uno se acuerda, esta linea sale en
+ * TODOS los turnos. De los dos sitios, era el que mas importaba.
+ *
+ * Con clave propia si sale: ahi el dinero es del usuario y es su factura.
+ */
 export declare function renderFooter(costStr: string, outTokens: number, cachedTokens: number, modelName: string, durationMs?: number, contextPercent?: number, quotaStr?: string): void;
 export declare function renderError(message: string): void;
 export declare function formatToolName(name: string): string;