Connect the Vercel AI SDK to a React chat UI via assistant-ui — useChat hooks, custom transports, frontend tools, attachments, multi-step agents, and token usage.
@assistant-ui/react-ai-sdk integrates assistant-ui with the Vercel AI SDK. It covers useChat flows, custom transports, frontend tools, attachments, quote context, multi-step agents, token usage, and cloud persistence.
Pick a version
| AI SDK | Runtime package | Docs |
|---|---|---|
ai@^6 + @ai-sdk/react@^3 | @assistant-ui/react-ai-sdk (latest) | v6 (current) |
ai@^5 + @ai-sdk/react@^2 | @assistant-ui/[email protected] | v5 (legacy) |
ai@^4 | @assistant-ui/react-data-stream | v4 (legacy) |
New projects should target v6. v5 and v4 are documented for projects that have not migrated yet; both have known compatibility gaps and receive no new features.
Architecture
@assistant-ui/react-ai-sdk is layered on ExternalStoreRuntime (see architecture). Features that ship as runtime adapters work the same way they do everywhere else; see adapters.
Choosing useChatRuntime vs useAISDKRuntime
Both ship in the same package.
useChatRuntime(recommended) wraps the AI SDK'suseChathook and adds cloud thread support, the standard adapter slots, andAssistantChatTransport(which forwards system messages and frontend tools by default). Use this unless you have a reason not to.useAISDKRuntimeis a lower-level hook that takes an existinguseChatinstance you control directly. Use it when you need to share the chat instance with non-assistant-ui code or wire in a custom transport that does not inherit fromAssistantChatTransport.