thincoder 0.9.0 → 0.11.0

package/src/tui/pickers.mjs

@@ -1,144 +1,154 @@
 import { sliceByWidth } from "./render.mjs"
 import { PROVIDER_PRESETS as PRESETS } from "../config.mjs"
 
-/** Generic list picker + unified model/provider management picker.
- *  Receives closure dependencies via createPickers(ctx),
- *  returns { openPicker, closePicker, renderPickerLines, openModelPicker, setProviderKey }. */
+/** Generic list picker + model/provider management.
+ *  单一 Promise API：showPicker(title, entries, { defaultIndex }) → Promise<entry|null>。
+ *  picker 栈：state.pickerStack，state.picker 始终指向栈顶（layout/render/key-handler 都只读 state.picker）。
+ *  选中即关闭（Enter = resolve + pop）；Esc = pop 当前层并 resolve(null)。菜单循环由调用方 while 重开。 */
 export function createPickers(ctx) {
   const { agent, state, render, ansi, C, pushLine, persistRaw, askQuestion, maskKey } = ctx
 
-  const pickerItems = () => state.picker?.entries.filter((e) => e.type === "item") ?? []
+  state.pickerStack ??= []
 
-  /** Open a generic list picker. entries contain { type: "header"|"item", text, note?, ...extra },
-   *  onSelect receives the selected entry (with extra fields forwarded), onCancel called on Esc. */
-  function openPicker({ title, entries, onSelect, onCancel, defaultIndex = 0 }) {
-    state.picker = { title, entries, lines: [], index: defaultIndex, scroll: 0, selectedLine: 0, onSelect, onCancel }
-    renderPickerLines()
+  /** 当前 picker 过滤后的 item 列表（filter 大小写不敏感子串匹配，header 不参与） */
+  function pickerItems(p) {
+    const f = (p.filter ?? "").toLowerCase()
+    return p.entries.filter((e) => e.type === "item" && (!f || e.text.toLowerCase().includes(f)))
   }
 
+  /** 弹出栈顶 picker 并 resolve 其 Promise。返回是否有 picker 被弹出。 */
+  function popPicker(value) {
+    const p = state.pickerStack.pop()
+    if (!p) return false
+    state.picker = state.pickerStack.at(-1) ?? null
+    if (state.picker) rebuildLines()
+    else render()
+    p.resolve(value)
+    return true
+  }
+
+  /** 关闭所有 picker：清空栈，挂起者全部 resolve(null)。 */
   function closePicker() {
-    state.picker?.onCancel?.()
-    state.picker = null
-    render()
+    while (state.pickerStack.length) popPicker(null)
   }
 
-  /** Rebuild display lines from entries and refresh */
-  function renderPickerLines() {
+  /** 打开 picker，返回选中 entry（Esc/取消 → null）。
+   *  互斥保护：入栈前把现有挂起 picker 全部 resolve(null)，消除 Promise 悬挂。
+   *  （正常嵌套是先 await 上一层返回再开新的，栈深通常为 1。） */
+  function showPicker(title, entries, { defaultIndex = 0 } = {}) {
+    closePicker()
+    return new Promise((resolve) => {
+      const itemCount = entries.filter((e) => e.type === "item").length
+      const index = Math.max(0, Math.min(defaultIndex, Math.max(0, itemCount - 1)))
+      state.picker = { title, entries, lines: [], index, scroll: 0, selectedLine: 0, filter: "", resolve }
+      state.pickerStack.push(state.picker)
+      rebuildLines()
+    })
+  }
+
+  function rebuildLines() {
     const p = state.picker
     if (!p) return
+    const items = pickerItems(p)
+    p.filteredItems = items
+    if (p.index >= items.length) p.index = Math.max(0, items.length - 1)
     const lines = []
-    let row = 0
-    let selectedLine = 0
+    let row = 0, selLine = 0
     for (const e of p.entries) {
       if (e.type === "header") {
         lines.push({ text: ` ${e.text}${e.note ? `  ${e.note}` : ""}`, color: ansi.bold + C.tool })
       } else {
-        const selected = row === p.index
-        if (selected) selectedLine = lines.length
+        if (!items.includes(e)) continue // 被 filter 滤掉
+        const sel = row === p.index
+        if (sel) selLine = lines.length
         const marker = e.marker ? `  ${e.marker}` : ""
-        lines.push({
-          text: `${selected ? " ▸ " : "   "}${e.text}${marker}`,
-          color: selected ? ansi.bold + C.text : C.dim,
-        })
+        lines.push({ text: `${sel ? " ▸ " : "   "}${e.text}${marker}`, color: sel ? ansi.bold + C.text : C.dim })
         row++
       }
     }
+    if (p.filter && items.length === 0) lines.push({ text: "   (no match)", color: C.dim })
     p.lines = lines
-    p.selectedLine = selectedLine
+    p.selectedLine = selLine
     render()
   }
 
-  // ========== unified picker: model switch + provider management ==========
+  function renderPickerLines() { rebuildLines() }
+
+  // === model picker ===
+
+  /** entry 唯一标识：异步更新 entries 后按它恢复选中项 */
+  function entryKey(e) {
+    if (!e) return null
+    return e.action === "switch" ? `switch:${e.provider}:${e.model}` : `action:${e.action}`
+  }
 
   async function openModelPicker() {
-    const entries = buildModelEntries()
-    const onSelect = async (e) => {
+    // 菜单循环：选中即关闭，子流程结束后重开主菜单；Esc 退出
+    for (;;) {
+      const entries = buildModelEntries()
+      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)
+      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))
-      } else if (e.action === "add") {
-        await addProviderFlow()
-      } else if (e.action === "remove") {
-        await removeProviderFlow()
-      } else if (e.action === "key") {
-        await setKeyFlow()
+        return
       }
+      if (e.action === "add") await addProviderFlow()
+      else if (e.action === "remove") await removeProviderFlow()
+      else if (e.action === "key") await setKeyFlow()
     }
-    openPicker({ title: "Models & Providers", entries, onSelect })
-    // default select the currently active model
-    const current = pickerItems().findIndex(
-      (e) => e.action === "switch" && e.provider === agent.activeProvider && e.model === agent.provider.model,
-    )
-    if (current >= 0) state.picker.index = current
-    renderPickerLines()
+  }
 
-    // async fetch remote model list, append under each provider
+  /** 后台拉取模型列表并 splice 进 entries；更新时按 entryKey 恢复用户光标下的选中项 */
+  async function fetchModels(entries) {
     const { listModels } = await import("../provider/index.mjs")
-    await Promise.all(
-      agent.providers.map(async (p) => {
-        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) },
-          )
-          // find the model item position for this provider in entries, insert new models after it
-          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 })),
-            )
-          }
-          // update header note to remove "loading..."
-          const header = entries.find((e) => e.type === "header" && e.text === p.name)
-          if (header) header.note = `${p.baseURL}${p.apiKey ? "" : " (no key)"}`
-        } catch (error) {
-          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)})`
-        }
-        if (state.picker?.entries === entries) renderPickerLines()
-      }),
-    )
+    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()
+    }))
   }
 
-  /** Build picker entries: each provider gets a header + model list, management actions at the bottom */
   function buildModelEntries() {
     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 ? "●" : "",
-      })
+      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 ? "●" : "" })
     }
-    // management actions
     entries.push({ type: "header", text: "Provider Management" })
     entries.push({ type: "item", text: "Add provider…", action: "add" })
-    if (agent.providers.length > 1) {
-      entries.push({ type: "item", text: "Remove provider…", action: "remove" })
-    }
+    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
   }
 
-  /** Switch provider + model, persist, threshold follows model */
   async function selectModel(item) {
     closePicker()
     const target = agent.providers.find((pp) => pp.name === item.provider)
@@ -153,11 +163,11 @@ export function createPickers(ctx) {
     if (!agent.provider.apiKey) agent.provider.apiKey = process.env.THINCODER_API_KEY
     if (agent.config?.agent?.compactThresholdAuto) {
       const { resolveCompactThreshold } = await import("../config.mjs")
-      const { value } = resolveCompactThreshold(null, item.model)
-      agent.config.agent.compactThreshold = value
+      agent.config.agent.compactThreshold = resolveCompactThreshold(null, item.model).value
     }
     await persistRaw((raw) => {
-      raw.providers = agent.providers
+      // 落盘前剥离运行时注入的 proxyUri（由 loadConfig + injectProxy 在加载时重建）
+      raw.providers = agent.providers.map(({ proxyUri: _, ...p }) => p)
       raw.activeProvider = item.provider
     })
     agent.config.activeProvider = item.provider
@@ -167,106 +177,65 @@ export function createPickers(ctx) {
     }
   }
 
-  /** Add provider: preset menu → input key → done, or custom step-by-step input */
   async function addProviderFlow() {
-    const presetEntries = [
+    const entries = [
       { type: "header", text: "Select a preset provider" },
-      ...Object.entries(PRESETS)
-        .filter(([name]) => !agent.providers.some((p) => p.name === name))
-        .map(([name, p]) => ({
-          type: "item",
-          text: `${name.padEnd(10)} ${p.desc ?? ""} (${p.model})`,
-          name,
-          kind: "preset",
-        })),
+      ...Object.entries(PRESETS).filter(([name]) => !agent.providers.some((p) => p.name === name))
+        .map(([name, p]) => ({ type: "item", text: `${name.padEnd(10)} ${p.desc ?? ""} (${p.model})`, name, kind: "preset" })),
       { type: "header", text: "Other" },
       { type: "item", text: "Custom (manual config)", name: "__custom__", kind: "custom" },
     ]
-    openPicker({
-      title: "Add Provider",
-      entries: presetEntries,
-      onCancel: () => openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)),
-      onSelect: async (se) => {
-        if (se.kind === "custom") {
-          const name = await askQuestion("Enter provider name:")
-          if (!name) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-          if (agent.providers.some((p) => p.name === name)) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-          const baseURLRaw = await askQuestion("Enter baseURL (e.g. https://api.example.com/v1):")
-          if (!baseURLRaw) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-          const baseURL = baseURLRaw.replace(/\/+$/, "")
-          if (!/^https?:\/\//.test(baseURL)) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-          const model = await askQuestion("Enter model name:")
-          if (!model) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-          agent.providers.push({ name, baseURL, model })
-          await persistRaw((raw) => { raw.providers = agent.providers })
-          const key = await askQuestion(`Enter API key for ${name} (leave empty to skip):`)
-          if (key) { await setProviderKey(name, key) }
-          openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error))
-          return
-        }
-        // preset
-        if (agent.providers.some((p) => p.name === se.name)) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-        const preset = PRESETS[se.name]
-        const providerCfg = { name: se.name, baseURL: preset.baseURL, model: preset.model }
-        if (preset.thinking) providerCfg.thinking = preset.thinking
-        if (preset.reasoningEffort) providerCfg.reasoningEffort = preset.reasoningEffort
-        if (preset.maxTokens) providerCfg.maxTokens = preset.maxTokens
-        if (preset.chatPath) providerCfg.chatPath = preset.chatPath
-        if (preset.desc) providerCfg.desc = preset.desc
-        agent.providers.push(providerCfg)
-        await persistRaw((raw) => { raw.providers = agent.providers })
-        const presetKey = await askQuestion(`Enter API key for ${se.name} (leave empty to skip):`)
-        if (presetKey) await setProviderKey(se.name, presetKey)
-        openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error))
-      },
-    })
+    const se = await showPicker("Add Provider", entries)
+    if (!se) return // Esc → 返回上级（openModelPicker 循环会重开主菜单）
+    if (se.kind === "custom") {
+      const name = await askQuestion("Enter provider name:")
+      if (!name) return
+      if (agent.providers.some((p) => p.name === name)) return
+      const baseURL = (await askQuestion("Enter baseURL:")).replace(/\/+$/, "")
+      if (!baseURL) return
+      const model = await askQuestion("Enter model name:")
+      if (!model) return
+      agent.providers.push({ name, baseURL, model })
+      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)
+      return
+    }
+    const preset = PRESETS[se.name]
+    if (!preset || agent.providers.some((p) => p.name === se.name)) return
+    const cfg = { name: se.name, baseURL: preset.baseURL, model: preset.model }
+    if (preset.thinking) cfg.thinking = preset.thinking
+    if (preset.reasoningEffort) cfg.reasoningEffort = preset.reasoningEffort
+    if (preset.maxTokens) cfg.maxTokens = preset.maxTokens
+    if (preset.chatPath) cfg.chatPath = preset.chatPath
+    agent.providers.push(cfg)
+    await persistRaw((raw) => { raw.providers = agent.providers })
+    const key = await askQuestion(`Enter API key for ${se.name} (skip if none):`)
+    if (key) await setProviderKey(se.name, key)
   }
 
-  /** Remove provider (cannot remove the currently active one) */
   async function removeProviderFlow() {
     const candidates = agent.providers.filter((p) => p.name !== agent.activeProvider)
-    if (candidates.length === 0) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-    const removeEntries = [
-      { type: "header", text: "Select provider to remove (current one cannot be removed)" },
+    if (!candidates.length) return
+    const se = await showPicker("Remove Provider", [
+      { type: "header", text: "Select provider to remove" },
       ...candidates.map((p) => ({ type: "item", text: `${p.name} (${p.model})`, name: p.name })),
-    ]
-    openPicker({
-      title: "Remove Provider",
-      entries: removeEntries,
-      onCancel: () => openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)),
-      onSelect: async (se) => {
-        const at = agent.providers.findIndex((p) => p.name === se.name)
-        agent.providers.splice(at, 1)
-        await persistRaw((raw) => { raw.providers = agent.providers })
-        openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error))
-      },
-    })
+    ])
+    if (!se) return
+    agent.providers.splice(agent.providers.findIndex((p) => p.name === se.name), 1)
+    await persistRaw((raw) => { raw.providers = agent.providers })
   }
 
-  /** Set/change API key: select provider → enter key */
   async function setKeyFlow() {
-    const keyEntries = [
-      { type: "header", text: "Select provider to configure key" },
-      ...agent.providers.map((p) => ({
-        type: "item",
-        text: `${p.name} ${p.apiKey ? `(has key: ${maskKey(p.apiKey)})` : "(no key)"}`,
-        name: p.name,
-      })),
-    ]
-    openPicker({
-      title: "Configure API Key",
-      entries: keyEntries,
-      onCancel: () => openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)),
-      onSelect: async (se) => {
-        const key = await askQuestion(`Enter API key for ${se.name}:`)
-        if (!key) { openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error)); return }
-        await setProviderKey(se.name, key)
-        openModelPicker().catch((e) => pushLine(`[error] ${e.message}`, C.error))
-      },
-    })
+    const se = await showPicker("Configure API Key", [
+      { type: "header", text: "Select provider" },
+      ...agent.providers.map((p) => ({ type: "item", text: `${p.name} ${p.apiKey ? `(has key: ${maskKey(p.apiKey)})` : "(no key)"}`, name: p.name })),
+    ])
+    if (!se) return
+    const key = await askQuestion(`Enter API key for ${se.name}:`)
+    if (key) await setProviderKey(se.name, key)
   }
 
-  /** Write key for a given provider (memory + config file); if it's the currently active one, sync runtime too */
   async function setProviderKey(name, key) {
     const target = agent.providers.find((p) => p.name === name)
     if (!target) return
@@ -275,5 +244,5 @@ export function createPickers(ctx) {
     await persistRaw((raw) => { raw.providers = agent.providers })
   }
 
-  return { openPicker, closePicker, renderPickerLines, openModelPicker, setProviderKey }
+  return { showPicker, closePicker, popPicker, renderPickerLines, openModelPicker, selectModel, setProviderKey }
 }

package/src/tui/render-frame.mjs

@@ -35,7 +35,7 @@ const SLASH_HINTS = {
 export function renderHeader(agent, cols) {
   const model = agent.provider.model
   const spec = specForModel(model)
-  const thinkOnValue = spec.thinkOnValue ?? "enabled"
+  const thinkOnValue = spec.thinkEnabledValue ?? "enabled"
   const t = agent.provider.thinking
   const effort = agent.provider.reasoningEffort
   const thinkBadge = t?.type === "disabled" ? "│ think: off"
@@ -146,12 +146,29 @@ export function renderPicker(state, cols, panel, overlay) {
   if (!panel || !overlay) return []
   const out = []
   const winH = panel.h - 1
-  const start = Math.max(0, Math.min(overlay.scroll, Math.max(0, overlay.lines.length - winH)))
+  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)
-  const title = state.picker ? ` ❯ ${state.picker.title} ` : " ❯ Setup "
-  out.push(`${ansi.bold}${C.tool}${title}${ansi.reset}${ansi.dim}${state.picker ? "(↑↓ navigate, Enter confirm, Esc cancel)" : ""}${ansi.reset}`)
-  for (const l of shown) {
-    out.push(`${l.color}${sliceByWidth(l.text, cols - 1)}${ansi.reset}`)
+  // 标题行：左侧标题 + 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 "
+  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}`)
+  const hasMoreAbove = start > 0
+  const hasMoreBelow = start + winH < total
+  for (let i = 0; i < shown.length; i++) {
+    const l = shown[i]
+    // 可视窗上方/下方有更多内容时，在首行/末行右侧给 dim 提示；单行窗口两个方向都有则合并指示
+    const moreAbove = i === 0 && hasMoreAbove
+    const moreBelow = i === shown.length - 1 && hasMoreBelow
+    const ind = moreAbove && moreBelow ? "↑↓ more" : moreAbove ? "↑ more" : moreBelow ? "↓ more" : ""
+    const maxW = cols - 1 - (ind ? stringWidth(ind) + 1 : 0)
+    // 超宽行截断并加省略号
+    const text = stringWidth(l.text) > maxW ? sliceByWidth(l.text, Math.max(0, maxW - 1)) + "…" : l.text
+    const pad = ind ? " ".repeat(Math.max(1, cols - 1 - stringWidth(text) - stringWidth(ind))) : ""
+    out.push(`${l.color}${text}${ansi.reset}${ind ? `${ansi.dim}${pad}${ind}${ansi.reset}` : ""}`)
   }
   for (let i = shown.length; i < winH; i++) out.push("")
   return out
@@ -193,7 +210,7 @@ export function renderInputBox(state, W, boxLines, cols, inputLayout, inputOffse
     if (li === curLine && curCol >= 0) {
       const beforeWidth = Math.min(curCol, stringWidth(content))
       const before = sliceByWidth(content, beforeWidth)
-      const atIdx = beforeWidth
+      const atIdx = before.length   // character index (not display width — CJK chars diverge)
       const at = content[atIdx] ?? " "
       const after = content.slice(atIdx + 1)
       content = before + `${ansi.reset}\x1b[7m${at}\x1b[27m${ansi.reset}` + after
@@ -406,7 +423,7 @@ function buildStatusLine(state, agent, { cols, slashCommands }) {
       ? " y: continue │ n: stop"
       : " y: approve │ n: deny │ a: approve all (AUTO)"
   }
-  if (state.picker) return " ↑↓: select │ Enter: confirm │ Esc: cancel"
+  if (state.picker) return " type: filter │ ↑↓/PgUp/PgDn: select │ Enter: confirm │ Esc: cancel"
   if (state.wizard) {
     return state.wizard.step === "provider"
       ? " ↑↓: select │ Enter: confirm │ Esc: skip"
@@ -434,10 +451,11 @@ function buildStatusLine(state, agent, { cols, slashCommands }) {
   const elapsed = state.processing ? ` ${Math.floor((Date.now() - state.processingStarted) / 1000)}s` : ""
   const toolHint = state.currentTool ? ` ${state.currentTool}…` : ""
   const statusText = state.processing ? `${state.status}${toolHint}${elapsed}` : state.status
-  const ctxThreshold = agent.config?.agent?.compactThreshold ?? 100_000
-  const ctxPct = Math.round((state.ctxCache.tokens / ctxThreshold) * 100)
+  const modelContext = specForModel(agent.provider.model).context
+  const ctxPct = Math.round((state.ctxCache.tokens / modelContext) * 100)
+  const ctxTokensHint = state.ctxCache.tokens > 0 ? ` ${fmtK(state.ctxCache.tokens)}` : ""
   const ctxHint = ctxPct > 0
-    ? ctxPct >= 80 ? ` │ ${ansi.reset}${C.warn}context ${ctxPct}%${ansi.reset}${ansi.dim}` : ` │ context ${ctxPct}%` : ""
+    ? 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`
 }

package/src/tui/slash-commands.mjs

@@ -4,11 +4,12 @@
  *
  * ctx object is injected by index.mjs and forwarded to each handler:
  *   { agent, state, distillOpts, pushLine, pushLabel, render,
- *     openPicker, openModelPicker, setProviderKey, runDistill,
+ *     showPicker, closePicker, openModelPicker, setProviderKey, runDistill,
  *     persistRaw, syncProviderField, maskKey, exit, SLASH_COMMANDS }
  */
 
 import { C } from "./ansi.mjs"
+import { specForModel } from "../config.mjs"
 import { handleClearCommand } from "./cmd-clear.mjs"
 import { handleNewCommand } from "./cmd-new.mjs"
 import { handleExitCommand } from "./cmd-exit.mjs"
@@ -55,8 +56,11 @@ export const SLASH_COMMANDS = [
   { name: "/help", group: "System", desc: "this list" },
 ]
 
-/** Command → handler mapping table */
-const HANDLERS = {
+/** High-frequency command aliases (single source of truth — also used by index.mjs and cmd-help.mjs) */
+export const SLASH_ALIASES = { "/h": "/help", "/x": "/exit", "/m": "/model", "/p": "/plan", "/t": "/think", "/c": "/clear", "/n": "/new" }
+
+/** Command → handler mapping table (exported for tests) */
+export const HANDLERS = {
   "/clear": handleClearCommand,
   "/new": handleNewCommand,
   "/exit": handleExitCommand,
@@ -90,27 +94,29 @@ export function createSlashCommands(ctx) {
   const handlerCtx = { ...ctx, SLASH_COMMANDS }
 
   async function handleSlash(text) {
-    const [cmd] = text.split(/\s+/)
-    // high-frequency command aliases
-    const aliases = { "/h": "/help", "/x": "/exit", "/m": "/model", "/p": "/plan", "/t": "/think", "/c": "/clear", "/n": "/new" }
-    const resolved = aliases[cmd] ?? cmd
+    const [rawCmd, ...args] = text.split(/\s+/)
+    // case-insensitive matching + alias resolution
+    const cmd = rawCmd.toLowerCase()
+    const resolved = SLASH_ALIASES[cmd] ?? cmd
     const handler = HANDLERS[resolved]
     if (handler) {
-      await handler(handlerCtx)
+      await handler(handlerCtx, args)
       return
     }
-    ctx.pushLine(`Unknown command: ${cmd} (/help for available commands)`, C.error)
+    ctx.pushLine(`Unknown command: ${rawCmd} (/help for available commands)`, C.error)
   }
 
   /** Tab completion candidates: command names / subcommands / provider names / preset names / think params */
   function completions(input) {
     if (!input.startsWith("/")) return []
     const parts = input.split(/\s+/)
-    // still typing the first token: complete command names
+    // still typing the first token: complete command names (case-insensitive)
     if (parts.length === 1) {
-      return SLASH_COMMANDS.filter((c) => c.name.startsWith(parts[0])).map((c) => c.name)
+      const prefix = parts[0].toLowerCase()
+      return SLASH_COMMANDS.filter((c) => c.name.startsWith(prefix)).map((c) => c.name)
     }
-    const cmd = parts[0]
+    // aliases resolve to their target command, so `/m <Tab>` completes /model args
+    const cmd = SLASH_ALIASES[parts[0].toLowerCase()] ?? parts[0].toLowerCase()
     const last = parts.at(-1) // when trailing space, list all candidates
     const head = parts.slice(0, -1).join(" ")
     const argIndex = parts.length - 2 // which parameter is being typed (0-based)
@@ -118,13 +124,17 @@ export function createSlashCommands(ctx) {
     if (cmd === "/model" && argIndex === 0) return match(agent.providers.map((p) => p.name))
     if (cmd === "/think") {
       if (argIndex === 0) return match(["on", "off", "effort"])
-      if (argIndex === 1 && parts[1] === "effort") return match(["low", "high", "max"])
+      if (argIndex === 1 && parts[1].toLowerCase() === "effort") {
+        // effort enum is model-specific — take it from the current model's spec
+        const levels = specForModel(agent.provider?.model).reasoningEffortEnum ?? ["high", "max"]
+        return match(levels)
+      }
     }
-    if (cmd === "/config" && argIndex === 0) return match(["embedkey", "set"])
+    if (cmd === "/config" && argIndex === 0) return match(["embedkey"])
     if (cmd === "/goal" && argIndex === 0) return match(["set", "cancel"])
     if (cmd === "/mcp") {
-      if (argIndex === 0) return match(["add", "url", "ws", "remove", "connect", "list"])
-      if (argIndex === 1 && (parts[1] === "remove" || parts[1] === "connect")) return match((agent.config?.mcp?.servers ?? []).map((s) => s.name))
+      if (argIndex === 0) return match(["add", "http", "ws", "stdio", "ai", "remove", "connect", "list"])
+      if (argIndex === 1 && (parts[1]?.toLowerCase() === "remove" || parts[1]?.toLowerCase() === "connect")) return match((agent.config?.mcp?.servers ?? []).map((s) => s.name))
     }
     return []
   }