用途:把自然语言描述的界面需求翻译为受约束的 UITree JSON,再由 Preact 渲染器输出可用的仪表盘或应用界面。流程为:用户提示 → Claude(受组件目录约束)→ UITree JSON → Preact 渲染器 → UI。
主要能力:内置组件目录作为护栏,涵盖布局(Card、Grid、Stack)、数据展示(Metric、Chart、Table、List)、交互(Button、Select、DatePicker)、排版(Heading、Text)、状态(Badge、Alert)与特殊组件(Divider、Empty)。数据绑定使用 JSON Pointer 语法,如 /revenue、/users/0/name。元素可带 visible 条件,支持真值检查及 and、or、not、eq 表达式。
使用方式:先输出 UITree JSON(含 root、elements、data),再基于 assets/template.html 创建 HTML 产物,该模板已内嵌渲染器,无需单独内联 renderer.js。相关文件还有 assets/catalog.json 与 references/uitree-format.md。
适用场景:指标看板、销售仪表盘、含图表与表格的数据展示界面等。
限制:只能使用目录内组件,不得自创组件类型或使用任意 HTML/CSS,不得遗漏必填属性,树结构应保持扁平(嵌套不超过 3 层)。需提供符合结构的示例数据。其他细节暂未提供。