chocolatito-code 1.5.0 → 1.6.0

package/dist/index.js

@@ -16,6 +16,7 @@ import { showBanner, animateStartupBanner, showHelp, showEffortMenu } from "./ui
 import { fijarMotor } from "./ui/motorActual.js";
 import { elegirDeLista } from "./ui/selector.js";
 import { entrarEnPantallaFija, pantallaFijaPedida } from "./ui/pantalla.js";
+import { montarArbol } from "./ui/ink/montarApp.js";
 import { reafirmarModoCrudo } from "./ui/keyboardGuard.js";
 import { askInteractivePrompt, SLASH_COMMANDS } from "./ui/prompt.js";
 import { changeDir } from "./tools/changeDir.js";
@@ -239,8 +240,13 @@ ${nodeViejo}
     // La barra de abajo solo puede quedarse clavada si el programa toma la
     // pantalla entera. Se pide con CHOCOLATITO_PANTALLA=fija y se paga con el
     // historial del terminal: ver ui/pantalla.ts.
-    if (pantallaFijaPedida())
+    if (pantallaFijaPedida()) {
         entrarEnPantallaFija();
+        // Entrar y empezar a dibujar son la misma decision: entrar sin montar el
+        // arbol deja una consola en blanco de la que solo se sale cerrando la
+        // ventana.
+        montarArbol();
+    }
     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.

package/dist/ui/ink/App.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+/**
+ * EL ÁRBOL ÚNICO
+ *
+ * POR QUE EXISTE
+ *
+ * Antes Ink solo era dueño del prompt: se montaba para pedir una orden y se
+ * desmontaba al enviarla. Mientras el agente trabajaba, el terminal volvía a ser
+ * de siempre y la barra de abajo la pintaba `pieFijo` borrando y repintando a
+ * mano.
+ *
+ * Eso son DOS dueños del mismo trozo de pantalla turnándose, y de ahí salían
+ * casi todas las quejas: la barra que sube con el scroll, el hueco que aparece,
+ * el marco que se descuadra. Cada arreglo era coordinar mejor a los dos dueños.
+ *
+ * Aquí hay uno solo, y vive toda la sesión. Lo que sale del agente entra en el
+ * historial (historial.ts) y se pinta arriba; abajo va SIEMPRE la barra, sea la
+ * de escribir o la de trabajar. Nadie tiene que ponerse de acuerdo con nadie.
+ *
+ * Y POR ESO LA BARRA SE QUEDA QUIETA
+ *
+ * No porque se repinte rápido, sino porque es la última fila de un árbol que
+ * ocupa la ventana entera. No hay nada que pueda moverla, ni la rueda del ratón.
+ */
+export declare function App(): React.ReactElement;

package/dist/ui/ink/App.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Box, Text, useStdout } from "ink";
+import { Prompt } from "./Prompt.js";
+import { alEscribir, tope, ventana } from "../historial.js";
+import { cuandoCambieElPie, lineasDelPie } from "../pieFijo.js";
+import { alCambiarElTurno, estadoDelTurno } from "./control.js";
+/**
+ * EL ÁRBOL ÚNICO
+ *
+ * POR QUE EXISTE
+ *
+ * Antes Ink solo era dueño del prompt: se montaba para pedir una orden y se
+ * desmontaba al enviarla. Mientras el agente trabajaba, el terminal volvía a ser
+ * de siempre y la barra de abajo la pintaba `pieFijo` borrando y repintando a
+ * mano.
+ *
+ * Eso son DOS dueños del mismo trozo de pantalla turnándose, y de ahí salían
+ * casi todas las quejas: la barra que sube con el scroll, el hueco que aparece,
+ * el marco que se descuadra. Cada arreglo era coordinar mejor a los dos dueños.
+ *
+ * Aquí hay uno solo, y vive toda la sesión. Lo que sale del agente entra en el
+ * historial (historial.ts) y se pinta arriba; abajo va SIEMPRE la barra, sea la
+ * de escribir o la de trabajar. Nadie tiene que ponerse de acuerdo con nadie.
+ *
+ * Y POR ESO LA BARRA SE QUEDA QUIETA
+ *
+ * No porque se repinte rápido, sino porque es la última fila de un árbol que
+ * ocupa la ventana entera. No hay nada que pueda moverla, ni la rueda del ratón.
+ */
+export function App() {
+    const { stdout } = useStdout();
+    const filas = Math.max(6, stdout?.rows || 24);
+    const [, setRedibujar] = useState(0);
+    const [subido, setSubido] = useState(0);
+    const [turno, setTurno] = useState(estadoDelTurno());
+    const repintar = () => setRedibujar((n) => n + 1);
+    // Tres fuentes de cambio, todas fuera de React: lo que escribe el agente, lo
+    // que publica el spinner, y el paso de "esperando orden" a "trabajando".
+    useEffect(() => alEscribir(repintar), []);
+    useEffect(() => cuandoCambieElPie(repintar), []);
+    useEffect(() => alCambiarElTurno((nuevo) => setTurno(nuevo)), []);
+    // Al empezar un turno se vuelve al final: lo interesante es lo que va a salir,
+    // no donde estabas mirando.
+    useEffect(() => {
+        if (turno.esperando)
+            return;
+        setSubido(0);
+    }, [turno.esperando]);
+    const barraDeTrabajo = turno.esperando ? [] : lineasDelPie();
+    const altoBarra = turno.esperando ? 0 : barraDeTrabajo.length;
+    const altoAviso = subido > 0 ? 1 : 0;
+    // Cuando espera orden, el hueco de abajo lo ocupa el prompt y su alto lo
+    // decide él; se le pasa cuánto sitio hay para lo de arriba.
+    const altoDelTexto = Math.max(1, filas - altoBarra - altoAviso - (turno.esperando ? 5 : 0));
+    const visible = ventana(altoDelTexto, subido);
+    const huecos = Math.max(0, altoDelTexto - visible.length);
+    return (_jsxs(Box, { flexDirection: "column", height: filas, children: [Array.from({ length: huecos }, (_, i) => (_jsx(Text, { children: " " }, `hueco-${i}`))), visible.map((linea, i) => (_jsx(Text, { children: linea }, `h-${i}`))), subido > 0 && (_jsx(Text, { dimColor: true, children: `  ↑ ${subido} lineas mas arriba · Av Pag para volver al final` })), turno.esperando ? (_jsx(Prompt, { alEnviar: turno.responder, alCancelar: () => turno.responder("/exit"), cwd: turno.cwd, promptSymbol: turno.promptSymbol, avisos: [], sinHistorial: true, alDesplazar: (cuanto) => setSubido((n) => Math.max(0, Math.min(tope(altoDelTexto), n + cuanto))) })) : (barraDeTrabajo.map((linea, i) => _jsx(Text, { children: linea }, `t-${i}`)))] }));
+}

package/dist/ui/ink/Prompt.d.ts

@@ -38,5 +38,13 @@ export interface PromptProps {
     promptSymbol: string;
     /** Mensajes que llegaron tarde y hay que dejar por encima del marco. */
     avisos: string[];
+    /**
+     * El historial lo pinta otro (el arbol de App). Aqui solo la barra.
+     *
+     * Sin esto se pintaria dos veces: una desde App y otra desde aqui.
+     */
+    sinHistorial?: boolean;
+    /** Re Pag / Av Pag cuando quien manda el scroll es el arbol de arriba. */
+    alDesplazar?: (cuanto: number) => void;
 }
-export declare function Prompt({ alEnviar, alCancelar, cwd, promptSymbol, avisos, }: PromptProps): React.ReactElement;
+export declare function Prompt({ alEnviar, alCancelar, cwd, promptSymbol, avisos, sinHistorial, alDesplazar, }: PromptProps): React.ReactElement;

package/dist/ui/ink/Prompt.js

@@ -9,7 +9,7 @@ import { alEscribir, tope, ventana } from "../historial.js";
 import { enPantallaFija } from "../pantalla.js";
 /** Marca del cursor. Ink esconde el de verdad, así que este se dibuja. */
 const CARET = "█";
-export function Prompt({ alEnviar, alCancelar, cwd, promptSymbol, avisos, }) {
+export function Prompt({ alEnviar, alCancelar, cwd, promptSymbol, avisos, sinHistorial = false, alDesplazar, }) {
     const { stdout } = useStdout();
     const { exit } = useApp();
     const [texto, setTexto] = useState("");
@@ -76,10 +76,18 @@ export function Prompt({ alEnviar, alCancelar, cwd, promptSymbol, avisos, }) {
         //
         // Solo Re Pag y Av Pag. Las flechas y los caracteres son para escribir:
         // robarselos aqui dejaria al usuario sin poder teclear.
-        if (fija && (tecla.pageUp || tecla.pageDown)) {
+        if (tecla.pageUp || tecla.pageDown) {
             const salto = Math.max(1, Math.floor(altoDelTexto / 2));
-            setSubido((n) => tecla.pageUp ? Math.min(tope(altoDelTexto), n + salto) : Math.max(0, n - salto));
-            return;
+            // Con el arbol de App al mando, el scroll lo lleva el: aqui no se sabe
+            // cuanto sitio hay arriba, porque el prompt es solo la parte de abajo.
+            if (alDesplazar) {
+                alDesplazar(tecla.pageUp ? salto : -salto);
+                return;
+            }
+            if (fija) {
+                setSubido((n) => tecla.pageUp ? Math.min(tope(altoDelTexto), n + salto) : Math.max(0, n - salto));
+                return;
+            }
         }
         // ------------------------------------------------------------- salir
         if (tecla.ctrl && entrada === "c") {
@@ -215,7 +223,7 @@ export function Prompt({ alEnviar, alCancelar, cwd, promptSymbol, avisos, }) {
             setElegido(0);
         }
     });
-    if (!fija) {
+    if (!fija || sinHistorial) {
         return (_jsxs(Box, { flexDirection: "column", children: [avisos.map((a, i) => (_jsx(Text, { children: a }, `aviso-${i}`))), marco.lines.map((linea, i) => (_jsx(Text, { children: linea }, i)))] }));
     }
     // PANTALLA FIJA: el arbol ocupa la ventana entera y la barra va la ultima, asi

package/dist/ui/ink/control.d.ts

@@ -0,0 +1,36 @@
+/**
+ * EL PUENTE ENTRE EL BUCLE Y EL ÁRBOL
+ *
+ * El programa es un `while` que espera: `const orden = await
+ * askInteractivePrompt()`. El árbol de Ink, en cambio, vive todo el rato y se
+ * limita a dibujar el estado que haya.
+ *
+ * Aquí se casan las dos formas. `pedirOrden()` marca "esperando", devuelve una
+ * promesa y se queda quieto; el componente pinta el prompt, y cuando el usuario
+ * envía, resuelve esa promesa y el estado vuelve a "trabajando". El bucle no se
+ * entera de nada: sigue teniendo una función que devuelve un texto.
+ *
+ * POR QUE NO SE MONTA Y DESMONTA EL ÁRBOL EN CADA VUELTA
+ *
+ * Es lo que se hacía antes, y era la causa de fondo: mientras el agente
+ * trabajaba no había árbol, así que la barra la pintaba otro por su cuenta. Dos
+ * dueños de la misma pantalla turnándose. Con el árbol siempre vivo hay uno.
+ */
+export interface EstadoDelTurno {
+    /** ¿Está el programa esperando que el usuario escriba? */
+    esperando: boolean;
+    cwd: string;
+    promptSymbol: string;
+    /** Lo llama el prompt al enviar. Fuera de "esperando" no hace nada. */
+    responder: (orden: string) => void;
+}
+export declare function estadoDelTurno(): EstadoDelTurno;
+export declare function alCambiarElTurno(cb: (e: EstadoDelTurno) => void): () => void;
+/**
+ * Pide una orden. Se resuelve cuando el usuario la envía.
+ *
+ * El guardián `entregado` no es paranoia: el componente puede llamar a
+ * `responder` desde dos caminos —enviar y cancelar— y resolver dos veces una
+ * promesa deja el bucle avanzando por su cuenta con una orden que nadie escribió.
+ */
+export declare function pedirOrden(promptSymbol: string, cwd: string): Promise<string>;

package/dist/ui/ink/control.js

@@ -0,0 +1,54 @@
+import process from "node:process";
+const TRABAJANDO = {
+    esperando: false,
+    cwd: process.cwd(),
+    promptSymbol: "❯",
+    responder: () => { },
+};
+let estado = TRABAJANDO;
+const oyentes = [];
+export function estadoDelTurno() {
+    return estado;
+}
+export function alCambiarElTurno(cb) {
+    oyentes.push(cb);
+    return () => {
+        const i = oyentes.indexOf(cb);
+        if (i >= 0)
+            oyentes.splice(i, 1);
+    };
+}
+function avisar() {
+    for (const cb of oyentes) {
+        try {
+            cb(estado);
+        }
+        catch { }
+    }
+}
+/**
+ * Pide una orden. Se resuelve cuando el usuario la envía.
+ *
+ * El guardián `entregado` no es paranoia: el componente puede llamar a
+ * `responder` desde dos caminos —enviar y cancelar— y resolver dos veces una
+ * promesa deja el bucle avanzando por su cuenta con una orden que nadie escribió.
+ */
+export function pedirOrden(promptSymbol, cwd) {
+    return new Promise((resolve) => {
+        let entregado = false;
+        estado = {
+            esperando: true,
+            cwd,
+            promptSymbol,
+            responder: (orden) => {
+                if (entregado)
+                    return;
+                entregado = true;
+                estado = TRABAJANDO;
+                avisar();
+                resolve(orden);
+            },
+        };
+        avisar();
+    });
+}

package/dist/ui/ink/montarApp.d.ts

@@ -0,0 +1,2 @@
+export declare function montarArbol(): void;
+export declare function desmontarArbol(): void;

package/dist/ui/ink/montarApp.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import process from "node:process";
+import { render } from "ink";
+import { App } from "./App.js";
+/**
+ * MONTA EL ÁRBOL Y LO DEJA VIVO TODA LA SESIÓN
+ *
+ * Va en su propio archivo por una razón práctica: `pantalla.ts` no puede montar
+ * JSX sin arrastrarse a sí mismo. `pantalla` → `App` → `Prompt` → `pantalla` es
+ * un ciclo, y los ciclos en ESM funcionan hasta que uno de los módulos necesita
+ * un valor del otro antes de tiempo, y entonces fallan de una forma que no se
+ * parece a su causa. Con el montaje aparte, `index.ts` llama a los dos y no hay
+ * ciclo.
+ *
+ * `exitOnCtrlC: false` porque Ctrl+C ya lo trata el prompt: dejar que Ink cierre
+ * el proceso por su cuenta se salta el guardado de la sesión.
+ */
+let arbol = null;
+export function montarArbol() {
+    if (arbol)
+        return;
+    arbol = render(_jsx(App, {}), { exitOnCtrlC: false });
+}
+export function desmontarArbol() {
+    if (!arbol)
+        return;
+    try {
+        arbol.unmount();
+    }
+    catch { }
+    arbol = null;
+}
+// Si el proceso muere sin pasar por la salida ordenada, el árbol tiene que
+// soltarse igual: un árbol vivo en un proceso que se cierra deja el terminal a
+// medio restaurar.
+process.on("exit", desmontarArbol);

package/dist/ui/ink/montarPrompt.js

@@ -7,6 +7,8 @@ import { expandirPegados, limpiarPegados } from "../pegados.js";
 import { apuntarEnHistorial } from "../entrada.js";
 import { soltarPie } from "../pieFijo.js";
 import { clearTyped } from "../typeAhead.js";
+import { enPantallaFija } from "../pantalla.js";
+import { pedirOrden } from "./control.js";
 /**
  * EL PUENTE ENTRE INK Y EL BUCLE DE SIEMPRE
  *
@@ -64,6 +66,16 @@ export async function preguntarConInk(promptSymbol = "❯", cwd = process.cwd())
     // pisan, y el que pierde deja filas huérfanas.
     soltarPie();
     limpiarRestos();
+    // Con el arbol unico montado, aqui no se monta ni se desmonta nada: solo se
+    // dice "estoy esperando" y el arbol pinta el prompt. Ver ink/control.ts.
+    if (enPantallaFija()) {
+        const orden = await pedirOrden(promptSymbol, cwd);
+        const entero = expandirPegados(orden);
+        if (entero.trim())
+            apuntarEnHistorial(entero);
+        limpiarPegados();
+        return entero;
+    }
     return new Promise((resolve) => {
         let entregado = false;
         let empujarAviso = null;

package/dist/ui/pantalla.d.ts

@@ -1,3 +1,15 @@
+/**
+ * Fija POR DEFECTO.
+ *
+ * Estuvo detras de un interruptor un dia, y fue un error: el usuario pidio
+ * cuatro veces que la caja no se moviera y lo que recibio fue una opcion que
+ * habia que acordarse de encender. Una funcion que hay que activar a mano es,
+ * para quien la pidio, una funcion que no esta.
+ *
+ * `CHOCOLATITO_PANTALLA=normal` devuelve el comportamiento de siempre: el
+ * historial vuelve a ser del terminal y la rueda del raton a servir, a cambio de
+ * que la barra suba con el scroll.
+ */
 export declare function pantallaFijaPedida(): boolean;
 /**
  * Enciende o apaga el modo a mano, SIN tocar el terminal.

package/dist/ui/pantalla.js

@@ -1,6 +1,7 @@
 import process from "node:process";
 import { redirigirDibujo } from "./salida.js";
 import { apuntar } from "./historial.js";
+import { habilitarPie } from "./pieFijo.js";
 /**
  * LA PANTALLA ALTERNATIVA
  *
@@ -30,8 +31,22 @@ const ENTRAR = "\x1b[?1049h";
 const SALIR = "\x1b[?1049l";
 let dentro = false;
 let logOriginal = null;
+/**
+ * Fija POR DEFECTO.
+ *
+ * Estuvo detras de un interruptor un dia, y fue un error: el usuario pidio
+ * cuatro veces que la caja no se moviera y lo que recibio fue una opcion que
+ * habia que acordarse de encender. Una funcion que hay que activar a mano es,
+ * para quien la pidio, una funcion que no esta.
+ *
+ * `CHOCOLATITO_PANTALLA=normal` devuelve el comportamiento de siempre: el
+ * historial vuelve a ser del terminal y la rueda del raton a servir, a cambio de
+ * que la barra suba con el scroll.
+ */
 export function pantallaFijaPedida() {
-    return process.env.CHOCOLATITO_PANTALLA === "fija";
+    if (process.env.CHOCOLATITO_PANTALLA === "normal")
+        return false;
+    return true;
 }
 /** `null` = manda el estado real. Las pruebas lo fuerzan. */
 let forzado = null;
@@ -55,6 +70,11 @@ export function entrarEnPantallaFija() {
     process.stdout.write(ENTRAR);
     // Lo que se dibujaba en el terminal pasa a ser historial nuestro.
     redirigirDibujo((texto) => apuntar(texto));
+    // Y el pie deja de pintar. Sigue guardando sus secciones -el spinner y la
+    // linea de razonamiento publican ahi sin enterarse de nada- pero quien las
+    // dibuja pasa a ser el arbol. Dos dueños del mismo trozo de pantalla es
+    // exactamente el problema que esto viene a quitar.
+    habilitarPie(false);
     logOriginal = console.log;
     console.log = (...args) => {
         apuntar(args.map((a) => (typeof a === "string" ? a : String(a))).join(" ") + "\n");
@@ -76,6 +96,7 @@ export function salirDePantallaFija() {
         logOriginal = null;
     }
     redirigirDibujo(null);
+    habilitarPie(null);
     try {
         process.stdout.write(SALIR);
     }

package/dist/ui/pieFijo.d.ts

@@ -31,6 +31,16 @@ export declare function fijarSeccion(nombre: SeccionDelPie, lineas: string[]): v
  * para el mismo resultado, y un parpadeo que se nota en un terminal lento.
  */
 export declare function fijarSecciones(entradas: Array<[SeccionDelPie, string[]]>): void;
+export declare function cuandoCambieElPie(cb: () => void): () => void;
+/**
+ * Las lineas que el pie tiene puestas ahora mismo, en orden.
+ *
+ * La necesita el arbol de Ink cuando manda el: ahi el pie no pinta nada -pintar
+ * seria un segundo dueño del mismo trozo de pantalla- pero el spinner y la
+ * linea de razonamiento siguen publicando aqui, que es lo que hace que ese
+ * cambio no toque ni al spinner ni al bucle.
+ */
+export declare function lineasDelPie(): string[];
 export declare function quitarSeccion(nombre: SeccionDelPie): void;
 /**
  * Escribe texto permanente sin que el pie se lo lleve por delante.

package/dist/ui/pieFijo.js

@@ -233,15 +233,51 @@ export function fijarSeccion(nombre, lineas) {
  * para el mismo resultado, y un parpadeo que se nota en un terminal lento.
  */
 export function fijarSecciones(entradas) {
-    if (!pieUsable())
-        return;
     let cambio = false;
     for (const [nombre, lineas] of entradas) {
         if (anotar(nombre, lineas))
             cambio = true;
     }
-    if (cambio)
+    if (!cambio)
+        return;
+    // Con el pie apagado -que es lo que pasa cuando manda Ink- las secciones se
+    // siguen guardando y se avisa, pero no se pinta nada aqui: pintar seria un
+    // segundo dueño del mismo trozo de pantalla.
+    if (pieUsable())
         repintar("");
+    for (const cb of alCambiarElPie) {
+        try {
+            cb();
+        }
+        catch { }
+    }
+}
+/** Quien pinta el pie desde fuera se entera por aqui. */
+const alCambiarElPie = [];
+export function cuandoCambieElPie(cb) {
+    alCambiarElPie.push(cb);
+    return () => {
+        const i = alCambiarElPie.indexOf(cb);
+        if (i >= 0)
+            alCambiarElPie.splice(i, 1);
+    };
+}
+/**
+ * Las lineas que el pie tiene puestas ahora mismo, en orden.
+ *
+ * La necesita el arbol de Ink cuando manda el: ahi el pie no pinta nada -pintar
+ * seria un segundo dueño del mismo trozo de pantalla- pero el spinner y la
+ * linea de razonamiento siguen publicando aqui, que es lo que hace que ese
+ * cambio no toque ni al spinner ni al bucle.
+ */
+export function lineasDelPie() {
+    const salida = [];
+    for (const nombre of ORDEN) {
+        const trozo = secciones.get(nombre);
+        if (trozo && trozo.length > 0)
+            salida.push(...trozo);
+    }
+    return salida;
 }
 export function quitarSeccion(nombre) {
     fijarSeccion(nombre, []);

package/extension/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "minimum_chrome_version": "102",
   "name": "Chocolatito Code",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "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.5.0",
+  "version": "1.6.0",
   "description": "Agente autónomo de programación para la terminal, con control real del ordenador y del navegador. Desarrollado por Chocolatito.",
   "type": "module",
   "bin": {