@assistant-ui/mcp-docs-server 0.1.26 → 0.1.28

package/.docs/raw/docs/(docs)/guides/tool-ui.mdx

@@ -748,6 +748,35 @@ useAssistantToolUI({
   server.
 </Callout>
 
+## Per-Property Streaming Status
+
+When rendering a tool UI, you can track which arguments have finished streaming using `useToolArgsStatus`. This must be used inside a tool-call message part context.
+
+```tsx
+import { useToolArgsStatus } from "@assistant-ui/react";
+
+const WeatherUI = makeAssistantToolUI({
+  toolName: "weather",
+  render: ({ args }) => {
+    const { status, propStatus } = useToolArgsStatus<{
+      location: string;
+      unit: string;
+    }>();
+
+    return (
+      <div>
+        <span className={propStatus.location === "streaming" ? "animate-pulse" : ""}>
+          {args.location ?? "..."}
+        </span>
+        {status === "complete" && <WeatherChart data={args} />}
+      </div>
+    );
+  },
+});
+```
+
+`propStatus` maps each key to `"streaming"` | `"complete"` once the key appears in the partial JSON. Keys not yet present in the stream are absent from `propStatus`.
+
 ## Related Guides
 
 - [Tools Guide](/docs/guides/tools) - Learn how to create and use tools with AI models

package/.docs/raw/docs/(docs)/guides/voice.mdx

@@ -0,0 +1,333 @@
+---
+title: Realtime Voice
+description: Bidirectional realtime voice conversations with AI agents.
+---
+
+import { VoiceSample } from "@/components/docs/samples/voice";
+
+assistant-ui supports realtime bidirectional voice via the `RealtimeVoiceAdapter` interface. This enables live voice conversations where the user speaks into their microphone and the AI agent responds with audio, with transcripts appearing in the thread in real time.
+
+<VoiceSample />
+
+## How It Works
+
+Unlike [Speech Synthesis](/docs/guides/speech) (text-to-speech) and [Dictation](/docs/guides/dictation) (speech-to-text), the voice adapter handles **both directions simultaneously** — the user's microphone audio is streamed to the agent, and the agent's audio response is played back, all while transcripts are appended to the message thread.
+
+| Feature | Adapter | Direction |
+|---------|---------|-----------|
+| [Speech Synthesis](/docs/guides/speech) | `SpeechSynthesisAdapter` | Text → Audio (one message at a time) |
+| [Dictation](/docs/guides/dictation) | `DictationAdapter` | Audio → Text (into composer) |
+| **Realtime Voice** | `RealtimeVoiceAdapter` | Audio ↔ Audio (bidirectional, live) |
+
+## Configuration
+
+Pass a `RealtimeVoiceAdapter` implementation to the runtime via `adapters.voice`:
+
+```tsx
+const runtime = useChatRuntime({
+  adapters: {
+    voice: new MyVoiceAdapter({ /* ... */ }),
+  },
+});
+```
+
+When a voice adapter is provided, `capabilities.voice` is automatically set to `true`.
+
+## Hooks
+
+### useVoiceState
+
+Returns the current voice session state, or `undefined` when no session is active.
+
+```tsx
+import { useVoiceState, useVoiceVolume } from "@assistant-ui/react";
+
+const voiceState = useVoiceState();
+// voiceState?.status.type — "starting" | "running" | "ended"
+// voiceState?.isMuted — boolean
+// voiceState?.mode — "listening" | "speaking"
+
+const volume = useVoiceVolume();
+// volume — number (0–1, real-time audio level via separate subscription)
+```
+
+### useVoiceControls
+
+Returns methods to control the voice session.
+
+```tsx
+import { useVoiceControls } from "@assistant-ui/react";
+
+const { connect, disconnect, mute, unmute } = useVoiceControls();
+```
+
+## UI Example
+
+```tsx
+import { useVoiceState, useVoiceControls } from "@assistant-ui/react";
+import { PhoneIcon, PhoneOffIcon, MicIcon, MicOffIcon } from "lucide-react";
+
+function VoiceControls() {
+  const voiceState = useVoiceState();
+  const { connect, disconnect, mute, unmute } = useVoiceControls();
+
+  const isRunning = voiceState?.status.type === "running";
+  const isStarting = voiceState?.status.type === "starting";
+  const isMuted = voiceState?.isMuted ?? false;
+
+  if (!isRunning && !isStarting) {
+    return (
+      <button onClick={() => connect()}>
+        <PhoneIcon /> Connect
+      </button>
+    );
+  }
+
+  return (
+    <>
+      <button onClick={() => (isMuted ? unmute() : mute())} disabled={!isRunning}>
+        {isMuted ? <MicOffIcon /> : <MicIcon />}
+        {isMuted ? "Unmute" : "Mute"}
+      </button>
+      <button onClick={() => disconnect()}>
+        <PhoneOffIcon /> Disconnect
+      </button>
+    </>
+  );
+}
+```
+
+## Custom Adapters
+
+Implement the `RealtimeVoiceAdapter` interface to integrate with any voice provider.
+
+### RealtimeVoiceAdapter Interface
+
+```tsx
+import type { RealtimeVoiceAdapter } from "@assistant-ui/react";
+
+class MyVoiceAdapter implements RealtimeVoiceAdapter {
+  connect(options: {
+    abortSignal?: AbortSignal;
+  }): RealtimeVoiceAdapter.Session {
+    // Establish connection to your voice service
+    return {
+      get status() { /* ... */ },
+      get isMuted() { /* ... */ },
+
+      disconnect: () => { /* ... */ },
+      mute: () => { /* ... */ },
+      unmute: () => { /* ... */ },
+
+      onStatusChange: (callback) => {
+        // Status: { type: "starting" } → { type: "running" } → { type: "ended", reason }
+        return () => {}; // Return unsubscribe
+      },
+
+      onTranscript: (callback) => {
+        // callback({ role: "user" | "assistant", text: "...", isFinal: true })
+        // Transcripts are automatically appended as messages in the thread.
+        return () => {};
+      },
+
+      // Report who is speaking (drives the VoiceOrb speaking animation)
+      onModeChange: (callback) => {
+        // callback("listening") — user's turn
+        // callback("speaking") — agent's turn
+        return () => {};
+      },
+
+      // Report real-time audio level (0–1) for visual feedback
+      onVolumeChange: (callback) => {
+        // callback(0.72) — drives VoiceOrb amplitude and waveform bar heights
+        return () => {};
+      },
+    };
+  }
+}
+```
+
+### Session Lifecycle
+
+The session status follows the same pattern as other adapters:
+
+```
+starting → running → ended
+```
+
+The `ended` status includes a `reason`:
+- `"finished"` — session ended normally
+- `"cancelled"` — session was cancelled by the user
+- `"error"` — session ended due to an error (includes `error` field)
+
+### Mode and Volume
+
+All adapters must implement `onModeChange` and `onVolumeChange`. If your provider doesn't support these, return a no-op unsubscribe:
+
+- **`onModeChange`** — Reports `"listening"` (user's turn) or `"speaking"` (agent's turn). The `VoiceOrb` switches to the active speaking animation.
+- **`onVolumeChange`** — Reports a real-time audio level (`0`–`1`). The `VoiceOrb` modulates its amplitude and glow, and waveform bars scale to match.
+
+When using `createVoiceSession`, these are handled automatically — call `session.emitMode()` and `session.emitVolume()` when your provider delivers data.
+
+### Transcript Handling
+
+Transcripts emitted via `onTranscript` are automatically appended to the message thread:
+
+- **User transcripts** (`role: "user"`, `isFinal: true`) are appended as user messages.
+- **Assistant transcripts** (`role: "assistant"`) are streamed into an assistant message. The message shows a "running" status until `isFinal: true` is received.
+
+## Example: ElevenLabs Conversational AI
+
+[ElevenLabs Conversational AI](https://elevenlabs.io/docs/agents-platform/overview) provides realtime voice agents via WebRTC.
+
+### Install Dependencies
+
+```bash
+npm install @elevenlabs/client
+```
+
+### Adapter
+
+```tsx title="lib/elevenlabs-voice-adapter.ts"
+import type { RealtimeVoiceAdapter, Unsubscribe } from "@assistant-ui/react";
+import { VoiceConversation } from "@elevenlabs/client";
+
+export class ElevenLabsVoiceAdapter implements RealtimeVoiceAdapter {
+  private _agentId: string;
+
+  constructor(options: { agentId: string }) {
+    this._agentId = options.agentId;
+  }
+
+  connect(options: {
+    abortSignal?: AbortSignal;
+  }): RealtimeVoiceAdapter.Session {
+    const statusCallbacks = new Set<(s: RealtimeVoiceAdapter.Status) => void>();
+    const transcriptCallbacks = new Set<(t: RealtimeVoiceAdapter.TranscriptItem) => void>();
+    const modeCallbacks = new Set<(m: RealtimeVoiceAdapter.Mode) => void>();
+    const volumeCallbacks = new Set<(v: number) => void>();
+
+    let currentStatus: RealtimeVoiceAdapter.Status = { type: "starting" };
+    let isMuted = false;
+    let conversation: VoiceConversation | null = null;
+    let disposed = false;
+
+    const updateStatus = (status: RealtimeVoiceAdapter.Status) => {
+      if (disposed) return;
+      currentStatus = status;
+      for (const cb of statusCallbacks) cb(status);
+    };
+
+    const cleanup = () => {
+      disposed = true;
+      conversation = null;
+      statusCallbacks.clear();
+      transcriptCallbacks.clear();
+      modeCallbacks.clear();
+      volumeCallbacks.clear();
+    };
+
+    const session: RealtimeVoiceAdapter.Session = {
+      get status() { return currentStatus; },
+      get isMuted() { return isMuted; },
+      disconnect: () => { conversation?.endSession(); cleanup(); },
+      mute: () => { conversation?.setMicMuted(true); isMuted = true; },
+      unmute: () => { conversation?.setMicMuted(false); isMuted = false; },
+      onStatusChange: (cb): Unsubscribe => {
+        statusCallbacks.add(cb);
+        return () => statusCallbacks.delete(cb);
+      },
+      onTranscript: (cb): Unsubscribe => {
+        transcriptCallbacks.add(cb);
+        return () => transcriptCallbacks.delete(cb);
+      },
+      onModeChange: (cb): Unsubscribe => {
+        modeCallbacks.add(cb);
+        return () => modeCallbacks.delete(cb);
+      },
+      onVolumeChange: (cb): Unsubscribe => {
+        volumeCallbacks.add(cb);
+        return () => volumeCallbacks.delete(cb);
+      },
+    };
+
+    if (options.abortSignal) {
+      options.abortSignal.addEventListener("abort", () => {
+        conversation?.endSession(); cleanup();
+      }, { once: true });
+    }
+
+    const doConnect = async () => {
+      if (disposed) return;
+      try {
+        conversation = await VoiceConversation.startSession({
+          agentId: this._agentId,
+          onConnect: () => updateStatus({ type: "running" }),
+          onDisconnect: () => { updateStatus({ type: "ended", reason: "finished" }); cleanup(); },
+          onError: (msg) => { updateStatus({ type: "ended", reason: "error", error: new Error(msg) }); cleanup(); },
+          onModeChange: ({ mode }) => {
+            if (disposed) return;
+            for (const cb of modeCallbacks) cb(mode === "speaking" ? "speaking" : "listening");
+          },
+          onMessage: (msg) => {
+            if (disposed) return;
+            for (const cb of transcriptCallbacks) {
+              cb({ role: msg.role === "user" ? "user" : "assistant", text: msg.message, isFinal: true });
+            }
+          },
+        });
+      } catch (error) {
+        updateStatus({ type: "ended", reason: "error", error }); cleanup();
+      }
+    };
+
+    doConnect();
+    return session;
+  }
+}
+```
+
+### Usage
+
+```tsx
+import { ElevenLabsVoiceAdapter } from "@/lib/elevenlabs-voice-adapter";
+
+const runtime = useChatRuntime({
+  adapters: {
+    voice: new ElevenLabsVoiceAdapter({
+      agentId: process.env.NEXT_PUBLIC_ELEVENLABS_AGENT_ID!,
+    }),
+  },
+});
+```
+
+## Example: LiveKit
+
+[LiveKit](https://livekit.io/) provides realtime voice via WebRTC rooms with transcription support.
+
+### Install Dependencies
+
+```bash
+npm install livekit-client
+```
+
+### Usage
+
+```tsx
+import { LiveKitVoiceAdapter } from "@/lib/livekit-voice-adapter";
+
+const runtime = useChatRuntime({
+  adapters: {
+    voice: new LiveKitVoiceAdapter({
+      url: process.env.NEXT_PUBLIC_LIVEKIT_URL!,
+      token: async () => {
+        const res = await fetch("/api/livekit-token", { method: "POST" });
+        const { token } = await res.json();
+        return token;
+      },
+    }),
+  },
+});
+```
+
+See the `examples/with-livekit` directory in the repository for a complete implementation including the adapter and token endpoint.

package/.docs/raw/docs/(reference)/api-reference/primitives/message-part.mdx

@@ -37,6 +37,29 @@ Custom data events that can be rendered as UI at their position in the message s
 
 You can use either the explicit format `{ type: "data", name: "workflow", data: {...} }` or the shorthand `data-*` prefixed format `{ type: "data-workflow", data: {...} }`. The prefixed format is automatically converted to a `DataMessagePart` (stripping the `data-` prefix as the `name`). Unknown message part types that don't match any built-in type are silently skipped with a console warning.
 
+#### Streaming Data Parts
+
+Data parts can be sent from the server using `appendData()` on the stream controller:
+
+```ts
+controller.appendData({
+  type: "data",
+  name: "chart",
+  data: { labels: ["Q1", "Q2"], values: [10, 20] },
+});
+```
+
+Register a renderer with `makeAssistantDataUI` to display data parts:
+
+```tsx
+import { makeAssistantDataUI } from "@assistant-ui/react";
+
+const ChartUI = makeAssistantDataUI({
+  name: "chart",
+  render: ({ data }) => <MyChart data={data} />,
+});
+```
+
 ## Anatomy
 
 ```tsx

package/.docs/raw/docs/primitives/composer.mdx

@@ -102,19 +102,42 @@ import { ComposerPrimitive } from "@assistant-ui/react";
 
 The primitive's behavior (keyboard handling, disabled state, form submission) is merged onto your element. Your styles, your component, primitive wiring.
 
-### Unstable Mentions
+### Unstable Trigger Popovers
 
-Composer also includes an unstable mention system for `@`-triggered popovers. It is built around `ComposerPrimitive.Unstable_MentionRoot` and intended for rich inputs like `LexicalComposerInput`.
+Composer includes an unstable **trigger popover** system for character-triggered popovers (e.g. `@` for mentions, `/` for slash commands). Multiple triggers can coexist on the same input.
+
+**Mentions** (`@` trigger) — insert directive text into the message:
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionRoot>
+<ComposerPrimitive.Unstable_MentionRoot adapter={mentionAdapter}>
   <ComposerPrimitive.Root>
-    <LexicalComposerInput placeholder="Type @ to mention a tool..." />
+    <ComposerPrimitive.Input placeholder="Type @ to mention..." />
     <ComposerPrimitive.Unstable_MentionPopover />
   </ComposerPrimitive.Root>
 </ComposerPrimitive.Unstable_MentionRoot>
 ```
 
+**Slash commands** (`/` trigger) — execute an action and clear the command text:
+
+```tsx
+<ComposerPrimitive.Unstable_SlashCommandRoot adapter={slashAdapter}>
+  <ComposerPrimitive.Root>
+    <ComposerPrimitive.Input placeholder="Type / for commands..." />
+    <ComposerPrimitive.Unstable_TriggerPopoverPopover>
+      <ComposerPrimitive.Unstable_TriggerPopoverItems>
+        {(items) => items.map(item => (
+          <ComposerPrimitive.Unstable_TriggerPopoverItem key={item.id} item={item}>
+            {item.label}
+          </ComposerPrimitive.Unstable_TriggerPopoverItem>
+        ))}
+      </ComposerPrimitive.Unstable_TriggerPopoverItems>
+    </ComposerPrimitive.Unstable_TriggerPopoverPopover>
+  </ComposerPrimitive.Root>
+</ComposerPrimitive.Unstable_SlashCommandRoot>
+```
+
+See the [Mentions guide](/docs/guides/mentions) and [Slash Commands guide](/docs/guides/slash-commands) for full documentation.
+
 ## Parts
 
 ### Root

package/.docs/raw/docs/runtimes/a2a/index.mdx

@@ -97,6 +97,7 @@ const runtime = useA2ARuntime({ client });
 | Option | Type | Description |
 | --- | --- | --- |
 | `baseUrl` | `string` | Base URL of the A2A server |
+| `basePath` | `string` | Optional path prefix for API endpoints (e.g. `"/v1"`). Does not affect agent card discovery |
 | `headers` | `Record<string, string>` or `() => Record<string, string>` | Static or dynamic headers (e.g. for auth tokens) |
 | `tenant` | `string` | Tenant ID for multi-tenant servers (prepended to URL paths) |
 | `extensions` | `string[]` | Extension URIs to negotiate via `A2A-Extensions` header |
@@ -124,7 +125,10 @@ const runtime = useA2ARuntime({ client });
 | --- | --- | --- |
 | `client` | `A2AClient` | Pre-built A2A client instance (provide this OR `baseUrl`) |
 | `baseUrl` | `string` | A2A server URL (creates a client automatically) |
+| `basePath` | `string` | Path prefix for API endpoints (e.g. `"/v1"`). Only used with `baseUrl` |
+| `tenant` | `string` | Tenant ID for multi-tenant servers. Only used with `baseUrl` |
 | `headers` | see above | Headers for the auto-created client |
+| `extensions` | `string[]` | Extension URIs to negotiate. Only used with `baseUrl` |
 | `contextId` | `string` | Initial context ID for the conversation |
 | `configuration` | `A2ASendMessageConfiguration` | Default send message configuration |
 | `onError` | `(error: Error) => void` | Error callback |

package/.docs/raw/docs/runtimes/ai-sdk/v6.mdx

@@ -111,9 +111,9 @@ Use `messageMetadata` in your Next.js route to attach `usage` from `finish` and
 import { streamText, convertToModelMessages } from "ai";
 import { frontendTools } from "@assistant-ui/react-ai-sdk";
 export async function POST(req: Request) {
-  const { messages, tools, modelName } = await req.json();
+  const { messages, tools, config } = await req.json();
   const result = streamText({
-    model: getModel(modelName),
+    model: getModel(config?.modelName),
     messages: await convertToModelMessages(messages),
     tools: frontendTools(tools),
   });

package/.docs/raw/docs/runtimes/assistant-transport.mdx

@@ -72,11 +72,15 @@ The backend endpoint receives POST requests with the following payload:
   tools?: Record<string, ToolJSONSchema>, // Tool definitions keyed by tool name
   threadId: string | null, // The current thread/conversation identifier (null for new threads)
   parentId?: string | null, // The parent message ID (included when editing or branching)
-  // ...callSettings (maxTokens, temperature, topP, presencePenalty, frequencyPenalty, seed)
-  // ...config (apiKey, baseUrl, modelName)
+  callSettings?: { maxTokens, temperature, topP, presencePenalty, frequencyPenalty, seed },
+  config?: { apiKey, baseUrl, modelName },
 }
 ```
 
+<Callout type="warn">
+  **Migrating from top-level fields:** `callSettings` and `config` fields were previously spread at the top level of the request body (e.g. `body.modelName` instead of `body.config.modelName`). Both formats are currently sent for backward compatibility, but the top-level fields are deprecated and will be removed in a future version. Update your backend to read from the nested objects.
+</Callout>
+
 The backend endpoint returns a stream of state snapshots using the `assistant-stream` library ([npm](https://www.npmjs.com/package/assistant-stream) / [PyPI](https://pypi.org/project/assistant-stream/)).
 
 ### Handling Commands

package/.docs/raw/docs/ui/context-display.mdx

@@ -33,9 +33,9 @@ Use `messageMetadata` in your Next.js route to attach `usage` from `finish` and
 import { streamText, convertToModelMessages } from "ai";
 
 export async function POST(req: Request) {
-  const { messages, modelName } = await req.json();
+  const { messages, config } = await req.json();
   const result = streamText({
-    model: getModel(modelName),
+    model: getModel(config?.modelName),
     messages: await convertToModelMessages(messages),
   });
   return result.toUIMessageStreamResponse({

package/.docs/raw/docs/ui/model-selector.mdx

@@ -50,7 +50,7 @@ const ComposerAction: FC = () => {
 
 ### Read the model in your API route
 
-The selected model name is sent as `config.modelName` in the request body:
+The selected model's `id` is sent as `config.modelName` in the request body:
 
 ```tsx title="app/api/chat/route.ts" {2,5}
 export async function POST(req: Request) {

package/.docs/raw/docs/ui/voice.mdx

@@ -0,0 +1,172 @@
+---
+title: Voice
+description: Realtime voice session controls with connect, mute, and status indicator.
+---
+
+import { VoiceSample, VoiceVariantsSample, VoiceStatesSample } from "@/components/docs/samples/voice";
+
+A control bar for realtime bidirectional voice sessions with an animated orb indicator. Works with any `RealtimeVoiceAdapter` (LiveKit, ElevenLabs, etc.).
+
+<VoiceSample />
+
+## Getting Started
+
+<Steps>
+  <Step>
+
+### Add the component
+
+<InstallCommand shadcn={["voice"]} />
+
+This adds `/components/assistant-ui/voice.tsx` to your project, which you can adjust as needed.
+
+  </Step>
+  <Step>
+
+### Configure a voice adapter
+
+Pass a `RealtimeVoiceAdapter` to your runtime. See the [Realtime Voice guide](/docs/guides/voice) for details.
+
+```tsx
+const runtime = useChatRuntime({
+  adapters: {
+    voice: myVoiceAdapter,
+  },
+});
+```
+
+  </Step>
+  <Step>
+
+### Use in your application
+
+```tsx title="app/page.tsx"
+import { Thread } from "@/components/assistant-ui/thread";
+import { VoiceControl } from "@/components/assistant-ui/voice";
+import { AuiIf } from "@assistant-ui/react";
+
+export default function Chat() {
+  return (
+    <div className="flex h-full flex-col">
+      <AuiIf condition={(s) => s.thread.capabilities.voice}>
+        <VoiceControl />
+      </AuiIf>
+      <div className="min-h-0 flex-1">
+        <Thread />
+      </div>
+    </div>
+  );
+}
+```
+
+  </Step>
+</Steps>
+
+## Anatomy
+
+The `VoiceControl` component is built with the following hooks and conditionals:
+
+```tsx
+import { AuiIf, useVoiceState, useVoiceControls } from "@assistant-ui/react";
+
+<div className="aui-voice-control">
+  <VoiceIndicator />
+
+  <AuiIf condition={(s) => s.thread.voice == null}>
+    <VoiceConnectButton />
+  </AuiIf>
+
+  <AuiIf condition={(s) => s.thread.voice?.status.type === "running"}>
+    <VoiceMuteButton />
+    <VoiceDisconnectButton />
+  </AuiIf>
+</div>
+```
+
+## Examples
+
+### Conditionally show voice controls
+
+Only render when a voice adapter is configured:
+
+```tsx
+<AuiIf condition={(s) => s.thread.capabilities.voice}>
+  <VoiceControl />
+</AuiIf>
+```
+
+### Voice toggle in composer
+
+Add a compact voice toggle button inside the composer action area:
+
+```tsx
+function ComposerVoiceToggle() {
+  const voiceState = useVoiceState();
+  const { connect, disconnect } = useVoiceControls();
+  const isActive =
+    voiceState?.status.type === "running" ||
+    voiceState?.status.type === "starting";
+
+  return (
+    <AuiIf condition={(s) => s.thread.capabilities.voice}>
+      <button
+        type="button"
+        onClick={() => (isActive ? disconnect() : connect())}
+        aria-label={isActive ? "End voice" : "Start voice"}
+      >
+        {isActive ? <PhoneOffIcon /> : <PhoneIcon />}
+      </button>
+    </AuiIf>
+  );
+}
+```
+
+### Custom indicator colors
+
+Override the indicator styles by targeting the `aui-voice-indicator` class:
+
+```css
+.aui-voice-indicator {
+  /* Override active color */
+  &.bg-green-500 {
+    background: theme("colors.blue.500");
+  }
+}
+```
+
+## States
+
+The `VoiceOrb` responds to five voice session states with distinct animations:
+
+<VoiceStatesSample />
+
+## Variants
+
+Four built-in color palettes. Size is controlled via `className`.
+
+<VoiceVariantsSample />
+
+## Sub-components
+
+| Component | Description |
+|-----------|-------------|
+| `VoiceOrb` | Animated orb visual with gradient, glow, and ripple effects. Accepts `state` and `variant` props. |
+| `VoiceControl` | Control bar with status dot, connect/disconnect, and mute/unmute buttons. |
+| `VoiceConnectButton` | Calls `connect()`. Shown when no session is active. |
+| `VoiceMuteButton` | Toggles `mute()`/`unmute()`. Shown when session is running. |
+| `VoiceDisconnectButton` | Calls `disconnect()`. Shown when session is active. |
+
+All sub-components are exported and can be used independently for custom layouts.
+
+## State Selectors
+
+Use these with `AuiIf` or `useAuiState` to build custom voice UI:
+
+| Selector | Type | Description |
+|----------|------|-------------|
+| `s.thread.capabilities.voice` | `boolean` | Whether a voice adapter is configured |
+| `s.thread.voice` | `VoiceSessionState \| undefined` | `undefined` when no session |
+| `s.thread.voice?.status.type` | `"starting" \| "running" \| "ended"` | Session phase |
+| `s.thread.voice?.isMuted` | `boolean` | Microphone muted state |
+| `s.thread.voice?.mode` | `"listening" \| "speaking"` | Who is currently active (user or agent) |
+| `useVoiceVolume()` | `number` | Real-time audio level (0–1), separate from main state to avoid 20Hz re-renders |