primocode 10.4.0 → 10.4.2

package/README.md

@@ -1,4 +1,4 @@
-# PrimoCode v10.4.0
+# PrimoCode v10.4.2
 
 Agente de engenharia brasileiro para o terminal, no estilo Claude Code.
 Cria arquivos de verdade, roda comandos, **controla o navegador e o desktop** —
@@ -9,7 +9,7 @@ OpenRouter, e cada apelido (`top`/`main`/`fast`) é uma **corrente**: se um mode
 está no limite de pedidos, o próximo atende. Você não vê o erro, e não paga nada.
 
 ```
- ▐▛███▜▌   Primo Code v10.4.0
+ ▐▛███▜▌   Primo Code v10.4.2
 ▝▜█████▛▘  Bem-vindo de volta, Joel
   ▘▘ ▝▝    ~/primocode  · /dir <pasta> muda
 ```
@@ -19,6 +19,14 @@ veja `/mascot` e `/name`.
 
 ## O que mudou na 10.4
 
+- **A tela do OpenCode.** O PrimoCode abre em tela cheia: a conversa rola em
+  cima, a caixa de digitar fica presa no pé, e a barra da direita mostra a
+  sessão, o contexto (tokens e % usado), o modo, a pasta e a versão. Sem
+  conversa, a home põe o logo e a caixa no meio. `Tab` troca o modo, `Ctrl+P`
+  abre os comandos (o menu abre em cima da caixa), a roda do mouse e o
+  `PgUp`/`PgDn` rolam a conversa. `PRIMOCODE_TELA=linha` volta ao jeito antigo.
+- **Motion sem encostar na borda.** Margem de 6% nas laterais e 7% em cima e
+  embaixo, e 4% entre elementos — garantido em código antes do render.
 - **Vídeo gravado em 3D (`estilo: personagem`).** Personagens modelados — gente
   ou robô — conversando num set (podcast, estúdio, escritório). A boca segue a
   voz letra por letra, eles piscam, gesticulam e viram a cabeça para quem fala.

package/bin/primocode.js

@@ -482,6 +482,36 @@ function barraDeStatus() {
     return { modo, cor, esquerda: partes.join(c.dim(' · ')), direita: direita.join(c.dim('   ')) };
 }
 
+/* A barra da direita da tela cheia, como a do OpenCode: o contexto (quantos
+   tokens a conversa já ocupa e quanto isso é do teto), o modo e o esforço, e
+   no pé a pasta com o ramo e a versão. */
+function barraLateral() {
+    const uso = memoria.usoDoContexto(state.memoria, state.history);
+    const dir = state.workDir || process.cwd();
+    const ramo = ramoDoGit(dir);
+    const m = state.mode === 'auto' && state.modoEfetivo ? state.modoEfetivo : state.mode;
+    const secoes = [
+        { titulo: 'Contexto', linhas: [
+            c.muted(`${uso.tokens.toLocaleString('pt-BR')} tokens`),
+            (uso.pct >= 100 ? c.err : uso.pct >= 70 ? c.warn : c.muted)(`${uso.pct}% usado`),
+        ] },
+        { titulo: 'Modo', linhas: [
+            `${COR_MODO[m] || COR_MODO.auto}${NOME_MODO[m] || m}${c.reset}` + c.muted(` · esforço ${effort.normalizar(state.config.effort)}`),
+        ] },
+    ];
+    if (state.attachedFiles.length) {
+        secoes.push({ titulo: 'Anexos', linhas: state.attachedFiles.map((f) => c.muted(path.basename(f.path))) });
+    }
+    if (state.controle && state.controle.liberado) secoes.push({ titulo: 'Controle do PC', linhas: [c.warn('liberado até fechar')] });
+    return {
+        secoes,
+        rodape: [
+            c.muted(shortPath(dir)) + (ramo ? c.white(':' + ramo) : ''),
+            c.brand('●') + ' ' + c.bold(c.white('Primo')) + c.white('Code') + ' ' + c.dim(VERSION),
+        ],
+    };
+}
+
 /* O Tab com a caixa vazia gira o modo, como o "tab agents" do OpenCode:
    auto → primo code → chat → auto. A escolha fica salva, como a do /mode. */
 function trocarModo() {
@@ -2707,23 +2737,40 @@ async function main() {
         process.exit(0);
     }
 
-    /* A abertura do OpenCode: o nome e a caixa no MEIO da tela, não no pé de
-       um terminal cheio. Quebras de linha empurram o que havia para o
-       histórico do terminal (nada se perde, dá para rolar), o cursor volta ao
-       topo e desce até o ponto em que o logo e a caixa ficam centrados. */
-    if (process.stdout.isTTY && process.stdout.rows >= 20) {
-        const rows = process.stdout.rows;
-        const alto = 8 + 6;                       // o logo com a versão + a caixa
-        process.stdout.write('\n'.repeat(rows) + '\x1b[H' + '\n'.repeat(Math.max(0, Math.floor((rows - alto) / 2) - 1)));
+    /* A TELA CHEIA do OpenCode (lib/tela.js) é o padrão: a conversa rola em
+       cima, a caixa fica presa no pé, a barra da direita mostra a sessão e o
+       contexto, e sem conversa a home põe o logo e a caixa no meio da tela.
+       PRIMOCODE_TELA=linha (ou "tela": "linha" no config) volta ao jeito
+       antigo, que escreve em linha pelo terminal. */
+    const telaCheia = process.stdout.isTTY && process.stdout.rows >= 16
+        && (process.env.PRIMOCODE_TELA || state.config.tela || 'cheia') !== 'linha';
+    if (!telaCheia) {
+        if (process.stdout.isTTY && process.stdout.rows >= 20) {
+            const rows = process.stdout.rows;
+            const alto = 8 + 6;                       // o logo com a versão + a caixa
+            process.stdout.write('\n'.repeat(rows) + '\x1b[H' + '\n'.repeat(Math.max(0, Math.floor((rows - alto) / 2) - 1)));
+        }
+        console.log(welcomeBox(VERSION, state.workDir ? shortPath(state.workDir) : null, {
+            pastaPadrao: state.workDirOrigem === 'padrao',
+        }));
     }
-    console.log(welcomeBox(VERSION, state.workDir ? shortPath(state.workDir) : null, {
-        pastaPadrao: state.workDirOrigem === 'padrao',
-    }));
     rl = entrada.criar({
         status: barraDeStatus,
         comandos: comandosDoMenu,
         vazio: ui.convite(),
+        telaCheia,
+        lateral: barraLateral,
+        versao: VERSION,
+        logo: ui.logoComMascote(state.config.mascot),
+        pasta: () => {
+            const dir = state.workDir || process.cwd();
+            const ramo = ramoDoGit(dir);
+            return shortPath(dir) + (ramo ? ':' + ramo : '');
+        },
     });
+    if (telaCheia && state.workDirOrigem === 'padrao') {
+        console.log(c.warn(`  pasta padrão: ${shortPath(state.workDir)}`) + c.dim('  · /dir <pasta> para trabalhar numa sua'));
+    }
     // O spinner desenha dentro da caixa (lib/entrada.js mostrarSpinner).
     if (rl.tty) Spinner.caixa = rl;
     ui.titulo('PrimoCode');

package/lib/entrada.js

@@ -40,6 +40,7 @@
 const readline = require('readline');
 const { EventEmitter } = require('events');
 const { c, visibleWidth, truncate } = require('./ui.js');
+const tela = require('./tela.js');
 
 // ── O desenho ────────────────────────────────────────────────────────────
 
@@ -200,8 +201,13 @@ function montar(e) {
     // campo de digitar para baixo a cada tecla, e o texto que a pessoa
     // escreve saltaria de lugar enquanto ela escreve. O desenho é o do
     // OpenCode: fundo de painel, e o escolhido numa faixa pêssego.
+    /* NA TELA CHEIA (`menuAcima`) ele abre EM CIMA do painel, como no
+       OpenCode: lá a caixa é presa no pé da tela e nada salta — o menu só
+       cobre a conversa. */
+    const menu = [];
     if (e.menu && e.menu.itens.length) {
-        const cabem = Math.max(1, Math.min(e.menu.itens.length, 8));
+        const out = menu;
+        const cabem = Math.max(1, Math.min(e.menu.itens.length, e.menuAcima ? 10 : 8));
         // A janela acompanha a seleção: descer na lista rola, em vez de o
         // item escolhido sumir embaixo.
         let topo = Math.max(0, Math.min(e.menu.sel - Math.floor(cabem / 2),
@@ -221,10 +227,14 @@ function montar(e) {
         }
     }
 
+    let acima = 0;
+    if (menu.length && e.menuAcima) { out.splice(e.spinner ? 1 : 0, 0, ...menu); acima = menu.length; }
+    else out.push(...menu);
+
     const margem = ' '.repeat(recuo);
     return {
         linhas: recuo ? out.map((l) => margem + l) : out,
-        cursorLinha: (e.spinner ? 1 : 0) + 1 + cursorLinha,   // +1 pelo respiro de cima
+        cursorLinha: acima + (e.spinner ? 1 : 0) + 1 + cursorLinha,   // +1 pelo respiro de cima
         /* No modo bash o "!" não é desenhado, então tudo depois dele anda uma
            coluna para a esquerda — e o cursor tem de andar junto, ou ele
            aparece um caractere à frente de onde o texto realmente está. */
@@ -268,6 +278,12 @@ class Entrada extends EventEmitter {
         this.oculto = false;      // a próxima resposta é senha: ver `ocultarProxima`
         this.tty = !!(process.stdin.isTTY && process.stdout.isTTY);
         this.escreverCru = process.stdout.write.bind(process.stdout);
+        /* A TELA CHEIA (lib/tela.js): a conversa vive aqui, em linhas, e a
+           tela inteira é redesenhada a cada mudança — em vez de o texto subir
+           pelo terminal com a caixa atrás. */
+        this.cheia = !!(op.telaCheia && this.tty);
+        this.conversa = [];
+        this.rolagem = 0;
     }
 
     // ── ciclo de vida ────────────────────────────────────────────────────
@@ -290,7 +306,7 @@ class Entrada extends EventEmitter {
         this._aoTeclar = (ch, key) => this._tecla(ch, key);
         process.stdin.on('keypress', this._aoTeclar);
 
-        this._aoRedimensionar = () => { if (this.desenhado) this._redesenhar(); };
+        this._aoRedimensionar = () => { if (this.cheia) this._pintar(); else if (this.desenhado) this._redesenhar(); };
         process.stdout.on('resize', this._aoRedimensionar);
 
         /* Todo `console.log` do programa passa a apagar a caixa antes de
@@ -300,8 +316,20 @@ class Entrada extends EventEmitter {
            por cima da caixa. */
         this._stdoutOriginal = process.stdout.write;
         const eu = this;
+        if (this.cheia) this._entrarNaTela();
         process.stdout.write = function (texto, ...resto) {
             if (eu._pintando) return eu._stdoutOriginal.call(this, texto, ...resto);
+            /* Na tela cheia, o que o programa escreve vira linha da conversa,
+               e quem põe na tela é o próximo quadro. Suspensa (o painel do
+               /effort desenhando por cima), passa direto. */
+            if (eu.cheia) {
+                if (eu.suspenso) return eu._stdoutOriginal.call(this, texto, ...resto);
+                tela.acrescentar(eu.conversa, texto);
+                eu._agendar();
+                const fim = resto.find((r) => typeof r === 'function');
+                if (fim) fim();
+                return true;
+            }
             eu._apagar();
             const r = eu._stdoutOriginal.call(this, texto, ...resto);
             /* ── O TEXTO QUE CHEGA EM PEDAÇOS ────────────────────────────
@@ -346,6 +374,7 @@ class Entrada extends EventEmitter {
 
     parar() {
         if (!this.tty) { if (this._rlPipe) this._rlPipe.close(); return; }
+        if (this.cheia) this._sairDaTela();
         this._apagar();
         this.escreverCru('\x1b[?2004l');
         if (this._stdoutOriginal) process.stdout.write = this._stdoutOriginal;
@@ -359,8 +388,89 @@ class Entrada extends EventEmitter {
     /* Enquanto outro desenho é dono da tela — o painel do /effort, uma tela
        do marketplace — a caixa sai da frente e larga o teclado. Sem isso, os
        dois desenhariam no mesmo lugar e as setas moveriam os dois. */
-    suspender() { this.suspenso = true; this._apagar(); }
-    retomar() { this.suspenso = false; if (this.ativo && !this.fechado) this._desenhar(); }
+    suspender() { this.suspenso = true; if (this.cheia) this._sairDaTela(); else this._apagar(); }
+    retomar() {
+        this.suspenso = false;
+        if (this.cheia && this.ativo && !this.fechado) { this._entrarNaTela(); return this._pintar(); }
+        if (this.ativo && !this.fechado) this._desenhar();
+    }
+
+    // ── a tela cheia ─────────────────────────────────────────────────────
+
+    /* A tela alternativa (a do vim): o que estava no terminal fica guardado e
+       volta inteiro na saída. Com ela, a roda do mouse — senão o terminal
+       transformaria a roda em seta para cima e a seta é o histórico. */
+    _entrarNaTela() {
+        if (this._naTela) return;
+        this._naTela = true;
+        /* O resto do programa (o markdown, a fala) quebra linha pela largura
+           do terminal. Na tela cheia a conversa é só a coluna da esquerda —
+           sem a barra da direita — então, enquanto ela está no ar, é ESSA a
+           largura que o programa vê. A real fica guardada para o desenho. */
+        if (!this._colunasReais) {
+            const eu = this;
+            this._colunasReais = process.stdout.columns || 80;
+            Object.defineProperty(process.stdout, 'columns', {
+                configurable: true,
+                get() { return eu._naTela && !eu.suspenso ? tela.larguraDaConversa(eu._colunasReais) : eu._colunasReais; },
+                set(v) { eu._colunasReais = v; },   // o Node escreve aqui quando a janela muda
+            });
+        }
+        this.escreverCru('\x1b[?1049h\x1b[?1000h\x1b[?1006h\x1b[2J');
+        if (!this._aoSairDoProcesso) {
+            // Um erro que derruba o programa não pode deixar o terminal na
+            // tela alternativa, sem cursor e capturando o mouse.
+            this._aoSairDoProcesso = () => this._sairDaTela();
+            process.on('exit', this._aoSairDoProcesso);
+        }
+    }
+
+    _sairDaTela() {
+        if (!this._naTela) return;
+        this._naTela = false;
+        this.escreverCru('\x1b[?1000l\x1b[?1006l\x1b[?25h\x1b[?1049l');
+    }
+
+    /** Junta as mudanças de um mesmo instante num quadro só. */
+    _agendar() {
+        if (this._agendado) return;
+        this._agendado = setTimeout(() => { this._agendado = null; this._pintar(); }, 16);
+    }
+
+    /** O estado do quadro, para a tela cheia (função pura em lib/tela.js). */
+    _quadroCheio() {
+        const conversa = this.conversa.some((l) => /\S/.test(l));
+        return tela.quadro({
+            colunas: this._colunasReais || 80,
+            linhas: process.stdout.rows || 24,
+            conversa: this.conversa,
+            rolagem: this.rolagem,
+            home: !this.mandou && !conversa,
+            caixa: (colunas, centro) => montar({ ...this._estado(), colunas, centro, menuAcima: true }),
+            lateral: { titulo: this.titulo, ...(this.op.lateral ? this.op.lateral() : {}) },
+            versao: this.op.versao || '',
+            logo: this.op.logo,
+            pasta: this.op.pasta ? this.op.pasta() : '',
+        });
+    }
+
+    _pintar() {
+        if (!this.cheia || this.suspenso || this.fechado || !this._naTela) return;
+        const q = this._quadroCheio();
+        this.rolagem = Math.min(this.rolagem, q.rolagemMax);
+        let out = '\x1b[?25l';
+        q.linhas.forEach((l, i) => { out += `\x1b[${i + 1};1H${l}\x1b[0m\x1b[K`; });
+        out += `\x1b[${q.cursor.linha + 1};${q.cursor.coluna + 1}H\x1b[?25h`;
+        this._pintando = true;
+        this.escreverCru(out);
+        this._pintando = false;
+        this.desenhado = { linhas: q.linhas, cursorLinha: q.cursor.linha };
+    }
+
+    _rolar(passo) {
+        this.rolagem = Math.max(0, this.rolagem + passo);
+        this._pintar();
+    }
 
     /** O agente está trabalhando: a caixa esmaece, e o Enter manda um RECADO
      *  que entra na tarefa em curso (a caixa de entrada de lib/act.js). */
@@ -378,11 +488,13 @@ class Entrada extends EventEmitter {
         const novo = texto || '';
         if (novo === (this.spinnerTexto || '')) return;
         this.spinnerTexto = novo;
+        if (this.cheia) return this._agendar();
         if (this.desenhado && !this._meiaLinha) this._redesenhar();
     }
 
     /** Escreve texto ACIMA da caixa — é por onde todo o resto do programa fala. */
     escreverAcima(texto) {
+        if (this.cheia) { tela.acrescentar(this.conversa, texto); return this._agendar(); }
         if (!this.desenhado) { this.escreverCru(texto); return; }
         this._apagar();
         this.escreverCru(texto);
@@ -441,8 +553,10 @@ class Entrada extends EventEmitter {
 
     // ── desenho ──────────────────────────────────────────────────────────
 
-    _quadro() {
-        return montar({
+    _quadro() { return montar(this._estado()); }
+
+    _estado() {
+        return ({
             texto: this.oculto ? '•'.repeat(this.line.length) : this.line,
             cursor: this.cursor,
             colunas: process.stdout.columns || 80,
@@ -457,6 +571,7 @@ class Entrada extends EventEmitter {
     }
 
     _desenhar() {
+        if (this.cheia) return this._pintar();
         if (!this.tty || this.suspenso || this.fechado) return;
         /* Já desenhada (um `prompt()` de quem não sabe que ela está no ar):
            apaga antes. Sem isso o quadro novo começava na linha do cursor —
@@ -482,6 +597,7 @@ class Entrada extends EventEmitter {
     }
 
     _apagar() {
+        if (this.cheia) return;
         if (!this.desenhado || !this.tty) return;
         this._pintando = true;
         // Sobe até a primeira linha do quadro e limpa daí para baixo.
@@ -538,6 +654,19 @@ class Entrada extends EventEmitter {
             return;
         }
 
+        /* A roda do mouse chega como "\x1b[<64;x;yM", e o readline a entrega
+           picada, tecla por tecla. Daqui até o M (ou m), tudo é do mouse. */
+        if (key && key.code === '[<') { this._mouse = ''; return; }
+        if (this._mouse != null) {
+            if (/^[mM]$/.test(seq)) {
+                const botao = parseInt(this._mouse, 10);
+                this._mouse = null;
+                if (botao === 64) this._rolar(3);
+                else if (botao === 65) this._rolar(-3);
+            } else this._mouse += seq;
+            return;
+        }
+
         if (!key) { if (ch) this.write(ch); return; }
 
         // Esc Esc e o resto das teclas de fora: quem escuta decide. A caixa
@@ -607,6 +736,8 @@ class Entrada extends EventEmitter {
                 if (this.cursor < this.line.length) { this.cursor++; this._redesenhar(); }
                 return;
             }
+            case 'pageup': return this._rolar(Math.max(3, (process.stdout.rows || 24) - 8));
+            case 'pagedown': return this._rolar(-Math.max(3, (process.stdout.rows || 24) - 8));
             case 'home': this.cursor = 0; this._redesenhar(); return;
             case 'end':  this.cursor = this.line.length; this._redesenhar(); return;
 
@@ -647,7 +778,9 @@ class Entrada extends EventEmitter {
                 this.cursor = antes.length;
                 return this._mudou();
             }
-            case 'l': this._apagar(); this.escreverCru('\x1b[2J\x1b[H'); return this._desenhar();
+            case 'l':
+                if (this.cheia) { this.conversa = []; this.rolagem = 0; return this._pintar(); }
+                this._apagar(); this.escreverCru('\x1b[2J\x1b[H'); return this._desenhar();
             case 'j': return this._novaLinha();
             // Ctrl+P abre os comandos, como no OpenCode: o mesmo menu do "/".
             case 'p':
@@ -711,11 +844,26 @@ class Entrada extends EventEmitter {
            rola para cima não acha o que perguntou. */
         this._apagar();
         if (texto.trim()) this.mandou = true;   // a caixa sai do centro e ocupa a largura
+        // O título da sessão, na barra da direita: o primeiro pedido.
+        if (texto.trim() && !oculto && !this.titulo && !texto.trim().startsWith('/')) {
+            const t = visto.replace(/\s+/g, ' ').trim();
+            this.titulo = t.length > 70 ? t.slice(0, 69).replace(/\s+\S*$/, '') + '…' : t;
+        }
         if (texto.trim() && !oculto) {
             // Na tela fica a etiqueta (o que se viu ao mandar); quem vai ao agente
             // é o texto inteiro. O desenho é o do pedido no OpenCode: o mesmo
             // painel da caixa, com a barra, e um respiro em cima e embaixo.
-            this.escreverCru(pedidoNaTela(visto, process.stdout.columns || 80) + '\n');
+            if (this.cheia) {
+                const W = this._colunasReais || 80;
+                const mainW = W >= tela.LATERAL_MIN ? W - tela.LATERAL_W : W;
+                this.rolagem = 0;
+                /* Uma linha em branco antes e outra depois do pedido: cada
+                   troca (pedido, resposta) é um bloco separado na tela. */
+                const temAlgo = this.conversa.some((l) => /\S/.test(l));
+                const ultima = this.conversa[this.conversa.length - 1] || '';
+                const antes = !temAlgo ? '' : /\S/.test(ultima) ? '\n\n' : '\n';
+                tela.acrescentar(this.conversa, antes + pedidoNaTela(visto, mainW - 1) + '\n\n');
+            } else this.escreverCru(pedidoNaTela(visto, process.stdout.columns || 80) + '\n');
             if (this.historico[this.historico.length - 1] !== texto) this.historico.push(texto);
         }
         this._desenhar();

package/lib/tela.js

@@ -0,0 +1,232 @@
+/**
+ * tela.js — a TELA CHEIA do PrimoCode, no desenho do OpenCode.
+ *
+ * O jeito antigo escrevia em linha, como qualquer programa de terminal: o
+ * texto subia e a caixa ia junto, no pé do que já tinha saído. O OpenCode,
+ * que é a referência pedida (com os prints), é outra coisa: ocupa a tela
+ * inteira (a "tela alternativa" do terminal, a mesma do vim), e cada parte
+ * tem lugar fixo:
+ *
+ *   ┌──────────────────────────────────────────┬──────────────────┐
+ *   │ a conversa, rolando                      │ título da sessão │
+ *   │                                          │ Contexto         │
+ *   │                                          │   36.216 tokens  │
+ *   │ [menu dos comandos, quando aberto]       │   4% usado       │
+ *   │ ┃ caixa de digitar, presa no pé          │                  │
+ *   │ ┃ Auto · low PrimoCode                   │ ~/pasta:main     │
+ *   │ ~/pasta              36k (4%)  ctrl+p…   │ ● PrimoCode 10.4 │
+ *   └──────────────────────────────────────────┴──────────────────┘
+ *
+ * Sem conversa ainda, a HOME: o logo e a caixa no meio da tela, a pasta no
+ * canto de baixo à esquerda e a versão à direita.
+ *
+ * Tudo aqui é FUNÇÃO PURA: recebe o estado e devolve as linhas da tela. Quem
+ * escreve no terminal é lib/entrada.js. Assim o teste confere o quadro
+ * inteiro — com barra lateral, sem ela, home, menu — sem terminal nenhum.
+ */
+
+'use strict';
+
+const { c, visibleWidth, truncate, logo } = require('./ui.js');
+
+const RESET = '\x1b[0m';
+const FUNDO_LATERAL = '\x1b[48;5;234m';
+const LATERAL_W = 42;          // a largura da barra da direita
+const LATERAL_MIN = 110;       // abaixo disso a barra some: a conversa precisa do espaço
+const RECUO = 3;               // quanto a resposta entra em relação ao painel do pedido
+
+/* ── A conversa como texto ───────────────────────────────────────────────
+   O que o programa escreve (console.log, o fluxo da resposta) chega aqui
+   como texto cru, com cor. A tela guarda LINHAS lógicas; quebrar na largura
+   é coisa do desenho, porque a largura muda quando a janela muda. */
+
+/** Junta um pedaço escrito às linhas que já existem. */
+function acrescentar(linhas, texto) {
+    // Tirar o que não é cor: mover cursor, limpar linha, título. Na tela
+    // cheia quem decide onde cada coisa vai é o desenho, não quem escreve.
+    const t = String(texto == null ? '' : texto)
+        .replace(/\x1b\][^\x07]*(\x07|\x1b\\)/g, '')
+        .replace(/\x1b\[[0-9;?]*[A-Za-ln-z]/g, '');
+    if (!linhas.length) linhas.push('');
+    const partes = t.split('\n');
+    partes.forEach((p, i) => {
+        if (i > 0) linhas.push('');
+        // "\r" volta ao começo da linha: o que vem depois toma o lugar dela
+        // (é como o spinner antigo e as barras de progresso se redesenhavam).
+        const k = p.lastIndexOf('\r');
+        if (k >= 0) linhas[linhas.length - 1] = p.slice(k + 1);
+        else linhas[linhas.length - 1] += p;
+    });
+    // Guarda as últimas 5.000: uma sessão longa não pode crescer sem fim.
+    if (linhas.length > 5000) linhas.splice(0, linhas.length - 5000);
+    return linhas;
+}
+
+/**
+ * Quebra uma linha com cor em pedaços de no máximo `w` colunas: no ESPAÇO
+ * quando dá (palavra cortada ao meio é o que faz texto de terminal parecer
+ * quebrado), no caractere só quando a palavra sozinha é maior que a linha.
+ * Não corta código de cor ao meio e religa a cor ativa em cada pedaço.
+ */
+function quebrarComCor(linha, w) {
+    const out = [];
+    let atual = '', larg = 0, ativo = '';
+    // Códigos de cor não têm espaço, então partir no espaço não os corta.
+    const palavras = String(linha).split(/(?<= )/);
+    const corDe = (t) => {
+        for (const m of t.match(/\x1b\[[0-9;]*m/g) || []) ativo = (m === RESET || m === '\x1b[m') ? '' : ativo + m;
+    };
+    const novaLinha = () => { out.push(atual + (ativo ? RESET : '')); atual = ativo; larg = 0; };
+    for (const p of palavras) {
+        const pw = visibleWidth(p);
+        const semEspaco = visibleWidth(p.replace(/ +$/, ''));
+        if (larg + semEspaco <= w) { atual += p; larg += pw; corDe(p); continue; }
+        if (semEspaco <= w && larg > 0) { novaLinha(); atual += p; larg = pw; corDe(p); continue; }
+        // A palavra não cabe nem sozinha: vai caractere a caractere.
+        const re = /\x1b\[[0-9;]*m/y;
+        for (let i = 0; i < p.length;) {
+            re.lastIndex = i;
+            const m = re.exec(p);
+            if (m) { atual += m[0]; corDe(m[0]); i += m[0].length; continue; }
+            const ch = String.fromCodePoint(p.codePointAt(i));
+            const cw = visibleWidth(ch);
+            if (larg + cw > w && larg > 0) novaLinha();
+            atual += ch; larg += cw; i += ch.length;
+        }
+    }
+    out.push(atual + (ativo ? RESET : ''));
+    return out;
+}
+
+/** Preenche até `w` colunas (ou corta), com o fundo opcional até o fim. */
+function caber(s, w, fundo) {
+    const v = visibleWidth(s);
+    if (v > w) s = truncate(s, w);
+    const falta = Math.max(0, w - visibleWidth(s));
+    if (!fundo) return s + ' '.repeat(falta);
+    return fundo + String(s).split(RESET).join(RESET + fundo) + ' '.repeat(falta) + RESET;
+}
+
+/* ── A barra da direita ──────────────────────────────────────────────── */
+
+/**
+ * @param {object} lat  { titulo, secoes: [{titulo, linhas}], rodape: [] }
+ * @param {number} alto quantas linhas a tela tem
+ */
+function lateral(lat, alto) {
+    const w = LATERAL_W - 4;           // 2 de margem de cada lado
+    const corpo = [''];
+    for (const l of quebrarComCor(c.bold(c.white(lat.titulo || 'Nova sessão')), w)) corpo.push(l);
+    for (const s of (lat.secoes || [])) {
+        corpo.push('');
+        corpo.push(c.bold(c.white(s.titulo)));
+        for (const l of s.linhas) corpo.push(...quebrarComCor(l, w));
+    }
+    const rodape = (lat.rodape || []).slice();
+    rodape.push('');
+    const linhas = [];
+    for (let i = 0; i < alto; i++) {
+        const deBaixo = alto - i - 1;
+        let l = '';
+        if (deBaixo < rodape.length) l = rodape[rodape.length - 1 - deBaixo];
+        else if (i < corpo.length) l = corpo[i];
+        linhas.push(caber('  ' + caber(l, w) + '  ', LATERAL_W, FUNDO_LATERAL));
+    }
+    return linhas;
+}
+
+/* ── O quadro inteiro ─────────────────────────────────────────────────── */
+
+/**
+ * @param {object} e
+ * @param {number} e.colunas, e.linhas   o tamanho do terminal
+ * @param {string[]} e.conversa          as linhas lógicas escritas até aqui
+ * @param {number} e.rolagem             quantas linhas acima do fim (0 = colado embaixo)
+ * @param {boolean} e.home               ainda não houve pedido: logo no meio
+ * @param {(colunas:number, centro:boolean)=>{linhas:string[], cursorLinha:number, cursorColuna:number}} e.caixa
+ * @param {object} e.lateral             o conteúdo da barra da direita
+ * @param {string} e.versao, e.pasta     o rodapé da home
+ * @returns {{linhas: string[], cursor: {linha:number, coluna:number}, rolagemMax: number}}
+ */
+function quadro(e) {
+    const W = Math.max(30, e.colunas || 80);
+    const H = Math.max(10, e.linhas || 24);
+
+    if (e.home) {
+        const caixa = e.caixa(W, true);
+        const lg = W >= 60 && e.logo ? e.logo : W >= 50 ? logo() : [c.bold(c.white('primocode'))];
+        /* O painel fica PARADO no lugar dele: o menu, quando abre, cobre o
+           que está em cima (o logo), em vez de empurrar tudo para cima. */
+        const menu = Math.max(0, caixa.linhas.findIndex((l) => l.includes('┃')) - (/┃/.test(caixa.linhas[0]) ? 0 : 0));
+        const bloco = lg.length + 2 + caixa.linhas.length - menu;
+        const topo = Math.max(0, Math.floor((H - bloco) / 2) - 1);
+        const linhas = [];
+        for (let i = 0; i < topo; i++) linhas.push('');
+        for (const l of lg) linhas.push(' '.repeat(Math.max(0, Math.floor((W - visibleWidth(l)) / 2))) + l);
+        linhas.push('', '');
+        const inicioCaixa = Math.max(0, linhas.length - menu);
+        linhas.length = inicioCaixa;
+        linhas.push(...caixa.linhas);
+        while (linhas.length < H - 1) linhas.push('');
+        linhas.length = H - 1;
+        const esq = ' ' + c.dim(e.pasta || '');
+        const dir = c.dim(e.versao || '') + ' ';
+        linhas.push(esq + ' '.repeat(Math.max(1, W - visibleWidth(esq) - visibleWidth(dir))) + dir);
+        return {
+            linhas: linhas.map((l) => caber(l, W)),
+            cursor: { linha: inicioCaixa + caixa.cursorLinha, coluna: caixa.cursorColuna },
+            rolagemMax: 0,
+        };
+    }
+
+    const comLateral = W >= LATERAL_MIN;
+    const mainW = comLateral ? W - LATERAL_W : W;
+    /* Uma coluna de margem dos dois lados, para a conversa e para a caixa: o
+       pedido mandado (um painel) e a caixa de digitar ficam na MESMA borda. */
+    const caixa0 = e.caixa(mainW - 1, false);
+    const caixa = { ...caixa0, linhas: caixa0.linhas.map((l) => ' ' + l), cursorColuna: caixa0.cursorColuna + 1 };
+    const altoConversa = Math.max(1, H - caixa.linhas.length);
+
+    /* A conversa, quebrada na largura da coluna. Os PAINÉIS (o pedido que se
+       mandou) ficam na borda da caixa; o resto — a resposta, as ações, o
+       fecho "▣" — entra RECUADO, como no OpenCode. Sem o recuo, tudo saía
+       colado na borda e um bloco não se separava do outro. */
+    const visiveis = [];
+    for (const l of (e.conversa || [])) {
+        const painel = /^(\x1b\[[0-9;]*m)*┃/.test(l);
+        const margem = painel ? ' ' : ' '.repeat(RECUO + 1);
+        for (const p of quebrarComCor(l, painel ? mainW - 2 : mainW - 2 - RECUO)) visiveis.push(margem + p);
+    }
+    while (visiveis.length && !temTexto(visiveis[visiveis.length - 1])) visiveis.pop();
+    if (visiveis.length) visiveis.push('');     // um respiro entre a conversa e a caixa
+    const rolagemMax = Math.max(0, visiveis.length - altoConversa);
+    const rolagem = Math.max(0, Math.min(e.rolagem | 0, rolagemMax));
+    const fim = visiveis.length - rolagem;
+    const janela = visiveis.slice(Math.max(0, fim - altoConversa), fim);
+    // A conversa encosta EMBAIXO, logo acima da caixa — como num chat.
+    const conversa = [];
+    for (let i = janela.length; i < altoConversa; i++) conversa.push('');
+    for (const l of janela) conversa.push(l);
+    if (rolagem > 0) {
+        conversa[0] = ' ' + c.dim(`↑ ${rolagem} linha${rolagem > 1 ? 's' : ''} abaixo · PgDn ou a roda do mouse para voltar`);
+    }
+
+    const esquerda = [...conversa, ...caixa.linhas].map((l) => caber(l, mainW));
+    const direita = comLateral ? lateral(e.lateral || {}, H) : null;
+    const linhas = esquerda.map((l, i) => (direita ? l + direita[i] : l));
+    return {
+        linhas,
+        cursor: { linha: altoConversa + caixa.cursorLinha, coluna: caixa.cursorColuna },
+        rolagemMax,
+    };
+}
+
+function temTexto(l) { return visibleWidth(l) > 0 && /\S/.test(l.replace(/\x1b\[[0-9;]*m/g, '')); }
+
+/** A largura que o texto da conversa tem, numa tela de `colunas`. */
+function larguraDaConversa(colunas) {
+    const W = Math.max(30, colunas || 80);
+    return (W >= LATERAL_MIN ? W - LATERAL_W : W) - 2 - RECUO;
+}
+
+module.exports = { RECUO, larguraDaConversa, quadro, acrescentar, quebrarComCor, lateral, caber, LATERAL_W, LATERAL_MIN };

package/lib/ui.js

@@ -358,6 +358,14 @@ function logo() {
 }
 const LOGO_W = visibleWidth(logo()[0]);
 
+/** O logo com o mascote do PrimoCode na frente — o desenho de 3 linhas
+ *  alinhado às 3 linhas do corpo das letras (a 4ª é só a perna do p). */
+function logoComMascote(style) {
+    const m = mascot(style);
+    const l = logo();
+    return l.map((linha, i) => (m[i] || ' '.repeat(ART_W)) + '   ' + linha);
+}
+
 /** Centraliza uma linha (com cor) em `cols` colunas. */
 function centro(s, cols) {
     return ' '.repeat(Math.max(0, Math.floor((cols - visibleWidth(s)) / 2))) + s;
@@ -633,4 +641,4 @@ function friendlyError(raw) {
 
 
 module.exports = {
-    titulo, c, logo, letreiro, convite, EXEMPLOS, mascot, MASCOTES, resolverMascote, mascoteInfo, galeriaMascotes, reacao, welcomeBox, Spinner, PENSANDO, actionHeader, friendlyError, visibleWidth, stripAnsi, truncate, padRight };
+    titulo, c, logo, logoComMascote, letreiro, convite, EXEMPLOS, mascot, MASCOTES, resolverMascote, mascoteInfo, galeriaMascotes, reacao, welcomeBox, Spinner, PENSANDO, actionHeader, friendlyError, visibleWidth, stripAnsi, truncate, padRight };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "primocode",
-  "version": "10.4.0",
+  "version": "10.4.2",
   "description": "PrimoCode — agente de engenharia com IA e cursor próprio. Requer conta Conecta Primo AI (Premium ou Super). Cria arquivos, roda comandos, controla navegador e desktop: abre apps, clica em botões e ícones pelo nome, digita e usa atalhos.",
   "main": "bin/primocode.js",
   "bin": {
@@ -8,7 +8,7 @@
   },
   "scripts": {
     "start": "node bin/primocode.js",
-    "test": "node test/tools.test.js && node test/ui.test.js && node test/entrada.test.js && node test/transparencia.test.js && node test/permissao.test.js && node test/compatibilidade.test.js && node test/skills.test.js && node test/skills-de-fora.test.js && node test/skills-novas.test.js && node test/comandos.test.js && node test/estudio.test.js && node test/voz.test.js && node test/modo.test.js && node test/pasta.test.js && node test/projeto.test.js && node test/nome-projeto.test.js && node test/api-propria.test.js && node test/claude-engine.test.js && node test/codex.test.js && node test/conferir.test.js && node test/catalogo.test.js && node test/desktop.test.js && node test/seta.test.js && node test/effort.test.js && node test/regressao.test.js && node test/memoria-conversa.test.js && node test/repeticao.test.js && node test/casar.test.js && node test/recado.test.js && node test/releitura.test.js && node test/snapshot.test.js && node test/video.test.js && node test/limpeza.test.js && node test/autonomia.test.js && node test/desfazer.test.js && node test/desfazer-git.test.js && node test/referencia.test.js && node test/parar.test.js && node test/continuar.test.js && node test/pipeline.test.js && node test/conta.test.mjs && node test/nuvem.test.js && node test/prazo.test.js && node test/primeira-vez.test.js && node test/fala.test.js && node test/especialistas.test.js && node test/empurrao.test.js && node test/terminal-novo.test.js && node test/markdown.test.js && node test/coerencia.test.js && node test/contexto.test.js && node test/perigo.test.js && node test/rapidez.test.js && node test/mascotes.test.js && node test/comandos-extra.test.js && node test/offline.test.js && node test/edicao.test.js && node test/composicao.test.js && node test/acervo-site.test.js && node test/impacto.test.js && node test/cinema.test.js && node test/producao.test.js && node test/ende.test.js && node test/capa.test.js && node test/broll.test.js && node test/morfar.test.js && node test/motion.test.js && node test/motion-roteiro.test.js && node test/kit-motion.test.js && node test/gerativo.test.js && node test/gerativo-identidade.test.js && node test/gerativo-moldura.test.js && node test/gerativo-heroi.test.js && node test/gerativo-ambiente.test.js && node test/hibrido.test.js && node test/batida.test.js && node test/estudio-acervo.test.js && node test/estudio-diretor.test.js && node test/estudio-marca.test.js && node test/estudio-novo-projeto.test.js && node test/estudio-plano.test.js && node test/estudio-slides.test.js && node test/estudio-video.test.js && node test/revisor.test.js && node test/assinatura.test.js && node test/biblioteca.test.js && node test/mcp.test.js && node test/personas.test.js && node test/efeitos.test.js && node test/auto.test.js && node test/colar.test.js && node test/orquestra.test.js && node test/shell-limpo.test.js && node test/editar-remotion.test.js && node test/variacao3d.test.js && node test/portao-skill.test.js && node test/clones.test.js && node test/kokoro.test.js && node test/fluido.test.js && node test/zoom.test.js && node test/personagem.test.js && node test/margem.test.js"
+    "test": "node test/tools.test.js && node test/ui.test.js && node test/entrada.test.js && node test/transparencia.test.js && node test/permissao.test.js && node test/compatibilidade.test.js && node test/skills.test.js && node test/skills-de-fora.test.js && node test/skills-novas.test.js && node test/comandos.test.js && node test/estudio.test.js && node test/voz.test.js && node test/modo.test.js && node test/pasta.test.js && node test/projeto.test.js && node test/nome-projeto.test.js && node test/api-propria.test.js && node test/claude-engine.test.js && node test/codex.test.js && node test/conferir.test.js && node test/catalogo.test.js && node test/desktop.test.js && node test/seta.test.js && node test/effort.test.js && node test/regressao.test.js && node test/memoria-conversa.test.js && node test/repeticao.test.js && node test/casar.test.js && node test/recado.test.js && node test/releitura.test.js && node test/snapshot.test.js && node test/video.test.js && node test/limpeza.test.js && node test/autonomia.test.js && node test/desfazer.test.js && node test/desfazer-git.test.js && node test/referencia.test.js && node test/parar.test.js && node test/continuar.test.js && node test/pipeline.test.js && node test/conta.test.mjs && node test/nuvem.test.js && node test/prazo.test.js && node test/primeira-vez.test.js && node test/fala.test.js && node test/especialistas.test.js && node test/empurrao.test.js && node test/terminal-novo.test.js && node test/markdown.test.js && node test/coerencia.test.js && node test/contexto.test.js && node test/perigo.test.js && node test/rapidez.test.js && node test/mascotes.test.js && node test/comandos-extra.test.js && node test/offline.test.js && node test/edicao.test.js && node test/composicao.test.js && node test/acervo-site.test.js && node test/impacto.test.js && node test/cinema.test.js && node test/producao.test.js && node test/ende.test.js && node test/capa.test.js && node test/broll.test.js && node test/morfar.test.js && node test/motion.test.js && node test/motion-roteiro.test.js && node test/kit-motion.test.js && node test/gerativo.test.js && node test/gerativo-identidade.test.js && node test/gerativo-moldura.test.js && node test/gerativo-heroi.test.js && node test/gerativo-ambiente.test.js && node test/hibrido.test.js && node test/batida.test.js && node test/estudio-acervo.test.js && node test/estudio-diretor.test.js && node test/estudio-marca.test.js && node test/estudio-novo-projeto.test.js && node test/estudio-plano.test.js && node test/estudio-slides.test.js && node test/estudio-video.test.js && node test/revisor.test.js && node test/assinatura.test.js && node test/biblioteca.test.js && node test/mcp.test.js && node test/personas.test.js && node test/efeitos.test.js && node test/auto.test.js && node test/colar.test.js && node test/orquestra.test.js && node test/shell-limpo.test.js && node test/editar-remotion.test.js && node test/variacao3d.test.js && node test/portao-skill.test.js && node test/clones.test.js && node test/kokoro.test.js && node test/fluido.test.js && node test/zoom.test.js && node test/personagem.test.js && node test/tela.test.js && node test/margem.test.js"
   },
   "engines": {
     "node": ">=18.17.0"