Agentic Chat Natural conversation with frontend tool execution
chat-ui
Tool Rendering Backend agent tools rendered as UI components
agent-capabilities
Agentic Generative UI Long-running agent tasks with generated UI
generative-ui
State Streaming Per-token state delta streaming from agent to UI
agent-state
Shared State (Read + Write) Bidirectional agent state — UI writes preferences, agent writes notes back
agent-state
Sub-Agents Multiple agents with visible task delegation
multi-agent
Pre-Built: Sidebar Docked sidebar chat via <CopilotSidebar />
chat-ui
Pre-Built: Popup Floating popup chat via <CopilotPopup />
chat-ui
Chat Customization (Slots) Customize CopilotChat via its slot system
chat-ui
Chat Customization (CSS) Default CopilotChat re-themed via CopilotKitCSSProperties
chat-ui
Headless Chat (Simple) Minimal custom chat surface built on useAgent
chat-ui
Headless Chat (Complete) Full chat implementation built from scratch on useAgent
chat-ui
Frontend Tools (In-App Actions) Agent invokes client-side handlers registered with useFrontendTool
interactivity
Frontend Tools (Async) useFrontendTool with an async handler — agent awaits a client-side async operation (simulated notes DB query) and uses the returned result
interactivity
In-Chat Human in the Loop User approves agent actions before execution
interactivity
In-App Human in the Loop (Frontend Tools + async HITL) Agent requests approval via useFrontendTool with an async handler; the approval UI pops up as an app-level modal OUTSIDE the chat, and a completion callback resolves the pending tool Promise with the user's decision
interactivity
Readonly State (Agent Context) Frontend provides read-only context to the agent via useAgentContext
agent-state
Tool Rendering (Default Catch-all) Out-of-the-box tool rendering — backend defines the tools; the frontend adds zero custom renderers and relies on CopilotKit's built-in default UI
generative-ui
Tool Rendering (Custom Catch-all) Single branded wildcard renderer via useDefaultRenderTool — the same app-designed card paints every tool call
generative-ui
Fully Open-Ended Generative UI Agent generates UI from an arbitrary component library
generative-ui
Open-Ended Gen UI (Advanced: with frontend function calling) Agent-authored UI that can invoke frontend sandbox functions from inside the iframe
generative-ui
BYOC: json-render Agent emits a JSON spec; `@json-render/react` renders it against a Zod catalog of MetricCard, BarChart, PieChart
generative-ui
BYOC: Hashbrown Streaming structured output via `@hashbrownai/react` — agent emits a catalog-constrained JSON envelope that renders progressively
generative-ui
Multimodal Attachments Image + PDF attachments routed through Claude's native vision + pypdf text flattening
interactivity
Voice Input Audio transcription wired on a per-demo runtime with a guarded OpenAI Whisper service that maps missing keys to 401
chat-ui
Agent Config Object Forwarded props (tone / expertise / responseLength) flow from the provider into the agent's system prompt via `forwardedProps.config.configurable.properties`
agent-capabilities
Agentic Chat (Reasoning) Visible reasoning / thinking chain rendered via a custom messageView slot
chat-ui
Reasoning (Default Render) Reasoning rendered via CopilotKit's built-in collapsible card with zero custom config
chat-ui
Tool Rendering (Reasoning Chain) Sequential tool calls combined with visible reasoning steps
generative-ui
Authentication Framework-native request auth via the V2 runtime's `onRequest` hook; missing bearer token returns 401
agent-capabilities
MCP Apps MCP server-driven UI via activity renderers — the agent calls a tool on a remote MCP server (Excalidraw) and the runtime middleware renders the returned UI resource as a sandboxed iframe inline in the chat
generative-ui
Beautiful Chat Polished brand-themed chat surface over the Claude Agent SDK backend with seeded suggestion pills and a glanceable decorative side panel — pure frontend dressing, no extra runtime config
chat-ui
Tool-Based Generative UI Agent uses tools to trigger UI generation (haiku generator via useFrontendTool + useRenderTool)
generative-ui
In-Chat HITL (useHumanInTheLoop — ergonomic API) Interactive approval/decision surface rendered inline in the chat via the high-level `useHumanInTheLoop` hook
interactivity
In-Chat HITL (Booking) Time-picker card rendered inline via useHumanInTheLoop for a booking flow
interactivity
In-Chat HITL (useInterrupt — low-level primitive) Interactive time-picker component rendered inline in the chat via useFrontendTool with an async handler — the Promise resolves only when the user picks a slot or cancels
generative-ui
Headless Interrupt (testing) Resolve interrupts from a plain button grid — no chat, no useInterrupt render prop; the time-picker popup appears in the app surface outside the chat
interactivity
Declarative Generative UI (A2UI) Canonical A2UI BYOC — custom catalog (Card/StatusBadge/Metric/InfoRow/PrimaryButton/PieChart/BarChart) wired via a2ui.catalog on the provider; backend agent owns the `generate_a2ui` tool with injectA2UITool false
generative-ui
Declarative Generative UI (A2UI — Fixed Schema) A2UI rendering against a known client-side schema; the backend ships flight_schema.json and only streams data via display_flight
generative-ui