AI-Assisted Development

Use AI tools to build with assistant-ui faster. AI-accessible documentation, Claude Code skills, and MCP integration.

Build faster with AI assistants that understand assistant-ui. This page covers all the ways to give your AI tools access to assistant-ui documentation and context.

AI Accessible Documentation

Our docs are designed to be easily accessible to AI assistants:

/llms.txt

Structured index of all documentation pages. Point your AI here for a quick overview.

/llms-full.txt

Complete documentation in a single file. Use this for full context.

.mdx suffix

Add .mdx to any page's URL to get raw markdown content (e.g., /docs/installation.mdx).

Context Files

Add assistant-ui context to your project's CLAUDE.md or .cursorrules:

## assistant-ui

This project uses assistant-ui for chat interfaces.

Documentation: https://www.assistant-ui.com/llms-full.txt

Key patterns:
- Use AssistantRuntimeProvider at the app root
- Thread component for full chat interface
- AssistantModal for floating chat widget
- useChatRuntime hook with AI SDK transport

Skills

Install assistant-ui skills for AI Tools:

npx skills add assistant-ui/skills

Skill	Purpose
`/assistant-ui`	General architecture and overview guide
`/setup`	Project setup and configuration (AI SDK, LangGraph, custom backends)
`/primitives`	UI component primitives (Thread, Composer, Message, etc.)
`/runtime`	Runtime system and state management
`/tools`	Tool registration and tool UI
`/streaming`	Streaming protocol with assistant-stream
`/cloud`	Cloud persistence and authorization
`/thread-list`	Multi-thread management
`/update`	Update assistant-ui and AI SDK to latest versions

Use by typing the command in Claude Code, e.g., /assistant-ui for the main guide or /setup when setting up a project.

MCP

@assistant-ui/mcp-docs-server provides direct access to assistant-ui documentation and examples in your IDE via the Model Context Protocol.

Once installed, your AI assistant will understand everything about assistant-ui - just ask naturally:

"Add a chat interface with streaming support to my app"
"How do I integrate assistant-ui with the Vercel AI SDK?"
"My Thread component isn't updating, what could be wrong?"

Quick Install (CLI)

npx assistant-ui mcp

Or specify your IDE directly:

npx assistant-ui mcp --cursor
npx assistant-ui mcp --windsurf
npx assistant-ui mcp --vscode
npx assistant-ui mcp --zed
npx assistant-ui mcp --claude-code
npx assistant-ui mcp --claude-desktop

Manual Installation

Or add to .cursor/mcp.json:

{
  "mcpServers": {
    "assistant-ui": {
      "command": "npx",
      "args": ["-y", "@assistant-ui/mcp-docs-server"]
    }
  }
}

After adding, open Cursor Settings → MCP → find "assistant-ui" and click enable.

Add to ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "assistant-ui": {
      "command": "npx",
      "args": ["-y", "@assistant-ui/mcp-docs-server"]
    }
  }
}

After adding, fully quit and re-open Windsurf.

Add to .vscode/mcp.json in your project:

{
  "servers": {
    "assistant-ui": {
      "command": "npx",
      "args": ["-y", "@assistant-ui/mcp-docs-server"],
      "type": "stdio"
    }
  }
}

Enable MCP in Settings → search "MCP" → enable "Chat > MCP". Use GitHub Copilot Chat in Agent mode.

Add to your Zed settings file:

macOS: ~/.zed/settings.json
Linux: ~/.config/zed/settings.json
Windows: %APPDATA%\Zed\settings.json

Or open via Cmd/Ctrl + , → "Open JSON Settings"

{
  "context_servers": {
    "assistant-ui": {
      "command": {
        "path": "npx",
        "args": ["-y", "@assistant-ui/mcp-docs-server"]
      }
    }
  }
}

The server starts automatically with the Assistant Panel.

claude mcp add assistant-ui -- npx -y @assistant-ui/mcp-docs-server

The server starts automatically once added.

Add to ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows):

{
  "mcpServers": {
    "assistant-ui": {
      "command": "npx",
      "args": ["-y", "@assistant-ui/mcp-docs-server"]
    }
  }
}

Restart Claude Desktop after updating the configuration.

Available Tools

Tool	Description
`assistantUIDocs`	Access documentation: getting started, component APIs, runtime docs, integration guides
`assistantUIExamples`	Browse code examples: AI SDK, LangGraph, OpenAI Assistants, tool UI patterns

Troubleshooting

Server not starting: Ensure npx is installed and working. Check configuration file syntax.
Tool calls failing: Restart the MCP server and/or your IDE. Update to latest IDE version.