chocolatito-code 1.0.0

package/dist/ui/spinner.d.ts

@@ -0,0 +1,24 @@
+export declare class DynamicSpinner {
+    private timer;
+    private glyphIdx;
+    private verbIdx;
+    private startTime;
+    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.
+     *
+     * 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.
+     */
+    private drawTypeAhead;
+    private clearExtraRows;
+    stop(): void;
+}

package/dist/ui/spinner.js

@@ -0,0 +1,111 @@
+import chalk from "chalk";
+import process from "node:process";
+import { typedText, queuedCount } from "./typeAhead.js";
+import { modeBadge } from "./modes.js";
+const GLYPHS = ["✢", "✳", "∗", "✻", "✽"];
+const VERBS = [
+    "Analizando",
+    "Rumiando",
+    "Tramando",
+    "Destilando",
+    "Hilvanando",
+    "Cavilando",
+    "Maquinando",
+    "Urdiendo",
+    "Tejiendo",
+    "Cocinando",
+];
+export class DynamicSpinner {
+    timer = null;
+    glyphIdx = 0;
+    verbIdx = 0;
+    startTime = 0;
+    isRunning = false;
+    prefix = "";
+    tokenCount = 0;
+    /** Lineas extra pintadas debajo del spinner en el ultimo tick. */
+    extraRows = 0;
+    constructor(prefix = "") {
+        this.prefix = prefix;
+    }
+    start(initialPrefix) {
+        if (this.isRunning)
+            return;
+        if (initialPrefix)
+            this.prefix = initialPrefix;
+        this.isRunning = true;
+        this.startTime = Date.now();
+        this.glyphIdx = 0;
+        this.verbIdx = 0;
+        this.extraRows = 0;
+        this.timer = setInterval(() => {
+            this.tick();
+        }, 120);
+    }
+    tick() {
+        if (!this.isRunning)
+            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;
+        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 badge = modeBadge();
+        const modeStr = badge ? `  ${badge}` : "";
+        this.clearExtraRows();
+        process.stdout.write(`\r\x1b[2K${glyph} ${verb} ${timeStr}${tokenStr}${escStr}${modeStr}`);
+        this.drawTypeAhead();
+    }
+    /**
+     * Segunda linea con lo que el usuario esta escribiendo mientras se genera.
+     *
+     * 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.
+     */
+    drawTypeAhead() {
+        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)")}`);
+        }
+        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");
+        }
+        process.stdout.write(`\x1b[${this.extraRows}A\r`);
+        this.extraRows = 0;
+    }
+    stop() {
+        if (!this.isRunning)
+            return;
+        this.isRunning = false;
+        if (this.timer) {
+            clearInterval(this.timer);
+            this.timer = null;
+        }
+        this.clearExtraRows();
+        process.stdout.write("\r\x1b[2K");
+    }
+}

package/dist/ui/theme.d.ts

@@ -0,0 +1,36 @@
+export declare const THEME: {
+    colors: {
+        terracotta: string;
+        terracottaDark: string;
+        amber: string;
+        purple: string;
+        purpleDark: string;
+        peach: string;
+        green: string;
+        red: string;
+        cyan: string;
+        white: string;
+        gray: string;
+        grayDark: string;
+        bgMuted: string;
+    };
+    glyphs: {
+        bullet: string;
+        hook: string;
+        chevron: string;
+        arrow: string;
+        star: string;
+        checked: string;
+        unchecked: string;
+        sparkle: string;
+        lightning: string;
+    };
+    styles: {
+        primary: import("chalk").ChalkInstance;
+        accent: import("chalk").ChalkInstance;
+        success: import("chalk").ChalkInstance;
+        warning: import("chalk").ChalkInstance;
+        error: import("chalk").ChalkInstance;
+        muted: import("chalk").ChalkInstance;
+    };
+};

package/dist/ui/theme.js

@@ -0,0 +1,37 @@
+import chalk from "chalk";
+export const THEME = {
+    colors: {
+        terracotta: "#D97757",
+        terracottaDark: "#C06345",
+        amber: "#FFA500",
+        purple: "#A855F7",
+        purpleDark: "#8B5CF6",
+        peach: "#F5C7B2",
+        green: "#22C55E",
+        red: "#EF4444",
+        cyan: "#06B6D4",
+        white: "#FAF5F0",
+        gray: "#71717A",
+        grayDark: "#27272A",
+        bgMuted: "#252830",
+    },
+    glyphs: {
+        bullet: "●",
+        hook: "⎿",
+        chevron: "❯",
+        arrow: "▸",
+        star: "✻",
+        checked: "☒",
+        unchecked: "☐",
+        sparkle: "✨",
+        lightning: "⚡",
+    },
+    styles: {
+        primary: chalk.hex("#D97757"),
+        accent: chalk.hex("#A855F7"),
+        success: chalk.green,
+        warning: chalk.hex("#FFA500"),
+        error: chalk.red,
+        muted: chalk.gray,
+    },
+};

package/dist/ui/typeAhead.d.ts

@@ -0,0 +1,31 @@
+/**
+ * ESCRIBIR MIENTRAS EL AGENTE TRABAJA
+ *
+ * Mientras se generaba una respuesta, el vigilante de teclas se quedaba con el
+ * teclado en modo crudo y solo miraba Esc y Ctrl+C: todo lo demas que escribiera
+ * el usuario se tiraba a la basura sin dejar rastro en pantalla. Daba la
+ * sensacion de que el terminal se habia colgado.
+ *
+ * Ahora lo que se teclea se acumula aqui, se pinta debajo del spinner, y al
+ * pulsar Enter queda en cola como siguiente mensaje.
+ *
+ * CUIDADO CON LO QUE ENTRA. Una flecha del cursor no es texto: el terminal manda
+ * "\x1b[A". Al aceptarlo tal cual, el buffer se quedaba con basura invisible que
+ * no se limpiaba nunca, y en cuanto el usuario pulsaba Enter en un turno
+ * posterior esa basura se encolaba y se enviaba SOLA como si fuera una orden.
+ * Desde fuera se veia asi: acabas una respuesta, el agente arranca otra vez por
+ * su cuenta y el teclado deja de responder, porque durante la generacion el
+ * teclado es del vigilante. De ahi el "a veces despues de una respuesta no se
+ * puede escribir".
+ */
+export declare function typedText(): string;
+export declare function pushTyped(text: string): void;
+export declare function backspaceTyped(): void;
+export declare function clearTyped(): void;
+/** Enter durante la generacion: lo escrito pasa a la cola. */
+export declare function commitTyped(): string | null;
+export declare function hasQueued(): boolean;
+export declare function queuedCount(): number;
+/** Recoge todo lo encolado como un unico mensaje y vacia la cola. */
+export declare function takeQueued(): string | null;
+export declare function resetTypeAhead(): void;

package/dist/ui/typeAhead.js

@@ -0,0 +1,87 @@
+/**
+ * ESCRIBIR MIENTRAS EL AGENTE TRABAJA
+ *
+ * Mientras se generaba una respuesta, el vigilante de teclas se quedaba con el
+ * teclado en modo crudo y solo miraba Esc y Ctrl+C: todo lo demas que escribiera
+ * el usuario se tiraba a la basura sin dejar rastro en pantalla. Daba la
+ * sensacion de que el terminal se habia colgado.
+ *
+ * Ahora lo que se teclea se acumula aqui, se pinta debajo del spinner, y al
+ * pulsar Enter queda en cola como siguiente mensaje.
+ *
+ * CUIDADO CON LO QUE ENTRA. Una flecha del cursor no es texto: el terminal manda
+ * "\x1b[A". Al aceptarlo tal cual, el buffer se quedaba con basura invisible que
+ * no se limpiaba nunca, y en cuanto el usuario pulsaba Enter en un turno
+ * posterior esa basura se encolaba y se enviaba SOLA como si fuera una orden.
+ * Desde fuera se veia asi: acabas una respuesta, el agente arranca otra vez por
+ * su cuenta y el teclado deja de responder, porque durante la generacion el
+ * teclado es del vigilante. De ahi el "a veces despues de una respuesta no se
+ * puede escribir".
+ */
+let buffer = "";
+let queued = [];
+/**
+ * Deja solo lo que de verdad es texto.
+ *
+ * Fuera: secuencias de escape (flechas, F1-F12, inicio/fin, shift+tab) y
+ * cualquier caracter de control. Si de una pulsacion no queda nada imprimible,
+ * es que no era texto.
+ */
+function soloTexto(raw) {
+    if (!raw)
+        return "";
+    // Una secuencia de escape entera se descarta de golpe: sus caracteres
+    // sueltos ("[", "A") si son imprimibles y colarian letras falsas.
+    if (raw.charCodeAt(0) === 0x1b)
+        return "";
+    let out = "";
+    for (const ch of raw) {
+        const c = ch.codePointAt(0);
+        // Se descartan los controles C0 y el DEL. Todo lo demas es texto del usuario,
+        // incluidas tildes, enies y emoji.
+        if (c !== undefined && c >= 0x20 && c !== 0x7f)
+            out += ch;
+    }
+    return out;
+}
+export function typedText() {
+    return buffer;
+}
+export function pushTyped(text) {
+    buffer += soloTexto(text);
+}
+export function backspaceTyped() {
+    buffer = buffer.slice(0, -1);
+}
+export function clearTyped() {
+    buffer = "";
+}
+/** Enter durante la generacion: lo escrito pasa a la cola. */
+export function commitTyped() {
+    const text = buffer.trim();
+    buffer = "";
+    if (!text)
+        return null;
+    queued.push(text);
+    return text;
+}
+export function hasQueued() {
+    return queued.length > 0;
+}
+export function queuedCount() {
+    return queued.length;
+}
+/** Recoge todo lo encolado como un unico mensaje y vacia la cola. */
+export function takeQueued() {
+    if (queued.length === 0)
+        return null;
+    const text = queued.join("\n").trim();
+    queued = [];
+    // Una cola que solo tenia ruido no vale como orden: enviarla gasta dinero y
+    // se salta el prompt del usuario.
+    return text.length > 0 ? text : null;
+}
+export function resetTypeAhead() {
+    buffer = "";
+    queued = [];
+}

package/extension/README.md

@@ -0,0 +1,74 @@
+# Extensión de Chocolatito Code para Chrome
+
+Es lo que permite que el agente trabaje **dentro de tu Chrome**, con tus cuentas ya
+iniciadas y **sin quitarte la pantalla**. Puedes seguir jugando o trabajando mientras
+opera en una pestaña que ni siquiera está visible.
+
+## Instalación (una sola vez)
+
+1. Abre `chrome://extensions`
+2. Activa **Modo de desarrollador** (interruptor arriba a la derecha)
+3. Pulsa **Cargar descomprimida**
+4. Selecciona esta carpeta:
+   `C:\Users\Ryzen\Documents\tomas\chocolatito-code\extension`
+
+Listo. El icono mostrará el distintivo `on` cuando la CLI esté abierta.
+
+> **No uses el flag `--load-extension`.** Chrome 137 lo eliminó por abuso de malware;
+> hoy no hace nada. Y si añades `--disable-extensions-except`, Chrome desactiva todas
+> las extensiones, incluida esta.
+
+## Cómo saber que está funcionando
+
+- El icono de la extensión muestra `on` cuando hay conexión con la CLI.
+- La pestaña en la que trabaja entra en un **grupo naranja "Chocolatito Code"**.
+- En esa página aparece un **aviso flotante** abajo a la derecha con lo que está
+  haciendo en cada momento ("leyendo la pagina", "escribiendo", …).
+- Al terminar, `chrome(done)` deshace el grupo y retira el aviso.
+
+## Por qué hace falta una extensión
+
+| Vía | ¿Tus sesiones? | ¿Segundo plano real? |
+|---|---|---|
+| CDP con puerto de depuración (`browser`) | No — Chrome 136+ lo bloquea en el perfil por defecto | Sí, pero en un perfil vacío |
+| UI Automation + ratón y teclado (`computer_use`) | Sí | No — para escribir hay que traer la ventana al frente |
+| **Extensión (`chrome`)** | **Sí** | **Sí** |
+
+Las dos primeras fallan justo en la casilla que importa. La extensión corre dentro del
+navegador, así que no necesita foco ni ratón, y hereda tu sesión porque *es* tu Chrome.
+
+## Arquitectura
+
+```
+CLI (chocolatito)                    Chrome
+┌──────────────────┐                ┌─────────────────────────────┐
+│ browserExtension │  WebSocket     │ background.js               │
+│  servidor local  │◄──────────────►│  service worker             │
+│  127.0.0.1:8787  │                │   · pestañas y grupos       │
+└──────────────────┘                │   · captura por CDP         │
+                                    └───────────┬─────────────────┘
+                                                │ chrome.tabs.sendMessage
+                                    ┌───────────▼─────────────────┐
+                                    │ content.js (en la página)   │
+                                    │  · snapshot con refs        │
+                                    │  · clic y escritura         │
+                                    │  · aviso flotante           │
+                                    └─────────────────────────────┘
+```
+
+El servidor escucha **solo en 127.0.0.1** y rechaza cualquier conexión cuyo origen no
+sea `chrome-extension://`, para que una página web no pueda hablar con él.
+
+## Detalles que costó descubrir
+
+- **Escribir con `el.value = ...` no funciona en React.** El texto se ve pero el estado
+  interno del framework sigue vacío, así que el botón de enviar queda deshabilitado.
+  Hay que llamar al *setter nativo* del prototipo y emitir `input`. En campos
+  `contenteditable`, `document.execCommand("insertText")`.
+- **El snapshot atraviesa shadow DOM.** Sin eso, en las apps de Google se ve media
+  interfaz.
+- **Las capturas van por `chrome.debugger`**, no por `chrome.tabs.captureVisibleTab`:
+  esta última exige que la pestaña esté activa y la ventana enfocada, justo lo que
+  queremos evitar.
+- **El service worker se duerme.** Un ping cada 20 s mantiene viva la conexión y con
+  ella el índice de referencias del último snapshot.