Skip to content

@dragcraft/core

@dragcraft/core 负责 schema、命令和历史记录。

需要实现可承载子节点的 flex、grid 或分栏物料时,先阅读 外部容器物料;本页说明 Core 提供的容器 API。

先看一个最小示例:

ts
import { createEngine, CommandType } from '@dragcraft/core'

const engine = createEngine()

engine.execute({
  type: CommandType.SET_GLOBAL_CONFIG,
  payload: {
    config: {
      title: '首页',
    },
  },
})

const schema = engine.state.getSchema()
console.log(schema.globalConfig.title)

这段代码展示了这个包最常见的读写节奏。我们先用 createEngine() 创建实例,再通过命令对象调用 engine.execute(),最后用 engine.state.getSchema() 读取公开状态。

加载已有页面时不要把 schema 传给 createEngine()。先注册页面需要的 widget metadata,再调用 engine.importSchema(schema);这样容器定义、节点所有权和 ID 唯一性会在进入运行态前统一校验。使用 createDesigner() 时可以继续传 engineOptions.initialSchema,Designer 会负责正确的注册与导入顺序。

要定义页面节点、布局位置或容器区域时,继续阅读 Schema 与布局createLayoutPlan()EventNameresolveBehavior() 适合在实现自定义布局、事件订阅或拖拽约束时再查阅。

engine.state.getSchema()getNodeById() 返回当前已提交的深冻结只读快照;在下一条有效变更命令前,重复读取会得到相同引用。engine.store 只公开只读 refs 和 selection/hover/drag 交互方法,不包含 schema mutation API;修改页面必须通过 engine.execute(),需要一份可编辑的导出对象时使用 engine.exportSchema()。成功结果中的 changed: false 表示命令没有产生提交、历史或 schema:changed 事件。

Container public API

root.children 包含页面节点,flow/chrome/layer 保持 root-only;容器 regions 拥有普通子节点,当前协议拒绝嵌套容器。container 是兼容现有文档的可选字段,因此 schema version 不变。

主要入口包括 validateContainerDefinition()createContainerState()createContainerPlan()resolvePlacementDecision()buildSchemaIndex()validateSchema()NodeDestination 显式区分 root 与 container region,所有跨 owner 的 add/move/remove/copy 都通过结构化 command result 保证拒绝回滚与 undo 一致性。外部 meta 注册 variants、regions、constraints 和 material-owned migration;框架不定义 flex/grid geometry。