@threadcrumbs/common 0.1.4 → 0.1.5

package/telemetry/claude-code.mjs

@@ -6,7 +6,8 @@ import { awaitedPeers, readLiveSessions, transcriptDetail, transcriptReader, tur
 import { exists, listDirs, listFiles, num } from '../lib/fsutil.mjs'
 import { contextBreakdown } from '../lib/context-breakdown.mjs'
 import { recentReaders } from '../lib/jsonl-follower.mjs'
-import { DETAIL_LIMITS, RECENT_MS, askOf, number, planSummary, sampleList, text, titleFromPrompt, toolNow } from '../lib/telemetry-fields.mjs'
+import { nameKind } from '../lib/tool-kinds.mjs'
+import { DETAIL_LIMITS, RECENT_MS, askOf, filePaths, number, planSummary, sampleList, text, titleFromPrompt, toolNow } from '../lib/telemetry-fields.mjs'
 
 export { nextPlan } from '../lib/telemetry-fields.mjs'
 
@@ -27,10 +28,10 @@ export function claudeCode({
   const projectsDir = path.join(home, 'projects')
   const liveDir = path.join(home, 'sessions')
   const catalogDir = path.join(home, 'cache', 'model-catalog')
-  const transcripts = transcriptReader({ detail: true })
+  const transcripts = transcriptReader({ detail: true, sizes: true })
   const subagentFiles = transcriptReader()
   const subagentDetails = transcriptReader({ detail: true, words: true })
-  const openedFor = recentReaders(() => transcriptReader({ words: true, sizes: true }), OPENED_KEPT)
+  const openedFor = recentReaders(() => transcriptReader({ words: true, tail: true }), OPENED_KEPT)
   const desktopRecords = desktopRecordReader()
   const olderReaders = new Map()
   const metas = new Map()
@@ -219,11 +220,11 @@ export function claudeCode({
     const read = await openedFor(file).read(file, stat).catch(() => null)
     const limit = contextLimit(limits, state.model)
     const reserved = limit ? Math.min(RESERVED_TOKENS, limit) : RESERVED_TOKENS
-    return { words: read?.words ?? null, contextBreakdown: contextBreakdown(read?.sizes, { total: state.context, limit, reserved }) }
+    return { words: read?.words ?? null, contextBreakdown: contextBreakdown(state.sizes, { total: state.context, limit, reserved }) }
   }
 
   function olderReader(file) {
-    const reader = olderReaders.get(file) || transcriptReader({ detail: true })
+    const reader = olderReaders.get(file) || transcriptReader({ detail: true, sizes: true })
     olderReaders.delete(file)
     olderReaders.set(file, reader)
     while (olderReaders.size > OLDER_KEPT) olderReaders.delete(olderReaders.keys().next().value)
@@ -252,13 +253,14 @@ export function claudeCode({
     }
   }
 
-  async function sessionDetail(sessionKey, { subagent = null } = {}) {
+  async function sessionDetail(sessionKey, { subagent = null, filesOnly = false } = {}) {
     const id = String(sessionKey).replace(/^claude-code:/, '')
     const file = known.get(id)
     const stat = file ? await fsp.stat(file).catch(() => null) : null
     if (!stat) return null
     if (subagent != null) return subagentDetail(file, id, String(subagent))
     const state = await transcripts.read(file, stat)
+    if (filesOnly) return { id: `claude-code:${id}`, sessionId: id, files: filePaths(state.detail.files, state.cwd) }
     const said = await opened(file, stat, state, await contextLimits())
     return {
       id: `claude-code:${id}`,
@@ -334,7 +336,10 @@ function statusOf({ running, state, calls, subagents, awaiting, lastAt, mark, un
   const failedTurn = failed || Boolean(mark?.failed)
   const quiet = () => (unread ? ['done', 'unread'] : ['idle', mark ? 'read' : 'quiet'])
   if (running) {
-    if (running.status === 'waiting') return ['asking', calls.some((c) => c.questions) ? 'question' : calls.length ? 'approval' : 'waiting']
+    if (running.status === 'waiting') {
+      const asked = calls.filter((c) => (c.kind ?? nameKind(c.name)) !== 'agent')
+      return ['asking', asked.some((c) => c.questions) ? 'question' : asked.length ? 'approval' : 'waiting']
+    }
     const busy = running.status ? running.status === 'busy' : midTurn
     if (busy) return onlyAgents ? ['delegating', 'subagents'] : ['working', running.status ? 'process-busy' : 'turn-open']
     if (subagents || awaiting.length) return ['delegating', subagents ? 'subagents' : 'awaiting']
@@ -364,7 +369,8 @@ function toSession({ id, state, stat, running, subagents, workingSubagents, awai
   const unread = Boolean(mark) && (state.handedBackAt || mark.activeAt) > mark.focusedAt
   const calls = [...state.open.values()].sort((a, b) => a.startedAt - b.startedAt)
   const [status, statusReason] = statusOf({ running, state, calls, subagents, awaiting, lastAt: lastActivityAt, mark, unread, now })
-  const errorText = state.detail?.errors.at(-1)?.message || mark?.errorText || ''
+  const markFailed = Boolean(mark?.failed) && !turnEnding(state).failed
+  const errorText = (markFailed && mark.errorText) || state.detail?.errors.at(-1)?.message || mark?.errorText || ''
   const midTurn = Boolean(state.ending && !state.ending.handedBack)
   const turnOpen = midTurn && (status === 'working' || status === 'delegating' || status === 'asking')
   const { projectPath, project, worktree } = projectOf(mark?.cwd || state.firstCwd || state.cwd, mark?.originCwd)

package/telemetry/codex.mjs

@@ -19,6 +19,7 @@ import {
   emptySample,
   endCall,
   fileList,
+  filePaths,
   inputKind,
   joinedText,
   keepNewest,
@@ -34,6 +35,7 @@ import {
   startCall,
   text,
   textList,
+  wordsFull,
   titleFromPrompt,
   toolInput,
   toolNow,
@@ -43,6 +45,7 @@ import {
 const ACTIVE_WINDOW_MS = 30 * 60 * 1000
 const SUBAGENT_WINDOW_MS = 10 * 60 * 1000
 const OPENED_KEPT = 3
+const TAIL_BYTES = 512 * 1024
 const COMPACT_SHARE = 0.9
 const REPORTED_SHARE = 0.95
 const ROLLOUT_FILE = /^rollout-.{19}-([0-9a-f-]{36})(?:_[0-9a-f-]{36})?\.jsonl$/i
@@ -143,6 +146,7 @@ function emptyRollout() {
     fallbackPrompts: 0,
     open: false,
     turnStartedAt: 0,
+    turnId: '',
     usageLimits: null,
     failed: false,
     calls: new Map(),
@@ -151,6 +155,8 @@ function emptyRollout() {
     tokens: null,
     context: null,
     contextSample: emptySample(),
+    sizes: emptySizes(),
+    sent: emptySent(),
     plan: null,
     history: [],
     contextParts: null,
@@ -166,13 +172,19 @@ function emptyRollout() {
 
 const AGENTS_FILE = /^# AGENTS\.md instructions for ([^\n]+)/
 
-const emptyOpened = () => ({
-  lastAt: 0,
-  thoughts: [],
-  replies: [],
-  sizes: emptySizes(),
-  sent: { base: 0, developer: [], other: 0, memory: new Map(), tools: new Map() },
-})
+const emptyWords = () => ({ lastAt: 0, thoughts: [], replies: [] })
+
+function applyWords(state, record) {
+  const at = Date.parse(record.timestamp) || state.lastAt
+  state.lastAt = at
+  const item = record.payload
+  if (record.type !== 'response_item' || !item || typeof item !== 'object') return
+  const id = text(item.id) || null
+  if (item.type === 'reasoning') keepText(state.thoughts, 'thoughts', { id, at, text: joinedText(item.summary, 'summary_text', 'text') })
+  else if (item.type === 'message' && item.role === 'assistant') keepText(state.replies, 'replies', { id, at, text: joinedText(item.content, 'output_text', 'text') })
+}
+
+const emptySent = () => ({ base: 0, developer: [], other: 0, memory: new Map(), tools: new Map() })
 
 function callName(item) {
   if (item.type === 'local_shell_call') return 'shell'
@@ -186,14 +198,11 @@ function codexFixed(sent) {
   fixed.system = developer + (sent.developer.includes(sent.base) ? 0 : sent.base) + sent.other
   fixed.mcp = new Map(sent.tools)
   fixed.memory = new Map(sent.memory)
+  fixed.recorded = new Set(['system', 'mcpTools', 'memory'])
   return fixed
 }
 
-function applyOpened(state, record) {
-  const at = Date.parse(record.timestamp) || state.lastAt
-  state.lastAt = at
-  const item = record.payload
-  if (!item || typeof item !== 'object') return
+function applySizes(state, record, item, at) {
   const { sizes, sent } = state
   const before = sizes.first == null
   if (record.type === 'session_meta') {
@@ -207,14 +216,10 @@ function applyOpened(state, record) {
   } else if (record.type !== 'response_item') {
     return
   } else if (item.type === 'reasoning') {
-    const said = joinedText(item.summary, 'summary_text', 'text')
-    keepText(state.thoughts, 'thoughts', { id: text(item.id) || null, at, text: said })
-    sizeReply(sizes, said.length)
+    sizeReply(sizes, joinedText(item.summary, 'summary_text', 'text').length)
     return
   } else if (item.type === 'message' && item.role === 'assistant') {
-    const said = joinedText(item.content, 'output_text', 'text')
-    keepText(state.replies, 'replies', { id: text(item.id) || null, at, text: said })
-    sizeReply(sizes, said.length)
+    sizeReply(sizes, joinedText(item.content, 'output_text', 'text').length)
     return
   } else if (CALLS.has(item.type)) {
     sizeCall(sizes, text(item.call_id), callName(item), (text(item.arguments) || text(item.input) || JSON.stringify(item.action ?? '')).length)
@@ -230,7 +235,7 @@ function applyOpened(state, record) {
   } else if (item.type === 'message') {
     const raw = contentText(item.content)
     const agents = item.role === 'user' ? AGENTS_FILE.exec(raw) : null
-    if (agents) sent.memory.set(`${agents[1].trim().replace(/[\/]+$/, '')}/AGENTS.md`, raw.length)
+    if (agents) sent.memory.set(`${agents[1].trim().replace(/[\\/]+$/, '')}/AGENTS.md`, raw.length)
     else if (item.role === 'user' && promptText(raw)) {
       sizePrompt(sizes, raw.length)
       return
@@ -253,6 +258,7 @@ function applyRecord(state, record) {
   }
   const payload = record.payload
   if (!payload || typeof payload !== 'object') return
+  applySizes(state, record, payload, at || state.lastAt)
   if (record.type === 'session_meta') applyMeta(state, payload)
   else if (record.type === 'turn_context') applySettings(state, payload.model, payload.effort, payload.cwd)
   else if (record.type === 'response_item') applyItem(state, payload, at || state.lastAt)
@@ -367,13 +373,16 @@ function addLines(state, patch) {
 function applyEvent(state, event, at) {
   switch (event.type) {
     case 'task_started':
-    case 'turn_started':
-      if (!state.open) state.turnStartedAt = at
+    case 'turn_started': {
+      const turn = text(event.turn_id)
+      if (!state.open || (turn && turn !== state.turnId)) state.turnStartedAt = at
+      if (turn) state.turnId = turn
       state.open = true
       state.failed = false
       state.calls.clear()
       settleCalls(state.activity)
       break
+    }
     case 'task_complete':
     case 'turn_complete':
       state.open = false
@@ -468,7 +477,7 @@ export function codex({
   const locksDir = path.join(home, 'thread-writer-locks')
   const indexFile = path.join(home, 'session_index.jsonl')
   const rollouts = jsonlFollower({ empty: emptyRollout, apply: applyRecord })
-  const openedFor = recentReaders(() => jsonlFollower({ empty: emptyOpened, apply: applyOpened }), OPENED_KEPT)
+  const openedFor = recentReaders(() => jsonlFollower({ empty: emptyWords, apply: applyWords, tail: { bytes: TAIL_BYTES, enough: wordsFull } }), OPENED_KEPT)
   let index = { mtime: -1, names: new Map() }
   let known = new Map()
   let childrenOf = new Map()
@@ -576,11 +585,12 @@ export function codex({
     return state ? { file, stat, state } : null
   }
 
-  async function sessionDetail(key) {
+  async function sessionDetail(key, { filesOnly = false } = {}) {
     const id = String(key).replace(/^codex:/, '').toLowerCase()
     const found = await readKnown(id)
     if (!found || found.state.subagent || found.state.internal) return null
     const { file, stat, state } = found
+    if (filesOnly) return { id: `codex:${id}`, sessionId: id, files: filePaths(state.files, state.cwd) }
     const said = await openedFor(file).read(file, stat).catch(() => null)
     const limit = state.context?.limit || null
     const subagents = []
@@ -617,7 +627,7 @@ export function codex({
       prompts: (state.typed ? state.promptList : state.fallbackPromptList).map((p) => ({ ...p })),
       thoughts: textList(said?.thoughts),
       replies: textList(said?.replies),
-      contextBreakdown: contextBreakdown(said?.sizes, {
+      contextBreakdown: contextBreakdown(state.sizes, {
         total: state.context?.used,
         limit,
         reserved: limit ? Math.round(limit * (1 - COMPACT_SHARE / REPORTED_SHARE)) : null,

package/telemetry/cursor.mjs

@@ -198,9 +198,10 @@ export function cursor({
     return list.sort((a, b) => a.startedAt - b.startedAt).slice(-DETAIL_LIMITS.subagents)
   }
 
-  async function sessionDetail(key) {
+  async function sessionDetail(key, { filesOnly = false } = {}) {
     const id = String(key).replace(/^cursor:/, '')
     const entry = known.get(id)
+    if (filesOnly) return entry ? { id: `cursor:${id}`, sessionId: id, files: null } : null
     const stat = entry ? await fsp.stat(entry.file).catch(() => null) : null
     if (!stat) return null
     const state = await follow(entry.file, stat)

package/telemetry/hermes.mjs

@@ -122,10 +122,11 @@ export function hermes({ home = resolveHermesHome(), now = Date.now } = {}) {
     return sessions
   }
 
-  async function sessionDetail(key) {
+  async function sessionDetail(key, { filesOnly = false } = {}) {
     const match = /^hermes:([^:]+):(.+)$/.exec(String(key))
     if (!match) return null
     const [, profile, rootId] = match
+    if (filesOnly) return { id: `hermes:${profile}:${rootId}`, sessionId: rootId, files: null }
     const store = (await storeFiles()).find((s) => s.profile === profile)
     if (!store) return null
     const detail = await withReadOnly(store.file, (db) => detailFrom(db, rootId, now()), null)

package/ui/fonts.css

@@ -0,0 +1,48 @@
+@font-face {
+  font-family: 'Inter Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+  src: url('./fonts/inter-latin-ext-wght-normal.woff2') format('woff2-variations');
+}
+@font-face {
+  font-family: 'Inter Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+  src: url('./fonts/inter-latin-wght-normal.woff2') format('woff2-variations');
+}
+@font-face {
+  font-family: 'Inter Tight Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+  src: url('./fonts/inter-tight-latin-ext-wght-normal.woff2') format('woff2-variations');
+}
+@font-face {
+  font-family: 'Inter Tight Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+  src: url('./fonts/inter-tight-latin-wght-normal.woff2') format('woff2-variations');
+}
+@font-face {
+  font-family: 'JetBrains Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 800;
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+  src: url('./fonts/jetbrains-mono-latin-ext-wght-normal.woff2') format('woff2-variations');
+}
+@font-face {
+  font-family: 'JetBrains Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 800;
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+  src: url('./fonts/jetbrains-mono-latin-wght-normal.woff2') format('woff2-variations');
+}

package/ui/gauge.css

@@ -0,0 +1,75 @@
+.inst {
+  display: block;
+  flex: none;
+  overflow: visible;
+}
+.i-dial {
+  fill: var(--dial);
+  stroke: var(--line);
+  stroke-width: 1;
+}
+.i-mini .i-dial {
+  stroke-width: 2.4;
+}
+.i-hub {
+  fill: var(--hub);
+}
+.i-track,
+.i-fill,
+.i-red {
+  fill: none;
+  stroke-width: 6;
+  stroke-linecap: round;
+}
+.i-track {
+  stroke: var(--dial-track);
+}
+.i-fill {
+  stroke: var(--inst);
+}
+.i-red {
+  stroke: var(--err);
+  opacity: 0.8;
+}
+.i-mini .i-track,
+.i-mini .i-fill,
+.i-mini .i-red {
+  stroke-width: 10;
+}
+.inst[data-level='high'] .i-fill {
+  stroke: var(--warn);
+}
+.inst[data-level='full'] .i-fill {
+  stroke: var(--err);
+}
+.i-needle {
+  stroke: var(--needle);
+  stroke-width: 3.2;
+  stroke-linecap: round;
+  filter: drop-shadow(0 0 3px var(--needle-glow));
+}
+.i-mini .i-needle {
+  stroke-width: 6;
+  filter: none;
+}
+.i-label {
+  fill: var(--text);
+  font: 600 12px var(--cond);
+}
+.i-wrap {
+  position: relative;
+}
+.i-wrap::after {
+  content: '';
+  position: absolute;
+  top: calc(-1 * var(--hit-t, 4px));
+  right: calc(-1 * var(--hit-r, 4px));
+  bottom: calc(-1 * var(--hit-b, 4px));
+  left: calc(-1 * var(--hit-l, 4px));
+}
+.i-wrap:has(+ .i-wrap) {
+  --hit-r: 2px;
+}
+.i-wrap + .i-wrap {
+  --hit-l: 2px;
+}

package/ui/gauge.mjs

@@ -0,0 +1,14 @@
+const ARC = 'M-19.8,19.8 A28,28 0 1 1 19.8,19.8'
+const fx = (n) => n.toFixed(2)
+const clamp = (v, lo, hi) => Math.min(hi, Math.max(lo, v))
+
+export const levelOf = (pct) => (pct == null ? 'unknown' : pct >= 90 ? 'full' : pct >= 70 ? 'high' : 'ok')
+export const levelClass = (spec) => (spec.level === 'full' ? 'x' : spec.level === 'high' ? 'h' : 'f')
+
+export function contextGauge(spec, size = 18) {
+  const mini = size <= 30
+  const p = clamp(spec.pct ?? 0, 0, 100)
+  const level = spec.level || levelOf(spec.pct ?? null)
+  const body = `<path d="${ARC}" class="i-track" pathLength="100"/><path d="${ARC}" class="i-red" pathLength="100" stroke-dasharray="10 100" stroke-dashoffset="-90"/><path d="${ARC}" class="i-fill" pathLength="100" stroke-dasharray="${fx(p)} 100"/><line x1="0" y1="0" x2="${mini ? 19 : 21}" y2="0" class="i-needle" transform="rotate(${fx(135 + (270 * p) / 100)})"/>${mini ? '' : `<text x="0" y="28" class="i-label" text-anchor="middle">${Math.round(p)}%</text>`}`
+  return `<svg class="inst${mini ? ' i-mini' : ''}" data-k="gauge" data-level="${level}" width="${size}" height="${size}" viewBox="-36 -36 72 72" aria-hidden="true"><circle r="35" class="i-dial"/>${body}<circle r="${mini ? 6 : 4.5}" class="i-hub"/></svg>`
+}

package/ui/html.mjs

@@ -0,0 +1 @@
+export const esc = (s) => String(s ?? '').replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[c])

package/ui/icons.mjs

@@ -0,0 +1,98 @@
+import { mcpServer } from '../lib/tool-kinds.mjs'
+import { esc } from './html.mjs'
+
+export { mcpServer }
+
+const LINE_ICONS = {
+  key: '<circle cx="8" cy="15.5" r="4.5"/><path d="M11.3 12.2 20 3.5M16.5 7l2.5 2.5M14 9.5l2 2"/>',
+  folder: '<path d="M3 7.4A1.4 1.4 0 0 1 4.4 6h4.2l2 2.5h7A1.4 1.4 0 0 1 19 9.9v7.7a1.4 1.4 0 0 1-1.4 1.4H4.4A1.4 1.4 0 0 1 3 17.6z"/>',
+  org: '<path d="M4.5 20V5.4A1.4 1.4 0 0 1 5.9 4h6.7A1.4 1.4 0 0 1 14 5.4V20"/><path d="M14 9h4.1a1.4 1.4 0 0 1 1.4 1.4V20"/><path d="M3 20h18"/><path d="M7.5 8h3M7.5 11.5h3M7.5 15h3M16.8 13h.01M16.8 16.5h.01"/>',
+  branch:
+    '<circle cx="7" cy="5.5" r="2.2"/><circle cx="7" cy="18.5" r="2.2"/><circle cx="17" cy="7.5" r="2.2"/><path d="M7 7.7v8.6"/><path d="M17 9.7c0 3.4-2.6 4.6-6 5.2-1.9.3-3.3.9-4 1.4"/>',
+  worktree: '<circle cx="6.5" cy="5" r="2.2"/><circle cx="17.5" cy="5" r="2.2"/><circle cx="12" cy="19" r="2.2"/><path d="M6.5 7.2v1.3a3 3 0 0 0 3 3h5a3 3 0 0 0 3-3V7.2"/><path d="M12 11.5v5.3"/>',
+  model: '<path d="M11 3.5l1.8 4.9 4.9 1.8-4.9 1.8L11 16.9l-1.8-4.9-4.9-1.8 4.9-1.8z"/><path d="M18 14.5l.8 2 2 .8-2 .8-.8 2-.8-2-2-.8 2-.8z"/>',
+  'k-read': '<path d="M13.5 3.5H7.4A1.4 1.4 0 0 0 6 4.9v14.2a1.4 1.4 0 0 0 1.4 1.4h9.2a1.4 1.4 0 0 0 1.4-1.4V8z"/><path d="M13.5 3.5V8H18"/><path d="M9 12.5h6M9 16h4"/>',
+  'k-search': '<circle cx="10.5" cy="10.5" r="6"/><path d="M15 15l5 5"/>',
+  'k-edit': '<path d="M15.2 5.3a2 2 0 0 1 2.8 0l.7.7a2 2 0 0 1 0 2.8L8.5 19 4 20l1-4.5z"/><path d="M13.5 7l3.5 3.5"/>',
+  'k-delete':
+    '<path d="M4.5 7h15"/><path d="M9.5 7V5.2a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1V7"/><path d="M6.5 7l.8 11.8a1.5 1.5 0 0 0 1.5 1.4h6.4a1.5 1.5 0 0 0 1.5-1.4L17.5 7"/><path d="M10.2 11v5.5M13.8 11v5.5"/>',
+  'k-move': '<path d="M12 20.5H7.4A1.4 1.4 0 0 1 6 19.1V4.9a1.4 1.4 0 0 1 1.4-1.4h6.1L18 8v3"/><path d="M13.5 3.5V8H18"/><path d="M11.5 16h9M17.5 13l3 3-3 3"/>',
+  'k-execute': '<path d="M5 7l5 5-5 5"/><path d="M12.5 17H19"/>',
+  'k-fetch': '<circle cx="12" cy="12" r="8.5"/><path d="M3.5 12h17"/><path d="M12 3.5c2.3 2.3 3.5 5.2 3.5 8.5s-1.2 6.2-3.5 8.5C9.7 18.2 8.5 15.3 8.5 12S9.7 5.8 12 3.5z"/>',
+  'k-think': '<path d="M9.5 17.5h5M10.5 20.5h3"/><path d="M12 3.5a5.5 5.5 0 0 0-3.3 9.9c.6.5 1 1.2 1 2v.1h4.6v-.1c0-.8.4-1.5 1-2A5.5 5.5 0 0 0 12 3.5z"/>',
+  'k-agent': '<path d="M2.5 12H9M6.5 9.2 9.3 12l-2.8 2.8"/><circle cx="15.5" cy="12" r="5.5" stroke-linecap="butt" stroke-dasharray="3.2 2.56"/><circle cx="15.5" cy="12" r="1.7" fill="currentColor" stroke="none"/>',
+  'k-plan': '<path d="M3.5 7.2 5.8 9.5 10 5M3.5 15.7 5.8 18 10 13.5"/><path d="M13.5 7.5H20.5M13.5 16H20.5"/>',
+  'k-communicate':
+    '<path d="M4 6.4A1.9 1.9 0 0 1 5.9 4.5h12.2A1.9 1.9 0 0 1 20 6.4v8.2a1.9 1.9 0 0 1-1.9 1.9H11.5L7 20v-3.5H5.9A1.9 1.9 0 0 1 4 14.6z"/><path d="M10.1 8.7a1.9 1.9 0 1 1 2.8 1.7c-.6.3-.9.7-.9 1.3"/><path d="M12 14h.01"/>',
+  'k-switch_mode': '<rect x="2.5" y="7" width="19" height="10" rx="5"/><circle cx="16.5" cy="12" r="2.5"/>',
+  'k-other': '<path d="M17.57 4.17A4.8 4.8 0 0 0 11.13 10.47L5.11 16.49a1.7 1.7 0 0 0 2.4 2.4L13.53 12.87A4.8 4.8 0 0 0 19.83 6.43L17.76 8.5 15.5 6.24z"/>',
+  'k-mcp': '<path d="M9 3.5v4M15 3.5v4"/><path d="M6.5 7.5h11V10a5.5 5.5 0 0 1-11 0z"/><path d="M12 15.5v5"/>',
+}
+
+export const ICON_NAMES = Object.freeze(Object.keys(LINE_ICONS))
+
+export const ICO = (name, size = 13) =>
+  `<svg class="ico" width="${size}" height="${size}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${LINE_ICONS[name] || ''}</svg>`
+
+export const EFFORT_LEVELS = { minimal: 1, low: 1, medium: 2, high: 3, xhigh: 4, max: 5 }
+export const EFFORT_NAMES = { minimal: 'Minimal', low: 'Low', medium: 'Medium', high: 'High', xhigh: 'Extra high', max: 'Max' }
+export const effortName = (effort) => EFFORT_NAMES[String(effort).toLowerCase()] || effort || ''
+
+export function effortBars(effort) {
+  if (!effort) return ''
+  const level = EFFORT_LEVELS[String(effort).toLowerCase()] ?? 0
+  const bars = [1, 2, 3, 4, 5]
+    .map((n) => `<rect x="${n * 4 - 1.5}" y="${(20 - n * 3.2).toFixed(1)}" width="2.6" height="${(n * 3.2).toFixed(1)}" rx="1.1" class="${n <= level ? 'eb-on' : 'eb-off'}"/>`)
+    .join('')
+  const label = esc(`${effortName(effort)} effort`)
+  return `<svg class="ico eff" width="14" height="14" viewBox="0 0 24 24" role="img" aria-label="${label}"><title>${label}</title>${bars}</svg>`
+}
+
+export const HARNESS_MARKS = Object.freeze({
+  'claude-code': 'CC',
+  codex: 'Cx',
+  cursor: 'Cu',
+  antigravity: 'AG',
+  hermes: 'H',
+  opencode: 'OC',
+  kilocode: 'K',
+  'gemini-cli': 'Gm',
+  'copilot-cli': 'Cp',
+})
+export const harnessMark = (id, name = id) => HARNESS_MARKS[id] || String(name || '?')[0].toUpperCase()
+
+export const KINDS = Object.freeze({
+  read: { name: 'Read', tip: 'Reads a file' },
+  search: { name: 'Search', tip: 'Searches for text or lists files' },
+  edit: { name: 'Edit', tip: 'Creates or changes a file' },
+  delete: { name: 'Delete', tip: 'Deletes files' },
+  move: { name: 'Move', tip: 'Moves or renames files' },
+  execute: { name: 'Run', tip: 'Runs a command' },
+  fetch: { name: 'Web', tip: 'Fetches a page or searches the web' },
+  think: { name: 'Think', tip: 'Thinks or takes notes, without changing anything' },
+  agent: { name: 'Subagent', tip: 'Hands work to a subagent' },
+  plan: { name: 'Plan', tip: 'Updates the plan' },
+  communicate: { name: 'Ask', tip: 'Asks you something' },
+  switch_mode: { name: 'Mode', tip: "Changes the agent's mode" },
+  other: { name: 'Other', tip: 'A tool that has no kind yet' },
+  mcp: { name: 'MCP', tip: 'A tool from an MCP server' },
+})
+
+const COMMAND_TOOLS = /bash|shell|command|exec|terminal|powershell/i
+export function kindOf(item, byName = null) {
+  const server = item?.server || mcpServer(item?.name)
+  if (server) return { kind: 'mcp', server, shell: false }
+  const kind = KINDS[item?.kind] ? item.kind : 'other'
+  const nameKind = byName?.get(item?.name) ?? (COMMAND_TOOLS.test(item?.name || '') ? 'execute' : null)
+  return { kind, server: null, shell: kind !== 'execute' && kind !== 'other' && nameKind === 'execute' }
+}
+
+export function kindTip({ kind, server, shell }) {
+  if (kind === 'mcp') return server ? `A tool from the ${server} MCP server` : KINDS.mcp.tip
+  const tip = (KINDS[kind] || KINDS.other).tip
+  return shell ? `${tip}, with a shell command` : tip
+}
+
+export const kindIconHTML = (k) => `<span class="tk" data-k="${esc(k.kind)}" data-tip="${esc(kindTip(k))}">${ICO(`k-${k.kind}`)}</span>`
+
+export const toolKinds = (tools) => new Map((tools || []).map((t) => [t.name, t.kind]))

package/ui/status.css

@@ -0,0 +1,75 @@
+[data-st='asking'] {
+  --st: var(--lamp);
+  --plate: var(--lamp-wash);
+}
+[data-st='working'] {
+  --st: var(--work);
+  --plate: var(--work-plate);
+}
+[data-st='delegating'] {
+  --st: var(--wait);
+  --plate: var(--wait-plate);
+}
+[data-st='done'] {
+  --st: var(--done);
+  --plate: var(--done-plate);
+}
+[data-st='error'] {
+  --st: var(--err);
+  --plate: var(--err-plate);
+}
+[data-st='idle'] {
+  --st: var(--idle);
+  --plate: var(--idle-plate);
+}
+
+.lamp {
+  display: inline-grid;
+  place-items: center;
+  width: 16px;
+  height: 16px;
+  flex: none;
+  color: var(--st, var(--idle));
+}
+.lamp svg {
+  width: 16px;
+  height: 16px;
+  overflow: visible;
+}
+.lamp .spin {
+  animation: tc-spin 1.5s linear infinite;
+  transform-origin: 8px 8px;
+}
+.lamp .spin-slow {
+  animation: tc-spin 5s linear infinite;
+  transform-origin: 8px 8px;
+}
+.lamp .blink {
+  animation: tc-blink 2s ease-in-out infinite;
+}
+
+@keyframes tc-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+@keyframes tc-blink {
+  0%,
+  60% {
+    opacity: 1;
+  }
+  80% {
+    opacity: 0.6;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .lamp .spin,
+  .lamp .spin-slow,
+  .lamp .blink {
+    animation: none;
+  }
+}

package/ui/status.mjs

@@ -0,0 +1,36 @@
+export const STATUSES = [
+  { key: 'asking', name: 'Needs you', color: '--lamp', plate: '--lamp-wash' },
+  { key: 'working', name: 'Working', color: '--work', plate: '--work-plate' },
+  { key: 'delegating', name: 'Waiting on agents', color: '--wait', plate: '--wait-plate' },
+  { key: 'done', name: 'Done', color: '--done', plate: '--done-plate' },
+  { key: 'error', name: 'Error', color: '--err', plate: '--err-plate' },
+  { key: 'idle', name: 'Idle', color: '--idle', plate: '--idle-plate' },
+]
+
+export const STATUS_KEYS = STATUSES.map((s) => s.key)
+
+export const URGENCY_ORDER = ['asking', 'error', 'done', 'working', 'delegating', 'idle']
+
+export const LIVE_STATUSES = new Set(['asking', 'working', 'delegating'])
+
+export const statusOf = (key) => STATUSES.find((s) => s.key === key) || STATUSES.at(-1)
+
+export const LAMP_ICONS = {
+  asking:
+    '<svg width="16" height="16" viewBox="0 0 16 16" aria-hidden="true"><g class="blink"><path d="M8 .9 15.100 8 8 15.100.9 8Z" fill="var(--sign)" stroke="var(--sign)" stroke-width="1"/><path d="M6.300 6.300a1.750 1.750 0 1 1 2.700 1.500c-.7.4-1 .8-1 1.400" fill="none" stroke="var(--sign-ink)" stroke-width="1.400" stroke-linecap="round"/><circle cx="8" cy="11.300" r=".85" fill="var(--sign-ink)"/></g></svg>',
+  working:
+    '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="5.600" stroke="currentColor" stroke-opacity=".28" stroke-width="2"/><g class="spin"><path d="M8 2.400a5.600 5.600 0 0 1 5.600 5.600" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></g></svg>',
+  delegating:
+    '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><g class="spin-slow"><circle cx="8" cy="8" r="5.800" stroke="currentColor" stroke-width="1.800" stroke-dasharray="2.600 2.460"/></g><circle cx="8" cy="8" r="2.100" fill="currentColor"/></svg>',
+  done: '<svg width="16" height="16" viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="6.600" fill="currentColor"/><path d="M4.900 8.200 7.100 10.400 11.100 5.800" fill="none" stroke="var(--knock)" stroke-width="1.700" stroke-linecap="round" stroke-linejoin="round"/></svg>',
+  error:
+    '<svg width="16" height="16" viewBox="0 0 16 16" aria-hidden="true"><path d="M8 1.500 15.200 14.200H.8Z" fill="currentColor"/><path d="M8 6v4" stroke="var(--knock)" stroke-width="1.600" stroke-linecap="round"/><circle cx="8" cy="12" r=".9" fill="var(--knock)"/></svg>',
+  idle: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="5.200" stroke="currentColor" stroke-width="1.600"/></svg>',
+  pending:
+    '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="4.600" stroke="currentColor" stroke-width="1.500"/></svg>',
+}
+
+export const lampHTML = (key, cls = '') => {
+  const st = STATUS_KEYS.includes(key) || key === 'pending' ? key : 'idle'
+  return `<span class="lamp${cls ? ` ${cls}` : ''}" data-st="${st}">${LAMP_ICONS[st]}</span>`
+}