thincoder 0.12.2 → 0.12.4

package/src/tui/pickers.mjs

@@ -1,5 +1,6 @@
 import { sliceByWidth } from "./render.mjs"
 import { PROVIDER_PRESETS as PRESETS } from "../config.mjs"
+import { computeLayout } from "./layout.mjs"
 
 /** Generic list picker + model/provider management.
  *  单一 Promise API：showPicker(title, entries, { defaultIndex }) → Promise<entry|null>。
@@ -69,12 +70,48 @@ export function createPickers(ctx) {
     if (p.filter && items.length === 0) lines.push({ text: "   (no match)", color: C.dim })
     p.lines = lines
     p.selectedLine = selLine
+
+    // Auto-scroll: keep selectedLine within the visible window.
+    // Fallback to a reasonable default when computeLayout can't run (e.g. test mocks without full state)
+    let winH
+    try {
+      winH = Math.max(1, (computeLayout(state, { cols: process.stdout.columns || 80, rows: process.stdout.rows || 24 }).panels.picker?.h ?? lines.length + 1) - 1)
+    } catch {
+      winH = 8 // safe fallback for test mocks
+    }
+    if (p.selectedLine < p.scroll) p.scroll = p.selectedLine
+    if (p.selectedLine >= p.scroll + winH) p.scroll = p.selectedLine - winH + 1
+    p.scroll = Math.max(0, Math.min(p.scroll, Math.max(0, lines.length - winH)))
+
     render()
   }
 
   function renderPickerLines() { rebuildLines() }
 
-  // === model picker ===
+  // === two-level model picker ===
+
+  /** Strip known version/date suffixes to get the "series" name of a model.
+   *  e.g. "qwen-max-latest" → "qwen-max", "qwen-max-2024-09-19" → "qwen-max" */
+  function modelSeries(name) {
+    return name
+      .replace(/-latest$/, "")
+      .replace(/-\d{4}-\d{2}-\d{2}$/, "") // date suffix like -2024-09-19
+      .replace(/-\d{8}$/, "")              // date suffix like -20240919
+  }
+
+  /** Dedupe model list: group by series, keep shortest name per group.
+   *  Reduces "qwen-max, qwen-max-latest, qwen-max-2024-09-19" to just "qwen-max". */
+  function dedupeModels(models) {
+    const groups = new Map()
+    for (const m of models) {
+      const series = modelSeries(m)
+      const existing = groups.get(series)
+      if (!existing || m.length < existing.length) {
+        groups.set(series, m)
+      }
+    }
+    return [...groups.values()].sort()
+  }
 
   /** entry 唯一标识：异步更新 entries 后按它恢复选中项 */
   function entryKey(e) {
@@ -82,79 +119,180 @@ export function createPickers(ctx) {
     return e.action === "switch" ? `switch:${e.provider}:${e.model}` : `action:${e.action}`
   }
 
+  /** Get API key for a provider (from config or env vars) */
+  function getApiKey(providerName, providerConfig) {
+    const envKey = { deepseek: "DEEPSEEK_API_KEY", openai: "OPENAI_API_KEY" }[providerName]
+    let apiKey = providerConfig.apiKey
+    if (!apiKey && envKey && process.env[envKey]) apiKey = process.env[envKey]
+    if (!apiKey) apiKey = process.env.THINCODER_API_KEY
+    return apiKey
+  }
+
+  /** Level 1: Show provider list. Selecting a provider opens Level 2 (model list). */
   async function openModelPicker() {
     // 菜单循环：选中即关闭，子流程结束后重开主菜单；Esc 退出
     for (;;) {
-      const entries = buildModelEntries()
+      const entries = buildProviderEntries()
       const items = entries.filter((e) => e.type === "item")
       const current = items.findIndex(
-        (e) => e.action === "switch" && e.provider === agent.activeProvider && e.model === agent.provider.model)
+        (e) => e.action === "open-models" && e.provider === agent.activeProvider)
       const picked = showPicker("Models & Providers", entries, { defaultIndex: Math.max(0, current) })
-      // 后台异步拉取各 provider 模型列表，原地更新 entries（不 await，错误仅提示）
-      fetchModels(entries).catch((err) => pushLine(`[model] fetch models failed: ${err.message}`, C.error))
       const e = await picked
       if (!e) return
-      if (e.action === "switch") {
-        await selectModel(e).catch((err) => pushLine(`[error] ${err.message}`, C.error))
-        return
+      if (e.action === "open-models") {
+        // Level 2: open model list for this provider
+        const modelSelected = await openModelListForProvider(e.provider)
+        if (modelSelected) return // model selected, close picker
+        // Esc from model list → return to provider list
+      } else if (e.action === "add") {
+        await addProviderFlow()
+      } else if (e.action === "remove") {
+        await removeProviderFlow()
+      } else if (e.action === "key") {
+        await setKeyFlow()
       }
-      if (e.action === "add") await addProviderFlow()
-      else if (e.action === "remove") await removeProviderFlow()
-      else if (e.action === "key") await setKeyFlow()
     }
   }
 
-  /** 后台拉取模型列表并 splice 进 entries；更新时按 entryKey 恢复用户光标下的选中项 */
-  async function fetchModels(entries) {
-    const { listModels } = await import("../provider/index.mjs")
-    await Promise.all(agent.providers.map(async (p) => {
-      let selKey = null
-      try {
-        const envKey = { deepseek: "DEEPSEEK_API_KEY", openai: "OPENAI_API_KEY" }[p.name]
-        let apiKey = p.apiKey
-        if (!apiKey && envKey && process.env[envKey]) apiKey = process.env[envKey]
-        if (!apiKey) apiKey = process.env.THINCODER_API_KEY
-        const models = await listModels({ baseURL: p.baseURL, apiKey: apiKey ?? "" }, { signal: AbortSignal.timeout(10000) })
-        if (state.picker?.entries !== entries) return // picker 已关或已换，不再更新
-        selKey = entryKey(pickerItems(state.picker)[state.picker.index])
-        const at = entries.findLastIndex((e) => e.type === "item" && e.action === "switch" && e.provider === p.name)
-        if (at >= 0) entries.splice(at + 1, 0, ...models.filter((m) => m !== p.model).map((m) => ({ type: "item", text: m, action: "switch", provider: p.name, model: m })))
-        const header = entries.find((e) => e.type === "header" && e.text === p.name)
-        if (header) header.note = `${p.baseURL}${p.apiKey ? "" : " (no key)"}`
-      } catch (error) {
-        if (state.picker?.entries !== entries) return
-        const header = entries.find((e) => e.type === "header" && e.text === p.name)
-        if (header) header.note = `${p.baseURL}${p.apiKey ? "" : " (no key)"}  (fetch failed: ${sliceByWidth(error.message, 40)})`
-      }
-      // 异步 splice 会改变光标下的项：按 entry 标识恢复选中，找不到则 clamp 到合法范围
-      const pk = state.picker
-      const items = pickerItems(pk)
-      const restored = selKey ? items.findIndex((e) => entryKey(e) === selKey) : -1
-      pk.index = restored >= 0 ? restored : Math.min(pk.index, Math.max(0, items.length - 1))
-      rebuildLines()
-    }))
+  /** Level 2: Show model list for a specific provider. Returns true if a model was selected. */
+  async function openModelListForProvider(providerName) {
+    const providerConfig = agent.providers.find((p) => p.name === providerName)
+    if (!providerConfig) return false
+
+    const entries = buildModelEntriesForProvider(providerName, providerConfig)
+    const items = entries.filter((e) => e.type === "item")
+    const currentModel = providerName === agent.activeProvider
+      ? (agent.activeModel || providerConfig.model)
+      : providerConfig.model
+    const current = items.findIndex((e) => e.model === currentModel)
+    const picked = showPicker(`${providerName} models`, entries, { defaultIndex: Math.max(0, current) })
+
+    // Async fetch models in background
+    fetchModelsForProvider(providerName, entries).catch((err) => {
+      pushLine(`[model] fetch models failed: ${err.message}`, C.error)
+    })
+
+    const e = await picked
+    if (!e) return false // Esc → back to provider list
+    if (e.action === "switch") {
+      await selectModel(e).catch((err) => pushLine(`[error] ${err.message}`, C.error))
+      return true
+    }
+    return false
   }
 
-  function buildModelEntries() {
+  /** Build entries for Level 1: provider list */
+  function buildProviderEntries() {
     const entries = []
     for (const p of agent.providers) {
       const active = p.name === agent.activeProvider
-      entries.push({ type: "header", text: p.name, note: `${p.baseURL}${p.apiKey ? "" : " (no key)"}${active ? " ← current" : ""}  loading...` })
-      entries.push({ type: "item", text: p.model, action: "switch", provider: p.name, model: p.model, marker: active ? "●" : "" })
+      const currentModel = active ? (agent.activeModel || p.model) : p.model
+      const marker = active ? "●" : ""
+      const note = active ? " ← current" : ""
+      const keyStatus = p.apiKey ? "" : " (no key)"
+      entries.push({
+        type: "item",
+        text: `${p.name.padEnd(12)} ${currentModel}${note}`,
+        action: "open-models",
+        provider: p.name,
+        marker,
+        note: `${p.baseURL}${keyStatus}`,
+      })
     }
-    entries.push({ type: "header", text: "Provider Management" })
+    entries.push({ type: "header", text: "Management" })
     entries.push({ type: "item", text: "Add provider…", action: "add" })
     if (agent.providers.length > 1) entries.push({ type: "item", text: "Remove provider…", action: "remove" })
     entries.push({ type: "item", text: "Set / change API key…", action: "key" })
     return entries
   }
 
+  /** Build entries for Level 2: model list for a specific provider */
+  function buildModelEntriesForProvider(providerName, providerConfig) {
+    const entries = []
+    const active = providerName === agent.activeProvider
+    const currentModel = active ? (agent.activeModel || providerConfig.model) : providerConfig.model
+    const isDefaultModel = currentModel === providerConfig.model
+
+    entries.push({ type: "header", text: "Current model" })
+    entries.push({
+      type: "item",
+      text: currentModel,
+      action: "switch",
+      provider: providerName,
+      model: currentModel,
+      marker: active && isDefaultModel ? "●" : "",
+    })
+
+    entries.push({ type: "header", text: "Available models (loading…)" })
+    return entries
+  }
+
+  /** Async fetch and splice models for a specific provider */
+  async function fetchModelsForProvider(providerName, entries) {
+    const { listModels } = await import("../provider/index.mjs")
+    const providerConfig = agent.providers.find((p) => p.name === providerName)
+    if (!providerConfig) return
+
+    let selKey = null
+    try {
+      const apiKey = getApiKey(providerName, providerConfig)
+      const models = await listModels(
+        { baseURL: providerConfig.baseURL, apiKey: apiKey ?? "" },
+        { signal: AbortSignal.timeout(10000) }
+      )
+      if (state.picker?.entries !== entries) return // picker closed or changed
+      selKey = entryKey(pickerItems(state.picker)[state.picker.index])
+
+      // Dedupe and filter
+      const deduped = dedupeModels(models)
+      const currentModel = providerName === agent.activeProvider
+        ? (agent.activeModel || providerConfig.model)
+        : providerConfig.model
+
+      // Find the "Available models" header and splice after it
+      const headerIdx = entries.findIndex((e) => e.type === "header" && e.text.startsWith("Available models"))
+      if (headerIdx >= 0) {
+        // Update header with count info
+        const hint = deduped.length < models.length
+          ? ` (${models.length} total, ${deduped.length} shown — type to filter)`
+          : ` (${deduped.length})`
+        entries[headerIdx].text = `Available models${hint}`
+
+        // Splice models after header (skip current model)
+        const newModels = deduped.filter((m) => m !== currentModel)
+        entries.splice(headerIdx + 1, 0, ...newModels.map((m) => ({
+          type: "item",
+          text: m,
+          action: "switch",
+          provider: providerName,
+          model: m,
+        })))
+      }
+    } catch (error) {
+      if (state.picker?.entries !== entries) return
+      const headerIdx = entries.findIndex((e) => e.type === "header" && e.text.startsWith("Available models"))
+      if (headerIdx >= 0) {
+        entries[headerIdx].text = `Available models (fetch failed: ${sliceByWidth(error.message, 30)})`
+      }
+    }
+
+    // Restore selection
+    const pk = state.picker
+    const items = pickerItems(pk)
+    const restored = selKey ? items.findIndex((e) => entryKey(e) === selKey) : -1
+    pk.index = restored >= 0 ? restored : Math.min(pk.index, Math.max(0, items.length - 1))
+    rebuildLines()
+  }
+
   async function selectModel(item) {
     closePicker()
     const target = agent.providers.find((pp) => pp.name === item.provider)
     if (!target) return
+    const providerDefault = target.model
     target.model = item.model
     agent.activeProvider = item.provider
+    // If selecting the provider's default model, clear activeModel; otherwise set it
+    agent.activeModel = item.model !== providerDefault ? item.model : null
     agent.provider = { ...target }
     if (!agent.provider.apiKey) {
       const envKey = { deepseek: "DEEPSEEK_API_KEY", openai: "OPENAI_API_KEY" }[item.provider]
@@ -169,8 +307,10 @@ export function createPickers(ctx) {
       // 落盘前剥离运行时注入的 proxyUri（由 loadConfig + injectProxy 在加载时重建）
       raw.providers = agent.providers.map(({ proxyUri: _, ...p }) => p)
       raw.activeProvider = item.provider
+      raw.activeModel = agent.activeModel || undefined  // null → omit from config
     })
     agent.config.activeProvider = item.provider
+    agent.config.activeModel = agent.activeModel
     if (!agent.provider.apiKey) {
       const selKey = await askQuestion(`Enter API key for ${item.provider} (leave empty to skip):`)
       if (selKey) await setProviderKey(item.provider, selKey)
@@ -195,7 +335,11 @@ export function createPickers(ctx) {
       if (!baseURL) return
       const model = await askQuestion("Enter model name:")
       if (!model) return
-      agent.providers.push({ name, baseURL, model })
+      const format = (await askQuestion("API format [openai/anthropic/google] (default: openai):")).trim().toLowerCase()
+      const cfg = { name, baseURL, model }
+      if (format === "anthropic" || format === "google") cfg.format = format
+      else if (format && format !== "openai") return // unknown format → abort
+      agent.providers.push(cfg)
       await persistRaw((raw) => { raw.providers = agent.providers })
       const key = await askQuestion(`Enter API key for ${name} (skip if none):`)
       if (key) await setProviderKey(name, key)
@@ -208,6 +352,7 @@ export function createPickers(ctx) {
     if (preset.reasoningEffort) cfg.reasoningEffort = preset.reasoningEffort
     if (preset.maxTokens) cfg.maxTokens = preset.maxTokens
     if (preset.chatPath) cfg.chatPath = preset.chatPath
+    if (preset.format) cfg.format = preset.format
     agent.providers.push(cfg)
     await persistRaw((raw) => { raw.providers = agent.providers })
     const key = await askQuestion(`Enter API key for ${se.name} (skip if none):`)

package/src/tui/render-conversation.mjs

@@ -4,12 +4,36 @@
  */
 import { ansi, C } from "./ansi.mjs"
 import { formatTables, sanitizeDisplay, wrapText } from "./render.mjs"
+import { renderMarkdownInline, renderMarkdownHeading } from "./markdown.mjs"
 
 let _convCache = { key: "", cols: 0, lines: [] }
 
 export function convCacheKey(state) {
   const lastLine = state.lines.length > 0 ? state.lines[state.lines.length - 1] : null
-  return `${state.lines.length}|${lastLine?.text.length ?? 0}|${state.streaming.length}|${state.reasoning.length}|${Object.keys(state.toolStreams).length}|${state.foldEnabled !== false ? "f" : "u"}`
+  return `${state.lines.length}|${lastLine?.text.length ?? 0}|${state.streaming.length}|${state.reasoning.length}|${state.advisorStreaming?.length ?? 0}|${state._advisorThink?.length ?? 0}|${state.foldEnabled !== false ? "f" : "u"}`
+}
+
+function highlightSearchMatches(text, query, matchesInLine, globalCurrentIndex, allMatches, lineIndex) {
+  if (!matchesInLine || matchesInLine.length === 0 || !query) return text
+  let result = ""
+  let lastEnd = 0
+  for (const startIdx of matchesInLine) {
+    result += text.substring(lastEnd, startIdx)
+    const endIdx = startIdx + query.length
+    const matchedText = text.substring(startIdx, endIdx)
+
+    // Find global index of this match
+    const gIdx = allMatches.findIndex(m => m.lineIndex === lineIndex && m.charIndex === startIdx)
+
+    if (gIdx === globalCurrentIndex) {
+      result += `\x1b[7m${matchedText}\x1b[27m` // Reverse video for current
+    } else {
+      result += `\x1b[33m\x1b[4m${matchedText}\x1b[24m\x1b[39m` // Yellow underline for others
+    }
+    lastEnd = endIdx
+  }
+  result += text.substring(lastEnd)
+  return result
 }
 
 function buildConvLines(state, cols) {
@@ -17,10 +41,20 @@ function buildConvLines(state, cols) {
   if (_convCache.key === key && _convCache.cols === cols) return _convCache.lines
 
   const convLines = []
-  for (const l of state.lines) {
-    for (const line of formatTables(sanitizeDisplay(l.text), cols - 1)) {
+  for (let i = 0; i < state.lines.length; i++) {
+    const l = state.lines[i]
+    let text = l.text
+
+    // Apply search highlighting
+    if (state.search && state.search.query && l._searchMatches) {
+      text = highlightSearchMatches(text, state.search.query, l._searchMatches, state.search.index, state.search.matches, i)
+    }
+
+    for (const line of formatTables(sanitizeDisplay(text), cols - 1)) {
       for (const wrapped of wrapText(line, cols - 1)) {
-        convLines.push({ text: wrapped, color: l.color, _foldId: l._foldId })
+        // Lightweight markdown display (IK5VW3): headings bold + inline markers styled.
+        // Runs AFTER wrapping so the ANSI it inserts never skews width math.
+        convLines.push({ text: renderMarkdownInline(renderMarkdownHeading(wrapped)), color: l.color, _foldId: l._foldId })
       }
     }
   }
@@ -29,21 +63,28 @@ function buildConvLines(state, cols) {
       convLines.push({ text: wrapped, color: C.reason })
     }
   }
+  if (state._advisorThink || state.advisorStreaming) {
+    const thinkLines = state._advisorThink ? sanitizeDisplay(state._advisorThink).split("\n") : []
+    const mainLines = state.advisorStreaming
+      ? formatTables(sanitizeDisplay(state.advisorStreaming), cols - 3)
+      : []
+    const allLines = [...thinkLines.map(l => ({ text: l, color: C.reason })), ...mainLines.map(l => ({ text: l, color: C.text }))]
+    const truncated = allLines.length > 5
+    if (truncated) convLines.push({ text: "│ …", color: C.dim })
+    const shown = truncated ? allLines.slice(-5) : allLines
+    for (const { text, color } of shown) {
+      for (const wrapped of wrapText(text, cols - 3)) {
+        convLines.push({ text: `│ ${wrapped}`, color })
+      }
+    }
+  }
   if (state.streaming) {
     for (const line of formatTables(sanitizeDisplay(state.streaming), cols - 1)) {
       for (const wrapped of wrapText(line, cols - 1)) {
-        convLines.push({ text: wrapped, color: C.text })
+        convLines.push({ text: renderMarkdownInline(renderMarkdownHeading(wrapped)), color: C.text })
       }
     }
   }
-  const allStreams = Object.values(state.toolStreams).join("")
-  if (allStreams) {
-    const tail = sanitizeDisplay(allStreams.slice(-4000))
-    for (const wrapped of wrapText(tail, cols - 1)) {
-      convLines.push({ text: wrapped, color: C.dim })
-    }
-  }
-
   // Fold long blocks (> 8 consecutive dim lines)
   const FOLD_LINES = 8
   let foldCounter = 0

package/src/tui/render-frame.mjs

@@ -111,20 +111,26 @@ function panelLines(p) {
 /** Tool output panels (streaming output like tail -f). Returns empty when no visible output. */
 export function renderOutput(state, W, panelH) {
   // Same visibility predicate as computeLayout: done panels linger until closeAt
-  const active = Object.values(state.outputPanels).filter((p) => !p.done || (p.closeAt ?? 0) > Date.now())
+  const active = Object.entries(state.outputPanels ?? {}).filter(([_, p]) => !p.done || (p.closeAt ?? 0) > Date.now())
   if (active.length === 0) return []
   const out = []
   const linesPerPanel = Math.max(1, Math.floor(panelH / active.length))
-  const perPanel = active.map((p) => panelLines(p).slice(-linesPerPanel))
-  for (const lines of perPanel) {
+  for (const [toolName, p] of active) {
+    const status = p.done ? `${C.dim}done${ansi.reset}` : `${C.tool}running${ansi.reset}`
+    out.push(`${C.text}❯ ${sliceByWidth(sanitizeDisplay(toolName), Math.max(10, W - 25))} — ${status}`)
+    const titleRows = 1
+    const contentRows = Math.max(0, linesPerPanel - titleRows)
+    const lines = contentRows > 0 ? panelLines(p).slice(-contentRows) : []
     for (const l of lines) {
       const color = PANEL_KIND_COLORS[l.kind] ?? C.dim
       out.push(`${color}  │ ${sliceByWidth(sanitizeDisplay(l.text), W - 5)}${ansi.reset}`)
     }
   }
-  // Fill remaining rows to match panelH exactly
-  const used = perPanel.reduce((s, lines) => s + lines.length, 0)
-  for (let i = used; i < panelH; i++) out.push("")
+  // Safety: never exceed allocated height (could happen with many panels + small terminal)
+  if (out.length > panelH) out.length = panelH
+  // Fill remaining rows to match panelH exactly. `out.length` is accurate because
+  // every pushed entry is a non-empty string (title or content line with prefix).
+  for (let i = out.length; i < panelH; i++) out.push("")
   return out
 }
 
@@ -149,10 +155,12 @@ export function renderPicker(state, cols, panel, overlay) {
   const total = overlay.lines.length
   const start = Math.max(0, Math.min(overlay.scroll, Math.max(0, total - winH)))
   const shown = overlay.lines.slice(start, start + winH)
-  // 标题行：左侧标题 + filter（截断防撑破帧），右侧位置指示（按键提示在状态栏，不重复）
+  // 标题行：左侧标题 + 过滤输入提示/内容（截断防撑破帧），右侧位置指示
   const p = state.picker
   const right = p && p.filteredItems?.length ? `${p.index + 1}/${p.filteredItems.length} ` : ""
-  const rawLeft = p ? ` ❯ ${p.title}${p.filter ? `  filter: ${p.filter}` : ""} ` : " ❯ Setup "
+  // 过滤提示：无filter时显示 "type to filter"，有filter时显示输入内容
+  const filterHint = p ? (p.filter ? `│ ${p.filter}` : "│ type to filter") : ""
+  const rawLeft = p ? ` ❯ ${p.title} ${filterHint} ` : " ❯ Setup "
   const left = sliceByWidth(rawLeft, Math.max(1, cols - 2 - stringWidth(right)))
   const titlePad = " ".repeat(Math.max(1, cols - 1 - stringWidth(left) - stringWidth(right)))
   out.push(`${ansi.bold}${C.tool}${left}${ansi.reset}${ansi.dim}${titlePad}${right}${ansi.reset}`)
@@ -188,6 +196,7 @@ export function renderInputBox(state, W, boxLines, cols, inputLayout, inputOffse
     if (title === " Input " || title === " Processing... ") parts.push(" Ctrl+U clear ")
     if (title === " Question ") parts.push(" Enter submit ")
     if (title === " Inject Message ") parts.push(" Enter send, Esc cancel ")
+    parts.push(" Shift+Enter / Ctrl+J newline ")
     parts.push(" Ctrl+V paste ")
     parts.push(" Ctrl+I inject ")
     const hint = parts.join("")
@@ -202,8 +211,21 @@ export function renderInputBox(state, W, boxLines, cols, inputLayout, inputOffse
   const curLine = (!hasOverlay && inputLayout) ? inputLayout.cursorLine - (inputOffset ?? 0) : -1
   const curCol = (!hasOverlay && inputLayout) ? inputLayout.cursorCol : -1
 
+  // Interrupt prompt 空文本占位符：灰色提示用户该做什么
+  const isInterruptEmpty = state.interruptPrompt && !state.interruptPrompt.text
+  const interruptPlaceholder = "Type message to inject (Enter send, Esc cancel)"
+
   for (let li = 0; li < boxLines.length; li++) {
     const l = boxLines[li]
+    // 第一行且 interrupt prompt 为空时，用灰色占位符替代 prompt
+    if (li === 0 && isInterruptEmpty) {
+      const prompt = "▸ "
+      const ph = `${prompt}${interruptPlaceholder}`
+      const phWidth = stringWidth(ph)
+      const fill = " ".repeat(Math.max(0, W - 4 - phWidth))
+      out.push(`${borderColor}│${ansi.reset} ${ansi.dim}${ph}${ansi.reset}${fill} ${borderColor}│${ansi.reset}`)
+      continue
+    }
     const original = sliceByWidth(l, W - 4)
     let content = original
     const contentWidth = stringWidth(original)
@@ -247,9 +269,10 @@ export function renderStatus(state, agent, cols, slashCommands) {
   const autoBanner = agent.autoApprove ? `${C.warn} AUTO${ansi.reset}${ansi.dim}│` : ""
   const planBanner = agent.planMode ? `${C.tool} PLAN${ansi.reset}${ansi.dim}│` : ""
   const advisorBanner = agent.config?.advisor?.enabled ? `${C.advisor} ADVISOR${ansi.reset}${ansi.dim}│` : ""
-  const bannerPrefix = (agent.planMode ? " PLAN│ " : "") + (agent.autoApprove ? " AUTO│ " : "") + (agent.config?.advisor?.enabled ? " ADVISOR│ " : "")
+  const engBanner = agent.config?.agent?.engineering ? `${C.advisor} ENG${ansi.reset}${ansi.dim}│` : ""
+  const bannerPrefix = (agent.planMode ? " PLAN│ " : "") + (agent.autoApprove ? " AUTO│ " : "") + (agent.config?.advisor?.enabled ? " ADVISOR│ " : "") + (agent.config?.agent?.engineering ? " ENG│ " : "")
   const statusMax = cols - 1 - (bannerPrefix ? stringWidth(bannerPrefix) : 0)
-  return `${ansi.dim}${planBanner}${autoBanner}${advisorBanner}${sliceByWidth(statusLine, Math.max(10, statusMax))}${ansi.reset}`
+  return `${ansi.dim}${planBanner}${autoBanner}${advisorBanner}${engBanner}${sliceByWidth(statusLine, Math.max(10, statusMax))}${ansi.reset}`
 }
 
 // ====================================================================
@@ -315,7 +338,9 @@ export function renderFrame(state, agent, opts) {
 function inputBoxStyle(state) {
   let borderColor = C.tool
   let title
-  if (state.interruptPrompt) {
+  if (state.search) {
+    borderColor = C.tool; title = ` Search ${state.search.matches.length > 0 ? `(${state.search.index + 1}/${state.search.matches.length})` : state.search.query ? "(no match)" : ""} `
+  } else if (state.interruptPrompt) {
     borderColor = C.warn; title = " Inject Message "
   } else if (state.question) {
     borderColor = C.tool; title = " Question "
@@ -369,6 +394,8 @@ function buildStatusLine(state, agent, { cols, slashCommands }) {
 
   const taskHint = state.tasks.length > 0
     ? ` │ ✓${state.tasks.filter((t) => t.status === "done").length}/${state.tasks.length}` : ""
+  const turnHint = agent._currentTurn > 0 && agent._maxTurns > 0
+    ? ` │ turn ${agent._currentTurn}/${agent._maxTurns}` : ""
   const tk = state.tokens
   const fmtK = (n) => (n >= 10000 ? `${Math.round(n / 1000)}k` : n >= 1000 ? `${(n / 1000).toFixed(1)}k` : `${n}`)
   const cacheTotal = tk.cacheHit + tk.cacheMiss
@@ -383,5 +410,5 @@ function buildStatusLine(state, agent, { cols, slashCommands }) {
   const ctxHint = ctxPct > 0
     ? ctxPct >= 80 ? ` │ ${ansi.reset}${C.warn}context ${ctxPct}%${ctxTokensHint}${ansi.reset}${ansi.dim}` : ` │ context ${ctxPct}%${ctxTokensHint}` : ""
   const queueHint = state.queue.length > 0 ? ` │ queue: ${state.queue.length}` : ""
-  return ` ${statusText}${taskHint}${tokenHint}${ctxHint}${queueHint}${scrollHint} │ Enter: send${state.processing ? " (queue)" : ""} │ /: commands │ wheel/PgUp/PgDn: scroll │ Ctrl+I: inject │ Ctrl+C: exit`
+  return ` ${statusText}${taskHint}${turnHint}${tokenHint}${ctxHint}${queueHint}${scrollHint} │ Enter: send${state.processing ? " (queue)" : ""} │ /: commands │ wheel/PgUp/PgDn: scroll │ Ctrl+I: inject │ Ctrl+C: exit (×2)`
 }

package/src/tui/render-loop.mjs

@@ -60,7 +60,7 @@ export function createRenderLoop(state, agent, ctx, pushLine, write = (s) => pro
 
       // Expired output panels: prune once their close grace elapsed (done + closeAt in the past)
       const now = Date.now()
-      for (const [name, p] of Object.entries(state.outputPanels)) {
+      for (const [name, p] of Object.entries(state.outputPanels ?? {})) {
         if (p.done && (p.closeAt ?? 0) <= now) delete state.outputPanels[name]
       }
 
@@ -103,6 +103,7 @@ export function createRenderLoop(state, agent, ctx, pushLine, write = (s) => pro
       if (out.length || cursorSuffix) write(ansi.syncUpdateStart + out.join("") + ansi.syncUpdateEnd + cursorSuffix)
     } catch (e) {
       // Don't let a render error crash the TUI
+      if (process.env.THINCODER_DEBUG_RENDER) process.stderr.write(`[render-error] ${e?.stack ?? e}\n`)
     }
   }
 

package/src/tui/render.mjs

@@ -130,18 +130,23 @@ function renderTable(block, width) {
   return out
 }
 
-/** Input area layout: wrap input buffer into lines, also compute cursor (row, col) position (display width) */
+/** Input area layout: wrap input buffer into lines, also compute cursor (row, col) position (display width).
+ *  Every line carries a 2-column prefix so all content left-edges align: first line gets the
+ *  `▸ ` prompt, continuation lines (wrap or explicit \n) get 2 spaces. Content width is
+ *  `width - 2` on every line. A trailing \n flushes an empty line so the cursor's row exists —
+ *  without it the box wouldn't grow for multiline input and the cursor row would be out of range. */
 export function layoutInput(chars, cursor, width) {
-  const PROMPT = "\u25b8 "
+  const PROMPT = "\u25b8 "  // first-line prefix (display width 2)
+  const CONT = "  "         // continuation prefix (width 2) — keeps left edge aligned
   const lines = []
   let cursorLine = 0
   let cursorCol = 0
   let cur = ""
   let col = 0
   let firstLine = true
-  const avail = () => (firstLine ? width - 2 : width)
+  const avail = () => width - 2 // every line reserves 2 cols for its prefix
   const flush = () => {
-    lines.push((firstLine ? PROMPT : "") + cur)
+    lines.push((firstLine ? PROMPT : CONT) + cur)
     firstLine = false
     cur = ""
     col = 0
@@ -153,19 +158,20 @@ export function layoutInput(chars, cursor, width) {
       if (col + w > avail()) flush()
       if (i === cursor) {
         cursorLine = lines.length
-        cursorCol = (firstLine ? 2 : 0) + col
+        cursorCol = 2 + col
       }
       cur += ch
       col += w
     } else {
       if (i === cursor) {
         cursorLine = lines.length
-        cursorCol = (firstLine ? 2 : 0) + col
+        cursorCol = 2 + col
       }
       if (ch === "\n") flush()
     }
   }
-  if (cur || lines.length === 0) flush()
+  const endsWithNewline = chars.length > 0 && chars[chars.length - 1] === "\n"
+  if (cur || lines.length === 0 || endsWithNewline) flush()
   return { lines, cursorLine, cursorCol }
 }