The frontend library for AI agents.
Primitives and a runtime for production chat. Any backend, through adapters.
CombinatorWhat you install
@assistant-ui/react
The runtime owns the thread, the stream, and the tools.
The setup
A provider, a hook, one component. The complete client, whatever runs behind it.
import { AssistantRuntimeProvider } from "@assistant-ui/react";
import { useChatRuntime, AssistantChatTransport } from "@assistant-ui/ai-sdk";
import { Thread } from "@/components/assistant-ui/thread";
export default function App() {
const runtime = useChatRuntime({
transport: new AssistantChatTransport({ api: "/api/chat" }),
});
return (
<AssistantRuntimeProvider runtime={runtime}>
<Thread />
</AssistantRuntimeProvider>
);
}Your route runs the model. The transport streams it back.
read the AI SDK guide →What the runtime handles
The primitives
Yours to reshape. Every part is a component you compose; the CLI copies the UI source into your repo.
Root · Owns the runtime context. Everything composes inside.
Works with AI SDK, LangGraph, and LangChain, or any backend through adapters. Ships for React, Native, and Ink. Elements extends it. Cloud hosts threads and persistence when you want them.
Build stateful conversational AI agents with LangGraph and assistant-ui.
@LangChainAIConversations and streaming AI output are powered by @assistantui. It renders the chat interface and stores threads in Assistant UI Cloud so sessions persist across refreshes and context builds over time.
@neondatabasePleasure to work with Simon… bring streaming, gen UI, and human-in-the-loop with LangGraph Cloud + assistant-ui.
@hwchase17
Get started
Start in the docs.
The command scaffolds a working thread. The docs take it from there.