@ botfather/ 单位

用于 单位 DSL 用于描述UI树的轻量级、无依赖性声明语言 .ui 文档.

这是什么?

单位为作者的UI提供一种比JSX显著的terser的最小语法,使它非常适合代码生成(例如LLM输出)和人类编辑. A 类 .ui 文件被解析成一个平坦的 JSON AST,然后可以通过包含的 React 渲染器或任何自定义主机框架通过自定义渲染器 API 提供.

主要特点:

• O(n) 单通解析器 — 无外部解析依赖性
• Render- 不可知性 — 反应是选入的; 插入任意框架
• 连续相接相干物质
• 编辑器集成的递增解析助手

安装

npm install @botfather/units
# react is a peer dependency for the React renderer
npm install react

这个 .ui 语法

TagName (prop:'value', expr=@scopeVar, visible?=@bool) {
  text 'Literal @{interpolated}'
  @rawExpr
  #if (@cond) { ... }
  #for (item, i in @list) {
    #key (@item.id)
    ChildTag (...)
  }
  #slot (slotName)
}

API 密码

分析

import { parseUnits } from "@botfather/units/parser";

const ast = parseUnits(`
  Button (variant:'primary') {
    text 'Click me'
  }
`);
// → { type: 'document', body: [...] }

在语法错误上丢出带有源偏移的描述性错误并片段.

格式化

import { formatUnits } from "@botfather/units/print";

const canonical = formatUnits(source);

行宽默认为 100覆盖 UNITS_PRINT_WIDTH 环境变量.

反应渲染器

import { renderUnits } from "@botfather/units/runtime";
import uiAst from "./app.ui"; // via vite-plugin-units

const element = renderUnits(uiAst, scope, {
  components: { Button: MyButtonComponent },
  slots: { default: <span>content</span> },
  set: (key, value) => setState(s => ({ ...s, [key]: value })),
});

自定义( 非反应) 渲染器

import { createUnitsRenderer } from "@botfather/units/custom-renderer";

const renderer = createUnitsRenderer({
  element(name, props, events, children) { /* create node */ },
  text(value) { /* create text node */ },
  fragment(children) { /* group children */ },
});

const node = renderer.render(ast, scope, options);

自定义渲染器指令行为镜像 #if/#elif/#else 财务报告和审定财务报表 #for/#key。 。 。 .

表达式评价器

import { createUnitsEvaluator } from "@botfather/units/runtime";

const evalExpr = createUnitsEvaluator();
const result = evalExpr("@items.length > 0", scope);

表达式使用 @ 作为瞄准镜访问器的前缀。 汇编评价缓存 Function 每个表达式字符串的对象,而范围前缀的正态保留了文字 @ 引用字符串中的字符.

递增分析

import {
  findChangedRange,
  findSmallestEnclosingNode,
  incrementalParse,
} from "@botfather/units/incremental";

const range = findChangedRange(prevSource, nextSource);
const node = findSmallestEnclosingNode(ast, range.start, range.endPrev);
const newAst = incrementalParse(prevAst, prevSource, nextSource);

用于编辑器集成. incrementalParse 尝试先是附加和最小的闭合节点回放,然后在需要时安全地返回到完整的回放区.

树 IR 适配器

import {
  normalizeDomTree,
  normalizeA11yTree,
  serializeAgentTree,
} from "@botfather/units/tree-ir";

const domIr = normalizeDomTree(rawDomLikeTree);
const a11yIr = normalizeA11yTree(rawAccessibilityTree);
const compact = serializeAgentTree(domIr);

serializeAgentTree 应用面向符号的默认值(dedups 冗余) name编号 :text ,省去角色隐含动作,如 click 按钮上,倒取出空文本叶,并省去文本节点代号。 传递选项, 如 includeRedundantNameText: true, (中文(简体) ), includeImplicitActions: true,或 includeTextIds: true 以保留那些田地.

变形程序

import {
  compileTransformProgram,
  runTransformProgram,
} from "@botfather/units/transform";

const program = compileTransformProgram(programSource);
const result = runTransformProgram(program, irTree, { task: "summarize" });

变形程序使用 .ui 用a的语法 Program (kind:'transform') root 和 预留的变换标签 (Rule, (中文(简体) ), Filter, (中文(简体) ), Merge, (中文(简体) ), Pass在变换模式中.

奖励+核查器

import { scoreProgram, verifyProgram } from "@botfather/units/reward";

const score = scoreProgram({ inputTree, outputTree, expectations });
const verification = verifyProgram(score, {
  action_recall: 1,
  name_recall: 0.98,
  text_f1: 0.95,
});

已验证库 + 合成

import {
  createVerifiedProgramMetadata,
  writeVerifiedProgram,
} from "@botfather/units/library";
import { runSynthesisLoop } from "@botfather/units/synthesis";

Vite 导入的脚本类型

添加 /// <reference types="@botfather/units/ui" /> (或从 @botfather/units/ui获取类型 .ui 文件导入 :

import { ast, source } from "./app.ui";
import formatted from "./app.ui?format";
import tokens from "./app.ui?tokens";
import html from "./app.ui?highlight";

软件包出口

许可证

麻省理工学院