v2.3.2-coder-answer-endpoint: fix ask_user_input submit in CoderPane

The CoderPane runs its own inference runner and broker on the boocoder
service. The AskUserInputCard was calling /api/chats/:id/answer_user_input
on the main BooChat server, which has a different inference runner — the
answer was accepted but the next turn was enqueued on the wrong runner,
so nothing happened.

Fix: register the same answer_user_input endpoint on the boocoder, and
add an apiPrefix prop to AskUserInputCard so the CoderPane routes
through /api/coder/chats/:id/answer_user_input. BooChat's MessageList
continues to use the default (no prefix) path.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/coder/src/index.ts

@@ -85,7 +85,9 @@ async function main() {
         type: 'permission_requested',
         task_id: prompt.taskId,
         session_id: prompt.sessionId,
+        kind: prompt.kind,
         tool_title: prompt.toolTitle,
+        ...(prompt.input ? { input: prompt.input } : {}),
         options: prompt.options.map((o) => ({ option_id: o.optionId, label: o.label })),
       } as WsFrame);
     },

apps/coder/src/routes/messages.ts

@@ -5,6 +5,33 @@ import type { Broker } from '@boocode/server/broker';
 import type { WsFrame } from '@boocode/server/ws-frames';
 import { resolveChatId } from './chat-resolve.js';
 
+const AnswerUserInputBody = z.object({
+  tool_call_id: z.string().min(1),
+  answers: z
+    .array(
+      z.object({
+        question: z.string(),
+        selected_options: z.array(z.string()),
+        free_text: z.string().nullable(),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
+
+const AskUserInputArgs = z.object({
+  questions: z
+    .array(
+      z.object({
+        question: z.string(),
+        type: z.enum(['single_select', 'multi_select']),
+        options: z.array(z.string()).min(1),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
+
 const SendBody = z.object({
   content: z.string().min(1).max(64_000),
   pane_id: z.string().min(1).max(200),
@@ -219,6 +246,138 @@ export function registerMessageRoutes(
     },
   );
 
+  // POST /api/chats/:id/answer_user_input — answer a pending ask_user_input
+  app.post<{ Params: { id: string } }>(
+    '/api/chats/:id/answer_user_input',
+    async (req, reply) => {
+      const parsed = AnswerUserInputBody.safeParse(req.body);
+      if (!parsed.success) {
+        reply.code(400);
+        return { error: 'invalid_body', details: parsed.error.flatten() };
+      }
+      const { tool_call_id, answers } = parsed.data;
+
+      const chatRows = await sql<{ id: string; session_id: string }[]>`
+        SELECT id, session_id FROM chats WHERE id = ${req.params.id} AND status = 'open'
+      `;
+      if (chatRows.length === 0) {
+        reply.code(404);
+        return { error: 'chat_not_found' };
+      }
+      const chat = chatRows[0]!;
+      const sessionId = chat.session_id;
+
+      const callerRows = await sql<{
+        message_id: string;
+        payload: { id: string; name: string; args: Record<string, unknown> };
+      }[]>`
+        SELECT p.message_id, p.payload
+        FROM message_parts p
+        JOIN messages m ON m.id = p.message_id
+        WHERE m.chat_id = ${chat.id}
+          AND m.role = 'assistant'
+          AND p.kind = 'tool_call'
+          AND p.payload->>'id' = ${tool_call_id}
+        ORDER BY m.created_at DESC
+        LIMIT 1
+      `;
+      if (!callerRows[0]) {
+        reply.code(404);
+        return { error: 'unknown_tool_call_id' };
+      }
+      const foundCall = callerRows[0].payload;
+      if (foundCall.name !== 'ask_user_input') {
+        reply.code(400);
+        return { error: 'tool_call_not_ask_user_input' };
+      }
+
+      const argsParsed = AskUserInputArgs.safeParse(foundCall.args);
+      if (!argsParsed.success) {
+        reply.code(400);
+        return { error: 'mismatched_answer_shape', detail: 'tool_call args invalid' };
+      }
+      const questions = argsParsed.data.questions;
+      if (answers.length !== questions.length) {
+        reply.code(400);
+        return { error: 'mismatched_answer_shape', detail: `expected ${questions.length} answer(s), got ${answers.length}` };
+      }
+      for (let i = 0; i < questions.length; i++) {
+        const q = questions[i]!;
+        const a = answers[i]!;
+        for (const sel of a.selected_options) {
+          if (!q.options.includes(sel)) {
+            reply.code(400);
+            return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} option not in question: ${sel}` };
+          }
+        }
+        if (q.type === 'single_select' && a.selected_options.length > 1) {
+          reply.code(400);
+          return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} multi on single_select` };
+        }
+        if (a.selected_options.length === 0 && (!a.free_text || !a.free_text.trim())) {
+          reply.code(400);
+          return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} is empty` };
+        }
+      }
+
+      const toolRows = await sql<{
+        message_id: string;
+        payload: { tool_call_id: string; output: unknown };
+      }[]>`
+        SELECT p.message_id, p.payload
+        FROM message_parts p
+        JOIN messages m ON m.id = p.message_id
+        WHERE m.chat_id = ${chat.id}
+          AND m.role = 'tool'
+          AND p.kind = 'tool_result'
+          AND p.payload->>'tool_call_id' = ${tool_call_id}
+        ORDER BY m.created_at DESC
+        LIMIT 1
+      `;
+      if (!toolRows[0]) {
+        reply.code(404);
+        return { error: 'unknown_tool_call_id', detail: 'tool message not found' };
+      }
+      if (toolRows[0].payload?.output !== null) {
+        reply.code(409);
+        return { error: 'tool_call_already_answered' };
+      }
+
+      const answerSet = { answers };
+      const newToolResults = { tool_call_id, output: answerSet, truncated: false };
+      const toolMessageId = toolRows[0].message_id;
+
+      const result = await sql.begin(async (tx) => {
+        await tx`DELETE FROM message_parts WHERE message_id = ${toolMessageId} AND kind = 'tool_result'`;
+        await tx`
+          INSERT INTO message_parts (message_id, sequence, kind, payload)
+          VALUES (${toolMessageId}, 0, 'tool_result', ${tx.json(newToolResults as never)})
+        `;
+        const [assistantMsg] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'assistant', '', 'streaming', clock_timestamp())
+          RETURNING id
+        `;
+        await tx`UPDATE sessions SET updated_at = clock_timestamp() WHERE id = ${sessionId}`;
+        await tx`UPDATE chats SET updated_at = clock_timestamp() WHERE id = ${chat.id}`;
+        return { tool_message_id: toolMessageId, assistant_message_id: assistantMsg!.id };
+      });
+
+      broker.publishFrame(sessionId, {
+        type: 'tool_result',
+        tool_message_id: result.tool_message_id,
+        tool_call_id,
+        chat_id: chat.id,
+        output: answerSet,
+        truncated: false,
+      } as unknown as WsFrame);
+      inference.enqueue(sessionId, chat.id, result.assistant_message_id, 'default');
+
+      reply.code(202);
+      return result;
+    },
+  );
+
   // POST /api/sessions/:sessionId/stop — cancel active inference
   app.post<{ Params: { sessionId: string } }>(
     '/api/sessions/:sessionId/stop',

apps/coder/src/routes/tasks.ts

@@ -19,6 +19,7 @@ const CreateBody = z.object({
 
 const PermissionBody = z.object({
   option_id: z.string().max(200).nullable(),
+  updated_input: z.record(z.unknown()).optional(),
 });
 
 const ListQuery = z.object({
@@ -164,7 +165,7 @@ export function registerTaskRoutes(app: FastifyInstance, sql: Sql, inference: In
       return { error: 'invalid body', details: parsed.error.flatten() };
     }
 
-    const ok = respondToPermission(req.params.id, parsed.data.option_id);
+    const ok = respondToPermission(req.params.id, parsed.data.option_id, parsed.data.updated_input as Record<string, unknown> | undefined);
     if (!ok) {
       reply.code(404);
       return { error: 'no pending permission' };

apps/coder/src/services/acp-dispatch.ts

@@ -17,6 +17,8 @@ import {
   type WriteTextFileResponse,
   type CreateTerminalRequest,
   type CreateTerminalResponse,
+  type CreateElicitationRequest,
+  type CreateElicitationResponse,
   type SessionConfigOption,
   type ClientSideConnection as ConnectionType,
 } from '@agentclientprotocol/sdk';
@@ -26,7 +28,7 @@ import { spawn } from 'node:child_process';
 import { findThoughtLevelConfigId } from './acp-derive.js';
 import { resolveAcpSpawnArgs } from './acp-spawn.js';
 import { createAcpNdJsonStream } from './acp-stream.js';
-import { waitForPermissionResponse, cancelPendingPermission } from './permission-waiter.js';
+import { waitForPermissionResponse, waitForElicitationResponse, cancelPendingPermission } from './permission-waiter.js';
 import { mergeTaskCommands, getTaskCommands } from './agent-commands-cache.js';
 import { readWorktreeTextFile, writeWorktreeTextFile } from './acp-client-fs.js';
 import {
@@ -254,6 +256,12 @@ class AcpStreamContext {
       createTerminal: async (_params: CreateTerminalRequest): Promise<CreateTerminalResponse> => {
         return { terminalId: 'noop' };
       },
+      unstable_createElicitation: async (params: CreateElicitationRequest): Promise<CreateElicitationResponse> => {
+        if (taskId && sessionId) {
+          return waitForElicitationResponse(taskId, sessionId, agent, modeId, params);
+        }
+        return { action: 'decline' };
+      },
     };
   }
 }

apps/coder/src/services/permission-waiter.ts

@@ -1,12 +1,13 @@
 /**
- * Blocks ACP dispatch on permission prompts until the user responds via API.
+ * Blocks ACP dispatch on permission/elicitation prompts until the user responds via API.
  */
-import type { RequestPermissionRequest, RequestPermissionResponse } from '@agentclientprotocol/sdk';
+import type { RequestPermissionRequest, RequestPermissionResponse, CreateElicitationRequest, CreateElicitationResponse } from '@agentclientprotocol/sdk';
 import { isUnattendedMode } from './provider-manifest.js';
 
 const DEFAULT_TIMEOUT_MS = 120_000;
 
 interface PendingPermission {
+  type: 'permission';
   request: RequestPermissionRequest;
   sessionId: string;
   resolve: (response: RequestPermissionResponse) => void;
@@ -14,11 +15,27 @@ interface PendingPermission {
   timer: ReturnType<typeof setTimeout>;
 }
 
-const pendingByTask = new Map<string, PendingPermission>();
+interface PendingElicitation {
+  type: 'elicitation';
+  request: CreateElicitationRequest;
+  sessionId: string;
+  resolve: (response: CreateElicitationResponse) => void;
+  reject: (err: Error) => void;
+  timer: ReturnType<typeof setTimeout>;
+}
+
+type PendingEntry = PendingPermission | PendingElicitation;
+
+const pendingByTask = new Map<string, PendingEntry>();
+
+export type PermissionKind = 'tool' | 'question' | 'plan' | 'elicitation';
 
 export interface PermissionPrompt {
   taskId: string;
+  kind: PermissionKind;
   toolTitle?: string;
+  description?: string;
+  input?: Record<string, unknown>;
   options: Array<{ optionId: string; label: string }>;
 }
 
@@ -33,10 +50,25 @@ export function setPermissionHooks(next: PermissionHooks): void {
   hooks = next;
 }
 
+function resolveKind(params: RequestPermissionRequest): PermissionKind {
+  const input = params.toolCall?.rawInput;
+  if (input && typeof input === 'object' && !Array.isArray(input) && 'questions' in input && Array.isArray((input as Record<string, unknown>).questions)) {
+    return 'question';
+  }
+  return 'tool';
+}
+
 function toPrompt(taskId: string, params: RequestPermissionRequest): PermissionPrompt {
+  const kind = resolveKind(params);
+  const rawInput = params.toolCall?.rawInput;
+  const input = rawInput && typeof rawInput === 'object' && !Array.isArray(rawInput)
+    ? rawInput as Record<string, unknown>
+    : undefined;
   return {
     taskId,
+    kind,
     toolTitle: params.toolCall?.title ?? undefined,
+    ...(input ? { input } : {}),
     options: params.options.map((o) => ({
       optionId: o.optionId,
       label: o.name,
@@ -73,24 +105,33 @@ export function waitForPermissionResponse(
       resolve({ outcome: { outcome: 'cancelled' } });
     }, timeoutMs);
 
-    pendingByTask.set(taskId, { request: params, sessionId, resolve, reject, timer });
+    pendingByTask.set(taskId, { type: 'permission', request: params, sessionId, resolve, reject, timer });
 
     const prompt = toPrompt(taskId, params);
     void hooks.onPrompt?.({ ...prompt, sessionId });
   });
 }
 
-export function respondToPermission(taskId: string, optionId: string | null): boolean {
+export function respondToPermission(taskId: string, optionId: string | null, updatedInput?: Record<string, unknown>): boolean {
   const pending = pendingByTask.get(taskId);
   if (!pending) return false;
 
   clearTimeout(pending.timer);
   pendingByTask.delete(taskId);
 
-  if (optionId) {
-    pending.resolve({ outcome: { outcome: 'selected', optionId } });
+  if (pending.type === 'elicitation') {
+    if (updatedInput) {
+      const content = updatedInput as { [key: string]: string | number | boolean | string[] };
+      pending.resolve({ action: 'accept', content });
+    } else {
+      pending.resolve({ action: 'decline' });
+    }
   } else {
-    pending.resolve({ outcome: { outcome: 'cancelled' } });
+    if (optionId) {
+      pending.resolve({ outcome: { outcome: 'selected', optionId } });
+    } else {
+      pending.resolve({ outcome: { outcome: 'cancelled' } });
+    }
   }
 
   void hooks.onResolved?.(taskId, pending.sessionId);
@@ -100,14 +141,67 @@ export function respondToPermission(taskId: string, optionId: string | null): bo
 export function getPendingPermission(taskId: string): PermissionPrompt | null {
   const pending = pendingByTask.get(taskId);
   if (!pending) return null;
+  if (pending.type === 'elicitation') {
+    return elicitationToPrompt(taskId, pending.request);
+  }
   return toPrompt(taskId, pending.request);
 }
 
+function elicitationToPrompt(taskId: string, params: CreateElicitationRequest): PermissionPrompt {
+  const input: Record<string, unknown> = { message: params.message };
+  if ('requestedSchema' in params) {
+    input.requestedSchema = params.requestedSchema;
+  }
+  return {
+    taskId,
+    kind: 'elicitation',
+    toolTitle: params.message,
+    input,
+    options: [],
+  };
+}
+
+export function waitForElicitationResponse(
+  taskId: string,
+  sessionId: string,
+  provider: string,
+  modeId: string | undefined,
+  params: CreateElicitationRequest,
+  timeoutMs = DEFAULT_TIMEOUT_MS,
+): Promise<CreateElicitationResponse> {
+  if (isUnattendedMode(provider, modeId)) {
+    return Promise.resolve({ action: 'decline' });
+  }
+
+  return new Promise((resolve, reject) => {
+    const existing = pendingByTask.get(taskId);
+    if (existing) {
+      clearTimeout(existing.timer);
+      existing.reject(new Error('superseded by newer elicitation request'));
+    }
+
+    const timer = setTimeout(() => {
+      pendingByTask.delete(taskId);
+      void hooks.onResolved?.(taskId, sessionId);
+      resolve({ action: 'cancel' });
+    }, timeoutMs);
+
+    pendingByTask.set(taskId, { type: 'elicitation', request: params, sessionId, resolve, reject, timer });
+
+    const prompt = elicitationToPrompt(taskId, params);
+    void hooks.onPrompt?.({ ...prompt, sessionId });
+  });
+}
+
 export function cancelPendingPermission(taskId: string): void {
   const pending = pendingByTask.get(taskId);
   if (!pending) return;
   clearTimeout(pending.timer);
   pendingByTask.delete(taskId);
-  pending.resolve({ outcome: { outcome: 'cancelled' } });
+  if (pending.type === 'elicitation') {
+    pending.resolve({ action: 'cancel' });
+  } else {
+    pending.resolve({ outcome: { outcome: 'cancelled' } });
+  }
   void hooks.onResolved?.(taskId, pending.sessionId);
 }

apps/coder/web/src/api/client.ts

@@ -1,4 +1,4 @@
-import type { Project, Session, Chat, Message, PendingChange } from './types';
+import type { Project, Session, Chat, Message, PendingChange, AskUserAnswer } from './types';
 
 export class ApiError extends Error {
   constructor(
@@ -52,6 +52,14 @@ export const api = {
         method: 'POST',
         body: JSON.stringify(body ?? {}),
       }),
+    answerUserInput: (chatId: string, toolCallId: string, answers: AskUserAnswer[]) =>
+      request<{ tool_message_id: string; assistant_message_id: string }>(
+        `/api/chats/${chatId}/answer_user_input`,
+        {
+          method: 'POST',
+          body: JSON.stringify({ tool_call_id: toolCallId, answers }),
+        },
+      ),
   },
 
   messages: {

apps/coder/web/src/api/types.ts

@@ -32,16 +32,37 @@ export interface Chat {
 export interface ToolCall {
   id: string;
   name: string;
-  arguments: string;
+  args: unknown;
 }
 
 export interface ToolResult {
   tool_call_id: string;
-  output: string;
+  output: unknown;
   truncated?: boolean;
   error?: boolean;
 }
 
+// Batch 9.7: ask_user_input shapes. The tool_call.args is { questions: AskUserQuestion[] }
+// (1-3 entries); the eventual tool_result.output is { answers: AskUserAnswer[] } in the
+// same order. AskUserInputCard renders questions and POSTs answers.
+export type AskUserQuestionType = 'single_select' | 'multi_select';
+
+export interface AskUserQuestion {
+  question: string;
+  type: AskUserQuestionType;
+  options: string[];
+}
+
+export interface AskUserAnswer {
+  question: string;
+  selected_options: string[];
+  free_text: string | null;
+}
+
+export interface AskUserAnswerSet {
+  answers: AskUserAnswer[];
+}
+
 export interface Message {
   id: string;
   session_id: string;

apps/coder/web/src/components/AskUserInputCard.tsx

@@ -0,0 +1,323 @@
+import { useMemo, useState } from 'react';
+import { Check } from 'lucide-react';
+import { api } from '@/api/client';
+import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
+import { Button } from '@/components/ui/button';
+import type {
+  AskUserAnswer,
+  AskUserAnswerSet,
+  AskUserQuestion,
+  ToolCall,
+  ToolResult,
+} from '@/api/types';
+
+// Batch 9.7: Inline interactive picker. Renders inside MessageList in place of
+// the standard ToolCallLine when the assistant emits an ask_user_input tool
+// call. While the tool result is null (server pre-stamps a sentinel with
+// output=null), shows the form; once the WS tool_result frame arrives with a
+// real AnswerSet, flips to read-only review mode.
+
+interface Props {
+  toolCall: ToolCall;
+  toolResult: ToolResult | null;
+  chatId: string;
+}
+
+function parseQuestions(raw: unknown): AskUserQuestion[] {
+  if (!raw || typeof raw !== 'object' || !('questions' in raw)) return [];
+  const arr = (raw as { questions: unknown }).questions;
+  if (!Array.isArray(arr)) return [];
+  const out: AskUserQuestion[] = [];
+  for (const item of arr) {
+    if (!item || typeof item !== 'object') continue;
+    const q = item as { question?: unknown; type?: unknown; options?: unknown };
+    if (typeof q.question !== 'string') continue;
+    if (q.type !== 'single_select' && q.type !== 'multi_select') continue;
+    if (!Array.isArray(q.options)) continue;
+    const opts = q.options.filter((o): o is string => typeof o === 'string');
+    if (opts.length < 2) continue;
+    out.push({ question: q.question, type: q.type, options: opts });
+  }
+  return out;
+}
+
+function parseAnswerSet(raw: unknown): AskUserAnswerSet | null {
+  if (!raw || typeof raw !== 'object' || !('answers' in raw)) return null;
+  const arr = (raw as { answers: unknown }).answers;
+  if (!Array.isArray(arr)) return null;
+  const answers: AskUserAnswer[] = [];
+  for (const item of arr) {
+    if (!item || typeof item !== 'object') continue;
+    const a = item as { question?: unknown; selected_options?: unknown; free_text?: unknown };
+    if (typeof a.question !== 'string') continue;
+    if (!Array.isArray(a.selected_options)) continue;
+    if (a.free_text !== null && typeof a.free_text !== 'string') continue;
+    const sel = a.selected_options.filter((s): s is string => typeof s === 'string');
+    answers.push({
+      question: a.question,
+      selected_options: sel,
+      free_text: (a.free_text as string | null) ?? null,
+    });
+  }
+  return { answers };
+}
+
+export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
+  const questions = useMemo(() => parseQuestions(toolCall.args), [toolCall.args]);
+
+  if (questions.length === 0) {
+    return (
+      <div className="rounded border border-destructive/40 bg-destructive/10 text-xs px-3 py-2 text-destructive">
+        ask_user_input: malformed tool args
+      </div>
+    );
+  }
+
+  // Tool result with a non-null output means the answer is already submitted.
+  // The pending sentinel uses output=null, so this branch only triggers after
+  // the real WS tool_result frame lands.
+  const answered = toolResult && toolResult.output !== null;
+  if (answered) {
+    const answerSet = parseAnswerSet(toolResult!.output);
+    return <AnsweredView questions={questions} answers={answerSet} />;
+  }
+
+  return (
+    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} />
+  );
+}
+
+function PendingView({
+  questions,
+  toolCallId,
+  chatId,
+}: {
+  questions: AskUserQuestion[];
+  toolCallId: string;
+  chatId: string;
+}) {
+  // Per-question selections + free text. Selections are option arrays so the
+  // multi_select case is uniform; single_select just constrains to length 1.
+  const [selections, setSelections] = useState<string[][]>(() => questions.map(() => []));
+  const [freeTexts, setFreeTexts] = useState<string[]>(() => questions.map(() => ''));
+  const [submitting, setSubmitting] = useState(false);
+
+  const singleQuestion = questions.length === 1;
+  const anyFreeText = freeTexts.some((t) => t.trim().length > 0);
+
+  // Submit button shows when:
+  //   - more than one question (always batched), OR
+  //   - one question and the user has typed free text (committing it needs an
+  //     explicit Submit so an accidental Tab/click doesn't lose it).
+  // For one question with no free text, clicking an option submits inline.
+  const showSubmitButton = !singleQuestion || anyFreeText;
+
+  // Every question must have at least one of (option, free text).
+  const allComplete = questions.every((_, i) => {
+    return selections[i]!.length > 0 || freeTexts[i]!.trim().length > 0;
+  });
+
+  function buildAnswers(): AskUserAnswer[] {
+    return questions.map((q, i) => {
+      const freeText = freeTexts[i]!.trim();
+      return {
+        question: q.question,
+        selected_options: selections[i]!,
+        free_text: freeText.length > 0 ? freeText : null,
+      };
+    });
+  }
+
+  async function submit(answers: AskUserAnswer[]) {
+    if (submitting) return;
+    setSubmitting(true);
+    try {
+      await api.chats.answerUserInput(chatId, toolCallId, answers);
+      // Card stays mounted; the incoming WS tool_result frame will flip it
+      // into AnsweredView via the parent prop change.
+    } catch (err) {
+      console.error('ask_user_input submit failed:', err instanceof Error ? err.message : err);
+      setSubmitting(false);
+    }
+  }
+
+  function pickSingle(qIdx: number, option: string) {
+    setSelections((prev) => prev.map((arr, i) => (i === qIdx ? [option] : arr)));
+    // Immediate submit for the single-question single-select shortcut. Only
+    // fires when no free text exists anywhere — once the user typed, the
+    // Submit button takes over so the typed text isn't silently dropped.
+    if (singleQuestion && !anyFreeText) {
+      const answers: AskUserAnswer[] = [
+        {
+          question: questions[0]!.question,
+          selected_options: [option],
+          free_text: null,
+        },
+      ];
+      void submit(answers);
+    }
+  }
+
+  function toggleMulti(qIdx: number, option: string) {
+    setSelections((prev) =>
+      prev.map((arr, i) => {
+        if (i !== qIdx) return arr;
+        return arr.includes(option) ? arr.filter((o) => o !== option) : [...arr, option];
+      }),
+    );
+  }
+
+  function setFreeText(qIdx: number, value: string) {
+    setFreeTexts((prev) => prev.map((t, i) => (i === qIdx ? value : t)));
+  }
+
+  return (
+    <div className="rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-4">
+        {questions.map((q, i) => (
+          <div key={i} className="space-y-2">
+            {questions.length > 1 && (
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Question {i + 1}
+              </div>
+            )}
+            <div className="font-medium leading-snug">{q.question}</div>
+            {q.type === 'single_select' ? (
+              <RadioGroup
+                value={selections[i]![0] ?? ''}
+                onValueChange={(v) => pickSingle(i, v)}
+                disabled={submitting}
+                className="gap-1.5"
+              >
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            ) : (
+              <div className="grid gap-1.5">
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  const checked = selections[i]!.includes(opt);
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <input
+                        id={id}
+                        type="checkbox"
+                        checked={checked}
+                        disabled={submitting}
+                        onChange={() => toggleMulti(i, opt)}
+                        className="mt-1 size-3.5 rounded border-input accent-primary"
+                      />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </div>
+            )}
+            <div className="pt-1 space-y-1">
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Or type a custom answer
+              </div>
+              <input
+                type="text"
+                value={freeTexts[i]}
+                disabled={submitting}
+                placeholder="Free text…"
+                onChange={(e) => setFreeText(i, e.target.value)}
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            </div>
+          </div>
+        ))}
+      </div>
+      {showSubmitButton && (
+        <div className="flex justify-end gap-2 border-t px-4 py-2">
+          <Button
+            type="button"
+            size="sm"
+            disabled={!allComplete || submitting}
+            onClick={() => void submit(buildAnswers())}
+          >
+            {submitting ? 'Submitting…' : 'Submit'}
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+function AnsweredView({
+  questions,
+  answers,
+}: {
+  questions: AskUserQuestion[];
+  answers: AskUserAnswerSet | null;
+}) {
+  if (!answers) {
+    return (
+      <div className="rounded-lg border bg-muted/20 text-xs px-4 py-3 text-muted-foreground">
+        ask_user_input: answers unavailable
+      </div>
+    );
+  }
+
+  return (
+    <div className="rounded-lg border bg-muted/10 text-sm">
+      <div className="px-4 py-3 space-y-3">
+        {questions.map((q, i) => {
+          const a = answers.answers[i];
+          if (!a) return null;
+          return (
+            <div key={i} className="space-y-1.5">
+              {questions.length > 1 && (
+                <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                  Question {i + 1}
+                </div>
+              )}
+              <div className="font-medium leading-snug">{q.question}</div>
+              <div className="space-y-0.5">
+                {q.options.map((opt, j) => {
+                  const selected = a.selected_options.includes(opt);
+                  return (
+                    <div
+                      key={j}
+                      className={
+                        selected
+                          ? 'flex items-start gap-2 text-sm leading-snug text-foreground'
+                          : 'flex items-start gap-2 text-sm leading-snug text-muted-foreground/60 line-through'
+                      }
+                    >
+                      <span className="mt-0.5 size-3.5 shrink-0 inline-flex items-center justify-center">
+                        {selected && <Check className="size-3 text-primary" />}
+                      </span>
+                      <span>{opt}</span>
+                    </div>
+                  );
+                })}
+              </div>
+              {a.free_text && (
+                <div className="rounded bg-background border px-2 py-1 text-xs font-mono whitespace-pre-wrap">
+                  {a.free_text}
+                </div>
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}

apps/coder/web/src/components/ChatPane.tsx

@@ -1,6 +1,6 @@
 import { useState, useRef, useEffect } from 'react';
 import { Send, Square } from 'lucide-react';
-import type { Message } from '@/api/types';
+import type { Message, ToolResult } from '@/api/types';
 import { api } from '@/api/client';
 import { MessageBubble } from './MessageBubble';
 
@@ -66,6 +66,14 @@ export function ChatPane({ sessionId, chatId, messages, isStreaming, connected }
   // Filter out system messages for display (sentinels)
   const visibleMessages = messages.filter((m) => m.role !== 'system');
 
+  // Build a lookup map from tool_call_id -> ToolResult for all messages
+  const toolResultsMap: Record<string, ToolResult> = {};
+  for (const msg of messages) {
+    if (msg.tool_results) {
+      toolResultsMap[msg.tool_results.tool_call_id] = msg.tool_results;
+    }
+  }
+
   return (
     <div className="flex flex-col h-full">
       {/* Connection indicator */}
@@ -88,7 +96,7 @@ export function ChatPane({ sessionId, chatId, messages, isStreaming, connected }
           </div>
         )}
         {visibleMessages.map((msg) => (
-          <MessageBubble key={msg.id} message={msg} />
+          <MessageBubble key={msg.id} message={msg} chatId={msg.chat_id} toolResultsMap={toolResultsMap} />
         ))}
         <div ref={messagesEndRef} />
       </div>

apps/coder/web/src/components/MessageBubble.tsx

@@ -1,13 +1,16 @@
 import Markdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
-import type { Message } from '@/api/types';
+import type { Message, ToolResult } from '@/api/types';
 import { Wrench, AlertCircle, Loader2 } from 'lucide-react';
+import { AskUserInputCard } from './AskUserInputCard';
 
 interface Props {
   message: Message;
+  chatId: string;
+  toolResultsMap: Record<string, ToolResult>;
 }
 
-export function MessageBubble({ message }: Props) {
+export function MessageBubble({ message, chatId }: Props) {
   if (message.role === 'tool') {
     return <ToolResultBubble message={message} />;
   }
@@ -34,18 +37,31 @@ export function MessageBubble({ message }: Props) {
 
         {message.tool_calls && message.tool_calls.length > 0 && (
           <div className="mb-2 space-y-1">
-            {message.tool_calls.map((tc) => (
-              <div
-                key={tc.id}
-                className="flex items-center gap-1.5 text-xs text-zinc-400 bg-zinc-900/50 rounded px-2 py-1"
-              >
-                <Wrench size={11} />
-                <span className="font-mono">{tc.name}</span>
-                <span className="text-zinc-500 truncate max-w-[200px]">
-                  {truncateArgs(tc.arguments)}
-                </span>
-              </div>
-            ))}
+            {message.tool_calls.map((tc) => {
+              if (tc.name === 'ask_user_input') {
+                const result = message.tool_results ?? null;
+                return (
+                  <AskUserInputCard
+                    key={tc.id}
+                    toolCall={tc}
+                    toolResult={result}
+                    chatId={chatId}
+                  />
+                );
+              }
+              return (
+                <div
+                  key={tc.id}
+                  className="flex items-center gap-1.5 text-xs text-zinc-400 bg-zinc-900/50 rounded px-2 py-1"
+                >
+                  <Wrench size={11} />
+                  <span className="font-mono">{tc.name}</span>
+                  <span className="text-zinc-500 truncate max-w-[200px]">
+                    {truncateArgs(tc.args)}
+                  </span>
+                </div>
+              );
+            })}
           </div>
         )}
 
@@ -70,12 +86,12 @@ export function MessageBubble({ message }: Props) {
   );
 }
 
-function ToolResultBubble({ message }: Props) {
+function ToolResultBubble({ message }: { message: Message }) {
   const result = message.tool_results;
   if (!result) return null;
 
   const isError = result.error;
-  const output = result.output || '';
+  const output = result.output != null ? String(result.output) : '';
   const displayOutput =
     output.length > 300 ? output.slice(0, 300) + '...' : output;
 
@@ -99,17 +115,21 @@ function ToolResultBubble({ message }: Props) {
   );
 }
 
-function truncateArgs(args: string): string {
+function truncateArgs(args: unknown): string {
   if (!args) return '';
   try {
-    const parsed = JSON.parse(args);
-    const keys = Object.keys(parsed);
-    if (keys.length === 0) return '';
-    const first = keys[0]!;
-    const val = String(parsed[first]);
-    const display = val.length > 40 ? val.slice(0, 40) + '...' : val;
-    return `${first}: ${display}`;
+    if (typeof args === 'object' && args !== null) {
+      const obj = args as Record<string, unknown>;
+      const keys = Object.keys(obj);
+      if (keys.length === 0) return '';
+      const first = keys[0]!;
+      const val = String(obj[first] ?? '');
+      const display = val.length > 40 ? val.slice(0, 40) + '...' : val;
+      return `${first}: ${display}`;
+    }
+    const str = String(args);
+    return str.length > 50 ? str.slice(0, 50) + '...' : str;
   } catch {
-    return args.length > 50 ? args.slice(0, 50) + '...' : args;
+    return String(args).length > 50 ? String(args).slice(0, 50) + '...' : String(args);
   }
 }

apps/coder/web/src/components/ui/button.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
+  size?: 'default' | 'sm' | 'lg' | 'icon';
+}
+
+const variantClasses: Record<string, string> = {
+  default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+  destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+  outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+  secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+  ghost: 'hover:bg-accent hover:text-accent-foreground',
+  link: 'text-primary underline-offset-4 hover:underline',
+};
+
+const sizeClasses: Record<string, string> = {
+  default: 'h-9 px-4 py-2',
+  sm: 'h-8 rounded-md px-3 text-xs',
+  lg: 'h-10 rounded-md px-8',
+  icon: 'h-9 w-9',
+};
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant = 'default', size = 'default', ...props }, ref) => {
+    const base =
+      'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-60';
+    const cls = [base, variantClasses[variant] ?? '', sizeClasses[size] ?? '', className ?? ''].join(' ');
+    return <button className={cls} ref={ref} {...props} />;
+  },
+);
+Button.displayName = 'Button';
+
+export { Button };

apps/coder/web/src/components/ui/radio-group.tsx

@@ -0,0 +1,56 @@
+import * as React from 'react';
+
+const RadioGroupContext = React.createContext<{
+  value: string | undefined;
+  onValueChange: (v: string) => void;
+  disabled?: boolean;
+} | null>(null);
+
+interface RadioGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+  value?: string;
+  onValueChange?: (value: string) => void;
+  disabled?: boolean;
+}
+
+const RadioGroup = React.forwardRef<HTMLDivElement, RadioGroupProps>(
+  ({ className, value, onValueChange, disabled, ...props }, ref) => {
+    const ctx = React.useMemo(() => ({ value, onValueChange: onValueChange ?? (() => {}), disabled }), [value, onValueChange, disabled]);
+    return (
+      <RadioGroupContext.Provider value={ctx}>
+        <div
+          ref={ref}
+          role="radiogroup"
+          className={className}
+          {...props}
+        />
+      </RadioGroupContext.Provider>
+    );
+  },
+);
+RadioGroup.displayName = 'RadioGroup';
+
+interface RadioGroupItemProps extends React.InputHTMLAttributes<HTMLInputElement> {
+  value: string;
+}
+
+const RadioGroupItem = React.forwardRef<HTMLInputElement, RadioGroupItemProps>(
+  ({ className, value, ...props }, ref) => {
+    const ctx = React.useContext(RadioGroupContext);
+    if (!ctx) return <input ref={ref} type="radio" className={className} value={value} {...props} />;
+    const checked = ctx.value === value;
+    return (
+      <input
+        ref={ref}
+        type="radio"
+        checked={checked}
+        disabled={ctx.disabled}
+        onChange={() => ctx.onValueChange(value)}
+        className={className}
+        {...props}
+      />
+    );
+  },
+);
+RadioGroupItem.displayName = 'RadioGroupItem';
+
+export { RadioGroup, RadioGroupItem };

apps/server/src/services/agents.ts

@@ -83,6 +83,10 @@ export function slugify(name: string): string {
 
 interface ParsedFrontmatter {
   temperature?: number;
+  top_p?: number;
+  top_k?: number;
+  min_p?: number;
+  presence_penalty?: number;
   tools?: string[];
   description?: string;
   model?: string;
@@ -132,6 +136,46 @@ function parseFrontmatter(yaml: string): { data: ParsedFrontmatter; errors: stri
       const n = Number(valueRaw);
       if (Number.isFinite(n)) data.temperature = n;
       else errors.push(`temperature must be a number (got "${valueRaw}")`);
+    } else if (key === 'top_p') {
+      const n = Number(valueRaw);
+      if (Number.isFinite(n)) {
+        data.top_p = n;
+        if (n < 0 || n > 1) {
+          console.warn(`agents: top_p ${n} out of range 0-1, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`top_p must be a number (got "${valueRaw}")`);
+      }
+    } else if (key === 'top_k') {
+      const n = Number(valueRaw);
+      if (Number.isInteger(n)) {
+        data.top_k = n;
+        if (n < 0 || n > 200) {
+          console.warn(`agents: top_k ${n} out of range 0-200, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`top_k must be an integer (got "${valueRaw}")`);
+      }
+    } else if (key === 'min_p') {
+      const n = Number(valueRaw);
+      if (Number.isFinite(n)) {
+        data.min_p = n;
+        if (n < 0 || n > 1) {
+          console.warn(`agents: min_p ${n} out of range 0-1, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`min_p must be a number (got "${valueRaw}")`);
+      }
+    } else if (key === 'presence_penalty') {
+      const n = Number(valueRaw);
+      if (Number.isFinite(n)) {
+        data.presence_penalty = n;
+        if (n < -2 || n > 2) {
+          console.warn(`agents: presence_penalty ${n} out of range -2-2, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`presence_penalty must be a number (got "${valueRaw}")`);
+      }
     } else if (key === 'tools') {
       if (valueRaw === '') {
         data.tools = [];
@@ -276,6 +320,10 @@ function parseAgentSection(section: RawSection): Omit<Agent, 'source'> {
     description: fm.description ?? '',
     system_prompt: systemPrompt,
     temperature: typeof fm.temperature === 'number' ? fm.temperature : DEFAULT_TEMPERATURE,
+    top_p: typeof fm.top_p === 'number' ? fm.top_p : null,
+    top_k: typeof fm.top_k === 'number' ? fm.top_k : null,
+    min_p: typeof fm.min_p === 'number' ? fm.min_p : null,
+    presence_penalty: typeof fm.presence_penalty === 'number' ? fm.presence_penalty : null,
     tools: filteredTools,
     model: typeof fm.model === 'string' && fm.model.length > 0 ? fm.model : null,
     max_tool_calls: typeof fm.max_tool_calls === 'number' ? fm.max_tool_calls : null,

apps/server/src/services/inference/sentinel-summaries.ts

@@ -86,7 +86,7 @@ export async function runCapHitSummary(
       ctx,
       session.model,
       messages,
-      { tools: null, temperature: agent?.temperature },
+      { tools: null, temperature: agent?.temperature, top_p: agent?.top_p ?? undefined, top_k: agent?.top_k ?? undefined, min_p: agent?.min_p ?? undefined, presence_penalty: agent?.presence_penalty ?? undefined },
       (delta) => {
         accumulated += delta;
         ctx.publish(sessionId, {
@@ -346,7 +346,7 @@ export async function runDoomLoopSummary(
       ctx,
       session.model,
       messages,
-      { tools: null, temperature: agent?.temperature },
+      { tools: null, temperature: agent?.temperature, top_p: agent?.top_p ?? undefined, top_k: agent?.top_k ?? undefined, min_p: agent?.min_p ?? undefined, presence_penalty: agent?.presence_penalty ?? undefined },
       (delta) => {
         accumulated += delta;
         ctx.publish(sessionId, {
@@ -545,7 +545,7 @@ export async function runStepCapSummary(
       ctx,
       session.model,
       messages,
-      { tools: null, temperature: agent?.temperature },
+      { tools: null, temperature: agent?.temperature, top_p: agent?.top_p ?? undefined, top_k: agent?.top_k ?? undefined, min_p: agent?.min_p ?? undefined, presence_penalty: agent?.presence_penalty ?? undefined },
       (delta) => {
         accumulated += delta;
         ctx.publish(sessionId, {

apps/server/src/services/inference/stream-phase.ts

@@ -31,6 +31,10 @@ interface StreamOptions {
   // (rare; we still omit from the request body to avoid OpenAI 400).
   tools: ToolJsonSchema[] | null;
   temperature?: number;
+  top_p?: number | null;
+  top_k?: number | null;
+  min_p?: number | null;
+  presence_penalty?: number | null;
 }
 
 // v1.13.1-A: convert BooCode's OpenAI-shaped history into AI SDK
@@ -199,6 +203,9 @@ export async function streamCompletion(
       ? { tools: aiTools, toolChoice: 'auto' as const, experimental_repairToolCall: repairToolCall }
       : {}),
     ...(typeof opts.temperature === 'number' ? { temperature: opts.temperature } : {}),
+    ...(typeof opts.top_p === 'number' ? { topP: opts.top_p } : {}),
+    ...(typeof opts.top_k === 'number' ? { topK: opts.top_k } : {}),
+    ...(typeof opts.presence_penalty === 'number' ? { presencePenalty: opts.presence_penalty } : {}),
     abortSignal: signal,
   });
 
@@ -388,6 +395,10 @@ export async function executeStreamPhase(
     : toolJsonSchemas()
   ).filter((t) => webToolsEnabled || !WEB_TOOL_NAMES.has(t.function.name));
   const effectiveTemperature = agent?.temperature;
+  const effectiveTopP = agent?.top_p ?? undefined;
+  const effectiveTopK = agent?.top_k ?? undefined;
+  const effectiveMinP = agent?.min_p ?? undefined;
+  const effectivePresencePenalty = agent?.presence_penalty ?? undefined;
 
   // v1.12.2: ctx_max lookup is cached after the first hit per model, so this
   // is a Map probe in steady state. We capture nCtx once at the top of the
@@ -425,7 +436,7 @@ export async function executeStreamPhase(
       ctx,
       session.model,
       messages,
-      { tools: effectiveTools, temperature: effectiveTemperature },
+      { tools: effectiveTools, temperature: effectiveTemperature, top_p: effectiveTopP, top_k: effectiveTopK, min_p: effectiveMinP, presence_penalty: effectivePresencePenalty },
       (delta) => {
         state.accumulated += delta;
         ctx.publish(sessionId, {

apps/server/src/types/api.ts

@@ -99,6 +99,10 @@ export interface Agent {
   description: string;
   system_prompt: string;
   temperature: number;
+  top_p: number | null;  // null means omit from request body
+  top_k: number | null;  // null means omit from request body
+  min_p: number | null;  // null means omit from request body
+  presence_penalty: number | null;  // null means omit from request body
   tools: string[];       // whitelist of tool names; empty = no tools allowed
   model: string | null;  // null means "session.model wins"
   source: AgentSource;

apps/server/src/types/ws-frames.ts

@@ -272,7 +272,9 @@ export const PermissionRequestedFrame = z.object({
   type: z.literal('permission_requested'),
   task_id: Uuid,
   session_id: Uuid,
+  kind: z.enum(['tool', 'question', 'plan', 'elicitation']).optional(),
   tool_title: z.string().optional(),
+  input: z.record(z.unknown()).optional(),
   options: z.array(PermissionOptionShape),
 });
 

apps/web/src/api/client.ts

@@ -319,10 +319,10 @@ export const api = {
       }),
     getTaskPermission: (taskId: string) =>
       request<PermissionPrompt>(`/api/coder/tasks/${taskId}/permission`),
-    respondTaskPermission: (taskId: string, optionId: string | null) =>
+    respondTaskPermission: (taskId: string, optionId: string | null, updatedInput?: Record<string, unknown>) =>
       request<{ ok: boolean }>(`/api/coder/tasks/${taskId}/permission`, {
         method: 'POST',
-        body: JSON.stringify({ option_id: optionId }),
+        body: JSON.stringify({ option_id: optionId, ...(updatedInput ? { updated_input: updatedInput } : {}) }),
       }),
     getTaskCommands: (taskId: string) =>
       request<{ taskId: string; commands: AgentCommand[] }>(`/api/coder/tasks/${taskId}/commands`),

apps/web/src/api/types.ts

@@ -250,9 +250,13 @@ export interface AgentSessionConfig {
   thinkingOptionId: string | null;
 }
 
+export type PermissionKind = 'tool' | 'question' | 'plan' | 'elicitation';
+
 export interface PermissionPrompt {
   taskId: string;
+  kind?: PermissionKind;
   toolTitle?: string;
+  input?: Record<string, unknown>;
   options: Array<{ optionId: string; label: string }>;
 }
 

apps/web/src/api/ws-frames.ts

@@ -272,7 +272,9 @@ export const PermissionRequestedFrame = z.object({
   type: z.literal('permission_requested'),
   task_id: Uuid,
   session_id: Uuid,
+  kind: z.enum(['tool', 'question', 'plan', 'elicitation']).optional(),
   tool_title: z.string().optional(),
+  input: z.record(z.unknown()).optional(),
   options: z.array(PermissionOptionShape),
 });
 

apps/web/src/components/AgentPicker.tsx

@@ -96,7 +96,7 @@ export function AgentPicker({ projectId, value, onChange }: Props) {
           <ChevronDown className="size-3 opacity-70" />
         </button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="start" className="max-h-80 overflow-y-auto w-72">
+      <DropdownMenuContent align="start" className="max-h-80 overflow-y-auto w-96">
         {error && (
           <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>
         )}
@@ -128,7 +128,7 @@ export function AgentPicker({ projectId, value, onChange }: Props) {
                     <span className="font-medium">{a.name}</span>
                   </div>
                   {a.description && (
-                    <span className="text-muted-foreground pl-[18px] truncate w-full">
+                    <span className="text-muted-foreground pl-[18px] line-clamp-2 w-full">
                       {a.description}
                     </span>
                   )}

apps/web/src/components/AskUserInputCard.tsx

@@ -1,7 +1,6 @@
 import { useMemo, useState } from 'react';
 import { Check } from 'lucide-react';
 import { toast } from 'sonner';
-import { api } from '@/api/client';
 import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
 import { Button } from '@/components/ui/button';
 import type {
@@ -22,6 +21,7 @@ interface Props {
   toolCall: ToolCall;
   toolResult: ToolResult | null;
   chatId: string;
+  apiPrefix?: string;
 }
 
 function parseQuestions(raw: unknown): AskUserQuestion[] {
@@ -63,7 +63,7 @@ function parseAnswerSet(raw: unknown): AskUserAnswerSet | null {
   return { answers };
 }
 
-export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
+export function AskUserInputCard({ toolCall, toolResult, chatId, apiPrefix = '' }: Props) {
   const questions = useMemo(() => parseQuestions(toolCall.args), [toolCall.args]);
 
   if (questions.length === 0) {
@@ -74,9 +74,6 @@ export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
     );
   }
 
-  // Tool result with a non-null output means the answer is already submitted.
-  // The pending sentinel uses output=null, so this branch only triggers after
-  // the real WS tool_result frame lands.
   const answered = toolResult && toolResult.output !== null;
   if (answered) {
     const answerSet = parseAnswerSet(toolResult!.output);
@@ -84,7 +81,7 @@ export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
   }
 
   return (
-    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} />
+    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} apiPrefix={apiPrefix} />
   );
 }
 
@@ -92,10 +89,12 @@ function PendingView({
   questions,
   toolCallId,
   chatId,
+  apiPrefix = '',
 }: {
   questions: AskUserQuestion[];
   toolCallId: string;
   chatId: string;
+  apiPrefix?: string;
 }) {
   // Per-question selections + free text. Selections are option arrays so the
   // multi_select case is uniform; single_select just constrains to length 1.
@@ -133,9 +132,16 @@ function PendingView({
     if (submitting) return;
     setSubmitting(true);
     try {
-      await api.chats.answerUserInput(chatId, toolCallId, answers);
-      // Card stays mounted; the incoming WS tool_result frame will flip it
-      // into AnsweredView via the parent prop change.
+      const url = `${apiPrefix}/api/chats/${chatId}/answer_user_input`;
+      const res = await fetch(url, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ tool_call_id: toolCallId, answers }),
+      });
+      if (!res.ok) {
+        const body = await res.json().catch(() => ({})) as { error?: string; detail?: string };
+        throw new Error(body.detail ?? body.error ?? `HTTP ${res.status}`);
+      }
     } catch (err) {
       toast.error(err instanceof Error ? err.message : 'submit failed');
       setSubmitting(false);

apps/web/src/components/ModelPicker.tsx

@@ -107,7 +107,7 @@ export function ModelPicker({ value, onChange }: Props) {
           <ChevronDown className="size-3 opacity-70" />
         </button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="max-h-72 overflow-y-auto">
+      <DropdownMenuContent align="end" className="max-h-72 min-w-[16rem] overflow-y-auto">
         {error && (
           <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>
         )}

apps/web/src/components/PermissionCard.tsx

@@ -1,14 +1,105 @@
-import { ShieldAlert } from 'lucide-react';
+import { useState } from 'react';
+import { ShieldAlert, MessageCircleQuestion } from 'lucide-react';
 import type { PermissionPrompt } from '@/api/types';
+import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
+import { Button } from '@/components/ui/button';
 import { cn } from '@/lib/utils';
 
 interface Props {
   prompt: PermissionPrompt;
-  onRespond: (optionId: string | null) => void;
+  onRespond: (optionId: string | null, updatedInput?: Record<string, unknown>) => void;
   busy?: boolean;
 }
 
+// ---------------------------------------------------------------------------
+// Question detection — ACP's RequestPermissionRequest carries the tool input
+// in `input`. Claude Code's AskUserQuestion puts { questions: [...] } there.
+// ---------------------------------------------------------------------------
+
+interface Question {
+  question: string;
+  header?: string;
+  options: string[];
+  multiSelect: boolean;
+}
+
+function parseQuestions(input: Record<string, unknown> | undefined): Question[] | null {
+  if (!input) return null;
+  const raw = input.questions;
+  if (!Array.isArray(raw)) return null;
+  const out: Question[] = [];
+  for (const item of raw) {
+    if (!item || typeof item !== 'object') continue;
+    const q = item as { question?: unknown; header?: unknown; options?: unknown; multiSelect?: unknown };
+    if (typeof q.question !== 'string') continue;
+    const opts = Array.isArray(q.options)
+      ? q.options.filter((o): o is string => typeof o === 'string')
+      : [];
+    out.push({
+      question: q.question,
+      header: typeof q.header === 'string' ? q.header : undefined,
+      options: opts,
+      multiSelect: q.multiSelect === true,
+    });
+  }
+  return out.length > 0 ? out : null;
+}
+
+// ---------------------------------------------------------------------------
+// Elicitation detection — ACP's createElicitation carries a JSON Schema in
+// `input.requestedSchema`. For now, render each property as a text input.
+// ---------------------------------------------------------------------------
+
+interface ElicitationField {
+  key: string;
+  title: string;
+  description?: string;
+  type: string;
+  enumValues?: string[];
+}
+
+function parseElicitation(input: Record<string, unknown> | undefined): { message: string; fields: ElicitationField[] } | null {
+  if (!input) return null;
+  const schema = input.requestedSchema;
+  if (!schema || typeof schema !== 'object') return null;
+  const s = schema as Record<string, unknown>;
+  const props = s.properties;
+  if (!props || typeof props !== 'object') return null;
+  const fields: ElicitationField[] = [];
+  for (const [key, val] of Object.entries(props as Record<string, unknown>)) {
+    if (!val || typeof val !== 'object') continue;
+    const p = val as Record<string, unknown>;
+    fields.push({
+      key,
+      title: typeof p.title === 'string' ? p.title : key,
+      description: typeof p.description === 'string' ? p.description : undefined,
+      type: typeof p.type === 'string' ? p.type : 'string',
+      enumValues: Array.isArray(p.enum) ? p.enum.filter((e): e is string => typeof e === 'string') : undefined,
+    });
+  }
+  if (fields.length === 0) return null;
+  return { message: typeof input.message === 'string' ? input.message : '', fields };
+}
+
 export function PermissionCard({ prompt, onRespond, busy }: Props) {
+  const isQuestion = prompt.kind === 'question';
+  const isElicitation = prompt.kind === 'elicitation';
+
+  if (isQuestion) {
+    const questions = parseQuestions(prompt.input);
+    if (questions) {
+      return <QuestionView questions={questions} prompt={prompt} onRespond={onRespond} busy={busy} />;
+    }
+  }
+
+  if (isElicitation) {
+    const elicitation = parseElicitation(prompt.input);
+    if (elicitation) {
+      return <ElicitationView elicitation={elicitation} prompt={prompt} onRespond={onRespond} busy={busy} />;
+    }
+  }
+
+  // Standard tool permission — approve/deny buttons
   return (
     <div className="mx-3 my-2 rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2 text-sm">
       <div className="flex items-start gap-2">
@@ -47,3 +138,286 @@ export function PermissionCard({ prompt, onRespond, busy }: Props) {
     </div>
   );
 }
+
+// ---------------------------------------------------------------------------
+// QuestionView — renders Claude's AskUserQuestion as interactive radio/checkbox
+// ---------------------------------------------------------------------------
+
+function QuestionView({
+  questions,
+  prompt,
+  onRespond,
+  busy,
+}: {
+  questions: Question[];
+  prompt: PermissionPrompt;
+  onRespond: Props['onRespond'];
+  busy?: boolean;
+}) {
+  const [selections, setSelections] = useState<string[][]>(() => questions.map(() => []));
+  const [freeTexts, setFreeTexts] = useState<string[]>(() => questions.map(() => ''));
+  const [submitting, setSubmitting] = useState(false);
+  const disabled = busy || submitting;
+
+  const allComplete = questions.every((_, i) =>
+    selections[i]!.length > 0 || freeTexts[i]!.trim().length > 0,
+  );
+
+  function buildAnswers(): Record<string, string> {
+    const answers: Record<string, string> = {};
+    for (let i = 0; i < questions.length; i++) {
+      const q = questions[i]!;
+      const key = q.question;
+      const selected = selections[i]!;
+      const free = freeTexts[i]!.trim();
+      if (free) {
+        answers[key] = free;
+      } else if (selected.length > 0) {
+        answers[key] = selected.join(', ');
+      }
+    }
+    return answers;
+  }
+
+  function handleSubmit() {
+    if (!allComplete || submitting) return;
+    setSubmitting(true);
+    const answers = buildAnswers();
+    const firstAllow = prompt.options.find((o) =>
+      o.label.toLowerCase().includes('allow') || o.label.toLowerCase().includes('yes'),
+    );
+    onRespond(firstAllow?.optionId ?? prompt.options[0]?.optionId ?? null, {
+      ...prompt.input,
+      answers,
+    });
+  }
+
+  function pickSingle(qIdx: number, option: string) {
+    setSelections((prev) => prev.map((arr, i) => (i === qIdx ? [option] : arr)));
+    if (questions.length === 1 && !freeTexts[0]!.trim()) {
+      setSubmitting(true);
+      const firstAllow = prompt.options.find((o) =>
+        o.label.toLowerCase().includes('allow') || o.label.toLowerCase().includes('yes'),
+      );
+      onRespond(firstAllow?.optionId ?? prompt.options[0]?.optionId ?? null, {
+        ...prompt.input,
+        answers: { [questions[0]!.question]: option },
+      });
+    }
+  }
+
+  function toggleMulti(qIdx: number, option: string) {
+    setSelections((prev) =>
+      prev.map((arr, i) => {
+        if (i !== qIdx) return arr;
+        return arr.includes(option) ? arr.filter((o) => o !== option) : [...arr, option];
+      }),
+    );
+  }
+
+  return (
+    <div className="mx-3 my-2 rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-4">
+        {questions.map((q, i) => (
+          <div key={i} className="space-y-2">
+            {questions.length > 1 && (
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                {q.header ?? `Question ${i + 1}`}
+              </div>
+            )}
+            <div className="font-medium leading-snug">{q.question}</div>
+            {q.options.length > 0 && !q.multiSelect && (
+              <RadioGroup
+                value={selections[i]![0] ?? ''}
+                onValueChange={(v) => pickSingle(i, v)}
+                disabled={disabled}
+                className="gap-1.5"
+              >
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            )}
+            {q.options.length > 0 && q.multiSelect && (
+              <div className="grid gap-1.5">
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  const checked = selections[i]!.includes(opt);
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <input
+                        id={id}
+                        type="checkbox"
+                        checked={checked}
+                        disabled={disabled}
+                        onChange={() => toggleMulti(i, opt)}
+                        className="mt-1 size-3.5 rounded border-input accent-primary"
+                      />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </div>
+            )}
+            <div className="pt-1 space-y-1">
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Or type a custom answer
+              </div>
+              <input
+                type="text"
+                value={freeTexts[i]}
+                disabled={disabled}
+                placeholder="Free text…"
+                onChange={(e) =>
+                  setFreeTexts((prev) => prev.map((t, idx) => (idx === i ? e.target.value : t)))
+                }
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            </div>
+          </div>
+        ))}
+      </div>
+      {(questions.length > 1 || freeTexts.some((t) => t.trim())) && (
+        <div className="flex justify-between items-center border-t px-4 py-2">
+          <button
+            type="button"
+            disabled={disabled}
+            onClick={() => onRespond(null)}
+            className="text-xs text-destructive hover:underline disabled:opacity-40"
+          >
+            Dismiss
+          </button>
+          <Button
+            type="button"
+            size="sm"
+            disabled={!allComplete || disabled}
+            onClick={handleSubmit}
+          >
+            {submitting ? 'Submitting…' : 'Submit'}
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+// ---------------------------------------------------------------------------
+// ElicitationView — renders ACP elicitation forms (JSON Schema-driven)
+// ---------------------------------------------------------------------------
+
+function ElicitationView({
+  elicitation,
+  prompt,
+  onRespond,
+  busy,
+}: {
+  elicitation: { message: string; fields: ElicitationField[] };
+  prompt: PermissionPrompt;
+  onRespond: Props['onRespond'];
+  busy?: boolean;
+}) {
+  const [values, setValues] = useState<Record<string, string>>(() => {
+    const init: Record<string, string> = {};
+    for (const f of elicitation.fields) init[f.key] = '';
+    return init;
+  });
+  const [submitting, setSubmitting] = useState(false);
+  const disabled = busy || submitting;
+
+  const allFilled = elicitation.fields.every((f) => (values[f.key] ?? '').trim().length > 0);
+
+  function handleSubmit() {
+    if (!allFilled || submitting) return;
+    setSubmitting(true);
+    const content: Record<string, unknown> = {};
+    for (const f of elicitation.fields) {
+      const raw = values[f.key]!.trim();
+      if (f.type === 'number' || f.type === 'integer') {
+        content[f.key] = Number(raw);
+      } else if (f.type === 'boolean') {
+        content[f.key] = raw === 'true' || raw === 'yes' || raw === '1';
+      } else {
+        content[f.key] = raw;
+      }
+    }
+    const firstAllow = prompt.options[0];
+    onRespond(firstAllow?.optionId ?? null, content);
+  }
+
+  return (
+    <div className="mx-3 my-2 rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-3">
+        <div className="flex items-start gap-2">
+          <MessageCircleQuestion className="size-4 text-blue-500 shrink-0 mt-0.5" />
+          <p className="font-medium leading-snug">{elicitation.message}</p>
+        </div>
+        {elicitation.fields.map((f) => (
+          <div key={f.key} className="space-y-1">
+            <label className="text-xs font-medium text-muted-foreground">{f.title}</label>
+            {f.description && (
+              <p className="text-[11px] text-muted-foreground/70">{f.description}</p>
+            )}
+            {f.enumValues ? (
+              <RadioGroup
+                value={values[f.key] ?? ''}
+                onValueChange={(v) => setValues((prev) => ({ ...prev, [f.key]: v }))}
+                disabled={disabled}
+                className="gap-1.5"
+              >
+                {f.enumValues.map((opt, j) => {
+                  const id = `e-${f.key}-${j}`;
+                  return (
+                    <label key={j} htmlFor={id} className="flex items-start gap-2 text-sm cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40">
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            ) : (
+              <input
+                type={f.type === 'number' || f.type === 'integer' ? 'number' : 'text'}
+                value={values[f.key] ?? ''}
+                disabled={disabled}
+                onChange={(e) => setValues((prev) => ({ ...prev, [f.key]: e.target.value }))}
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            )}
+          </div>
+        ))}
+      </div>
+      <div className="flex justify-between items-center border-t px-4 py-2">
+        <button
+          type="button"
+          disabled={disabled}
+          onClick={() => onRespond(null)}
+          className="text-xs text-destructive hover:underline disabled:opacity-40"
+        >
+          Dismiss
+        </button>
+        <Button
+          type="button"
+          size="sm"
+          disabled={!allFilled || disabled}
+          onClick={handleSubmit}
+        >
+          {submitting ? 'Submitting…' : 'Submit'}
+        </Button>
+      </div>
+    </div>
+  );
+}

apps/web/src/components/SessionLandingPage.tsx

@@ -1,8 +1,10 @@
-import { useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { Archive, MessageSquare, Send, ChevronDown, ChevronRight, RotateCcw, Trash2 } from 'lucide-react';
+import { toast } from 'sonner';
 import type { Chat } from '@/api/types';
+import { api } from '@/api/client';
 import { Button } from '@/components/ui/button';
-import { Textarea } from '@/components/ui/textarea';
+import { ChatInput } from '@/components/ChatInput';
 import {
   ContextMenu,
   ContextMenuContent,
@@ -25,6 +27,8 @@ interface Props {
   chats: Chat[];
   onOpenChat: (chatId: string) => void;
   onSend: (content: string) => void;
+  /** Create a chat and return its id. Used by slash-command handler. */
+  createChat: () => Promise<{ id: string }>;
   onReopenChat: (chatId: string) => Promise<void>;
   onArchiveChat: (chatId: string) => Promise<void>;
   onRenameChat: (chatId: string, name: string) => Promise<void>;
@@ -153,12 +157,15 @@ export function SessionLandingPage({
   chats,
   onOpenChat,
   onSend,
+  projectId,
+  createChat,
   onReopenChat,
   onArchiveChat,
   onRenameChat,
   onDeleteChat,
 }: Props) {
   const [composerValue, setComposerValue] = useState('');
+  const [chatId, setChatId] = useState<string | null>(null);
   const [showArchived, setShowArchived] = useState(false);
   const [renamingId, setRenamingId] = useState<string | null>(null);
   const [renameValue, setRenameValue] = useState('');
@@ -172,13 +179,43 @@ export function SessionLandingPage({
     .filter((c) => c.status === 'archived')
     .sort((a, b) => new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime());
 
-  function handleSend() {
+  // Create a chat lazily on first send or slash command.
+  const ensureChat = useCallback(async (): Promise<string> => {
+    if (chatId) return chatId;
+    try {
+      const chat = await createChat();
+      setChatId(chat.id);
+      return chat.id;
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'Failed to create chat');
+      throw err;
+    }
+  }, [chatId, createChat]);
+
+  async function handleSend() {
     const text = composerValue.trim();
     if (!text) return;
-    onSend(text);
-    setComposerValue('');
+    try {
+      const cid = await ensureChat();
+      onSend(text);
+      setComposerValue('');
+    } catch {
+      // Error already surfaced via toast.
+    }
   }
 
+  // v2.3: slash-command dispatch on landing page. Creates a chat first if
+  // one doesn't exist, then invokes the skill on that chat.
+  const handleSlashCommand = useCallback(async (skillName: string, userMessage: string) => {
+    try {
+      const cid = await ensureChat();
+      await api.chats.skillInvoke(cid, skillName, userMessage.length > 0 ? userMessage : null);
+      setComposerValue('');
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : `/${skillName} failed`);
+    }
+  }, [ensureChat]);
+
   function startRename(chat: Chat) {
     setRenamingId(chat.id);
     setRenameValue(chat.name ?? '');
@@ -293,33 +330,17 @@ export function SessionLandingPage({
         )}
       </div>
 
-      <div className="border-t px-4 py-3 flex items-end gap-2 shrink-0">
-        <Textarea
-          value={composerValue}
-          onChange={(e) => setComposerValue(e.target.value)}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
-              e.preventDefault();
-              handleSend();
-              return;
-            }
-            if (e.key === 'Enter' && !e.shiftKey) {
-              e.preventDefault();
-              handleSend();
-            }
-          }}
-          placeholder="Start a new chat..."
-          rows={2}
-          className="resize-none min-h-[52px] max-h-[160px]"
+      {/* v2.3: ChatInput with slash-command support replaces the bare Textarea.
+          chatId is created lazily on first send/slash. */}
+      <div className="border-t px-4 py-3 shrink-0">
+        <ChatInput
+          projectId={projectId}
+          onSend={handleSend}
+          onSlashCommand={handleSlashCommand}
+          chatId={chatId ?? undefined}
+          chatLabel={chatId ? undefined : 'Chat'}
+          disabled={false}
         />
-        <Button
-          onClick={handleSend}
-          disabled={!composerValue.trim()}
-          size="icon-lg"
-          aria-label="Send"
-        >
-          <Send />
-        </Button>
       </div>
 
       <Dialog open={archiveConfirm !== null} onOpenChange={(open) => { if (!open) setArchiveConfirm(null); }}>

apps/web/src/components/Workspace.tsx

@@ -1,5 +1,6 @@
 import { useEffect, useMemo, useState } from 'react';
 import { MessageSquare, Terminal, Code, Clipboard, Plus, X } from 'lucide-react';
+import { api } from '@/api/client';
 import type { Chat, Project, Session, WorkspacePane } from '@/api/types';
 import { MAX_PANES, activePaneChatId, type UseWorkspacePanesResult } from '@/hooks/useWorkspacePanes';
 import type { UseSessionChatsResult } from '@/hooks/useSessionChats';
@@ -386,6 +387,7 @@ export function Workspace({
                   sessionId={sessionId}
                   projectId={projectId}
                   chats={chats}
+                  createChat={() => api.chats.create(sessionId)}
                   onOpenChat={(chatId) => openChatInPane(idx, chatId)}
                   onSend={(content) => void handleLandingSend(idx, content)}
                   onReopenChat={async (chatId) => {

apps/web/src/components/panes/CoderMessageList.tsx

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useRef, type ReactNode } from 'react';
 import { MarkdownRenderer } from '@/components/MarkdownRenderer';
 import { ToolCallGroup } from '@/components/ToolCallGroup';
 import { ToolCallLine, type ToolRun } from '@/components/ToolCallLine';
+import { AskUserInputCard } from '@/components/AskUserInputCard';
 import { wireToolCallToRun, type CoderToolCallWire } from '@/lib/coder-tools';
 
 export interface CoderMessageWire {
@@ -116,6 +117,11 @@ function groupToolRuns(items: RenderItem[]): RenderItem[] {
       continue;
     }
     const name = item.run.call.name;
+    if (name === 'ask_user_input') {
+      out.push(item);
+      i += 1;
+      continue;
+    }
     let j = i + 1;
     while (
       j < items.length &&
@@ -178,10 +184,11 @@ function CoderTextBubble({ message }: { message: CoderMessageWire }) {
 
 interface Props {
   messages: CoderTimelineWire[];
+  chatId?: string;
   footer?: ReactNode;
 }
 
-export function CoderMessageList({ messages, footer }: Props) {
+export function CoderMessageList({ messages, chatId, footer }: Props) {
   const endRef = useRef<HTMLDivElement>(null);
   const scrollRef = useRef<HTMLDivElement>(null);
   const isNearBottomRef = useRef(true);
@@ -216,6 +223,17 @@ export function CoderMessageList({ messages, footer }: Props) {
             return <CoderTextBubble key={item.message.id} message={item.message} />;
           }
           if (item.kind === 'tool_run') {
+            if (item.run.call.name === 'ask_user_input' && chatId) {
+              return (
+                <AskUserInputCard
+                  key={item.key}
+                  toolCall={item.run.call}
+                  toolResult={item.run.result}
+                  chatId={chatId}
+                  apiPrefix="/api/coder"
+                />
+              );
+            }
             return <ToolCallLine key={item.key} run={item.run} />;
           }
           return <ToolCallGroup key={item.key} runs={item.runs} />;

apps/web/src/components/panes/CoderPane.tsx

@@ -290,7 +290,9 @@ function useCoderMessages(sessionId: string, chatId: string | undefined, handler
         } else if (frame.type === 'permission_requested') {
           handlersRef.current.onPermissionRequested?.({
             taskId: frame.task_id,
+            kind: frame.kind,
             toolTitle: frame.tool_title,
+            ...(frame.input ? { input: frame.input as Record<string, unknown> } : {}),
             options: (frame.options ?? []).map((o: { option_id: string; label: string }) => ({
               optionId: o.option_id,
               label: o.label,
@@ -565,11 +567,11 @@ export function CoderPane({
     setProviderCommands(commands);
   }, []);
 
-  const handlePermissionRespond = useCallback(async (optionId: string | null) => {
+  const handlePermissionRespond = useCallback(async (optionId: string | null, updatedInput?: Record<string, unknown>) => {
     if (!permissionPrompt) return;
     setPermissionBusy(true);
     try {
-      await api.coder.respondTaskPermission(permissionPrompt.taskId, optionId);
+      await api.coder.respondTaskPermission(permissionPrompt.taskId, optionId, updatedInput);
       setPermissionPrompt(null);
     } finally {
       setPermissionBusy(false);
@@ -703,6 +705,7 @@ export function CoderPane({
         ) : (
           <CoderMessageList
             messages={messages as CoderTimelineWire[]}
+            chatId={chatId}
             footer={
               activeTaskId && !permissionPrompt && sending === false ? (
                 <p className="text-xs text-muted-foreground animate-pulse">Agent running…</p>
@@ -715,7 +718,7 @@ export function CoderPane({
       {permissionPrompt && (
         <PermissionCard
           prompt={permissionPrompt}
-          onRespond={(id) => void handlePermissionRespond(id)}
+          onRespond={(id, input) => void handlePermissionRespond(id, input)}
           busy={permissionBusy}
         />
       )}

apps/web/src/components/ui/textarea.tsx

@@ -2,9 +2,10 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
-function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
-  return (
+const Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<"textarea">>(
+  ({ className, ...props }, ref) => (
     <textarea
+      ref={ref}
       data-slot="textarea"
       className={cn(
         "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
@@ -13,6 +14,7 @@ function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
       {...props}
     />
   )
-}
+)
+Textarea.displayName = "Textarea"
 
 export { Textarea }

apps/web/src/pages/Session.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import {
   Link,
   useLocation,
@@ -75,6 +75,19 @@ function SessionInner({ sessionId }: { sessionId: string }) {
   });
   const { chats, renameChat } = chatsHook;
 
+  // v2.3: fix hydrate race — if workspace hydrate clobbers the chat-pane
+  // promotion (panes[0] is still 'empty' while an open chat exists),
+  // re-promote immediately. Guarded by a ref to avoid infinite loops.
+  const promotedRef = useRef(false);
+  useEffect(() => {
+    if (panes.length !== 1 || panes[0]?.kind !== 'empty') return;
+    const openChat = chats.find((c) => c.status === 'open');
+    if (!openChat) return;
+    if (promotedRef.current) return;
+    promotedRef.current = true;
+    initializeFirstChatIfEmpty(openChat.id);
+  }, [panes, chats, initializeFirstChatIfEmpty]);
+
   // v1.8 Level 1: branch indicator. Polls every 30s; server caches the same
   // span so back-to-back loads are cheap. Returns null until the first fetch
   // resolves or if the project isn't a git repo.

data/AGENTS.md

@@ -2,7 +2,11 @@
 
 ## Code Reviewer
 ---
-temperature: 0.3
+temperature: 0.6
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 0.0
 tools: [find_files, get_codebase_overview, get_dependencies, get_file_analysis, get_framework_analysis, get_semantic_neighborhoods, get_symbol_info, grep, list_dir, search_symbols, view_file, watch_changes]
 description: Reviews code for bugs, security issues, and maintainability. Read-only.
 ---
@@ -37,7 +41,11 @@ Codecontext usage:
 
 ## Debugger
 ---
-temperature: 0.4
+temperature: 0.6
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 0.0
 tools: [find_files, get_codebase_overview, get_dependencies, get_file_analysis, get_framework_analysis, get_semantic_neighborhoods, get_symbol_info, grep, list_dir, search_symbols, view_file, watch_changes]
 description: Diagnoses bugs from error messages, logs, or described symptoms.
 ---
@@ -58,7 +66,11 @@ Rules:
 
 ## Refactorer
 ---
-temperature: 0.3
+temperature: 0.6
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 0.0
 steps: 5
 tools: [find_files, get_codebase_overview, get_dependencies, get_file_analysis, get_framework_analysis, get_semantic_neighborhoods, get_symbol_info, grep, list_dir, search_symbols, view_file, watch_changes]
 description: Proposes refactors for clarity, deduplication, or decoupling. Read-only — outputs plans, not edits.
@@ -97,7 +109,11 @@ Codecontext usage:
 
 ## Architect
 ---
-temperature: 0.5
+temperature: 1.0
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 1.5
 steps: 20
 tools: [find_files, get_codebase_overview, get_dependencies, get_file_analysis, get_framework_analysis, get_semantic_neighborhoods, get_symbol_info, grep, list_dir, search_symbols, view_file, watch_changes]
 description: Designs new features, modules, or architectural changes. Outputs a build plan.
@@ -136,7 +152,11 @@ Codecontext usage:
 
 ## Security Auditor
 ---
-temperature: 0.2
+temperature: 0.6
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 0.0
 tools: [find_files, get_codebase_overview, get_dependencies, get_file_analysis, get_framework_analysis, get_semantic_neighborhoods, get_symbol_info, grep, list_dir, search_symbols, view_file, watch_changes]
 description: Audits code for security vulnerabilities. Read-only.
 ---
@@ -177,7 +197,11 @@ Codecontext usage:
 
 ## Prompt Builder
 ---
-temperature: 0.4
+temperature: 0.6
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 0.0
 tools: [view_file, list_dir, grep, find_files]
 description: Builds prompts for OpenCode, Claude Code, or BooCode dispatch.
 ---
@@ -208,3 +232,29 @@ Rules:
 - For BooLab frontend prompts, always include the "verify shadcn primitives exist" preflight
 
 Output: the prompt, ready to paste. Nothing else.
+
+## Recon
+---
+temperature: 0.6
+top_p: 0.95
+top_k: 20
+min_p: 0.0
+presence_penalty: 0.0
+tools: [find_files, get_codebase_overview, get_dependencies, get_file_analysis, get_framework_analysis, get_semantic_neighborhoods, get_symbol_info, grep, list_dir, search_symbols, view_file, watch_changes]
+description: Discovers and maps unfamiliar codebases. Reads architecture, traces data flow, identifies key symbols.
+---
+You map codebases. Start broad, then drill into specifics.
+
+Process:
+1. get_codebase_overview for the big picture — file count, languages, top-level structure.
+2. list_dir the top-level directories to understand the layout.
+3. get_semantic_neighborhoods and get_hot_files to find core modules and high-impact files.
+4. Trace data flow: entry points → handlers → services → data stores.
+5. Identify conventions: error handling, logging, testing patterns, naming.
+
+Output:
+- Architecture overview (one paragraph)
+- Key files and their roles
+- Data flow map (entry → transform → output)
+- Conventions observed
+- Areas that need deeper investigation

docker-compose.yml

@@ -105,6 +105,8 @@ services:
     build:
       context: ./codecontext
     container_name: boocode_codecontext
+    ports:
+      - "127.0.0.1:8080:8080"
     restart: unless-stopped
     networks:
       - boocode_net