@sparqjs/schema-designer

@sparqjs/schema-designer 提供业务无关的 Schema 可视化设计器。宿主负责加载 Schema、实现设计期服务并决定保存和发布流程；Designer 只维护当前实例的草稿、画布、属性检查器和输出。

安装

pnpm add @sparqjs/schema-designer @sparqjs/schema-vue @sparqjs/schema-ui-element-plus element-plus vue

使用

import { createApp, h } from 'vue'
import { SparqDesigner } from '@sparqjs/schema-designer'
import '@sparqjs/schema-designer/style.css'
import '@sparqjs/schema-vue/style.css'
import '@sparqjs/schema-ui-element-plus/style.css'
import 'element-plus/dist/index.css'

const app = createApp({
    render: () =>
        h(SparqDesigner, {
            schema,
            onSave: async (nextSchema) => {
                await saveDraft(nextSchema)
            },
        }),
})

app.mount('#app')

schema 必须是 @sparqjs/schema-protocol 定义的 SchemaResource。onSave 只表示宿主接受当前输出；校验、发布、权限和失败反馈仍由宿主负责。

扩展边界

DesignerExtension 可以为单个 Designer 实例提供物料、运行时组件、属性配置、能力卡和设计期服务。扩展不写入全局注册表，同一页面可以挂载不同配置的多个 Designer。

Designer 不包含 Admin transport、认证、路由、Schema Draft API 或业务模块工作流。CMS、Settings 等模块应持有自己的加载、保存和发布状态，只把 Schema 与稳定扩展传入 SparqDesigner。