以 skill 自身的术语
该 skill 涵盖 @json-render/ink，一个 Ink 终端渲染器，可将 JSON 规格转换为具有数据绑定、可见性、动作和动态 props 的交互式终端组件树。文中介绍了如何使用 zod 从 Ink schema 定义 catalog，仅将自定义组件注册到 registry 中，并在 JSONUIProvider 内使用 Renderer 进行渲染，或使用更高层的 createRenderer 和 standardComponents。
读者将学习扁平元素映射规格格式（含 root key）、标准布局、内容与交互组件集合、状态与绑定表达式、事件系统以及内置的 setState、pushState 和 removeState 动作、repeat 列表、通过 useUIStream 实现的 JSONL 流式传输、provider 的作用、关键导出内容，以及诸如 80-120 列宽等终端设计规范。
它产出什么
- 由 JSON 规格渲染出的交互式终端组件树。
- 根据 catalog 生成的、用于规格编写的 AI 系统提示词。
- 一个与框架无关的内存中 StateStore，用于驱动重新渲染。
工作方式
- 01从 Ink Schema 定义 Catalog
从 @json-render/core 导入 defineCatalog，并传入 Ink schema 以及你想要允许的组件和动作定义。
- 02仅注册你的自定义组件
defineRegistry 接收 catalog，但标准组件实现已内置，因此只需将自定义组件映射到 Ink 元素。
- 03将 Renderer 包裹在 Providers 中
JSONUIProvider 为 Renderer 提供状态、可见性、动作和焦点上下文，Renderer 则接收规格和 registry。
- 04以扁平元素映射的形式编写规格
规格中包含一个指定首个元素名称的 root key，以及一个由带有 props、children 和可选事件绑定的类型化节点组成的 elements map。
- 05使用表达式绑定 Props
任何 prop 值都可以在渲染时从状态、repeat 项、条件或字符串模板中解析，而不必硬编码。
- 06渐进式流式传输规格
useUIStream 从 API 端点消费 JSONL patch 流，并向调用方暴露 spec、send 和 isStreaming。