useStream 是与 UI 无关的。它返回包含消息、工具调用、加载状态和线程历史的普通响应式状态，你可以将其连接到任何你选择的视觉层。这些页面展示了三个不同的库如何与 useStream 集成，每个库都遵循不同的理念来构建 AI 聊天和生成式 UI。
集成方案
AI Elements
基于 shadcn/ui 的可组合 AI 聊天组件。直接引入
Conversation、Message、Tool 和 Reasoning，并将它们直接连接到 stream.messages。assistant-ui
具有完整运行时层的无头 React 框架。通过
useExternalStoreRuntime 适配器将 useStream 桥接到 AssistantRuntimeProvider。OpenUI
生成式 UI 库，允许智能体以声明式组件 DSL 生成完整的交互式仪表板。专为数据丰富、报告风格的 UI 而构建。
选择库
三者都以相同的方式连接到useStream。选择取决于你正在构建的 UI 类型：
| AI Elements | assistant-ui | OpenUI | |
|---|---|---|---|
| 最适合 | 具有丰富消息类型的聊天 | 功能齐全、设置极简的聊天 | 生成的仪表板和报告 |
| UI 风格 | 可组合的 shadcn/ui 组件 | 无头插槽 + 默认主题 | 具有声明式 DSL 的预构建组件库 |
| 自定义 | 直接编辑源文件 | 覆盖组件插槽 | 通过 CSS 自定义属性进行主题定制 |
| 流式 UX | 组件级渐进式渲染 | 内置线程管理 | 提升式——外壳立即出现，数据随后填充 |
| 工具调用 | Tool / ToolHeader / ToolOutput | 通过消息插槽自定义 | 内嵌于生成的 UI 中 |
| 智能体格式 | 任何 stream.messages | 任何 stream.messages | 智能体输出 openui-lang 文本 |
@langchain/react 的智能体配合使用：createAgent、createDeepAgent 或自定义的 LangGraph 图。
Connect these docs to Claude, VSCode, and more via MCP for real-time answers.