BuilderIO/agent-native

GitHub: BuilderIO/agent-native

一个用于构建 Agent 与 UI 深度同步的应用框架,让 AI Agent 成为产品中的一等公民而非附属聊天窗口。

Stars: 809 | Forks: 101

# Agent-Native ### 用于构建归你所有的 Agentic 应用的开源框架。 不要在富用户界面和自主 Agent 之间做选择。每个 Agent-Native 应用两者兼具。 ## Agent 与 UI —— 完全连接 Agent 和 UI 是同一系统中的平等公民。每个操作都是双向的 —— 点击它或要求它。 ![Agent 与 UI 完全连接](https://cdn.builder.io/api/v1/file/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fadc1e9e9368e4a8cb1b4dbb5aae5aaa2) - **万物皆同步** —— Agent 和 UI 共享一个数据库和一个状态。任何一侧的更改都会立即显示在另一侧。 - **实时多人协作** —— 人类和 Agent 在同一个文档中同时协作:CRDT 合并、实时状态感知(光标、选区环、谁在哪张幻灯片上),并且 Agent 作为一等公民的协同编辑者。适用于任何 SQL 数据库和任何主机,包括 Serverless。 - **上下文感知** —— Agent 知道你在看什么。选择文本,按下 Cmd+I,告诉它要做什么。 - **按用户划分的工作区** —— 技能、记忆、指令、子 Agent 和 MCP 服务器 —— 基于 SQL,按用户自定义。Claude-Code 级别的灵活性,SaaS 级别的经济效益。 - **Agent 调用 Agent** —— 从任何应用标记(tag)另一个 Agent。它们通过 A2A 互相发现,并在你的整个技术栈中采取行动。 - **可复用的集成** —— 在 Dispatch 中连接一次提供商,将敏感值保存在保险库中,然后授予 Brain、Analytics、Mail 和 Dispatch 等应用访问共享账户元数据和凭据引用的权限。 - **三种形态** —— 将同一个 Agent 构建为无头 API、富聊天体验,或者是 Agent 和 UI 保持同步的完整应用。 - **自我改进的应用** —— 你的应用会自己变得更好。Agent 可以随着时间的推移添加功能、修复 Bug 并优化 UI。 - **任何数据库,任何主机** —— 任何 Drizzle 支持的 SQL 数据库。任何 Nitro 支持的托管目标。无锁定。 - **引入你需要的 Agent 表面** —— 兼容 MCP 的主机可以调用你的应用,编码 Agent 可以安装技能,原生聊天可以渲染可复用的应用输出,而 BYO(自带)Agent 运行时可以流式传输到 Agent-Native 聊天外壳中。 ## 用于 Agent-Native 应用的框架 Agent-Native 是一个开源框架,用于构建能够在真实应用内部执行操作的强大 Agent,而不仅仅是在它们旁边聊天。 它为你提供了用于产品级 Agentic 软件的基元:共享操作、基于 SQL 的状态、身份、工具、技能、任务、可观测性以及 UI 表面,所有这些都能协同工作。 后端无关:自带你的数据库、托管提供商、模型堆栈和应用代码。 ``` // One action powers UI, agent, HTTP, MCP, A2A, and CLI. export default defineAction({ schema: z.object({ emailId: z.string(), body: z.string(), }), run: async ({ emailId, body }) => { await db.insert(replies).values({ emailId, body }); }, }); ``` - **操作** —— 定义一次工作。可从 UI、Agent、API、MCP、A2A 和 CLI 中使用。 - **Agent 运行时** —— 聊天、工具、技能、记忆、任务、可观测性和切换(Handoff)协同发布。 - **后端无关** —— 插入任何 Drizzle 支持的 SQL 数据库和兼容 Nitro 的主机。 ## 一个 Agent,三种产品形态 Agent-Native 的基元让你能够选择在 Agent 周围放置多少 UI,而无需重建 Agent 契约: | 形态 | 你交付的内容 | 底层相同的基元 | | ------------- | --------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- | | **无头 (Headless)** | 从代码、CLI、HTTP、MCP 或 A2A 调用 Agent 和操作。 | `defineAction`、身份验证、技能、记忆、任务、可观测性 | | **富聊天** | 独立或嵌入式的聊天,带有原生表格、图表、审批、设置流程和工具结果。 | 共享聊天运行时,BYO 运行时适配器,操作声明的原生渲染器 | | **完整应用** | 完整的 SaaS/产品 UI,其中聊天可以从中心开始,移动到侧边栏,并与应用状态保持同步。 | SQL 状态,操作,上下文感知,深度链接,实时同步 | 协议随框架一起提供,而不是为每个功能单独进行集成。今天这意味着 A2A、MCP、MCP Apps、标准远程 MCP OAuth、MCP 客户端、HTTP/CLI 操作调用、原生聊天小部件、`AgentChatRuntime` 适配器、标准 OpenAI、AG-UI、Claude Agent SDK 和 Vercel AI SDK 聊天运行时连接器,以及深度链接都挂在同一个操作表面上。最好将 ACP 理解为编码 Agent/编辑器互操作性协议,而不是通用的 BYO 应用聊天运行时。 如需完整的决策指南 —— 无头、内置 Agent 上的富聊天、你自己的 Agent 上的富聊天、嵌入式 Sidecar,或完整应用 —— 请参阅 [Agent 表面](https://agent-native.com/docs/agent-surfaces)。 要将 Claude、ChatGPT、Codex、Cursor、OpenCode、GitHub Copilot / VS Code 或其他 MCP 主机连接到你托管的应用,请参阅 [外部 Agent 指南](https://agent-native.com/docs/external-agents)。 ## 通过一个技能尝试它 还不想搭建整个应用?通过一条命令,将可视化规划和 PR 摘要功能添加到 Claude Code、Codex、Cursor、Pi、OpenCode、GitHub Copilot / VS Code 及类似 Agent 中: ``` npx @agent-native/core@latest skills add visual-plan ``` 你将获得两个斜杠命令,它们将提升你的 Agent 规划和报告其工作的方式: - **`/visual-plan`** —— 在 Agent 编写代码之前,它会打开一个结构化、可审查的计划文档,而不是一大段密密麻麻的文字:内联图表、UI 线框图和原型、逐文件的实现映射,以及你可以评论和批准的注释。 - **`/visual-recap`** —— 在更改落地后,它会将 PR 或 git diff 转换为高视角的可视化摘要:Schema、API 和文件更改被渲染为有据可查的“更改前/更改后”对比块,并附带可共享的审查链接,而不是滚动浏览原始的 diff。 有关更多技能和本地安装,请参阅 **[技能指南](https://agent-native.com/docs/skills-guide#app-backed-skills)**。 ## 模板 从功能齐全的模板开始。每一个都是一个完整的、100% 免费且开源的 SaaS 应用 —— 是克隆而不是搭建骨架 —— 不同的是你拥有代码并且可以自定义一切。
**日历** Calendar template **Agent-Native 的 Google Calendar、Calendly** 管理事件,与 Google Calendar 同步,并分享一个带有 AI 调度功能的公开预订页面。 **内容** Content template **面向 MDX 的开源 Obsidian** 编辑本地 Markdown/MDX 文件,生成丰富的交互式自定义块,并与 Agent 一起起草、重写或发布。 **计划** Plans template **用于编码 Agent 的可视化计划模式** 安装 `/visual-plan` 和 `/visual-recap`,以便你的编码 Agent 可以在构建之前进行计划,并在更改落地后回顾更改 —— 带有图表、线框图、注释和审查链接的高级代码审查。
**幻灯片** Slides template **Agent-Native 的 Google Slides、Pitch** 通过提示或点击操作生成并编辑基于 React 的演示文稿。 **分析** Analytics template **Agent-Native 的 Amplitude、Mixpanel** 连接分析数据源,通过提示生成真实的图表,并构建可重用的仪表板。共享的工作区连接可以提供提供商凭据,而 Analytics 仍然拥有指标、真实数据源选择和已保存的分析。 **视频片段** Clips template **Agent-Native 的 Loom** 录制你的屏幕,支持自动生成转录文本、可共享链接,并且 Agent 可根据需要总结、添加字幕和编辑片段。
每个模板都是一个完整的、可克隆的 SaaS —— 复刻它,用 Agent 自定义它,拥有它。在连接你自己的数据源之前,先使用示例数据进行尝试。 在 **[agent-native.com/templates](https://agent-native.com/templates)** 查看完整的模板库。 ## 快速开始 一条命令即可复刻模板并开始本地构建。 ``` npx @agent-native/core@latest create my-platform cd my-platform pnpm install pnpm dev ``` CLI 会显示一个多选选择器,因此你可以在一个工作区中包含任意数量的模板。选择 Mail + Calendar + Forms,你将一次性获得所有三个已配置好并共享身份验证的应用。或者浏览 **[模板库](https://agent-native.com/templates)** 获取实时演示。 只想要一个应用,不要 Monorepo?使用 `--standalone`: ``` npx @agent-native/core@latest create my-app --standalone --template mail ``` ## 工作区(Monorepo) 工作区是 Agent-Native 项目的默认形态。每个应用都位于 `apps/` 下,并且 `packages/shared/` 可用于存放那些真正适用于每个应用的一小部分代码、指令、技能或品牌塑造。 ``` my-platform/ ├── package.json # declares `agent-native.workspaceCore` ├── pnpm-workspace.yaml ├── .env # shared secrets: ANTHROPIC_API_KEY, BUILDER_PRIVATE_KEY, A2A_SECRET, ... ├── packages/ │ └── shared/ # optional shared custom code └── apps/ ├── mail/ ├── calendar/ └── forms/ ``` 稍后添加另一个应用: ``` npx @agent-native/core@latest add-app notes --template content ``` 将每个应用部署在同一源下: ``` npx @agent-native/core@latest deploy # https://your-agents.com/mail/* → 邮件 # https://your-agents.com/calendar/* → 日历 # https://your-agents.com/forms/* → 表单 ``` 同源部署意味着跨每个应用的 **共享登录会话** 和 **零配置的跨应用 A2A** —— 从日历的 Agent 聊天中标记 `@mail` 即可直接工作(无需 JWT 签名,无需 CORS)。完整详情请见 **[agent-native.com/docs/multi-app-workspace](https://agent-native.com/docs/multi-app-workspace)**。 ## 两全其美 | | SaaS 工具 | 原始 AI Agent | 内部工具 | Agent-Native | | ----------------- | ------------------ | ----------------------- | -------------------------- | ----------------------- | | **UI** | 精致但死板 | 无 | 质量参差不齐 | 完整 UI,复刻即用 | | **AI** | 后期强行添加 | 强大 | 浅层连接 | Agent 优先,高度集成 | | **自定义** | 无法实现 | 指令和技能 | 完全自由,但维护成本高 | Agent 可修改应用 | | **所有权** | 租用 | 部分归你 | 你拥有代码 | 你拥有代码 | ## 文档 完整文档请见 **[agent-native.com](https://agent-native.com)**。 ## 许可证 MIT
标签:AI智能体, MCP协议, SQL数据库, 前端UI交互, 实时协作, 应用框架, 状态同步, 自动化攻击