← all repositories
assistant-ui/assistant-ui

React primitives that actually get chat UX right

A headless component library for AI chat interfaces, because streaming and auto-scroll are harder than they look.

10.5k stars TypeScript Chat Assistants
assistant-ui
Velocity · 7d
+11
★ / day
Trend
steady
star history

What it does

assistant-ui gives you composable React primitives—Thread, Message, Composer, ActionBar, and so on—to build chat interfaces without reinventing the tedious parts. It handles streaming, auto-scroll, retries, attachments, markdown rendering, code highlighting, voice dictation, and keyboard shortcuts. A CLI scaffolds a Next.js starter or drops styled components into an existing project, with a shadcn/ui theme as the default starting point.

The interesting bit

The runtime layer is swappable: useChatRuntime wires to Vercel AI SDK by default, but you can drop in useLangGraphRuntime, useDataStreamRuntime, or roll your own. That means the same UI components talk to LangChain, Google ADK, custom HTTP backends, or whatever you bolt on next. The README also notes “generative UI”—rendering tool calls and JSON as React components with inline human approvals—which suggests they’re thinking beyond simple message bubbles.

Key highlights

  • Radix-style composable primitives; bring your own styles or start from the CLI’s shadcn/ui theme
  • Broad backend adapters: Vercel AI SDK, LangGraph/LangChain, AG-UI/A2A, Google ADK, OpenCode, custom data streams
  • Production UX included: streaming, auto-scroll, retries, attachments, markdown, code blocks, voice input, a11y
  • Typed end-to-end: runtime APIs, tool schemas, message parts, and adapters
  • Optional managed cloud tier (assistant-cloud) for thread history, telemetry, and file storage
  • React Native and terminal (Ink) variants exist if you need to port the same patterns elsewhere

Caveats

  • The “generative UI” features are mentioned but not deeply documented in the README; you’ll need to dig into the docs for implementation details
  • The optional cloud services are a commercial add-on; the core library is MIT, but the full feature set may nudge you toward paid infrastructure

Verdict

Worth a look if you’re building a non-trivial AI chat product in React and don’t want to spend your first two weeks debugging scroll position and streaming state. Probably overkill if you just need a quick embedded chatbot widget.

heatdrop uses Google Analytics to see which pages get read — nothing else. Your call. How we handle data.