PSUIP Generate SDK

PSUIP（Particle Service UI Protocol）是一套用于描述企业级 UI 结构与内容的语义协议。本 SDK 将 PSUIP 文本转化为标准化「八要素」数据结构，可用于「八要素」渲染引擎用于渲染。

核心能力

• 语义解析：将 PSUIP 文本解析为布局、文本、按钮、卡片、表格、标签、图标等 UI 元素。
• 设计令牌：通过 seed 自定义主题，动态生成颜色、字体、尺寸等设计令牌。
• 可视化增强：内置上千枚矢量图标、表格/图表渲染器以及按钮、卡片等组件生成器。

安装

npm install psuip-generate-sdk
# 或
yarn add psuip-generate-sdk

快速上手

以下示例使用中立的内容片段，展示如何一次性获取标准八要素 JSON：

import PSUIPGenerator from "psuip-generate-sdk";

const eightElements = PSUIPGenerator({
  psuip: `
  <card>
  ### 智能协同平台
  - ✅ 模块化业务组件
  - ✅ 多终端一致体验
  - ✅ 实时数据洞察
  </card>

  <layout:row>
  我们提供端到端的数字化实施与 7x24 支持。
  </layout:row>
  `,
});

console.log(eightElements); // 八要素对象

API

PSUIPGenerator(options)

| 参数 | 类型 | 说明 | | --- | --- | --- | | psuip | string | 必填，符合 PSUIP 语法的文本内容。 | | seed | object | 选填，自定义品牌/主题种子，内部将衍生出颜色、尺寸、字体等设计令牌。 |

自定义主题（seed 示例）

const customTheme = PSUIPGenerator({
  psuip: `# Hello PSUIP`,
  seed: {
    shape: 5,
    degree: 5,
    font: 5,
    material: 5,
    color: '#0000FF'
  },
});

传入 seed 后，SDK 会：

1. 通过 calculateTokens 生成设计令牌；
2. 注入动态 Token 系统解析 PSUIP；

构建与发布

• npm run build：使用 Rollup 产出 dist/index.js。
• npm publish：发布前会自动执行 prepublishOnly 完成构建。

许可证

MIT License © Dingdao