koneck 2.34.0 → 2.35.1

package/dist/router-failure.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"router-failure.js","sourceRoot":"","sources":["../src/router-failure.ts"],"names":[],"mappings":"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"}

package/dist/web/ui-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ui-client.d.ts","sourceRoot":"","sources":["../../src/web/ui-client.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,wBAAgB,YAAY,IAAI,MAAM,CAmoErC"}
+{"version":3,"file":"ui-client.d.ts","sourceRoot":"","sources":["../../src/web/ui-client.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,wBAAgB,YAAY,IAAI,MAAM,CAk1ErC"}

package/dist/web/ui-client.js

@@ -83,11 +83,14 @@ const el = (tag, cls, text) => {
 };
 const mark = (cls) => el('div', 'mark' + (cls ? ' ' + cls : ''));
 const stream = () => $('stream');
+// The conversation column, which is what scrolls. It used to be the whole chat tab, and the file
+// panel beside it scrolled along with the transcript instead of on its own.
+const conv = () => $('conv');
 const atBottom = () => {
-  const f = $('chatview');
+  const f = conv();
   return f.scrollHeight - f.scrollTop - f.clientHeight < 100;
 };
-const stick = (was) => { if (was) $('chatview').scrollTop = $('chatview').scrollHeight; };
+const stick = (was) => { if (was) conv().scrollTop = conv().scrollHeight; };
 const add = (node) => { const was = atBottom(); stream().appendChild(node); stick(was); return node; };
 const clearHero = () => { const h = stream().querySelector('.hero'); if (h) h.remove(); };
 /**
@@ -402,22 +405,24 @@ function onEvent(e) {
       turn.tools += 1;
       $('livetool').textContent = e.name + (e.detail ? '  ' + e.detail : '');
       renderTool(e);
-      // Follow it: the path a tool names is the file to be looking at.
-      watchPath(pathFromTool(e), e.name, false);
+      // Follow it: not just which file, but which lines and which pattern.
+      watchTool(e, false);
       break;
     case 'tool-output':
       if (state.lastTool) {
         state.lastTool.body.textContent =
           (state.lastTool.body.textContent + e.line + '\n').slice(-5000);
       }
+      // And in the panel, where a running command is the thing being watched.
+      watchOutput(e.line);
       break;
     case 'tool-done': {
       finishTool(e);
       setBusy(true, 'thinking');
       $('livetool').textContent = '';
       // Once it has finished writing, the diff is what there is to see.
-      const wrotePath = pathFromTool(e);
-      if (e.ok && toolWrites(e.name)) watchPath(wrotePath || follow.path, e.name, true);
+      watchTool(e, true);
+      stopWatchClock();
       break;
     }
     case 'plan': renderPlan(e.steps); break;
@@ -1627,7 +1632,7 @@ async function openPast(file) {
   if (!data.entries.length) {
     stream().appendChild(el('div', 'empty', 'This session has no transcript in it.'));
   }
-  $('chatview').scrollTop = 0;
+  conv().scrollTop = 0;
 }
 
 async function refreshSessions() {
@@ -1849,40 +1854,59 @@ $('pmode').onclick = async () => {
   }
   $('modedlg').showModal();
 };
-/* ── following the file being worked on ───────────────────────────────────────────────────── */
+/* ── watching it work ─────────────────────────────────────────────────────────────────────── */
 
 /**
- * The panel beside the conversation, showing whatever the agent is touching.
+ * The panel beside the conversation, showing what the agent is doing while it does it.
  *
- * On by default, because the interesting part of watching an agent work is watching files change,
- * and a view you have to go and click is one you find out about after the fact. Remembered per
- * browser: a preference about a layout belongs to whoever is looking at it.
+ * Not "the last file it mentioned". A tool call says more than which file: read_files says which
+ * LINES, grep_search says which pattern, execute_command streams its output as it runs. All of that
+ * was already arriving and being thrown away, and the difference between showing a file and showing
+ * the four lines actually read is the difference between a decoration and a view.
+ *
+ * On by default, remembered per browser, and closable three ways — the pill, the panel's own
+ * button, and Escape — because a panel that follows you around had better be easy to stop.
  */
 const follow = {
   on: (() => { try { return localStorage.getItem('koneck.follow') !== 'off'; } catch (e) { return true; } })(),
   path: null,
-  /** Set while a fetch is in flight, so a burst of tool calls does not queue a burst of requests. */
+  /** 'code' | 'diff' | 'term' — what the body is currently showing. */
+  kind: null,
+  verb: '',
   busy: false,
-  /** The path a newer tool named while a fetch was running. */
   pending: null,
+  /** Line numbers under attention, one-based. */
+  attention: [],
+  /** Text to mark inside those lines: a grep pattern, or the text a replace is looking for. */
+  needle: null,
+  /** Lines of a running command's output, in arrival order. */
+  output: [],
+  /** Everything this turn has touched: { label, path, verb, kind, ok }. */
+  trail: [],
+  startedAt: 0,
+  timer: null,
 };
 
-/** The file a tool is acting on, from its arguments. Null when it is not about a file. */
-function pathFromTool(e) {
-  let args = e.args;
-  if (!args && e.detail) args = null;
-  if (args) {
-    try {
-      const parsed = JSON.parse(args);
-      for (const key of ['path', 'file', 'filename', 'file_path']) {
-        if (typeof parsed[key] === 'string' && parsed[key].trim()) return parsed[key].trim();
-      }
-      if (Array.isArray(parsed.paths) && typeof parsed.paths[0] === 'string') return parsed.paths[0];
-    } catch (err) { /* not JSON: fall through to the one-line detail */ }
-  }
-  // The detail line is often just the path, which is enough to follow by.
-  if (e.detail && /[./]/.test(e.detail) && !/\s/.test(e.detail.trim())) return e.detail.trim();
-  return null;
+/** How many output lines a command keeps in view. Beyond this the head is dropped. */
+const WATCH_OUTPUT_LINES = 400;
+
+/** What a tool is doing, as a word. The verb is the most informative thing in the header. */
+function verbFor(name) {
+  const n = String(name || '');
+  if (/^read_files$/.test(n)) return 'reading';
+  if (/grep|search_files/.test(n)) return 'searching';
+  if (/glob/.test(n)) return 'matching';
+  if (/list_dir/.test(n)) return 'listing';
+  if (/^write_file$/.test(n)) return 'writing';
+  if (/edit|patch|apply_diff|search_replace/.test(n)) return 'editing';
+  if (/execute_command|run/.test(n)) return 'running';
+  if (/delete/.test(n)) return 'deleting';
+  if (/move|rename/.test(n)) return 'moving';
+  if (/^git_/.test(n)) return n.replace('git_', 'git ');
+  if (/code_lookup/.test(n)) return 'asking the compiler';
+  if (/fetch_url|web_search/.test(n)) return 'fetching';
+  if (/^mcp__/.test(n)) return n.split('__')[1] || 'calling';
+  return 'working';
 }
 
 /** Whether a tool changes a file, which decides whether the panel shows content or a diff. */
@@ -1890,37 +1914,217 @@ function toolWrites(name) {
   return /write|edit|patch|replace|apply|create|delete|move|rename|format/i.test(name || '');
 }
 
+/**
+ * Everything a tool call says about where it is looking.
+ *
+ * The arguments are the only honest source for this: a detail line is a summary written for a
+ * transcript row, and guessing a path out of prose is how a panel ends up confidently showing the
+ * wrong file.
+ */
+function targetOf(e) {
+  const out = { path: null, lines: [], needle: null, command: null };
+  let parsed = null;
+  try { parsed = e.args ? JSON.parse(e.args) : null; } catch (err) { parsed = null; }
+  if (parsed) {
+    for (const key of ['path', 'file', 'file_path', 'filename']) {
+      if (typeof parsed[key] === 'string' && parsed[key].trim()) { out.path = parsed[key].trim(); break; }
+    }
+    if (!out.path && Array.isArray(parsed.paths) && typeof parsed.paths[0] === 'string') {
+      out.path = parsed.paths[0];
+    }
+    // read_files says which lines. This is the whole point: showing the region, not the file.
+    if (typeof parsed.offset === 'number') {
+      const from = Math.max(1, parsed.offset);
+      const count = typeof parsed.limit === 'number' && parsed.limit > 0 ? parsed.limit : 40;
+      for (let i = from; i < from + Math.min(count, 400); i++) out.lines.push(i);
+    }
+    if (typeof parsed.pattern === 'string') out.needle = parsed.pattern;
+    if (typeof parsed.search === 'string') out.needle = parsed.search;
+    if (typeof parsed.command === 'string') out.command = parsed.command;
+  }
+  if (!out.path && !out.command && e.detail && /[./]/.test(e.detail) && !/\s/.test(e.detail.trim())) {
+    out.path = e.detail.trim();
+  }
+  return out;
+}
+
 function setFollow(on) {
   follow.on = on;
   try { localStorage.setItem('koneck.follow', on ? 'on' : 'off'); } catch (e) {}
   $('pfollow').innerHTML = 'follow <b>' + (on ? 'on' : 'off') + '</b>';
-  $('watch').hidden = !on || !follow.path;
-  if (on && follow.path) void showWatched(follow.path, null);
+  $('watch').hidden = !on || (!follow.path && follow.kind !== 'term');
+  if (!on) stopWatchClock();
+  else if (follow.path) void showWatched(follow.path, follow.kind === 'diff');
 }
 
-/** Points the panel at a path. Cheap to call repeatedly; only the newest target is fetched. */
-function watchPath(path, toolName, wrote) {
-  if (!follow.on || !path) return;
-  follow.path = path;
+function stopWatchClock() {
+  if (follow.timer) { clearInterval(follow.timer); follow.timer = null; }
+  $('wms').textContent = '';
+}
+
+/** The header: the verb, the target, and how long this step has been going. */
+function watchHead(verb, target) {
+  $('wtool').textContent = verb;
+  $('wpath').textContent = target;
+  follow.startedAt = Date.now();
+  if (!follow.timer) {
+    follow.timer = setInterval(() => {
+      $('wms').textContent = ms(Date.now() - follow.startedAt);
+    }, 200);
+  }
+}
+
+/** Adds to the trail, or marks the existing entry live. Bounded, newest last. */
+function trailPush(entry) {
+  const key = entry.label;
+  const existing = follow.trail.find((t) => t.label === key);
+  if (existing) { Object.assign(existing, entry); } else { follow.trail.push(entry); }
+  while (follow.trail.length > 14) follow.trail.shift();
+  drawTrail(key);
+}
+
+function drawTrail(activeLabel) {
+  const host = $('wtrail');
+  host.innerHTML = '';
+  host.hidden = follow.trail.length === 0;
+  for (const t of follow.trail) {
+    const chip = el('div', 'wchip' + (t.label === activeLabel ? ' on' : '') + (t.ok === false ? ' bad' : ''));
+    chip.appendChild(el('span', 'dot'));
+    chip.appendChild(el('span', null, t.label));
+    chip.title = t.verb + ' ' + (t.path || t.label);
+    // A trail you can walk back along. Revisiting stops the panel following, because otherwise
+    // the next tool call would yank it away from whatever you went back to look at.
+    chip.onclick = () => {
+      if (t.kind === 'term') { drawTerm(t.verb, t.command || t.label, t.lines || []); drawTrail(t.label); return; }
+      follow.path = t.path;
+      follow.attention = t.lines || [];
+      follow.needle = t.needle || null;
+      watchHead(t.verb, t.path || t.label);
+      stopWatchClock();
+      void showWatched(t.path, t.kind === 'diff');
+      drawTrail(t.label);
+    };
+    host.appendChild(chip);
+  }
+  // Keep the live end in view without dragging the reader back if they scrolled away.
+  if (activeLabel) host.scrollLeft = host.scrollWidth;
+}
+
+/** Points the panel at whatever a tool call is about. Cheap to call on every event. */
+function watchTool(e, done) {
+  if (!follow.on) return;
+  const t = targetOf(e);
+  const verb = verbFor(e.name);
+
+  if (t.command) {
+    // A command is not a file, and its output IS the thing to watch.
+    follow.kind = 'term';
+    follow.path = null;
+    if (!done) { follow.output = []; follow.verb = verb; }
+    $('watch').hidden = false;
+    watchHead(verb, t.command);
+    drawTerm(verb, t.command, follow.output);
+    trailPush({ label: t.command.split(/\s+/)[0] || 'command', verb, kind: 'term',
+                command: t.command, lines: follow.output, ok: done ? e.ok !== false : undefined });
+    return;
+  }
+  if (!t.path) return;
+
+  follow.path = t.path;
+  follow.attention = t.lines;
+  follow.needle = t.needle;
+  follow.kind = done && toolWrites(e.name) ? 'diff' : 'code';
+  follow.verb = verb;
   $('watch').hidden = false;
-  $('wpath').textContent = path;
-  $('wtool').textContent = toolName || 'watching';
-  if (follow.busy) { follow.pending = [path, wrote]; return; }
-  void showWatched(path, wrote);
+  watchHead(verb, t.path);
+  trailPush({ label: t.path.split('/').pop() || t.path, verb, kind: follow.kind, path: t.path,
+              lines: t.lines, needle: t.needle, ok: done ? e.ok !== false : undefined });
+
+  if (follow.busy) { follow.pending = [t.path, follow.kind === 'diff']; return; }
+  void showWatched(t.path, follow.kind === 'diff');
+}
+
+/** A line of a running command, as it arrives. */
+function watchOutput(line) {
+  if (!follow.on || follow.kind !== 'term') return;
+  follow.output.push(line);
+  while (follow.output.length > WATCH_OUTPUT_LINES) follow.output.shift();
+  const host = $('wbody');
+  const term = host.querySelector('.wterm');
+  if (!term) return;
+  const wasAtEnd = host.scrollHeight - host.scrollTop - host.clientHeight < 40;
+  term.appendChild(el('span', 'ln', line));
+  // Follows the tail, unless the reader has scrolled up to look at something.
+  if (wasAtEnd) host.scrollTop = host.scrollHeight;
+}
+
+function drawTerm(verb, command, lines) {
+  const host = $('wbody');
+  host.innerHTML = '';
+  const term = el('div', 'wterm');
+  term.appendChild(el('span', 'cmd', '$ ' + command));
+  for (const line of lines) term.appendChild(el('span', 'ln', line));
+  if (lines.length === 0) term.appendChild(el('span', 'stub', 'waiting for output…'));
+  host.appendChild(term);
 }
 
 /**
- * Draws the panel.
+ * Draws a file, with the region under attention marked.
  *
- * A file that was only read is shown as itself. A file that was just written is shown as its diff,
- * because what changed is the thing worth seeing and reading the whole file to find three new
- * lines is work the panel should be doing.
+ * The gutter and the source are separate columns, so a highlight has to be applied to both or the
+ * numbers and the tint drift apart the moment a line wraps — which is why neither column wraps.
  */
-async function showWatched(path, wrote) {
+function drawCode(text, attention, needle) {
+  const lines = text.split('\n');
+  const hot = new Set(attention || []);
+  const code = el('div', 'rows');
+
+  /*
+   * One element per line in each column, and no newline characters inside them.
+   *
+   * The first version was a text node per line carrying its own newline, highlighted with an
+   * inline-block. It measured correct — seventy rows in each column, the same four marked — and
+   * rendered wrong: four consecutive highlighted lines came out as one, and the gutter jumped from
+   * 44 to 49. An inline-block whose content ends in a newline, inside a pre-formatted parent, is
+   * a layout argument nobody wins. Block rows cannot drift: row N of one column is row N of the
+   * other, because each is exactly one line box tall by construction.
+   */
+  const gut = el('div', 'gut');
+  const src = el('div', 'src');
+  for (let i = 0; i < lines.length; i++) {
+    const n = i + 1;
+    const marked = hot.has(n);
+    gut.appendChild(el('div', marked ? 'on' : null, String(n)));
+
+    const one = lines[i];
+    const row = el('div', marked ? 'on' : null);
+    // The exact text a pattern matched, inside the line — the finest grain the tool gives us.
+    let did = false;
+    if (needle && one) {
+      const at = one.indexOf(needle);
+      if (at !== -1) {
+        row.appendChild(document.createTextNode(one.slice(0, at)));
+        row.appendChild(el('span', 'hit', needle));
+        row.appendChild(document.createTextNode(one.slice(at + needle.length)));
+        did = true;
+      }
+    }
+    // An empty line still needs to occupy one, or every column below it is off by one.
+    if (!did) row.textContent = one === '' ? '\u200b' : one;
+    src.appendChild(row);
+  }
+  code.appendChild(gut);
+  code.appendChild(src);
+  return code;
+}
+
+/** Draws the panel for a path: the file itself, or its diff once it has been written. */
+async function showWatched(path, asDiff) {
+  if (!path) return;
   follow.busy = true;
   const host = $('wbody');
   try {
-    if (wrote && state.session) {
+    if (asDiff && state.session) {
       let ch = null;
       try {
         const out = await api('/api/changes?session=' + encodeURIComponent(state.session));
@@ -1929,7 +2133,7 @@ async function showWatched(path, wrote) {
       if (ch && ch.diff) {
         host.innerHTML = '';
         const head = el('div', 'wempty');
-        head.style.padding = '8px 12px';
+        head.style.padding = '8px 13px';
         head.textContent = '+' + ch.added + '  \u2212' + ch.removed + '  ' + ch.kind;
         host.appendChild(head);
         host.appendChild(renderDiff(ch.diff));
@@ -1948,15 +2152,12 @@ async function showWatched(path, wrote) {
       host.appendChild(el('div', 'wempty', 'Binary file — nothing to show as text.'));
       return;
     }
-    const code = el('div', 'code');
-    const lines = data.text.split('\n');
-    code.appendChild(el('div', 'gut', lines.map((_, i) => i + 1).join('\n')));
-    code.appendChild(el('div', 'src', data.text));
-    host.appendChild(code);
+    host.appendChild(drawCode(data.text, follow.attention, follow.needle));
+    // Put the region being read in the middle of the panel, which is the point of knowing it.
+    const first = host.querySelector('.src .on');
+    if (first) first.scrollIntoView({ block: 'center' });
   } finally {
     follow.busy = false;
-    // A newer target arrived while this was in flight: honour the last one and drop the rest,
-    // which is what keeps a run of twenty edits to twenty files at one request rather than twenty.
     if (follow.pending) {
       const next = follow.pending;
       follow.pending = null;
@@ -1967,6 +2168,12 @@ async function showWatched(path, wrote) {
 
 $('pfollow').onclick = () => setFollow(!follow.on);
 $('wclose').onclick = () => setFollow(false);
+// Escape closes it too, unless something modal is open — a dialog owns Escape while it is up.
+addEventListener('keydown', (ev) => {
+  if (ev.key !== 'Escape' || $('watch').hidden) return;
+  if (document.querySelector('dialog[open]') || !$('palette').hidden) return;
+  setFollow(false);
+});
 
 /* ── choosing a model ────────────────────────────────────────────────────────────────────── */
 

package/dist/web/ui-client.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-client.js","sourceRoot":"","sources":["../../src/web/ui-client.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,YAAY;IAC1B,OAAO,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAioElB,CAAC;AACF,CAAC"}
+{"version":3,"file":"ui-client.js","sourceRoot":"","sources":["../../src/web/ui-client.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,YAAY;IAC1B,OAAO,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAg1ElB,CAAC;AACF,CAAC"}

package/dist/web/ui-css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ui-css.d.ts","sourceRoot":"","sources":["../../src/web/ui-css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,wBAAgB,GAAG,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CA8iB3C"}
+{"version":3,"file":"ui-css.d.ts","sourceRoot":"","sources":["../../src/web/ui-css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,wBAAgB,GAAG,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CA2nB3C"}

package/dist/web/ui-css.js

@@ -20,6 +20,8 @@ export function css(markUrl) {
   --cyan:#0d7f92; --cyan-ink:#ffffff; --amber:#8a5a00; --green:#0f7a4a; --red:#b4232a;
   --violet:#6d4bc4;
   --add-bg:#e4f6ea; --add-ink:#0d5c37; --del-bg:#fdeaea; --del-ink:#8f1c22;
+  /* The region a tool is reading, and the exact text it matched inside that region. */
+  --attn-bg:#e8f4fb; --attn-hit:#bde4f7;
   --shadow:0 1px 2px rgba(15,28,34,.07), 0 8px 24px rgba(15,28,34,.05);
   --radius:10px; --mono:ui-monospace,'SF Mono',Menlo,Consolas,'DejaVu Sans Mono',monospace;
   --mark:url("${markUrl}");
@@ -31,6 +33,8 @@ export function css(markUrl) {
     --cyan:#4dd6e8; --cyan-ink:#04181c; --amber:#e8b04d; --green:#57d99a; --red:#ef767b;
     --violet:#b39cfb;
     --add-bg:#0f2a1e; --add-ink:#7ee0a7; --del-bg:#2b1416; --del-ink:#f4a3a6;
+  --attn-bg:#10222c; --attn-hit:#1c3f52;
+    --attn-bg:#10222c; --attn-hit:#1c3f52;
     --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.3);
   }
 }
@@ -114,6 +118,20 @@ header{height:47px;flex:0 0 47px;border-bottom:1px solid var(--line);display:fle
 .stopbtn{border:1px solid var(--red);color:var(--red);border-radius:999px;padding:4px 11px}
 
 .view{flex:1;overflow-y:auto;min-height:0}
+/*
+ * The hidden attribute wins, always.
+ *
+ * A browser hides [hidden] with display:none at the same specificity as a single class, and this
+ * stylesheet comes later, so any rule setting display on a class silently beats it and the
+ * element can never be hidden. Reported as a panel that would not close: the button set the
+ * attribute, nothing happened, and because the state behind it HAD changed the visible panel
+ * then stopped updating. One cause, two symptoms that looked unrelated.
+ *
+ * Every element added since has needed its own guard — .view, .live, .attached, footer, #palette —
+ * and .watch was the one that did not get one. So it is stated once, for anything hidden ever.
+ */
+[hidden]{display:none!important}
+
 .view[hidden]{display:none}
 .wrap{max-width:840px;margin:0 auto;padding:24px}
 .hero{text-align:center;padding:12vh 0 0;color:var(--muted)}
@@ -525,8 +543,18 @@ dialog:has(.dlg.wide){max-width:560px}
  * find out about afterwards. This follows the tool calls: the path a tool names becomes the panel,
  * and once the file has actually been written it becomes that file's diff.
  */
+/*
+ * Two scrollers, not one.
+ *
+ * .view is the scroller for every other tab, and the panel started out inside it — so scrolling
+ * the conversation scrolled the file with it, and the panel's own overflow never came into play
+ * because nothing bounded its height. The chat tab therefore does not scroll itself: the split
+ * fills it, and each half scrolls independently.
+ */
+#chatview{overflow:hidden;display:flex}
 .chatsplit{flex:1;display:flex;min-height:0;min-width:0}
-.chatsplit .wrap{flex:1 1 auto;min-width:0}
+.chatsplit .conv{flex:1 1 auto;min-width:0;overflow-y:auto;overflow-x:hidden}
+.chatsplit .conv .wrap{min-width:0}
 .watch{flex:0 0 44%;max-width:720px;min-width:0;border-left:1px solid var(--line);
   display:flex;flex-direction:column;background:var(--panel-2)}
 .whead{display:flex;gap:9px;align-items:center;padding:9px 12px;background:var(--panel);
@@ -535,13 +563,62 @@ dialog:has(.dlg.wide){max-width:560px}
   flex:0 0 auto}
 .whead .wp{font-family:var(--mono);font-size:12px;flex:1;min-width:0;overflow:hidden;
   text-overflow:ellipsis;white-space:nowrap;direction:rtl;text-align:left}
-.whead .wx{flex:0 0 auto;background:none;border:0;color:var(--dim);font-size:15px;cursor:pointer;
-  line-height:1;padding:0 2px}
-.whead .wx:hover{color:var(--red)}
-.wbody{flex:1;overflow:auto;min-height:0}
+.whead .wms{flex:0 0 auto;font-size:10.5px;color:var(--dim);font-variant-numeric:tabular-nums;
+  font-family:var(--mono)}
+/* A real hit area: a 15px glyph is a thing you aim at, not a thing you click. */
+.whead .wx{flex:0 0 auto;background:none;border:0;color:var(--dim);font-size:17px;cursor:pointer;
+  line-height:1;padding:2px 8px;margin:-4px -6px -4px 0;border-radius:6px}
+.whead .wx:hover{color:var(--red);background:var(--panel-2)}
+.wbody{flex:1;overflow:auto;min-height:0;position:relative}
 .wbody .code{min-height:100%}
 .wbody .diff{border-top:0}
 .wempty{padding:22px 14px;color:var(--dim);font-size:12.5px;line-height:1.6}
+
+/*
+ * Where it is looking, not just what at.
+ *
+ * A tool call says which lines it is reading and which pattern it is matching, so the panel can
+ * mark them: the region under attention is tinted and carries a marker in the gutter. Watching a
+ * file scroll past is not the same as seeing which four lines were actually read.
+ */
+/*
+ * A row per line, in both columns.
+ *
+ * Not inline-blocks carrying their own newline: that measured correct and rendered wrong, four
+ * highlighted lines collapsing into one and the gutter jumping 44 → 49. A block row is exactly one
+ * line box by construction, so row N of the gutter is row N of the source and no highlight can
+ * make them drift.
+ */
+.rows{display:flex;font-family:var(--mono);font-size:12.5px;line-height:1.5;align-items:stretch}
+.rows .gut{flex:0 0 auto;padding:10px 10px 10px 14px;text-align:right;color:var(--dim);
+  background:var(--panel);border-right:1px solid var(--line);user-select:none;
+  font-variant-numeric:tabular-nums}
+.rows .src{flex:1 1 auto;padding:10px 0 10px 14px;min-width:0;overflow-x:auto;tab-size:4}
+.rows .gut > div,.rows .src > div{white-space:pre;height:1.5em}
+.rows .gut > div.on{color:var(--cyan);background:var(--attn-bg)}
+.rows .src > div.on{background:var(--attn-bg);box-shadow:inset 2px 0 0 var(--cyan)}
+.rows .src .hit{background:var(--attn-hit);border-radius:2px}
+
+/* A command, as it runs. */
+.wterm{font-family:var(--mono);font-size:11.5px;line-height:1.5;padding:10px 13px;
+  white-space:pre-wrap;word-break:break-word;color:var(--muted)}
+.wterm .cmd{color:var(--cyan);display:block;margin-bottom:7px}
+.wterm .ln{display:block}
+.wterm .stub{color:var(--dim);font-style:italic}
+
+/* The trail: everything this turn has touched, still reachable. */
+.wtrail{flex:0 0 auto;display:flex;gap:6px;padding:8px 10px;overflow-x:auto;
+  border-top:1px solid var(--line);background:var(--panel)}
+.wtrail::-webkit-scrollbar{height:0}
+.wchip{flex:0 0 auto;display:flex;gap:5px;align-items:center;padding:3px 9px;border-radius:999px;
+  border:1px solid var(--line);background:var(--panel-2);font-size:11px;cursor:pointer;
+  white-space:nowrap;color:var(--muted);font-family:var(--mono)}
+.wchip:hover{border-color:var(--cyan);color:var(--ink)}
+.wchip.on{border-color:var(--cyan);color:var(--cyan)}
+.wchip .dot{width:5px;height:5px;border-radius:50%;background:var(--dim);flex:0 0 auto}
+.wchip.on .dot{background:var(--cyan)}
+.wchip.bad .dot{background:var(--red)}
+
 @media (max-width:1100px){ .watch{display:none} }
 
 /*

package/dist/web/ui-css.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-css.js","sourceRoot":"","sources":["../../src/web/ui-css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,GAAG,CAAC,OAAe;IACjC,OAAO;;;;;;;;;;gBAUO,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkiBtB,CAAC;AACF,CAAC"}
+{"version":3,"file":"ui-css.js","sourceRoot":"","sources":["../../src/web/ui-css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,GAAG,CAAC,OAAe;IACjC,OAAO;;;;;;;;;;;;gBAYO,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6mBtB,CAAC;AACF,CAAC"}

package/dist/web/ui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/web/ui.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAOH,wBAAgB,IAAI,IAAI,MAAM,CA2O7B"}
+{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/web/ui.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAOH,wBAAgB,IAAI,IAAI,MAAM,CAmP7B"}

package/dist/web/ui.js

@@ -65,6 +65,8 @@ export function page() {
 
   <div class="view" id="chatview">
    <div class="chatsplit">
+    <!-- The conversation is its own scroller so the panel beside it can be another. -->
+    <div class="conv" id="conv">
     <div class="wrap" id="stream">
       <div class="hero">
         <div class="mark"></div>
@@ -77,15 +79,21 @@ export function page() {
         </div>
       </div>
     </div>
+    </div>
     <!-- The file being worked on, beside the conversation rather than behind a tab. A tool call
          names a path; this shows it, and shows the diff once the file has actually been written. -->
     <aside class="watch" id="watch" hidden>
       <div class="whead">
         <span class="wt" id="wtool">watching</span>
         <span class="wp" id="wpath">&mdash;</span>
-        <button class="wx" id="wclose" title="Stop following (also the follow pill)">&times;</button>
+        <span class="wms" id="wms"></span>
+        <button type="button" class="wx" id="wclose" aria-label="Stop following"
+                title="Stop following — or press Escape, or the follow pill">&times;</button>
       </div>
       <div class="wbody" id="wbody"></div>
+      <!-- Everything this turn has touched, in order. The current one is live; the rest are
+           one click away, which is what makes it a record rather than a glimpse. -->
+      <div class="wtrail" id="wtrail" hidden></div>
     </aside>
    </div>
   </div>

package/dist/web/ui.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui.js","sourceRoot":"","sources":["../../src/web/ui.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,MAAM,UAAU,IAAI;IAClB,OAAO;;;;;;;SAOA,GAAG,CAAC,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA+NF,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC;EAC7C,YAAY,EAAE;;eAED,CAAC;AAChB,CAAC"}
+{"version":3,"file":"ui.js","sourceRoot":"","sources":["../../src/web/ui.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,MAAM,UAAU,IAAI;IAClB,OAAO;;;;;;;SAOA,GAAG,CAAC,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAuOF,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC;EAC7C,YAAY,EAAE;;eAED,CAAC;AAChB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "koneck",
-  "version": "2.34.0",
+  "version": "2.35.1",
   "description": "Kinetically Orchestrated Neural Execution Engine for Code",
   "type": "module",
   "bin": {