开源项目
Agent Editable UI
AI 写完页面，人还能直接点选修改吗？这个项目用具体案例，讨论如何只改一张卡片、替换展示商品，以及 Agent 再次调整布局后怎样接着编辑。
Agent 写好了页面，现在只改第二张卡片
Agent 可以写组件、在页面上重复使用组件，也可以读取业务数据来展示商品。 接下来，用户想直接点击标题改文案、调整某张卡片的颜色，或者换一个展示商品。 编辑器需要弄清楚：这次操作，究竟应该改哪一处代码或数据？
Agent Editable UI 分享 Foundax 对这个问题的工程思考， 让 Agent 写出的页面可以继续通过代码和画布共同修改，并跟随业务数据更新。
看起来相似的操作，实际修改的位置不同
| 用户想做什么 | 应该修改什么 |
|---|---|
| 只改第二张卡片的标题 | 修改这张卡片的内容，保留第一张卡片 |
| 修改价格的颜色 | 修改选定范围的样式，保留售价和计算方式 |
| 展示另一个商品 | 更换页面引用的商品 |
| 调整商品售价 | 通过业务服务修改商品记录 |
找到显示文字或源码行号，只完成了其中一部分。 编辑器还需要知道这个值来自哪里，以及用户想改一个实例，还是所有使用同一组件的位置。
Agent 再次修改页面，之前的编辑怎么办？
用户改过卡片之后，Agent 重新排列了布局，后台又更新了商品价格。 下一次编辑，需要基于最新代码，在还能确认对应位置时保留用户改动，同时继续从商品数据读取售价。
工程设计说明了怎样追踪这些关系、把修改关联到正确的项目版本， 以及旧的目标无法确认时，怎样让用户重新选择。
仓库里可以读到什么
- 案例推演：只改第二张卡片、替换商品，以及代码或数据变化后怎样继续编辑。
- 普通 TSX 与合成商品数据，用来逐步解释案例。
- 工程设计：内容来源怎样追踪、修改范围怎样确定、项目版本怎样处理。
这是包含静态源码案例的设计参考。完整编译器、预览运行时和可视化编辑器不在本次开源范围内， 仓库没有安装步骤或可运行的编辑器 Demo。
分享你遇到的编辑问题
如果你正在开发 AI 建站、CMS 或可视化开发工具，欢迎带来一个具体案例： 用户点选了什么、想改什么、哪些内容应该保留。 可以从仓库的贡献指南和 Issues 开始讨论。
在 GitHub 阅读设计与案例。 如果关注 Agent 怎样操作业务数据，可以阅读 Agent Business Workspace。