Gan-Tu/Widgets

解决的问题

该项目提供了一种在聊天界面中渲染紧凑、结构化 UI 组件的方法。它使开发者能够超越简单的文本响应，通过模板与数据相结合的方式，提供一种标准化系统，用于渲染丰富的、可交互的组件（如图表、表单和特定于代理的原语）。

工作原理

该系统使用 WidgetRenderer，接收三个主要输入：UI 模板字符串（以严格、类似 JSX 的语言编写）、可选的 Zod 模式用于数据验证，以及实际的数据对象。

为确保安全性和可预测性，渲染器使用保守的模板引擎，支持声明式逻辑（绑定、条件和循环），但禁止任意 JavaScript 执行。它包含一个 142 个预注册组件的库——从基本布局和排版到复杂的代理原生原语（如 ThinkingReasoning 和 StreamingText）。交互通过本地客户端操作（例如复制文本或打开 URL）处理，或通过 onAction 回调转发给宿主应用程序。

适用人群

希望在构建 AI 聊天 UI 或基于代理的应用程序时，无需为每种可能的 AI 输出手动构建独特的 React 组件，即可提供结构化、可交互的视觉响应的开发者。

主要亮点

• 丰富的组件库：内置 142 个组件，包括图表、表单和工作区原语。
• 模式验证：可选的 Zod 集成，确保在渲染前传递给组件的数据是有效的。
• 安全的模板：受限的 JSX 类似语言，防止任意 JS 执行，同时支持循环和条件渲染。
• 代理原生原语：专为 AI 交互设计的特殊组件，如推理块和审批卡片。
• 主题支持：通过 CSS 设计令牌完全可自定义，并内置亮色和暗色模式支持。