feat(round2+round3): 完整实现 A/B/C/D 主线 + round3-F/H 修复

Round2 主线:
- A: 事件落库地基 (RuntimeApp EventStore 单例 + 14 repo wiring)
- B: 执行体对齐 (read-before-edit, verification-before-completion)
- C: 界面对齐 (@opentui/solid, 删除 runtime 依赖)
- D: 经验闭环 (ExperienceMiner, DebuggerRole, CompactorRole)

Round2 补充修复:
- fail-on-missing 反作弊门禁
- projection-store-apply.test.ts 补写
- 3个空壳测试转行为 (evidence-store, recovery-impl, knowledge-store)
- ask 项目根支持 AIRCODING_PROJECT_ROOT
- Worker 事件契约修复 (task.attempt.started → checkpoint)

Round3-F: cpp 工具切换
- 删除 BuiltInToolRegistrar cpp.* 闭包
- 接入 toolchain-cpp 真实 CppToolRegistrar
- canonical envelope {status/output/metadata}
- ExecutorRole system prompt 对齐新工具名

Round3-H: Doctor 5 类报告
- toolchain (cmake/ninja/cppcheck/clangd/g++)
- display (X11/Wayland + ImageMagick)
- network (internet connectivity)
- provider (api_key/base_url/model/connectivity)

Secret 脱敏:
- 状态交接.md: sk- → \${OPENAI_API_KEY}
- .gitignore: 添加 .air/ .claude/

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

packages/tui/package.json

@@ -6,7 +6,8 @@
   "main": "./src/index.ts",
   "types": "./src/index.ts",
   "exports": {
-    ".": "./src/index.ts"
+    ".": "./src/index.ts",
+    "./preload": "./src/preload.ts"
   },
   "scripts": {
     "typecheck": "tsc --noEmit",
@@ -15,7 +16,9 @@
   },
   "dependencies": {
     "@aircoding/contracts": "workspace:*",
-    "@aircoding/runtime": "workspace:*"
+    "@opentui/core": "0.3.0",
+    "@opentui/solid": "0.3.0",
+    "solid-js": "1.9.10"
   },
   "devDependencies": {
     "@types/node": "^25.9.1",

packages/tui/src/ProjectionClient.ts

@@ -1,53 +1,28 @@
 /**
- * ProjectionClient - Local TUI-side projection consumer
- * TUI copies minimal projection types from contracts to avoid INV-4 violation
- * (TUI must only depend on contracts; dd §13.2 / c4/code-view §2 rule 3).
- *
- * The runtime package provides the authoritative ProjectionClient in
- * `runtime/projection/ProjectionClient.ts`. TUI defines its own local copy
- * with the same surface so that subscriptions work in-process.
+ * ProjectionClient - Local TUI-side projection consumer.
+ * TUI keeps a contracts-only copy of the ProjectionClient surface so it never imports runtime.
  *
  * @module packages/tui/src/ProjectionClient
  */
 
-import type { SessionID, ProjectID, TaskID, AgentID, ISOTimeString } from '@aircoding/contracts'
+import type { ProjectionSubscriber, SessionProjection } from './types.js'
 
-export interface SessionProjection {
-  session_id: SessionID
-  project_id: ProjectID
-  status: string
-  title?: string
-  tasks: TaskProjection[]
-  agents: AgentProjection[]
-}
-
-export interface TaskProjection {
-  id: TaskID
-  type: string
-  status: string
-  title: string
-  retry_count: number
-  attempts: number
-  created_at: string
-}
-
-export interface AgentProjection {
-  id: AgentID
-  type: string
-  status: string
-  task_id?: TaskID
-  last_heartbeat?: string
-}
-
-export type ProjectionSubscriber = (projection: SessionProjection) => void
+export type {
+  SessionProjection,
+  TaskProjection,
+  AgentProjection,
+  ToolRunProjection,
+  CommandRunProjection,
+  ArtifactProjection,
+  PermissionPromptProjection,
+  BlockerProjection,
+  ProjectionSubscriber,
+} from './types.js'
 
 export class ProjectionClient {
   private snapshot: SessionProjection | null = null
   private subscribers: Set<ProjectionSubscriber> = new Set()
 
-  /**
-   * Receive and cache a projection snapshot.
-   */
   receive_snapshot(projection: SessionProjection): void {
     this.snapshot = projection
     for (const sub of this.subscribers) {
@@ -55,17 +30,11 @@ export class ProjectionClient {
     }
   }
 
-  /**
-   * Subscribe to projection updates.
-   */
   subscribe(subscriber: ProjectionSubscriber): () => void {
     this.subscribers.add(subscriber)
     return () => this.subscribers.delete(subscriber)
   }
 
-  /**
-   * Get current snapshot.
-   */
   get_snapshot(): SessionProjection | null {
     return this.snapshot
   }

packages/tui/src/TuiApp.tsx

@@ -1,311 +1,712 @@
+/** @jsxImportSource @opentui/solid */
 /**
- * TuiApp - Main TUI application shell
- * DD §13.2. Real terminal rendering using ANSI escape codes.
+ * TuiApp - OpenTUI/Solid application shell
+ * DD §13.2. Projection-only display plus single OpenTUI textarea input owner.
  *
  * @module packages/tui/src/TuiApp
  */
 
-import { SessionView } from './components/SessionView.js'
-import { TaskListView } from './components/TaskListView.js'
-import { AgentStatusView } from './components/AgentStatusView.js'
-import { HudView } from './components/HudView.js'
-import type { SessionProjection } from './ProjectionClient.js'
+import { createCliRenderer, type CliRenderer, type TextareaRenderable, type KeyEvent } from '@opentui/core'
+import { render, useRenderer, useTerminalDimensions } from '@opentui/solid'
+import { createEffect, createSignal, For, onCleanup, onMount, Show } from 'solid-js'
+import type { SessionProjection } from './types.js'
 
 export interface TuiAppProps {
   client: {
     subscribe(handler: (projection: SessionProjection) => void): () => void
-    receive_snapshot(projection: SessionProjection): void
     get_snapshot(): SessionProjection | null
   }
+  onSubmit?: (input: string) => void | Promise<void>
+  onSlashCommand?: (input: string) => void | Promise<void>
+  onResolvePermission?: (prompt_id: string, selected_option: string) => void | Promise<void>
+  onExit?: () => void | Promise<void>
 }
 
 export interface TuiAppState {
   projection: SessionProjection | null
   active_view: 'tasks' | 'agents' | 'tools' | 'diff' | 'help'
+  busy: boolean
+  status: string
 }
 
-const ANSI = {
-  reset: '\x1b[0m',
-  bright: '\x1b[1m',
-  dim: '\x1b[2m',
-  underscore: '\x1b[4m',
-  blink: '\x1b[5m',
-  reverse: '\x1b[7m',
-  hidden: '\x1b[8m',
-  fg: {
-    black: '\x1b[30m',
-    red: '\x1b[31m',
-    green: '\x1b[32m',
-    yellow: '\x1b[33m',
-    blue: '\x1b[34m',
-    magenta: '\x1b[35m',
-    cyan: '\x1b[36m',
-    white: '\x1b[37m',
-    gray: '\x1b[90m',
-  },
-  bg: {
-    black: '\x1b[40m',
-    red: '\x1b[41m',
-    green: '\x1b[42m',
-    yellow: '\x1b[43m',
-    blue: '\x1b[44m',
-    magenta: '\x1b[45m',
-    cyan: '\x1b[46m',
-    white: '\x1b[47m',
-  },
-  clear: '\x1b[2J\x1b[H',
-  clearLine: '\x1b[2K',
-  cursor: {
-    home: '\x1b[H',
-    save: '\x1b[s',
-    restore: '\x1b[u',
-    hide: '\x1b[?25l',
-    show: '\x1b[?25h',
-    up: (n = 1) => `\x1b[${n}A`,
-    down: (n = 1) => `\x1b[${n}B`,
-    right: (n = 1) => `\x1b[${n}C`,
-    left: (n = 1) => `\x1b[${n}D`,
+const THEME = {
+  bg: '#0b0f14',
+  surface: '#111827',
+  surface2: '#1f2937',
+  text: '#e5e7eb',
+  muted: '#9ca3af',
+  faint: '#6b7280',
+  accent: '#22d3ee',
+  success: '#22c55e',
+  warning: '#f59e0b',
+  error: '#ef4444',
+  border: '#374151',
+}
+
+const PROMPT_HISTORY_LIMIT = 200
+const TEXTAREA_MIN_ROWS = 1
+const TEXTAREA_MAX_ROWS = 6
+const EXIT_CONFIRM_MS = 5000
+
+type PromptHistoryState = {
+  items: string[]
+  index: number | null
+  draft: string
+}
+
+type PromptHistoryMove = {
+  state: PromptHistoryState
+  apply: boolean
+  text?: string
+  cursor?: number
+}
+
+function createPromptHistory(): PromptHistoryState {
+  return { items: [], index: null, draft: '' }
+}
+
+function pushPromptHistory(state: PromptHistoryState, prompt: string): PromptHistoryState {
+  const text = prompt.trim()
+  if (!text) return state
+  if (state.items[state.items.length - 1] === text) {
+    return { ...state, index: null, draft: '' }
   }
+  return { items: [...state.items, text].slice(-PROMPT_HISTORY_LIMIT), index: null, draft: '' }
+}
+
+function movePromptHistory(state: PromptHistoryState, dir: -1 | 1, text: string, cursor: number): PromptHistoryMove {
+  if (state.items.length === 0) return { state, apply: false }
+  if (dir === -1 && cursor !== 0) return { state, apply: false }
+  if (dir === 1 && cursor !== text.length) return { state, apply: false }
+
+  if (state.index === null) {
+    if (dir === 1) return { state, apply: false }
+    const idx = state.items.length - 1
+    return { state: { ...state, index: idx, draft: text }, text: state.items[idx], cursor: 0, apply: true }
+  }
+
+  const idx = state.index + dir
+  if (idx < 0) return { state, apply: false }
+  if (idx >= state.items.length) {
+    return { state: { ...state, index: null }, text: state.draft, cursor: state.draft.length, apply: true }
+  }
+  return { state: { ...state, index: idx }, text: state.items[idx], cursor: dir === -1 ? 0 : state.items[idx].length, apply: true }
 }
 
 export class TuiApp {
   private client: TuiAppProps['client']
-  private state: TuiAppState
-  private unsubscribe: (() => void) | null = null
-  private running: boolean = false
+  private onSubmit?: TuiAppProps['onSubmit']
+  private onSlashCommand?: TuiAppProps['onSlashCommand']
+  private onResolvePermission?: TuiAppProps['onResolvePermission']
+  private onExit?: TuiAppProps['onExit']
+  private renderer: CliRenderer | null = null
+  private unsubscribeClient: (() => void) | null = null
+  private setProjection?: (projection: SessionProjection | null) => void
+  private setView?: (view: TuiAppState['active_view']) => void
+  private setBusy?: (busy: boolean) => void
+  private setStatus?: (status: string) => void
 
   constructor(props: TuiAppProps) {
     this.client = props.client
-    this.state = { projection: null, active_view: 'tasks' }
+    this.onSubmit = props.onSubmit
+    this.onSlashCommand = props.onSlashCommand
+    this.onResolvePermission = props.onResolvePermission
+    this.onExit = props.onExit
   }
 
   async start(): Promise<void> {
-    this.unsubscribe = this.client.subscribe((projection) => {
-      this.state.projection = projection
-      this.render()
+    if (this.renderer) return
+
+    this.renderer = await createCliRenderer({
+      targetFps: 30,
+      maxFps: 60,
+      useMouse: false,
+      autoFocus: false,
+      exitOnCtrlC: false,
+      screenMode: 'alternate-screen',
+      externalOutputMode: 'capture-stdout',
+      consoleMode: 'disabled',
+      clearOnShutdown: true,
+      openConsoleOnError: false,
+      useKittyKeyboard: {},
+      backgroundColor: THEME.bg,
     })
+    this.renderer.setBackgroundColor(THEME.bg)
 
-    const snapshot = this.client.get_snapshot()
-    if (snapshot) {
-      this.state.projection = snapshot
-    }
+    await render(() => (
+      <AirCodingView
+        initialProjection={this.client.get_snapshot()}
+        bindState={(bindings) => {
+          this.setProjection = bindings.setProjection
+          this.setView = bindings.setView
+          this.setBusy = bindings.setBusy
+          this.setStatus = bindings.setStatus
+        }}
+        onSubmit={(input) => this.submit(input)}
+        onSlashCommand={(input) => this.slash(input)}
+        onResolvePermission={(prompt_id, selected_option) => this.resolvePermission(prompt_id, selected_option)}
+        onExit={() => this.exit()}
+      />
+    ), this.renderer)
 
-    this.running = true
-    this.setup_input()
-    this.render()
+    this.unsubscribeClient = this.client.subscribe((projection) => {
+      this.setProjection?.(projection)
+    })
   }
 
   stop(): void {
-    this.running = false
-    this.unsubscribe?.()
-    this.unsubscribe = null
-    process.stdout.write(ANSI.cursor.show + ANSI.reset)
+    this.unsubscribeClient?.()
+    this.unsubscribeClient = null
+    this.setProjection = undefined
+    this.setView = undefined
+    this.setBusy = undefined
+    this.setStatus = undefined
+
+    if (this.renderer && !this.renderer.isDestroyed) {
+      this.renderer.setTerminalTitle('')
+      this.renderer.externalOutputMode = 'passthrough'
+      this.renderer.destroy()
+    }
+    this.renderer = null
   }
 
   set_view(view: TuiAppState['active_view']): void {
-    this.state.active_view = view
-    this.render()
+    this.setView?.(view)
   }
 
-  private setup_input(): void {
-    if (process.stdin.isTTY) {
-      process.stdin.setRawMode(true)
-      process.stdin.resume()
-      process.stdin.setEncoding('utf8')
+  set_busy(busy: boolean, status?: string): void {
+    this.setBusy?.(busy)
+    if (status) this.setStatus?.(status)
+  }
 
-      process.stdin.on('data', (key: string) => {
-        this.handle_input(key)
-      })
+  set_status(status: string): void {
+    this.setStatus?.(status)
+  }
+
+  private async submit(input: string): Promise<void> {
+    const text = input.trim()
+    if (!text) return
+    this.setBusy?.(true)
+    this.setStatus?.(`Running: ${text.slice(0, 72)}`)
+    try {
+      await this.onSubmit?.(text)
+      this.setStatus?.('Ready')
+    } catch (error) {
+      this.setStatus?.(error instanceof Error ? error.message : String(error))
+      throw error
+    } finally {
+      this.setBusy?.(false)
     }
   }
 
-  private handle_input(key: string): void {
-    switch (key) {
-      case 'q':
-      case '': // Ctrl+C
-        this.stop()
-        process.exit(0)
-        break
-      case '1':
-        this.set_view('tasks')
-        break
-      case '2':
-        this.set_view('agents')
-        break
-      case '3':
-        this.set_view('tools')
-        break
-      case '4':
-        this.set_view('diff')
-        break
-      case '?':
-      case 'h':
-        this.set_view('help')
-        break
+  private async slash(input: string): Promise<void> {
+    const text = input.trim()
+    if (!text) return
+    if (text === '/quit' || text === '/exit') {
+      await this.exit()
+      return
     }
+    this.setStatus?.(`Command: ${text}`)
+    await this.onSlashCommand?.(text)
   }
 
-  private render(): void {
-    if (!this.running) return
+  private async resolvePermission(prompt_id: string, selected_option: string): Promise<void> {
+    if (!this.onResolvePermission) {
+      this.setStatus?.('Permission selection requires runtime resolver')
+      return
+    }
+    this.setStatus?.(`Permission: ${selected_option}`)
+    await this.onResolvePermission(prompt_id, selected_option)
+  }
 
-    const p = this.state.projection
-    const lines: string[] = []
+  private async exit(): Promise<void> {
+    await this.onExit?.()
+  }
+}
 
-    // Header
-    lines.push(ANSI.clear)
-    lines.push(ANSI.fg.cyan + ANSI.bright + '═══════════════════════════════════════════════════════════════' + ANSI.reset)
-    lines.push(ANSI.fg.cyan + ANSI.bright + '  AirCoding v1.0.0-alpha' + ANSI.reset + ANSI.fg.gray + '  │  ' + (p ? `${p.tasks.length} tasks` : 'No session') + '  │  ' + this.get_status_indicator(p) + ANSI.reset)
-    lines.push(ANSI.fg.cyan + '═══════════════════════════════════════════════════════════════' + ANSI.reset)
+type StateBindings = {
+  setProjection: (projection: SessionProjection | null) => void
+  setView: (view: TuiAppState['active_view']) => void
+  setBusy: (busy: boolean) => void
+  setStatus: (status: string) => void
+}
 
-    // Navigation hints
-    lines.push(ANSI.fg.gray + '  [1]Tasks  [2]Agents  [3]Tools  [4]Diff  [h]Help  [q]Quit' + ANSI.reset)
+type FooterPhase = 'idle' | 'running' | 'permission' | 'confirm_exit' | 'error'
 
-    // Content area
-    lines.push('')
+function AirCodingView(props: {
+  initialProjection: SessionProjection | null
+  bindState: (bindings: StateBindings) => void
+  onSubmit: (input: string) => void | Promise<void>
+  onSlashCommand: (input: string) => void | Promise<void>
+  onResolvePermission: (prompt_id: string, selected_option: string) => void | Promise<void>
+  onExit: () => void | Promise<void>
+}) {
+  const renderer = useRenderer()
+  const dimensions = useTerminalDimensions()
+  const [projection, setProjection] = createSignal<SessionProjection | null>(props.initialProjection)
+  const [activeView, setActiveView] = createSignal<TuiAppState['active_view']>('tasks')
+  const [busy, setBusy] = createSignal(false)
+  const [status, setStatus] = createSignal('Ready')
+  const [footerPhase, setFooterPhase] = createSignal<FooterPhase>('idle')
+  const [toast, setToast] = createSignal('')
+  let textarea: TextareaRenderable | undefined
+  let history = createPromptHistory()
+  let pasteTick: ReturnType<typeof setTimeout> | undefined
+  let exitConfirmUntil = 0
 
-    if (this.state.active_view === 'help') {
-      lines.push(...this.render_help())
-    } else if (!p) {
-      lines.push(ANSI.fg.yellow + '  No active session. Run "air init" then "air run".' + ANSI.reset)
-      lines.push('')
-      lines.push(ANSI.fg.gray + '  Press q to exit.' + ANSI.reset)
+  props.bindState({
+    setProjection,
+    setView: setActiveView,
+    setBusy: (next) => {
+      setBusy(next)
+      setFooterPhase(next ? 'running' : 'idle')
+    },
+    setStatus: (next) => {
+      setStatus(next)
+      if (/error|failed|blocked|失败|错误/i.test(next)) setFooterPhase('error')
+      else if (!busy()) setFooterPhase('idle')
+    },
+  })
+
+  const focusPrompt = () => {
+    if (textarea && !textarea.isDestroyed) textarea.focus()
+  }
+
+  const submitPrompt = () => {
+    if (!textarea || textarea.isDestroyed || busy()) return
+    const text = textarea.plainText.trim()
+    if (!text) return
+    history = pushPromptHistory(history, text)
+    textarea.setText('')
+    exitConfirmUntil = 0
+    setFooterPhase('running')
+    setStatus(text.startsWith('/') ? `Command: ${text}` : `Sending: ${text.slice(0, 72)}`)
+    if (text.startsWith('/')) {
+      void props.onSlashCommand(text)
     } else {
-      switch (this.state.active_view) {
-        case 'tasks':
-          lines.push(...this.render_tasks(p))
-          break
-        case 'agents':
-          lines.push(...this.render_agents(p))
-          break
-        case 'tools':
-          lines.push(...this.render_tools(p))
-          break
-        case 'diff':
-          lines.push(...this.render_diff(p))
-          break
+      void props.onSubmit(text)
+    }
+    focusPrompt()
+  }
+
+  const refreshPasteLayout = () => {
+    if (pasteTick) clearTimeout(pasteTick)
+    pasteTick = setTimeout(() => {
+      pasteTick = undefined
+      if (!textarea || textarea.isDestroyed) return
+      textarea.getLayoutNode().markDirty()
+      renderer.requestRender()
+      void renderer.idle().then(() => renderer.requestRender()).catch(() => {})
+    }, 0)
+  }
+
+  const applyHistoryMove = (dir: -1 | 1) => {
+    if (!textarea || textarea.isDestroyed) return false
+    const text = textarea.plainText
+    const move = movePromptHistory(history, dir, text, textarea.cursorOffset)
+    history = move.state
+    if (!move.apply) return false
+    textarea.setText(move.text ?? '')
+    textarea.cursorOffset = move.cursor ?? 0
+    textarea.getLayoutNode().markDirty()
+    renderer.requestRender()
+    return true
+  }
+
+  const activePermission = () => projection()?.permission_prompts[0]
+
+  const resolvePermissionByIndex = (index: number) => {
+    const prompt = activePermission()
+    if (!prompt) return false
+    const options = prompt.options.length > 0 ? prompt.options : ['allow', 'deny']
+    const selected = options[index]
+    if (!selected) return false
+    setFooterPhase('permission')
+    setStatus(`Permission: ${selected}`)
+    void props.onResolvePermission(prompt.prompt_id, selected)
+    return true
+  }
+
+  const handleKeyDown = (event: KeyEvent) => {
+    const prompt = activePermission()
+    if (prompt) {
+      if (event.name === 'left' || event.name === 'h') {
+        event.preventDefault()
+        setToast('Use 1/2/3 to choose a permission option')
+        return
+      }
+      if (/^[1-9]$/.test(event.name) && resolvePermissionByIndex(Number(event.name) - 1)) {
+        event.preventDefault()
+        return
+      }
+      if ((event.name === 'a' || event.name === 'y') && resolvePermissionByIndex(0)) {
+        event.preventDefault()
+        return
+      }
+      if ((event.name === 'd' || event.name === 'n') && resolvePermissionByIndex(Math.min(1, (prompt.options.length || 2) - 1))) {
+        event.preventDefault()
+        return
       }
     }
 
-    // Footer
-    lines.push('')
-    lines.push(ANSI.fg.gray + '─'.repeat(76) + ANSI.reset)
-    lines.push(ANSI.fg.gray + '  Status: ' + this.get_status_text(p) + '  │  Session: ' + (p?.session_id || 'N/A') + ANSI.reset)
+    if (event.ctrl && event.name === 'c') {
+      event.preventDefault()
+      if (textarea && !textarea.isDestroyed && textarea.plainText.length > 0) {
+        textarea.setText('')
+        history = { ...history, index: null, draft: '' }
+        setFooterPhase('idle')
+        setStatus('Draft cleared; press Ctrl+C again to exit')
+        focusPrompt()
+        return
+      }
+      const now = Date.now()
+      if (now < exitConfirmUntil) {
+        void props.onExit()
+        return
+      }
+      exitConfirmUntil = now + EXIT_CONFIRM_MS
+      setFooterPhase('confirm_exit')
+      setStatus('Press Ctrl+C again within 5s to exit')
+      return
+    }
 
-    process.stdout.write(lines.join('\n') + '\n')
-  }
+    if (event.name === 'up' && applyHistoryMove(-1)) {
+      event.preventDefault()
+      return
+    }
 
-  private get_status_indicator(p: SessionProjection | null): string {
-    if (!p) return ANSI.fg.gray + 'IDLE' + ANSI.reset
-    switch (p.status) {
-      case 'running': return ANSI.fg.green + '● RUNNING' + ANSI.reset
-      case 'completed': return ANSI.fg.blue + '● COMPLETED' + ANSI.reset
-      case 'error': return ANSI.fg.red + '● ERROR' + ANSI.reset
-      default: return ANSI.fg.gray + '● ' + p.status.toUpperCase() + ANSI.reset
+    if (event.name === 'down' && applyHistoryMove(1)) {
+      event.preventDefault()
+      return
+    }
+
+    if (event.name === 'escape') {
+      event.preventDefault()
+      exitConfirmUntil = 0
+      setActiveView('tasks')
+      setFooterPhase(busy() ? 'running' : activePermission() ? 'permission' : 'idle')
+      focusPrompt()
+      return
+    }
+
+    if (event.ctrl && event.name === 'l') {
+      event.preventDefault()
+      renderer.requestRender()
+      return
+    }
+
+    if (!event.ctrl || event.meta) return
+
+    const next = shortcutToView(event.name)
+    if (next) {
+      event.preventDefault()
+      setActiveView(next)
+      focusPrompt()
     }
   }
 
-  private get_status_text(p: SessionProjection | null): string {
-    if (!p) return 'No session'
-    return `${p.status} | ${p.tasks.length} tasks | ${p.agents.length} agents`
+  onMount(() => {
+    renderer.setTerminalTitle('AirCoding')
+    focusPrompt()
+  })
+
+  onCleanup(() => {
+    if (pasteTick) clearTimeout(pasteTick)
+    renderer.setTerminalTitle('')
+  })
+
+  createEffect(() => {
+    const hasPermission = (projection()?.permission_prompts.length ?? 0) > 0
+    if (hasPermission) setFooterPhase('permission')
+    else if (!busy() && footerPhase() === 'permission') setFooterPhase('idle')
+  })
+
+  createEffect(() => {
+    projection()
+    activeView()
+    busy()
+    status()
+    footerPhase()
+    toast()
+    renderer.requestRender()
+  })
+
+  return (
+    <box width="100%" height="100%" flexDirection="column" backgroundColor={THEME.bg}>
+      <Header projection={projection()} />
+      <Nav active={activeView()} />
+      <box flexGrow={1} flexShrink={1} paddingLeft={2} paddingRight={2} paddingTop={1} paddingBottom={1}>
+        <Content projection={projection()} active={activeView()} height={Math.max(8, dimensions().height - 11)} />
+      </box>
+      <Prompt
+        busy={busy()}
+        phase={footerPhase()}
+        status={status()}
+        toast={toast()}
+        permission={activePermission()}
+        textareaRef={(area) => { textarea = area }}
+        onSubmit={submitPrompt}
+        onKeyDown={handleKeyDown}
+        onPaste={refreshPasteLayout}
+        onContentChange={() => renderer.requestRender()}
+      />
+    </box>
+  )
+}
+
+function Header(props: { projection: SessionProjection | null }) {
+  const taskCount = () => props.projection?.tasks.length ?? 0
+  return (
+    <box flexDirection="column" paddingLeft={2} paddingRight={2} paddingTop={1} backgroundColor={THEME.surface}>
+      <box flexDirection="row" justifyContent="space-between">
+        <text fg={THEME.accent}>AirCoding v1.0.0-alpha</text>
+        <text fg={statusColor(props.projection?.status)}>{(props.projection?.status ?? 'idle').toUpperCase()}</text>
+      </box>
+      <text fg={THEME.muted}>{props.projection?.title ?? 'No active session'} · {taskCount()} tasks · {props.projection?.agents.length ?? 0} agents</text>
+    </box>
+  )
+}
+
+function Nav(props: { active: TuiAppState['active_view'] }) {
+  const items: Array<[TuiAppState['active_view'], string]> = [
+    ['tasks', 'Ctrl+1 Tasks'],
+    ['agents', 'Ctrl+2 Agents'],
+    ['tools', 'Ctrl+3 Tools'],
+    ['diff', 'Ctrl+4 Diff'],
+    ['help', 'Ctrl+H Help'],
+  ]
+  return (
+    <box flexDirection="row" gap={1} paddingLeft={2} paddingRight={2} paddingTop={1} paddingBottom={1} backgroundColor={THEME.surface2}>
+      <For each={items}>{([view, label]) => (
+        <text fg={props.active === view ? THEME.accent : THEME.muted}>{label}</text>
+      )}</For>
+    </box>
+  )
+}
+
+function Content(props: { projection: SessionProjection | null; active: TuiAppState['active_view']; height: number }) {
+  const currentProjection = () => props.projection
+
+  return (
+    <Show when={currentProjection()} fallback={<EmptySession />}>
+      <box flexDirection="column" gap={1} height={props.height}>
+        <Show when={props.active === 'tasks'}>
+          <TasksView projection={currentProjection()!} />
+        </Show>
+        <Show when={props.active === 'agents'}>
+          <AgentsView projection={currentProjection()!} />
+        </Show>
+        <Show when={props.active === 'tools'}>
+          <ToolsView projection={currentProjection()!} />
+        </Show>
+        <Show when={props.active === 'diff'}>
+          <DiffView projection={currentProjection()!} />
+        </Show>
+        <Show when={props.active === 'help'}>
+          <HelpView />
+        </Show>
+      </box>
+    </Show>
+  )
+}
+
+function EmptySession() {
+  return (
+    <box flexDirection="column" gap={1}>
+      <text fg={THEME.warning}>No active session projection.</text>
+      <text fg={THEME.muted}>Run air init and air run from a project directory.</text>
+    </box>
+  )
+}
+
+function TasksView(props: { projection: SessionProjection }) {
+  return (
+    <box flexDirection="column" gap={1}>
+      <text fg={THEME.accent}>Tasks</text>
+      <Show when={props.projection.tasks.length > 0} fallback={<text fg={THEME.muted}>No tasks yet.</text>}>
+        <For each={props.projection.tasks.slice(0, 14)}>{(task) => (
+          <box flexDirection="column">
+            <text fg={statusColor(task.status)}>{statusMark(task.status)} {task.title || task.id}</text>
+            <text fg={THEME.faint}>  {task.id} · {task.type} · {task.status} · attempts {task.attempts}</text>
+          </box>
+        )}</For>
+      </Show>
+    </box>
+  )
+}
+
+function AgentsView(props: { projection: SessionProjection }) {
+  return (
+    <box flexDirection="column" gap={1}>
+      <text fg={THEME.accent}>Agents</text>
+      <Show when={props.projection.agents.length > 0} fallback={<text fg={THEME.muted}>No agents yet.</text>}>
+        <For each={props.projection.agents.slice(0, 14)}>{(agent) => (
+          <box flexDirection="column">
+            <text fg={statusColor(agent.status)}>{statusMark(agent.status)} {agent.type}</text>
+            <text fg={THEME.faint}>  {agent.id} · {agent.status}{agent.task_id ? ` · task ${agent.task_id}` : ''}</text>
+          </box>
+        )}</For>
+      </Show>
+    </box>
+  )
+}
+
+function ToolsView(props: { projection: SessionProjection }) {
+  const p = () => props.projection as SessionProjection & { tool_runs?: Array<{ tool_run_id: string; tool_name: string; status: string; duration_ms?: number }> }
+  return (
+    <box flexDirection="column" gap={1}>
+      <text fg={THEME.accent}>Tool runs</text>
+      <Show when={(p().tool_runs ?? []).length > 0} fallback={<text fg={THEME.muted}>No tool runs yet.</text>}>
+        <For each={(p().tool_runs ?? []).slice(-14).reverse()}>{(tool) => (
+          <box flexDirection="row" gap={1}>
+            <text fg={statusColor(tool.status)}>{statusMark(tool.status)}</text>
+            <text fg={THEME.text}>{tool.tool_name}</text>
+            <text fg={THEME.faint}>{tool.status}{tool.duration_ms ? ` · ${tool.duration_ms}ms` : ''}</text>
+          </box>
+        )}</For>
+      </Show>
+    </box>
+  )
+}
+
+function DiffView(props: { projection: SessionProjection }) {
+  const completed = () => props.projection.tasks.filter((task) => task.status === 'completed').length
+  const failed = () => props.projection.tasks.filter((task) => task.status === 'failed').length
+  const blocked = () => props.projection.tasks.filter((task) => task.status === 'blocked').length
+  return (
+    <box flexDirection="column" gap={1}>
+      <text fg={THEME.accent}>Session summary</text>
+      <text fg={THEME.success}>Completed: {completed()}</text>
+      <text fg={THEME.error}>Failed: {failed()}</text>
+      <text fg={THEME.warning}>Blocked: {blocked()}</text>
+      <text fg={THEME.muted}>Use /results for produced files. Projection data is sourced from runtime events.</text>
+    </box>
+  )
+}
+
+function HelpView() {
+  return (
+    <box flexDirection="column" gap={1}>
+      <text fg={THEME.accent}>Help</text>
+      <text fg={THEME.text}>Type a task in the prompt and press Enter.</text>
+      <text fg={THEME.text}>Slash commands: /help, /status, /tools, /tasks, /results, /quit.</text>
+      <text fg={THEME.text}>Navigation: Ctrl+1 tasks, Ctrl+2 agents, Ctrl+3 tools, Ctrl+4 diff, Ctrl+H help, Esc tasks.</text>
+      <text fg={THEME.text}>Prompt: Up/Down browse history at text boundaries; paste refreshes layout automatically.</text>
+      <text fg={THEME.muted}>Ctrl+C clears draft first, then asks for a second Ctrl+C within 5s to exit. Permission prompts use 1/2/3 or a/d.</text>
+    </box>
+  )
+}
+
+function Prompt(props: {
+  busy: boolean
+  phase: FooterPhase
+  status: string
+  toast: string
+  permission?: SessionProjection['permission_prompts'][number]
+  textareaRef: (area?: TextareaRenderable) => void
+  onSubmit: () => void
+  onKeyDown: (event: KeyEvent) => void
+  onPaste: () => void
+  onContentChange: () => void
+}) {
+  const permissionOptions = () => props.permission?.options.length ? props.permission.options : ['allow', 'deny']
+  const phaseLabel = () => {
+    if (props.permission) return 'Permission'
+    if (props.phase === 'confirm_exit') return 'Confirm exit'
+    if (props.phase === 'error') return 'Attention'
+    return props.busy ? 'Running' : 'Ready'
+  }
+  const phaseColor = () => {
+    if (props.permission || props.phase === 'confirm_exit') return THEME.warning
+    if (props.phase === 'error') return THEME.error
+    return props.busy ? THEME.warning : THEME.success
   }
 
-  private render_help(): string[] {
-    return [
-      ANSI.fg.cyan + ANSI.bright + '  Help' + ANSI.reset,
-      '',
-      '  Keyboard shortcuts:',
-      '    1 - Tasks view      Show task list and status',
-      '    2 - Agents view     Show agent status and activity',
-      '    3 - Tools view      Show available tools and usage',
-      '    4 - Diff view       Show file changes',
-      '    h - Help            Show this help',
-      '    q - Quit            Exit AirCoding',
-      '',
-      '  Getting started:',
-      '    air init <project>  Initialize a project',
-      '    air run             Start coding session',
-      '    air doctor          Run diagnostics',
-    ]
+  return (
+    <box flexDirection="column" paddingLeft={2} paddingRight={2} paddingBottom={1} backgroundColor={THEME.surface}>
+      <Show when={props.permission}>
+        <box flexDirection="column" paddingBottom={1}>
+          <text fg={THEME.warning}>Permission required: {props.permission?.subject || props.permission?.tool_name || props.permission?.prompt_id}</text>
+          <text fg={THEME.muted}>Risk: {props.permission?.risk_level || 'unknown'} · {props.permission?.reason || 'No reason provided'}</text>
+          <box flexDirection="row" gap={1}>
+            <For each={permissionOptions()}>{(option, index) => (
+              <text fg={index() === 0 ? THEME.success : THEME.warning}>{index() + 1}. {option}</text>
+            )}</For>
+          </box>
+        </box>
+      </Show>
+      <box flexDirection="row" justifyContent="space-between" paddingBottom={1}>
+        <text fg={phaseColor()}>{phaseLabel()}</text>
+        <text fg={props.phase === 'error' ? THEME.error : THEME.muted}>{props.toast || props.status}</text>
+      </box>
+      <textarea
+        width="100%"
+        minHeight={TEXTAREA_MIN_ROWS}
+        maxHeight={TEXTAREA_MAX_ROWS}
+        wrapMode="word"
+        placeholder={props.busy ? 'Task is running...' : 'Ask AirCoding to change this project, or type /help'}
+        placeholderColor={THEME.faint}
+        textColor={THEME.text}
+        focusedTextColor={THEME.text}
+        backgroundColor={THEME.bg}
+        focusedBackgroundColor={THEME.bg}
+        cursorColor={THEME.accent}
+        focused={!props.busy}
+        onSubmit={props.onSubmit}
+        onKeyDown={props.onKeyDown}
+        onPaste={props.onPaste}
+        onContentChange={props.onContentChange}
+        ref={props.textareaRef}
+      />
+    </box>
+  )
+}
+
+function shortcutToView(name: string): TuiAppState['active_view'] | undefined {
+  switch (name) {
+    case '1': return 'tasks'
+    case '2': return 'agents'
+    case '3': return 'tools'
+    case '4': return 'diff'
+    case 'h': return 'help'
+    default: return undefined
   }
+}
 
-  private render_tasks(p: SessionProjection): string[] {
-    const lines: string[] = []
-    lines.push(ANSI.fg.cyan + ANSI.bright + '  Tasks' + ANSI.reset)
-
-    if (p.tasks.length === 0) {
-      lines.push(ANSI.fg.gray + '  No tasks yet.' + ANSI.reset)
-      return lines
-    }
-
-    for (const task of p.tasks.slice(0, 10)) {
-      const status_color = task.status === 'completed' ? ANSI.fg.green : task.status === 'failed' ? ANSI.fg.red : ANSI.fg.yellow
-      lines.push(`  ${status_color}●${ANSI.reset} ${task.title || task.id}`)
-      lines.push(ANSI.fg.gray + `    ID: ${task.id} | Status: ${task.status}` + ANSI.reset)
-    }
-
-    if (p.tasks.length > 10) {
-      lines.push(ANSI.fg.gray + `  ... and ${p.tasks.length - 10} more tasks` + ANSI.reset)
-    }
-
-    return lines
+function statusColor(status: string | undefined): string {
+  switch (status) {
+    case 'completed':
+    case 'ok':
+    case 'active':
+    case 'running':
+      return THEME.success
+    case 'failed':
+    case 'error':
+    case 'lost':
+      return THEME.error
+    case 'blocked':
+    case 'pending':
+    case 'cancelled':
+      return THEME.warning
+    default:
+      return THEME.muted
   }
+}
 
-  private render_agents(p: SessionProjection): string[] {
-    const lines: string[] = []
-    lines.push(ANSI.fg.cyan + ANSI.bright + '  Agents' + ANSI.reset)
-
-    if (p.agents.length === 0) {
-      lines.push(ANSI.fg.gray + '  No active agents.' + ANSI.reset)
-      return lines
-    }
-
-    for (const agent of p.agents.slice(0, 10)) {
-      const status_color = agent.status === 'running' ? ANSI.fg.green : agent.status === 'idle' ? ANSI.fg.gray : ANSI.fg.yellow
-      lines.push(`  ${status_color}●${ANSI.reset} ${agent.type}`)
-      lines.push(ANSI.fg.gray + `    ID: ${agent.id?.slice(0, 8)}... | Status: ${agent.status}` + ANSI.reset)
-    }
-
-    return lines
+function statusMark(status: string | undefined): string {
+  switch (status) {
+    case 'completed':
+    case 'ok':
+      return '✓'
+    case 'failed':
+    case 'error':
+      return '✗'
+    case 'running':
+    case 'active':
+      return '●'
+    case 'blocked':
+      return '!'
+    default:
+      return '○'
   }
-
-  private render_tools(p: SessionProjection): string[] {
-    const lines: string[] = []
-    lines.push(ANSI.fg.cyan + ANSI.bright + '  Recent Tool Calls' + ANSI.reset)
-
-    const recent_calls = p.tasks.slice(0, 10)
-
-    if (recent_calls.length === 0) {
-      lines.push(ANSI.fg.gray + '  No tool calls yet.' + ANSI.reset)
-      return lines
-    }
-
-    for (const call of recent_calls) {
-      lines.push(`  ${ANSI.fg.green}✓${ANSI.reset} ${call.title || call.type}`)
-      lines.push(ANSI.fg.gray + `    Task: ${call.id?.slice(0, 8)}... | Status: ${call.status}` + ANSI.reset)
-    }
-
-    return lines
-  }
-
-  private render_diff(p: SessionProjection): string[] {
-    const lines: string[] = []
-    lines.push(ANSI.fg.cyan + ANSI.bright + '  Recent Changes' + ANSI.reset)
-
-    const task_count = p.tasks.length
-    const completed = p.tasks.filter(t => t.status === 'completed').length
-    const failed = p.tasks.filter(t => t.status === 'failed').length
-
-    if (task_count === 0) {
-      lines.push(ANSI.fg.gray + '  No changes yet.' + ANSI.reset)
-      return lines
-    }
-
-    lines.push(`  ${ANSI.fg.green}✓${ANSI.reset} Completed: ${completed}`)
-    lines.push(`  ${ANSI.fg.red}✗${ANSI.reset} Failed: ${failed}`)
-    lines.push(`  ${ANSI.fg.yellow}○${ANSI.reset} Pending: ${task_count - completed - failed}`)
-    lines.push('')
-    lines.push(ANSI.fg.gray + `  Total tasks: ${task_count}` + ANSI.reset)
-
-    return lines
-  }
-}
+}

packages/tui/src/index.ts

@@ -1,7 +1,7 @@
 /**
  * TUI package — Terminal UI components
  *
- * INV-4: TUI imports ONLY contracts + ProjectionClient from runtime.
+ * INV-4: TUI imports no runtime package; it consumes projection snapshots through a local client surface.
  * Uses OpenTUI @opentui/* as renderer (npm-dep, do NOT reimplement).
  *
  * @module packages/tui

packages/tui/src/preload.ts

@@ -0,0 +1,4 @@
+const openTuiPreload = '@opentui/solid/preload'
+await import(openTuiPreload)
+
+export {}

packages/tui/src/types.ts

@@ -1,11 +1,17 @@
 /**
- * TUI shared types
- * TUI imports ONLY contracts. No runtime imports.
+ * TUI shared projection types.
+ * TUI stays runtime-free and consumes projection snapshots only.
  *
  * @module packages/tui/src/types
  */
 
-import type { SessionID, ProjectID, TaskID, AgentID, ToolRunID, ISOTimeString } from '@aircoding/contracts'
+type SessionID = string
+type ProjectID = string
+type TaskID = string
+type AgentID = string
+type ToolRunID = string
+type CommandRunID = string
+type ArtifactID = string
 
 export interface SessionProjection {
   session_id: SessionID
@@ -14,6 +20,12 @@ export interface SessionProjection {
   title?: string
   tasks: TaskProjection[]
   agents: AgentProjection[]
+  tool_runs: ToolRunProjection[]
+  command_runs: CommandRunProjection[]
+  artifacts: ArtifactProjection[]
+  permission_prompts: PermissionPromptProjection[]
+  blockers: BlockerProjection[]
+  updated_at: string
 }
 
 export interface TaskProjection {
@@ -24,6 +36,7 @@ export interface TaskProjection {
   retry_count: number
   attempts: number
   created_at: string
+  agent_id?: AgentID
 }
 
 export interface AgentProjection {
@@ -34,4 +47,40 @@ export interface AgentProjection {
   last_heartbeat?: string
 }
 
+export interface ToolRunProjection {
+  tool_run_id: ToolRunID
+  tool_name: string
+  status: string
+  duration_ms?: number
+}
+
+export interface CommandRunProjection {
+  command_run_id: CommandRunID
+  command: string
+  status: string
+  exit_code?: number
+}
+
+export interface ArtifactProjection {
+  artifact_id: ArtifactID
+  type: string
+  uri: string
+}
+
+export interface PermissionPromptProjection {
+  prompt_id: string
+  subject: string
+  risk_level: string
+  reason: string
+  options: string[]
+  default_option?: string
+  tool_name?: string
+}
+
+export interface BlockerProjection {
+  task_id: TaskID
+  reason: string
+  blocker_kind: string
+}
+
 export type ProjectionSubscriber = (projection: SessionProjection) => void