@logicflow/core 2.2.1 → 2.2.3

package/dist/docs/api/logicflow-instance/register.zh.md

@@ -0,0 +1,76 @@
+---
+nav: API
+group:
+  title: LogicFlow 实例
+  order: 2
+title: 注册
+toc: content
+order: 10
+---
+
+本页汇总 LogicFlow 实例中与自定义节点/边注册相关的方法。
+
+### register
+
+注册单个自定义节点或边。
+
+**签名**
+
+```ts
+register(config: RegisterConfig): void
+```
+
+参数类型见 [`RegisterConfig`](../type/MainTypes.zh.md#registerconfig注册配置)。
+
+**示例**
+
+```ts
+import { RectNode, RectNodeModel } from '@logicflow/core';
+
+class CustomRectNode extends RectNode {}
+
+class CustomRectModel extends RectNodeModel {
+  setAttributes() {
+    this.width = 200;
+    this.height = 80;
+    this.radius = 50;
+  }
+}
+
+lf.register({
+  type: 'custom-rect',
+  view: CustomRectNode,
+  model: CustomRectModel,
+});
+```
+
+### batchRegister
+
+批量注册多个自定义节点或边。
+
+**签名**
+
+```ts
+batchRegister(configList: RegisterConfig[]): void
+```
+
+参数类型见 [`RegisterConfig`](../type/MainTypes.zh.md#registerconfig注册配置)。
+
+**示例**
+
+```ts
+lf.batchRegister([
+  {
+    type: 'user',
+    view: UserNode,
+    model: UserModel,
+  },
+  {
+    type: 'user1',
+    view: UserNode1,
+    model: UserModel1,
+  },
+]);
+```
+
+插件全局注册见 [LogicFlow.use](../logicflow-constructor/use.zh.md)。

package/dist/docs/api/logicflow-instance/render-and-data.en.md

@@ -0,0 +1,179 @@
+---
+nav: API
+group:
+  title: LogicFlow Instance
+  order: 2
+title: Rendering and data
+toc: content
+order: 1
+---
+
+This page covers rendering entry points, reading and writing graph data, and adapter hooks on the LogicFlow instance.
+
+### render
+
+Render graph data. When `adapterIn` is configured, incoming data is converted to LogicFlow’s internal shape first.
+
+**Signature**
+
+```ts
+render(graphData: unknown): void
+```
+
+**Parameters**
+
+| Name | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `graphData` | `unknown` | Yes | Graph payload; shape depends on `adapterIn`. |
+
+**Example**
+
+```ts
+lf.render({
+  nodes: [{ id: 'node_1', type: 'rect', x: 120, y: 100 }],
+  edges: [],
+});
+```
+
+### renderRawData
+
+Render native LogicFlow graph data without running `adapterIn`.
+
+**Signature**
+
+```ts
+renderRawData(graphData: GraphData): void
+```
+
+**Parameters**
+
+| Name | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `graphData` | [`GraphData`](../type/MainTypes.en.md#graphdata) | Yes | Native LogicFlow graph data. |
+
+**Example**
+
+```ts
+lf.renderRawData({
+  nodes: [{ id: 'node_1', type: 'rect', x: 120, y: 100 }],
+  edges: [],
+});
+```
+
+### getGraphData
+
+Return the current graph. When `adapterOut` is set, the result is passed through that adapter.
+
+**Signature**
+
+```ts
+getGraphData(...params: any[]): GraphConfigData | unknown
+```
+
+**Parameters**
+
+| Name | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `...params` | `any[]` | No | Extra arguments forwarded to `adapterOut`. |
+
+**Returns**
+
+- Without `adapterOut`: [`GraphConfigData`](../type/MainTypes.en.md#graphconfigdata).
+- With `adapterOut`: your business shape (`unknown`).
+
+**Example**
+
+```ts
+const data = lf.getGraphData(['property1', 'property2']);
+```
+
+### getGraphRawData
+
+Return native LogicFlow data, ignoring `adapterOut`.
+
+**Signature**
+
+```ts
+getGraphRawData(): GraphData
+```
+
+**Returns**
+
+- [`GraphData`](../type/MainTypes.en.md#graphdata)
+
+**Example**
+
+```ts
+const rawData = lf.getGraphRawData();
+console.log(rawData.nodes, rawData.edges);
+```
+
+### clearData
+
+Remove every node and edge from the canvas.
+
+**Signature**
+
+```ts
+clearData(): void
+```
+
+**Example**
+
+```ts
+lf.clearData();
+```
+
+### adapterIn
+
+Optional inbound adapter: convert business data to LogicFlow graph data before `render`.
+
+**Signature**
+
+```ts
+adapterIn?: (data: unknown) => GraphData
+```
+
+**Returns**
+
+- [`GraphData`](../type/MainTypes.en.md#graphdata)
+
+**Example**
+
+```ts
+lf.adapterIn = (bizData) => {
+  return {
+    nodes: [],
+    edges: [],
+  };
+};
+```
+
+### adapterOut
+
+Optional outbound adapter: convert LogicFlow graph data when `getGraphData` runs.
+
+**Signature**
+
+```ts
+adapterOut?: (data: GraphConfigData, ...params: any[]) => unknown
+```
+
+**Parameters**
+
+| Name | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `data` | [`GraphConfigData`](../type/MainTypes.en.md#graphconfigdata) | Yes | Current graph data. |
+| `...params` | `any[]` | No | Same extras passed to `getGraphData`. |
+
+**Example**
+
+```ts
+lf.adapterOut = (data, reserveFields = []) => {
+  return {
+    processNodes: data.nodes,
+    processEdges: data.edges,
+    reserveFields,
+  };
+};
+```

package/dist/docs/api/logicflow-instance/render-and-data.zh.md

@@ -0,0 +1,181 @@
+---
+nav: API
+group:
+  title: LogicFlow 实例
+  order: 2
+title: 渲染与数据
+toc: content
+order: 1
+---
+
+本页聚焦 LogicFlow 实例的渲染入口、图数据读写与数据适配器接口。
+
+### render
+
+渲染图数据；当配置了 `adapterIn` 时，会先转换为 LogicFlow 标准数据再渲染。
+
+**签名**
+
+```ts
+render(graphData: unknown): void
+```
+
+**参数**
+
+| 名称 | 类型 | 必传 | 说明 |
+| :--- | :--- | :--- | :--- |
+| `graphData` | `unknown` | 是 | 图数据，格式取决于是否配置了 `adapterIn`。 |
+
+**示例**
+
+```ts
+// 直接渲染 LogicFlow 标准格式
+lf.render({
+  nodes: [{ id: 'node_1', type: 'rect', x: 120, y: 100 }],
+  edges: [],
+});
+```
+
+### renderRawData
+
+渲染 LogicFlow 原生图数据，不经过 `adapterIn` 转换。
+
+**签名**
+
+```ts
+renderRawData(graphData: GraphData): void
+```
+
+**参数**
+
+| 名称 | 类型 | 必传 | 说明 |
+| :--- | :--- | :--- | :--- |
+| `graphData` | [`GraphData`](../type/MainTypes.zh.md#graphdata画布数据) | 是 | LogicFlow 原生图数据。 |
+
+**示例**
+
+```ts
+lf.renderRawData({
+  nodes: [{ id: 'node_1', type: 'rect', x: 120, y: 100 }],
+  edges: [],
+});
+```
+
+### getGraphData
+
+获取当前图数据；当配置了 `adapterOut` 时，返回值会先经过适配器转换。
+
+**签名**
+
+```ts
+getGraphData(...params: any[]): GraphConfigData | unknown
+```
+
+**参数**
+
+| 名称 | 类型 | 必传 | 说明 |
+| :--- | :--- | :--- | :--- |
+| `...params` | `any[]` | 否 | 透传给 `adapterOut` 的额外参数。 |
+
+**返回值**
+
+- 未配置 `adapterOut`：返回 [`GraphConfigData`](../type/MainTypes.zh.md#graphconfigdata流程图渲染数据类型)。
+- 已配置 `adapterOut`：返回适配后的业务数据（`unknown`）。
+
+**示例**
+
+```ts
+const data = lf.getGraphData(['property1', 'property2']);
+```
+
+### getGraphRawData
+
+获取当前图的 LogicFlow 原生数据，不受 `adapterOut` 影响。
+
+**签名**
+
+```ts
+getGraphRawData(): GraphData
+```
+
+**返回值**
+
+- [`GraphData`](../type/MainTypes.zh.md#graphdata画布数据)
+
+**示例**
+
+```ts
+const rawData = lf.getGraphRawData();
+console.log(rawData.nodes, rawData.edges);
+```
+
+### clearData
+
+清空当前画布中的全部节点和边数据。
+
+**签名**
+
+```ts
+clearData(): void
+```
+
+**示例**
+
+```ts
+lf.clearData();
+```
+
+### adapterIn
+
+自定义输入数据适配函数，用于在 `render` 前把业务数据转换为 LogicFlow 原生数据。
+
+**签名**
+
+```ts
+adapterIn?: (data: unknown) => GraphData
+```
+
+**返回值**
+
+- [`GraphData`](../type/MainTypes.zh.md#graphdata画布数据)
+
+**示例**
+
+```ts
+lf.adapterIn = (bizData) => {
+  // 将业务结构转换成 nodes / edges
+  return {
+    nodes: [],
+    edges: [],
+  };
+};
+```
+
+### adapterOut
+
+自定义输出数据适配函数，用于在 `getGraphData` 时把 LogicFlow 原生数据转换为业务数据。
+
+**签名**
+
+```ts
+adapterOut?: (data: GraphConfigData, ...params: any[]) => unknown
+```
+
+**参数**
+
+| 名称 | 类型 | 必传 | 说明 |
+| :--- | :--- | :--- | :--- |
+| `data` | [`GraphConfigData`](../type/MainTypes.zh.md#graphconfigdata流程图渲染数据类型) | 是 | 当前图数据。 |
+| `...params` | `any[]` | 否 | 来自 `getGraphData(...params)` 的透传参数。 |
+
+**示例**
+
+```ts
+lf.adapterOut = (data, reserveFields = []) => {
+  return {
+    processNodes: data.nodes,
+    processEdges: data.edges,
+    reserveFields,
+  };
+};
+```

package/dist/docs/api/logicflow-instance/text.en.md

@@ -0,0 +1,60 @@
+---
+nav: API
+group:
+  title: LogicFlow Instance
+  order: 2
+title: Text editing
+toc: content
+order: 5
+---
+
+This page documents instance APIs related to node and edge text editing.
+
+### editText
+
+Open the text editor for a node or edge.
+
+**Signature**
+
+```ts
+editText(id: string): void
+```
+
+**Parameters**
+
+| Name | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `id` | `string` | Yes | Node or edge id. |
+
+**Example**
+
+```ts
+lf.editText('node_1');
+```
+
+:::info{title=Note}
+If text editing was disabled at initialization, LogicFlow does not automatically clear edit state. Listen for the relevant events and call `setElementState` yourself to leave edit mode.
+:::
+
+### updateText
+
+Update the text value of a node or edge.
+
+**Signature**
+
+```ts
+updateText(id: string, value: string): void
+```
+
+**Parameters**
+
+| Name | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `id` | `string` | Yes | Node or edge id. |
+| `value` | `string` | Yes | New text content. |
+
+**Example**
+
+```ts
+lf.updateText('id', 'value');
+```

package/dist/docs/api/logicflow-instance/text.zh.md

@@ -0,0 +1,60 @@
+---
+nav: API
+group:
+  title: LogicFlow 实例
+  order: 2
+title: 文本编辑
+toc: content
+order: 5
+---
+
+本页汇总 LogicFlow 实例中与节点/边文本编辑相关的方法。
+
+### editText
+
+显示节点、连线文本编辑框，进入编辑状态。
+
+**签名**
+
+```ts
+editText(id: string): void
+```
+
+**参数**
+
+| 名称 | 类型 | 必传 | 说明 |
+| :--- | :--- | :--- | :--- |
+| `id` | `string` | 是 | 节点或边 ID。 |
+
+**示例**
+
+```ts
+lf.editText('node_1');
+```
+
+:::info{title=注意}
+当初始化 `lf` 实例时设置了文本不可编辑，LogicFlow 内部不会自动监听并取消元素编辑状态。此时需要自行监听并通过 `setElementState` 取消文本编辑状态。
+:::
+
+### updateText
+
+更新节点或边的文本内容。
+
+**签名**
+
+```ts
+updateText(id: string, value: string): void
+```
+
+**参数**
+
+| 名称 | 类型 | 必传 | 说明 |
+| :--- | :--- | :--- | :--- |
+| `id` | `string` | 是 | 节点或边 ID。 |
+| `value` | `string` | 是 | 更新后的文本值。 |
+
+**示例**
+
+```ts
+lf.updateText('id', 'value');
+```