lampson 0.2.7 → 0.2.9

package/public/js/editor.js

@@ -0,0 +1,232 @@
+// editor.js — editor de archivos del visor: un textarea transparente (caret, selección, teclado nativo) sobre un
+// <pre> con el mismo texto resaltado por highlight.js (vendor/highlight.min.js = build "common" + powershell +
+// dockerfile; Synsema se registra acá, traducido de la gramática TextMate oficial del repo kitecosmic/synsema,
+// editors/vscode/syntaxes/synsema.tmLanguage.json). El gutter con los números va aparte y sigue el scroll.
+//
+// Guardar: Ctrl+S o el botón → POST /api/fs {op:"write"} (lib/fs.syn: solo archivos que existen, dentro del
+// workspace). Antes de guardar se relee el archivo: si cambió en disco (el agente lo editó mientras tanto) se
+// avisa y se elige sobrescribir o recargar, nunca se pisa a ciegas. Cambiar de archivo con cambios sin guardar
+// no los pierde: quedan como borrador en memoria y vuelven al reabrirlo (se pierden al recargar la página, con aviso).
+// Solo lectura: archivos truncados por la API (> 200k) y binarios — guardar un recorte destruiría el archivo.
+
+const LANG_BY_EXT = {
+  js: 'javascript', mjs: 'javascript', cjs: 'javascript', jsx: 'javascript', ts: 'typescript', mts: 'typescript', cts: 'typescript', tsx: 'typescript',
+  css: 'css', scss: 'scss', less: 'less', html: 'xml', htm: 'xml', xml: 'xml', svg: 'xml', vue: 'xml', svelte: 'xml', xsl: 'xml', plist: 'xml',
+  json: 'json', jsonc: 'json', md: 'markdown', markdown: 'markdown', py: 'python', rs: 'rust', go: 'go',
+  sh: 'bash', bash: 'bash', zsh: 'bash', env: 'bash', ps1: 'powershell', psm1: 'powershell', psd1: 'powershell',
+  yml: 'yaml', yaml: 'yaml', sql: 'sql', c: 'c', h: 'c', cpp: 'cpp', cc: 'cpp', cxx: 'cpp', hpp: 'cpp', hh: 'cpp', cs: 'csharp',
+  java: 'java', kt: 'kotlin', kts: 'kotlin', swift: 'swift', rb: 'ruby', php: 'php', lua: 'lua', r: 'r', pl: 'perl',
+  ini: 'ini', toml: 'ini', cfg: 'ini', conf: 'ini', properties: 'ini', diff: 'diff', patch: 'diff', graphql: 'graphql', gql: 'graphql',
+  wasm: 'wasm', wat: 'wasm', syn: 'synsema', fsyn: 'synsema', txt: 'plaintext', log: 'plaintext', csv: 'plaintext', lock: 'plaintext',
+  prisma: 'prisma', tsbuildinfo: 'json', map: 'json', webmanifest: 'json', jsonl: 'json', har: 'json', mdx: 'markdown', proto: 'protobuf',
+  bat: 'dos', cmd: 'dos', psql: 'sql', pgsql: 'sql', mysql: 'sql', m: 'objectivec', csproj: 'xml', xaml: 'xml', astro: 'xml', ejs: 'xml', hbs: 'xml',
+  // nombres de fence habituales en el chat que no son extensiones
+  javascript: 'javascript', typescript: 'typescript', python: 'python', rust: 'rust', shell: 'bash', powershell: 'powershell',
+  synsema: 'synsema', html5: 'xml', dockerfile: 'dockerfile', makefile: 'makefile', text: 'plaintext', plaintext: 'plaintext'
+};
+const LANG_BY_NAME = { dockerfile: 'dockerfile', makefile: 'makefile', gnumakefile: 'makefile', '.env': 'bash', '.env.example': 'bash', '.gitignore': 'plaintext', '.gitattributes': 'plaintext', '.npmrc': 'ini', '.editorconfig': 'ini', '.nvmrc': 'plaintext', '.babelrc': 'json', '.eslintrc': 'json', '.prettierrc': 'json', '.swcrc': 'json', 'nginx.conf': 'nginx', procfile: 'plaintext' };
+function langOf(path) {
+  const base = String(path || '').split('/').pop().toLowerCase();
+  if (LANG_BY_NAME[base]) return LANG_BY_NAME[base];
+  if (base.startsWith('.env')) return 'bash';            // .env.local, .env.production…
+  if (base.startsWith('dockerfile')) return 'dockerfile'; // Dockerfile.dev
+  const i = base.lastIndexOf('.'); const ext = i >= 0 ? base.slice(i + 1) : '';
+  return LANG_BY_EXT[ext] || 'plaintext';
+}
+// código en un bloque ``` del chat (core.js md()): resaltado si el fence trae un lenguaje conocido
+function hlCode(code, lang) {
+  if (typeof hljs === 'undefined') return esc(code);
+  const l = String(lang || '').toLowerCase(); const name = LANG_BY_EXT[l] || (l && hljs.getLanguage(l) ? l : '');
+  if (!name || name === 'plaintext' || code.length > 60000) return esc(code);
+  try { return hljs.highlight(code, { language: name, ignoreIllegals: true }).value; } catch (e) { return esc(code); }
+}
+
+// ---- Synsema para highlight.js (misma partición que el tmLanguage: control, tipos, seguridad, agentes, LLM,
+// humano, observabilidad, serve, módulos; builtins solo cuando se llaman; task/type/agent + nombre = definición) ----
+function synsemaGrammar(hljs) {
+  const KEYWORDS = [
+    'when', 'otherwise', 'each', 'while', 'repeat', 'match', 'is', 'try', 'recover', 'give', 'stop', 'then', 'and_then', 'return',
+    'let', 'be', 'set', 'to', 'task', 'type', 'agent', 'state',
+    'and', 'or', 'not', 'in', 'of', 'as', 'with',
+    'spawn', 'share', 'observe', 'signal', 'wait_for',
+    'analyze', 'decide', 'reason', 'generate',
+    'approve', 'confirm', 'ask', 'show',
+    'trace', 'log', 'measure', 'checkpoint',
+    'serve', 'on', 'route', 'auth', 'errors', 'requires', 'expect', 'max_body', 'max_streams', 'stream', 'send', 'static', 'cache', 'fallback', 'cors', 'describe', 'private', 'from', 'domain', 'tls', 'redirect', 'proxy', 'host', 'paged', 'per', 'rate_limit', 'unlimited', 'none', 'mount', 'at',
+    'use', 'export', 'routes', 'enum'
+  ];
+  const SECURITY = ['require', 'allow', 'deny', 'sandbox', 'intent', 'invariant', 'verify'];
+  const BUILTINS = ['print', 'text', 'length', 'append', 'range', 'contains', 'split', 'join', 'type_of', 'matches', 'find_all', 'capture', 'replace_re', 'fetch', 'read_file', 'write_file', 'http', 'http_get', 'http_post', 'sql', 'sql_exec', 'sql_tables', 'db_open', 'db_close', 'format_time', 'parse_time', 'date_parts', 'now', 'sleep', 'apply', 'where', 'reduce', 'collect', 'transform', 'sort_by', 'group_by', 'every', 'some', 'flatten', 'parallel_map', 'chunk', 'remember', 'recall', 'forget_memory', 'add_rule', 'check_rules', 'get_rules', 'memory_summary', 'create_progress', 'start_step', 'complete_step', 'fail_step', 'resume_point', 'progress_display', 'progress_percent', 'ok', 'created', 'not_found', 'fail', 'html', 'respond', 'render', 'page', 'heading', 'prose', 'list', 'ordered_list', 'link', 'image', 'section', 'code', 'raw', 'content'];
+  const NUMBER = { scope: 'number', match: /\b[0-9][0-9_]*(\.[0-9][0-9_]*)?([eE][+-]?[0-9]+)?\b/ };
+  const CALL = { scope: 'built_in', match: new RegExp('\\b(' + BUILTINS.join('|') + ')(?=\\s*\\()') };
+  // {expr} dentro de un string: termina en }, pero también ante la comilla que cierra el string o al final de la
+  // línea, así una llave sin cerrar no arrastra el color
+  const subst = (quote) => ({ scope: 'subst', begin: /\{/, end: new RegExp('\\}|(?=' + quote + ')|$'), keywords: { keyword: KEYWORDS, literal: ['true', 'false', 'nothing'] }, contains: [NUMBER, CALL] });
+  return {
+    name: 'Synsema', aliases: ['syn', 'fsyn'],
+    keywords: { $pattern: /[A-Za-z_][A-Za-z0-9_]*/, keyword: KEYWORDS, literal: ['true', 'false', 'nothing'] },
+    contains: [
+      hljs.COMMENT('--', '$'),
+      // los strings no cruzan líneas: end también en $ (hljs compila con la bandera m). Sin esto una comilla o un
+      // backtick sin cerrar pintaban el resto del archivo como string (visto 2026-09-05 con un ` suelto en un .syn)
+      { scope: 'string', begin: /"/, end: /"|$/, contains: [{ scope: 'char.escape', match: /\\./ }, subst('"')] },
+      { scope: 'string', begin: /`/, end: /`|$/, contains: [{ scope: 'char.escape', match: /\\./ }, subst('`')] },
+      { match: [/\b(task|type|agent)\b/, /\s+/, /[A-Za-z_][A-Za-z0-9_]*/], scope: { 1: 'keyword', 3: 'title.function' } },
+      { scope: 'keyword.security', match: new RegExp('\\b(' + SECURITY.join('|') + ')\\b') },
+      CALL,
+      NUMBER
+    ]
+  };
+}
+// Prisma (schema.prisma): highlight.js no lo trae. Bloques model/enum/datasource/generator, tipos escalares,
+// atributos @id/@@map, env("…"), comentarios // y ///.
+function prismaGrammar(hljs) {
+  return {
+    name: 'Prisma', aliases: ['prisma'],
+    keywords: {
+      keyword: ['model', 'enum', 'type', 'view', 'datasource', 'generator'],
+      built_in: ['String', 'Int', 'BigInt', 'Float', 'Decimal', 'Boolean', 'DateTime', 'Json', 'Bytes', 'Unsupported'],
+      literal: ['true', 'false', 'null']
+    },
+    contains: [
+      hljs.COMMENT('///', '$'), hljs.COMMENT('//', '$'),
+      { scope: 'string', begin: /"/, end: /"|$/, contains: [{ scope: 'char.escape', match: /\\./ }] },
+      { match: [/\b(model|enum|type|view|datasource|generator)\b/, /\s+/, /[A-Za-z_]\w*/], scope: { 1: 'keyword', 3: 'title.class' } },
+      { scope: 'attribute', match: /@@?[A-Za-z_][\w.]*/ },
+      { scope: 'built_in', match: /\benv(?=\()/ },
+      { scope: 'number', match: /\b\d+(\.\d+)?\b/ }
+    ]
+  };
+}
+if (typeof hljs !== 'undefined') { hljs.registerLanguage('synsema', synsemaGrammar); hljs.registerLanguage('prisma', prismaGrammar); }
+
+// ---- estado ----
+const ED = { path: '', loaded: null, lang: 'plaintext', dirty: false, readonly: false, saving: false };
+const drafts = new Map(); // path → texto sin guardar (al cambiar de archivo no se pierde nada)
+const eta = $('#eta'), ehl = $('#ehl'), egut = $('#egut'), edBox = $('#editor');
+const HL_MAX = 120000;    // más que esto se muestra sin resaltar (hljs tardaría en cada tecla)
+const HL_SYNC_MAX = 30000; // hasta acá el espejo se redibuja en el mismo tick que la tecla; después con debounce corto
+
+function edVisible() { return !edBox.hidden && $('#viewer').style.display !== 'none' && !!ED.path; }
+function edDirty() { return ED.dirty; }
+
+// abre la respuesta de GET /api/file en el editor (tree.js openFile). Un borrador guardado gana al disco.
+function edOpen(d) {
+  edStash();
+  ED.path = d.path; ED.loaded = String(d.content ?? ''); ED.lang = langOf(d.path); ED.saving = false;
+  const binary = /\u0000/.test(ED.loaded);
+  ED.readonly = !!d.truncated || binary;
+  const draft = drafts.get(ED.path);
+  eta.value = !ED.readonly && draft != null && draft !== ED.loaded ? draft : ED.loaded;
+  ED.dirty = eta.value !== ED.loaded;
+  eta.readOnly = ED.readonly;
+  $('#vbody').hidden = true; edBox.hidden = false; $('#viewer').classList.add('edit');
+  edRender(); edMeta(d.truncated ? 'archivo muy grande · solo lectura' : binary ? 'binario · solo lectura' : '');
+  eta.scrollTop = 0; eta.scrollLeft = 0; edSync();
+  if (!ED.readonly) eta.focus({ preventScroll: true });
+}
+function edStash() { if (!ED.path) return; if (ED.dirty) drafts.set(ED.path, eta.value); else drafts.delete(ED.path); }
+// cierra el editor (✕ del visor, tras confirmar si había cambios); el visor vuelve a su <pre> de texto
+function edClose(discard) {
+  if (discard) drafts.delete(ED.path); else edStash();
+  ED.path = ''; ED.loaded = null; ED.dirty = false;
+  edBox.hidden = true; $('#vbody').hidden = false; $('#viewer').classList.remove('edit');
+}
+// el visor va a mostrar texto plano (logs de procesos/agentes, showText): el editor se esconde sin perder borradores
+function viewerText() { if (!edBox.hidden) edClose(false); }
+
+function edRender() {
+  const src = eta.value; let html;
+  if (src.length > HL_MAX || ED.lang === 'plaintext' || typeof hljs === 'undefined') html = esc(src);
+  else { try { html = hljs.highlight(src, { language: ED.lang, ignoreIllegals: true }).value; } catch (e) { html = esc(src); } }
+  // el espacio final: un <pre> no pinta la última línea vacía, el textarea sí; así ambos miden lo mismo
+  ehl.firstElementChild.innerHTML = html + '\n ';
+  const n = src.split('\n').length;
+  if (egut.childElementCount !== n) { let g = ''; for (let i = 1; i <= n; i++) g += '<span>' + i + '</span>'; egut.innerHTML = g; }
+}
+function edSync() { ehl.scrollTop = eta.scrollTop; ehl.scrollLeft = eta.scrollLeft; egut.style.transform = 'translateY(' + (-eta.scrollTop) + 'px)'; }
+function edMeta(note, bad) {
+  const n = eta.value.split('\n').length;
+  const parts = [ED.lang === 'plaintext' ? 'texto' : ED.lang, n + (n === 1 ? ' línea' : ' líneas')];
+  if (ED.dirty) parts.push('<b class="dirty">● sin guardar</b>');
+  if (note) parts.push(`<span class="${bad ? 'err' : 'note'}">${esc(note)}</span>`);
+  $('#vmeta').innerHTML = parts.join(' · ');
+  const b = $('#vsave'); b.hidden = ED.readonly; b.disabled = !ED.dirty || ED.saving;
+}
+
+// ---- guardar ----
+async function edSave(force) {
+  if (!edVisible() || ED.readonly || ED.saving) return;
+  const content = eta.value, path = ED.path;
+  if (!ED.dirty && !force) return;
+  ED.saving = true; edMeta('guardando…');
+  try {
+    if (!force) { // ¿cambió en disco desde que lo abrimos? (el agente pudo escribirlo mientras tanto)
+      const r0 = await fetch(BASE + '/api/file?path=' + encodeURIComponent(path)); const d0 = await r0.json();
+      if (r0.ok && String(d0.content) !== ED.loaded) { ED.saving = false; edConflict(); return; }
+    }
+    const r = await api(BASE + '/api/fs', { op: 'write', path, content });
+    if (!r.ok) { ED.saving = false; edMeta(r.data.error || 'no se pudo guardar', true); return; }
+    if (ED.path === path) { ED.loaded = content; ED.dirty = eta.value !== content; } // el usuario pudo seguir tipeando
+    drafts.delete(path); ED.saving = false;
+    edMeta('guardado'); setTimeout(() => { if (ED.path === path && !ED.dirty) edMeta(); }, 1800);
+    if (typeof treeChanged === 'function') treeChanged();
+  } catch (e) { ED.saving = false; edMeta('no se pudo guardar: ' + e.message, true); }
+}
+function edConflict() {
+  $('#vmeta').innerHTML = `<span class="warn">cambió en disco mientras lo editabas</span> · <a href="#" id="edover">sobrescribir</a> · <a href="#" id="edreload">recargar (pierde tus cambios)</a>`;
+  $('#edover').onclick = ev => { ev.preventDefault(); edSave(true); };
+  $('#edreload').onclick = ev => { ev.preventDefault(); drafts.delete(ED.path); ED.dirty = false; openFile(ED.path); };
+}
+// una tool del agente pudo tocar el archivo abierto (chat.js): sin cambios locales se recarga solo conservando el
+// scroll; con cambios locales se avisa y el conflicto se resuelve al guardar
+async function edTouched(path) {
+  if (!edVisible()) return;
+  const p = path ? String(path).replace(/\\/g, '/').replace(/^\.\//, '') : '';
+  if (p && p !== ED.path) return;
+  try {
+    const r = await fetch(BASE + '/api/file?path=' + encodeURIComponent(ED.path)); const d = await r.json();
+    if (!r.ok || String(d.content) === ED.loaded) return;
+    if (ED.dirty) { edMeta('el agente cambió este archivo en disco · al guardar podés sobrescribir o recargar', true); return; }
+    const st = eta.scrollTop, sl = eta.scrollLeft;
+    ED.loaded = String(d.content); eta.value = ED.loaded; ED.readonly = !!d.truncated; eta.readOnly = ED.readonly;
+    edRender(); edMeta('actualizado: el agente lo cambió'); eta.scrollTop = st; eta.scrollLeft = sl; edSync();
+    setTimeout(() => { if (!ED.dirty) edMeta(); }, 2500);
+  } catch (e) {}
+}
+
+// ---- teclado y eventos ----
+function edInsert(t) {
+  if (!document.execCommand || !document.execCommand('insertText', false, t)) { // execCommand conserva el undo del navegador
+    eta.setRangeText(t, eta.selectionStart, eta.selectionEnd, 'end'); eta.dispatchEvent(new Event('input'));
+  }
+}
+eta.addEventListener('input', () => {
+  ED.dirty = eta.value !== ED.loaded;
+  if (eta.value.length > HL_SYNC_MAX) debounce('edhl', edRender, 40); else edRender();
+  edMeta(); edSync();
+});
+eta.addEventListener('scroll', edSync);
+eta.addEventListener('keydown', ev => {
+  if (ED.readonly) return;
+  if (ev.key === 'Tab' && !ev.ctrlKey && !ev.altKey) {
+    ev.preventDefault();
+    const v = eta.value, s = eta.selectionStart, e = eta.selectionEnd;
+    if (s === e || !v.slice(s, e).includes('\n')) { if (!ev.shiftKey) edInsert('    '); return; } // 4 espacios: la indentación de Synsema
+    // varias líneas seleccionadas: indentar / desindentar el bloque
+    const ls = v.lastIndexOf('\n', s - 1) + 1; let le = v.indexOf('\n', e - 1); if (le < 0) le = v.length;
+    const lines = v.slice(ls, le).split('\n');
+    const out = lines.map(l => ev.shiftKey ? l.replace(/^(    |\t| {1,3})/, '') : '    ' + l).join('\n');
+    eta.setSelectionRange(ls, le); edInsert(out); eta.setSelectionRange(ls, ls + out.length);
+  } else if (ev.key === 'Enter' && !ev.ctrlKey && !ev.altKey && !ev.shiftKey) {
+    ev.preventDefault();
+    const v = eta.value, s = eta.selectionStart; const ls = v.lastIndexOf('\n', s - 1) + 1;
+    const ind = (v.slice(ls, s).match(/^[ \t]*/) || [''])[0];
+    edInsert('\n' + ind); // conserva la indentación de la línea anterior
+  } else if (ev.key === 'Escape') { eta.blur(); }
+});
+document.addEventListener('keydown', ev => {
+  if ((ev.ctrlKey || ev.metaKey) && !ev.altKey && ev.key.toLowerCase() === 's' && edVisible()) { ev.preventDefault(); edSave(); }
+});
+$('#vsave').onclick = () => edSave();
+window.addEventListener('beforeunload', ev => { if (ED.dirty || drafts.size) { ev.preventDefault(); ev.returnValue = ''; } });

package/public/js/login.js

@@ -0,0 +1,78 @@
+// login.js — /login (passkey de un dispositivo ya emparejado) y /pair#<código> (registrar una passkey nueva).
+// Los binarios de WebAuthn viajan en base64url: el server manda challenge / user.id / ids así, y recibe la
+// credencial en la forma de PublicKeyCredential.toJSON() (armada a mano: toJSON no está en todos los Safari).
+const $ = s => document.querySelector(s);
+const b64uToBuf = (s) => { s = s.replace(/-/g, '+').replace(/_/g, '/'); while (s.length % 4) s += '='; const bin = atob(s); const u = new Uint8Array(bin.length); for (let i = 0; i < bin.length; i++) u[i] = bin.charCodeAt(i); return u.buffer; };
+const bufToB64u = (buf) => { const u = new Uint8Array(buf); let s = ''; for (let i = 0; i < u.length; i++) s += String.fromCharCode(u[i]); return btoa(s).replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, ''); };
+function say(text, kind) { const m = $('#msg'); m.textContent = text || ''; m.className = 'msg' + (kind ? ' ' + kind : ''); }
+async function post(path, body) { const r = await fetch(path, { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(body || {}) }); let data = {}; try { data = await r.json(); } catch (e) {} return { ok: r.ok, status: r.status, data }; }
+function credJSON(c) {
+  const r = c.response, out = { id: c.id, rawId: bufToB64u(c.rawId), type: c.type, clientExtensionResults: c.getClientExtensionResults ? c.getClientExtensionResults() : {}, response: { clientDataJSON: bufToB64u(r.clientDataJSON) } };
+  if (c.authenticatorAttachment) out.authenticatorAttachment = c.authenticatorAttachment;
+  if (r.attestationObject) { out.response.attestationObject = bufToB64u(r.attestationObject); if (r.getTransports) out.response.transports = r.getTransports(); }
+  if (r.authenticatorData) out.response.authenticatorData = bufToB64u(r.authenticatorData);
+  if (r.signature) out.response.signature = bufToB64u(r.signature);
+  if (r.userHandle) out.response.userHandle = bufToB64u(r.userHandle);
+  return out;
+}
+function why(e) {
+  if (!e) return 'algo falló';
+  if (e.name === 'NotAllowedError') return 'cancelado o sin respuesta — volvé a intentar';
+  if (e.name === 'InvalidStateError') return 'este dispositivo ya tiene una passkey de lampson para este dominio — entrá desde /login';
+  if (e.name === 'SecurityError') return 'el navegador rechazó el dominio: las passkeys necesitan https (o localhost)';
+  return (e.name ? e.name + ': ' : '') + (e.message || String(e));
+}
+function guessName() {
+  const ua = navigator.userAgent;
+  const os = /iPhone/.test(ua) ? 'iPhone' : /iPad/.test(ua) ? 'iPad' : /Android/.test(ua) ? 'Android' : /Mac OS X/.test(ua) ? 'Mac' : /Windows/.test(ua) ? 'Windows' : /Linux/.test(ua) ? 'Linux' : 'dispositivo';
+  const br = /EdgA?\//.test(ua) ? 'Edge' : /SamsungBrowser/.test(ua) ? 'Samsung' : /CriOS|Chrome\//.test(ua) ? 'Chrome' : /FxiOS|Firefox\//.test(ua) ? 'Firefox' : /Safari\//.test(ua) ? 'Safari' : '';
+  return br ? os + ' · ' + br : os;
+}
+const next = () => { const n = new URLSearchParams(location.search).get('next'); return n && n.startsWith('/') && !n.startsWith('//') ? n : '/'; };
+const supported = () => window.isSecureContext && window.PublicKeyCredential && navigator.credentials;
+
+async function doPair(code) {
+  const btn = $('#doPair'); btn.disabled = true; say('preparando…');
+  try {
+    const o = await post('/api/auth/register/options', { code, name: $('#devName').value.trim() || guessName() });
+    if (!o.ok) { say(o.data.error || ('error ' + o.status), 'err'); btn.disabled = false; return; }
+    const pk = o.data.publicKey;
+    pk.challenge = b64uToBuf(pk.challenge); pk.user.id = b64uToBuf(pk.user.id);
+    say('seguí las instrucciones del dispositivo…');
+    const cred = await navigator.credentials.create({ publicKey: pk });
+    const r = await post('/api/auth/register', { code, challenge_id: o.data.challenge_id, name: $('#devName').value.trim() || guessName(), credential: credJSON(cred) });
+    if (!r.ok) { say(r.data.error || ('error ' + r.status), 'err'); btn.disabled = false; return; }
+    say('listo · entrando…', 'ok');
+    history.replaceState(null, '', '/pair');   // el código ya no sirve: que no quede en el historial
+    setTimeout(() => { location.href = '/'; }, 500);
+  } catch (e) { say(why(e), 'err'); btn.disabled = false; }
+}
+
+async function doLogin() {
+  const btn = $('#doLogin'); btn.disabled = true; say('');
+  try {
+    const o = await post('/api/auth/login/options', {});
+    if (!o.ok) { say(o.data.error || ('error ' + o.status), 'err'); btn.disabled = false; return; }
+    if (!o.data.known) { say('no hay dispositivos emparejados para este dominio: emparejá este desde la PC', 'err'); btn.disabled = false; return; }
+    const pk = o.data.publicKey;
+    pk.challenge = b64uToBuf(pk.challenge); pk.allowCredentials = (pk.allowCredentials || []).map(c => ({ type: c.type, id: b64uToBuf(c.id) }));
+    const cred = await navigator.credentials.get({ publicKey: pk });
+    const r = await post('/api/auth/login', { challenge_id: o.data.challenge_id, credential: credJSON(cred) });
+    if (!r.ok) { say(r.data.error || ('error ' + r.status), 'err'); btn.disabled = false; return; }
+    say('entrando…', 'ok'); location.href = next();
+  } catch (e) { say(why(e), 'err'); btn.disabled = false; }
+}
+
+(async () => {
+  const code = location.pathname === '/pair' ? decodeURIComponent(location.hash.slice(1)) : '';
+  if (code) {
+    $('#pair').hidden = false; $('#devName').value = guessName();
+    $('#doPair').onclick = () => doPair(code);
+  } else {
+    // ¿ya adentro? (esta PC o una sesión viva) → directo al hub
+    try { const me = await (await fetch('/api/auth/me')).json(); if (me.authenticated) { location.href = next(); return; } } catch (e) {}
+    $('#login').hidden = false; $('#doLogin').onclick = doLogin;
+    if (location.pathname === '/pair') say('este link no trae código: escaneá el QR de nuevo', 'err');
+  }
+  if (!supported()) { say('este navegador no puede usar passkeys aquí: hace falta https (el túnel) y un navegador actual', 'err'); document.querySelectorAll('button.primary').forEach(b => b.disabled = true); }
+})();

package/public/js/procs.js

@@ -44,6 +44,6 @@ async function openProc(name) {
 async function refreshProcViewer(name) {
   if (procOpen !== name || $('#viewer').style.display === 'none') { clearInterval(procTimer); return; }
   const x = await (await fetch(BASE + '/api/proc/log?name=' + encodeURIComponent(name) + '&tail=400')).json();
-  $('#vbody').textContent = x.log || ''; $('#vmeta').textContent = x.running ? '● corriendo · log en vivo' : '○ terminado';
+  viewerText(); $('#vbody').textContent = x.log || ''; $('#vmeta').textContent = x.running ? '● corriendo · log en vivo' : '○ terminado';
   if (!x.running) { clearInterval(procTimer); loadProcs(); }
 }

package/public/js/pwa.js

@@ -0,0 +1,5 @@
+// pwa.js — registra el service worker (instalable en el celular y en el escritorio). Solo en contexto seguro:
+// https (túnel, VPS) o localhost; por http en la LAN el navegador no lo permite y la app sigue como sitio.
+if ('serviceWorker' in navigator && window.isSecureContext) {
+  window.addEventListener('load', () => { navigator.serviceWorker.register('/sw.js', { scope: '/' }).catch(() => {}); });
+}

package/public/js/tree.js

@@ -1,5 +1,17 @@
-// tree.js — árbol de archivos (panel derecho) con estado git, y el visor de archivos
+// tree.js — árbol de archivos (panel derecho) con estado git, el visor de archivos y el explorador:
+// clic derecho = menú contextual (nuevo archivo/carpeta, abrir, renombrar, duplicar, copiar/cortar/pegar,
+// copiar ruta relativa/absoluta, insertar la ruta en el chat, eliminar), arrastrar y soltar para mover
+// (Ctrl al soltar = copiar; sobre un archivo = a su carpeta), F2 / Supr / Ctrl+C·X·V sobre la fila
+// seleccionada. Las operaciones van a POST /api/fs (lib/fs.syn) y nunca pisan un destino existente.
+// Las carpetas abiertas se recuerdan (localStorage lampson.tree.open) para que un cambio no las cierre.
 let gitStatus = { changes: {} };
+let treeRoot = '';        // ruta absoluta del workspace (para «copiar ruta absoluta»)
+let treeSel = null;       // {path, is_dir, row}: última fila clickeada (izquierdo o derecho)
+let treeClip = null;      // {path, is_dir, op: 'copy'|'cut'}
+let treeDrag = null;      // {path, is_dir} mientras se arrastra
+const openDirs = new Set((() => { try { return JSON.parse(localStorage.getItem('lampson.tree.open') || '[]'); } catch (e) { return []; } })());
+function saveOpen() { try { localStorage.setItem('lampson.tree.open', JSON.stringify([...openDirs])); } catch (e) {} }
+
 async function loadGit() {
   try { gitStatus = await (await fetch(BASE + '/api/git')).json(); } catch (e) { gitStatus = { repo: false, changes: {} }; }
   const g = $('#git'); if (!gitStatus.repo) { g.style.display = 'none'; return; }
@@ -17,37 +29,235 @@ function gitClass(path, isDir) {
   if (!isDir) { const c = ch[path]; return c === '??' ? 'gU' : c === 'A' ? 'gA' : c === 'D' ? 'gD' : c ? 'gM' : ''; }
   const p = path + '/'; for (const k in ch) if (k.startsWith(p)) return 'gM'; return '';
 }
+function parentOf(p) { const i = p.lastIndexOf('/'); return i < 0 ? '.' : p.slice(0, i); }
+function baseOf(p) { return p.slice(p.lastIndexOf('/') + 1); }
+function cssEsc(s) { return (window.CSS && CSS.escape) ? CSS.escape(s) : String(s).replace(/["\\]/g, '\\$&'); }
+function rowOf(path) { return $('#tree').querySelector(`.row[data-path="${cssEsc(path)}"]`); }
+
 async function loadTree() {
   await loadGit();
-  const box = $('#tree'); box.innerHTML = '';
+  const box = $('#tree'); box.innerHTML = ''; box.tabIndex = 0;
   let t; try { t = await (await fetch(BASE + '/api/tree')).json(); } catch (e) { box.innerHTML = '<div class="row none">sin árbol</div>'; return; }
-  const render = (entries, parent, depth) => {
+  treeRoot = t.root || '';
+  const render = (entries, parent) => {
     for (const e of entries) {
       const n = document.createElement('div'); n.className = 'node';
       const gc = gitClass(e.path, e.is_dir); const code = (gitStatus.changes || {})[e.path];
-      const r = document.createElement('div'); r.className = 'row' + (e.is_dir ? ' dir' : '') + (gc ? ' ' + gc : ''); r.title = e.path + (code ? ' · git ' + code : '');
-      r.innerHTML = `<span class="tw">${e.is_dir ? '▸' : ''}</span><span>${esc(e.name)}${e.is_dir ? '/' : ''}</span>` + (code && !e.is_dir ? `<span class="gs">${code === '??' ? 'N' : code}</span>` : '');
+      const cut = treeClip && treeClip.op === 'cut' && treeClip.path === e.path;
+      const r = document.createElement('div'); r.className = 'row' + (e.is_dir ? ' dir' : '') + (gc ? ' ' + gc : '') + (cut ? ' cut' : '');
+      r.title = e.path + (code ? ' · git ' + code : ''); r.dataset.path = e.path; r.dataset.dir = e.is_dir ? '1' : '';
+      r.innerHTML = `<span class="tw">${e.is_dir ? '▸' : ''}</span><span class="nm">${esc(e.name)}${e.is_dir ? '/' : ''}</span>` + (code && !e.is_dir ? `<span class="gs">${code === '??' ? 'N' : code}</span>` : '');
       n.appendChild(r);
+      wireRow(r, e);
       if (e.is_dir) {
-        const k = document.createElement('div'); k.className = 'kids hidden'; render(e.children || [], k, depth + 1); n.appendChild(k);
-        r.querySelector('.tw').textContent = '▸';
-        r.onclick = () => { k.classList.toggle('hidden'); r.querySelector('.tw').textContent = k.classList.contains('hidden') ? '▸' : '▾'; };
-      } else { r.onclick = () => openFile(e.path, r); }
+        const open = openDirs.has(e.path);
+        const k = document.createElement('div'); k.className = 'kids' + (open ? '' : ' hidden'); render(e.children || [], k); n.appendChild(k);
+        r.querySelector('.tw').textContent = open ? '▾' : '▸';
+        r.onclick = () => { select(r, e); toggleDir(r, k, e.path); };
+      } else { r.onclick = () => { select(r, e); openFile(e.path, r); }; }
       parent.appendChild(n);
     }
   };
-  render(t.entries || [], box, 0);
+  render(t.entries || [], box);
   if (t.truncated) { const d = document.createElement('div'); d.className = 'row none'; d.textContent = '… árbol truncado'; box.appendChild(d); }
+  if (treeSel) { const r = rowOf(treeSel.path); if (r) { treeSel.row = r; r.classList.add('sel'); } else treeSel = null; }
+  const vp = $('#vpath').textContent; const ar = vp && rowOf(vp); if (ar && $('#viewer').style.display !== 'none') ar.classList.add('active');
 }
+function toggleDir(r, k, path) {
+  k.classList.toggle('hidden'); const open = !k.classList.contains('hidden');
+  r.querySelector('.tw').textContent = open ? '▾' : '▸';
+  if (open) openDirs.add(path); else openDirs.delete(path); saveOpen();
+}
+function expandDir(path) { if (!path || path === '.') return; openDirs.add(path); saveOpen(); }
+function select(r, e) {
+  document.querySelectorAll('#tree .row.sel').forEach(x => x.classList.remove('sel'));
+  r.classList.add('sel'); treeSel = { path: e.path, is_dir: e.is_dir, row: r };
+}
+
+// ---- arrastrar y soltar: mover (Ctrl = copiar); sobre un archivo = a la carpeta del archivo ----
+function canDrop(d, dir) {
+  if (!d) return false;
+  if (parentOf(d.path) === dir) return false;                                   // ya está ahí
+  if (d.is_dir && (dir === d.path || dir.startsWith(d.path + '/'))) return false; // carpeta dentro de sí misma
+  return true;
+}
+function wireRow(r, e) {
+  r.oncontextmenu = ev => { ev.preventDefault(); ev.stopPropagation(); select(r, e); showMenu(ev.clientX, ev.clientY, { path: e.path, is_dir: e.is_dir, row: r }); };
+  r.draggable = true;
+  r.ondragstart = ev => { treeDrag = { path: e.path, is_dir: e.is_dir }; ev.dataTransfer.effectAllowed = 'copyMove'; ev.dataTransfer.setData('text/plain', e.path); r.classList.add('dragging'); };
+  r.ondragend = () => { treeDrag = null; r.classList.remove('dragging'); document.querySelectorAll('#tree .drop').forEach(x => x.classList.remove('drop')); };
+  // soltar sobre una carpeta = dentro de ella; sobre un archivo = en la carpeta del archivo (se ilumina esa)
+  const dir = e.is_dir ? e.path : parentOf(e.path);
+  const lit = () => (e.is_dir ? r : (rowOf(dir) || $('#tree')));
+  r.ondragover = ev => { if (!canDrop(treeDrag, dir)) return; ev.preventDefault(); ev.stopPropagation(); ev.dataTransfer.dropEffect = ev.ctrlKey ? 'copy' : 'move'; lit().classList.add('drop'); };
+  r.ondragleave = () => lit().classList.remove('drop');
+  r.ondrop = ev => { ev.preventDefault(); ev.stopPropagation(); document.querySelectorAll('#tree .drop, #tree.drop').forEach(x => x.classList.remove('drop')); dropInto(dir, ev.ctrlKey); };
+}
+async function dropInto(dir, copy) {
+  const d = treeDrag; treeDrag = null;
+  if (!canDrop(d, dir)) return;
+  await fsOp(copy ? { op: 'copy', path: d.path, to: dir } : { op: 'move', path: d.path, to: dir }, res => { expandDir(dir); if (!copy) afterMove(d.path, res.path); });
+}
+{
+  const box = $('#tree');
+  box.ondragover = ev => { if (!canDrop(treeDrag, '.')) return; ev.preventDefault(); ev.dataTransfer.dropEffect = ev.ctrlKey ? 'copy' : 'move'; box.classList.add('drop'); };
+  box.ondragleave = () => box.classList.remove('drop');
+  box.ondrop = ev => { ev.preventDefault(); box.classList.remove('drop'); dropInto('.', ev.ctrlKey); };
+  box.oncontextmenu = ev => { if (ev.target.closest('.row')) return; ev.preventDefault(); showMenu(ev.clientX, ev.clientY, null); };
+  box.onkeydown = ev => {
+    if (ev.target.tagName === 'INPUT' || !treeSel) return;
+    const s = treeSel; const key = ev.key.toLowerCase();
+    if (ev.key === 'F2') { ev.preventDefault(); renameInline(s); }
+    else if (ev.key === 'Delete') { ev.preventDefault(); const b = s.row.getBoundingClientRect(); showMenu(b.left + 60, b.bottom, s, 'delete'); }
+    else if (ev.ctrlKey && key === 'c') { ev.preventDefault(); setClip(s, 'copy'); }
+    else if (ev.ctrlKey && key === 'x') { ev.preventDefault(); setClip(s, 'cut'); }
+    else if (ev.ctrlKey && key === 'v') { ev.preventDefault(); pasteInto(s.is_dir ? s.path : parentOf(s.path)); }
+    else if (ev.key === 'Escape') { closeMenu(); }
+  };
+}
+
+// ---- operaciones (POST /api/fs) ----
+async function fsOp(body, onOk) {
+  const r = await api(BASE + '/api/fs', body);
+  if (!r.ok) { add('denied', esc((r.data && r.data.error) || 'error')); loadTree(); return null; }
+  const res = r.data.result || {};
+  if (onOk) onOk(res);
+  await loadTree();
+  return res;
+}
+function afterMove(oldPath, newPath) {
+  if (treeClip && treeClip.path === oldPath) treeClip = null;
+  if (treeSel && treeSel.path === oldPath) treeSel.path = newPath;
+  const vp = $('#vpath'); const v = vp.textContent;
+  if (v === oldPath || v.startsWith(oldPath + '/')) vp.textContent = newPath + v.slice(oldPath.length);
+}
+function afterDelete(path) {
+  if (treeClip && treeClip.path === path) treeClip = null;
+  if (treeSel && (treeSel.path === path || treeSel.path.startsWith(path + '/'))) treeSel = null;
+  const v = $('#vpath').textContent; if (v === path || v.startsWith(path + '/')) { $('#vpath').textContent = ''; showPane('log'); }
+}
+function setClip(s, op) { treeClip = { path: s.path, is_dir: s.is_dir, op }; loadTree(); }
+function canPaste(dir) {
+  if (!treeClip) return false;
+  if (treeClip.op === 'cut') return canDrop(treeClip, dir);
+  return !(treeClip.is_dir && (dir === treeClip.path || dir.startsWith(treeClip.path + '/')));
+}
+async function pasteInto(dir) {
+  if (!canPaste(dir)) return;
+  const c = treeClip;
+  await fsOp(c.op === 'cut' ? { op: 'move', path: c.path, to: dir } : { op: 'copy', path: c.path, to: dir }, res => { expandDir(dir); if (c.op === 'cut') { afterMove(c.path, res.path); treeClip = null; } });
+}
+function absPath(path) {
+  if (!treeRoot) return path;
+  const sep = treeRoot.includes('\\') ? '\\' : '/';
+  const root = treeRoot.replace(/[\\/]+$/, '');
+  return path === '.' ? root : root + sep + path.split('/').join(sep);
+}
+function copyText(t, row) {
+  const done = () => { if (row) { row.classList.add('flash'); setTimeout(() => row.classList.remove('flash'), 700); } };
+  if (navigator.clipboard && navigator.clipboard.writeText) navigator.clipboard.writeText(t).then(done, () => copyFallback(t, done)); else copyFallback(t, done);
+}
+function copyFallback(t, done) { const ta = document.createElement('textarea'); ta.value = t; ta.style.position = 'fixed'; ta.style.opacity = '0'; document.body.appendChild(ta); ta.select(); try { document.execCommand('copy'); } catch (e) {} ta.remove(); done(); }
+function insertInChat(path) {
+  const ta = $('#in'); const v = ta.value;
+  ta.value = v + (v && !/\s$/.test(v) ? ' ' : '') + path + ' ';
+  ta.focus(); ta.dispatchEvent(new Event('input', { bubbles: true }));
+}
+
+// ---- nuevo archivo / carpeta y renombrar: un input en la propia fila ----
+function nameInput(r, value, onDone) {
+  const nm = r.querySelector('.nm'); const inp = document.createElement('input'); inp.className = 'rn'; inp.value = value; inp.spellcheck = false;
+  nm.replaceWith(inp); inp.focus();
+  const dot = value.startsWith('.') ? -1 : value.lastIndexOf('.'); inp.setSelectionRange(0, dot > 0 ? dot : value.length);
+  let finished = false;
+  const finish = ok => { if (finished) return; finished = true; onDone(ok ? inp.value.trim() : null); };
+  inp.onkeydown = ev => { ev.stopPropagation(); if (ev.key === 'Enter') { ev.preventDefault(); finish(true); } else if (ev.key === 'Escape') { ev.preventDefault(); finish(false); } };
+  inp.onblur = () => finish(false);
+  inp.onclick = ev => ev.stopPropagation(); inp.oncontextmenu = ev => ev.stopPropagation();
+}
+function newEntry(dir, isDir) {
+  closeMenu();
+  const box = $('#tree');
+  let holder = box;
+  if (dir !== '.') {
+    const r = rowOf(dir); if (!r) return;
+    const k = r.parentNode.querySelector('.kids'); if (k.classList.contains('hidden')) toggleDir(r, k, dir);
+    holder = k;
+  }
+  const n = document.createElement('div'); n.className = 'node';
+  const r = document.createElement('div'); r.className = 'row new' + (isDir ? ' dir' : ''); r.innerHTML = `<span class="tw">${isDir ? '▸' : ''}</span><span class="nm"></span>`;
+  n.appendChild(r); holder.insertBefore(n, holder.firstChild);
+  nameInput(r, '', name => {
+    n.remove();
+    if (!name) return;
+    fsOp({ op: isDir ? 'mkdir' : 'create', path: dir, name }, res => { expandDir(dir); treeSel = { path: res.path, is_dir: !!res.is_dir }; if (!isDir) openFile(res.path); });
+  });
+}
+function renameInline(s) {
+  closeMenu();
+  const r = s.row || rowOf(s.path); if (!r) return;
+  const old = baseOf(s.path);
+  nameInput(r, old, name => {
+    if (!name || name === old) { loadTree(); return; }
+    fsOp({ op: 'rename', path: s.path, name }, res => afterMove(s.path, res.path));
+  });
+}
+
+// ---- menú contextual ----
+let ctxEl = null;
+function closeMenu() { if (ctxEl) { ctxEl.remove(); ctxEl = null; } }
+document.addEventListener('mousedown', ev => { if (ctxEl && !ctxEl.contains(ev.target)) closeMenu(); }, true);
+document.addEventListener('keydown', ev => { if (ev.key === 'Escape') closeMenu(); });
+window.addEventListener('blur', closeMenu); window.addEventListener('resize', closeMenu);
+$('#tree').addEventListener('scroll', closeMenu);
+// e = {path, is_dir, row} o null (raíz); only = 'delete' abre solo la confirmación de borrado (tecla Supr)
+function showMenu(x, y, e, only) {
+  closeMenu();
+  const isRoot = !e; const path = isRoot ? '.' : e.path; const isDir = isRoot || e.is_dir; const row = e && e.row;
+  const dir = isDir ? path : parentOf(path);      // carpeta donde se crea o se pega
+  const items = [];
+  const del = { l: 'Eliminar', k: 'Supr', danger: true, confirm: '¿eliminar ' + baseOf(path) + (isDir ? '/' : '') + '?', f: () => fsOp({ op: 'delete', path }, () => afterDelete(path)) };
+  if (only === 'delete') items.push(del);
+  else {
+    if (!isDir) items.push({ l: 'Abrir', f: () => openFile(path, row) });
+    items.push({ l: 'Nuevo archivo…', f: () => newEntry(dir, false) }, { l: 'Nueva carpeta…', f: () => newEntry(dir, true) }, 'sep');
+    if (!isRoot) items.push({ l: 'Renombrar', k: 'F2', f: () => renameInline(e) }, { l: 'Duplicar', f: () => fsOp({ op: 'copy', path }) }, 'sep', { l: 'Copiar', k: 'Ctrl+C', f: () => setClip(e, 'copy') }, { l: 'Cortar', k: 'Ctrl+X', f: () => setClip(e, 'cut') });
+    items.push({ l: 'Pegar' + (treeClip ? ' «' + baseOf(treeClip.path) + '»' : ''), k: 'Ctrl+V', dis: !canPaste(dir), f: () => pasteInto(dir) }, 'sep');
+    items.push({ l: 'Copiar ruta', f: () => copyText(path, row) }, { l: 'Copiar ruta absoluta', dis: !treeRoot, f: () => copyText(absPath(path), row) }, { l: 'Insertar en el chat', f: () => insertInChat(path) });
+    if (!isRoot) items.push('sep', del);
+    items.push('sep', { l: 'Recargar', f: loadTree });
+  }
+  const m = document.createElement('div'); m.className = 'ctx';
+  for (const it of items) {
+    if (it === 'sep') { const s = document.createElement('div'); s.className = 'sep'; m.appendChild(s); continue; }
+    const d = document.createElement('div'); d.className = 'it' + (it.dis ? ' dis' : '') + (it.danger ? ' danger' : '');
+    d.innerHTML = `<span>${esc(it.l)}</span>` + (it.k ? `<span class="k">${esc(it.k)}</span>` : '');
+    d.onclick = ev => { ev.stopPropagation(); if (it.confirm) inlineConfirm(d, it.confirm, () => { closeMenu(); it.f(); }); else { closeMenu(); it.f(); } };
+    m.appendChild(d);
+  }
+  document.body.appendChild(m); ctxEl = m;
+  const W = window.innerWidth, H = window.innerHeight, mw = m.offsetWidth, mh = m.offsetHeight;
+  m.style.left = Math.max(4, Math.min(x, W - mw - 4)) + 'px'; m.style.top = Math.max(4, Math.min(y, H - mh - 4)) + 'px';
+  if (only === 'delete') { const first = m.querySelector('.it'); if (first) first.click(); }
+}
+
+// abre el archivo en el editor (js/editor.js): colores por tipo de archivo, Ctrl+S guarda. El <pre> #vbody queda para logs.
 async function openFile(path, row) {
   document.querySelectorAll('.row.active').forEach(x => x.classList.remove('active')); if (row) row.classList.add('active');
   const r = await fetch(BASE + '/api/file?path=' + encodeURIComponent(path)); const d = await r.json();
-  if (!r.ok) { add('denied', esc(d.error || 'error')); return; }
-  $('#vpath').textContent = d.path; $('#vmeta').textContent = d.lines + ' líneas';
-  $('#vbody').className = ''; $('#vbody').innerHTML = String(d.content).split('\n').map((l, i) => `<span class="ln">${i + 1}</span>${esc(l)}`).join('\n');
+  if (!r.ok) { viewerNotice(path, 'no se pudo abrir', String(d.error || 'error')); return; }
+  if (!row) { const ar = rowOf(d.path); if (ar) ar.classList.add('active'); }
+  if (d.binary) { viewerNotice(d.path, 'binario · ' + fmtSize(d.size), 'Este archivo no es texto (base de datos, imagen, fuente, ejecutable…): no se puede mostrar ni editar acá.' + (d.error ? '\n\n' + d.error : '')); return; }
+  $('#vpath').textContent = d.path; $('#vbody').className = '';
+  edOpen(d);
   showPane('viewer'); $('#stage').scrollTop = 0;
 }
+// avisos del visor (binario, error al abrir): en el propio visor, no como mensaje en el chat
+function viewerNotice(path, meta, text) { showText(path, meta, text, false); }
+function fmtSize(n) { n = Number(n) || 0; return n < 1024 ? n + ' B' : n < 1048576 ? (n / 1024).toFixed(1) + ' KB' : (n / 1048576).toFixed(1) + ' MB'; }
 // el árbol se refresca solo cuando una tool pudo crear/borrar archivos, con un pequeño debounce; ↻ lo fuerza a mano
 function treeChanged() { debounce('tree', loadTree, 400); }
 $('#tree-reload').onclick = e => { e.stopPropagation(); const b = e.currentTarget; b.classList.remove('spin'); void b.offsetWidth; b.classList.add('spin'); loadTree(); };
-$('#vclose').onclick = () => { showPane('log'); procOpen = null; clearInterval(procTimer); $('#vbody').className = ''; document.querySelectorAll('.row.active, .m.active, .p.active').forEach(x => x.classList.remove('active')); memOpen = null; };
+function closeViewer(discard) { showPane('log'); procOpen = null; clearInterval(procTimer); $('#vbody').className = ''; document.querySelectorAll('.row.active, .m.active, .p.active').forEach(x => x.classList.remove('active')); memOpen = null; edClose(discard); const x = $('#vclose'); x.classList.remove('ask'); x.textContent = '✕ cerrar'; }
+// con cambios sin guardar, el ✕ pregunta antes (mismo patrón en línea que borrar en el árbol)
+$('#vclose').onclick = () => { if (edVisible() && edDirty()) { inlineConfirm($('#vclose'), '¿descartar cambios?', () => closeViewer(true)); return; } closeViewer(false); };